/* SMP-spelersgids + profielen. Minecraft-tintjes: pixel-hoekjes, blokkige balken, advancement-frames. */
.sp .crumbs{font-size:.85rem;color:var(--mut);margin-bottom:.6rem}.sp .crumbs a{color:var(--mut)}
.sp-head{padding-bottom:1.2rem}.sp-head p{max-width:680px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sp-search{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--rad);padding:.7rem;position:sticky;top:64px;z-index:5;box-shadow:0 10px 30px #0006}
.sp-mag{color:var(--g);display:flex;padding-left:.4rem}
.sp-search input[type=search]{flex:1 1 220px;min-width:0;background:#0b0f14;border:2px solid var(--line);color:var(--txt);border-radius:10px;padding:.7rem .9rem;font:inherit;font-weight:600;outline:none;transition:border-color .15s}
.sp-search input[type=search]:focus{border-color:var(--g)}
.sp-sort{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.sp-sort button,.adv-f button{background:none;border:1px solid var(--line);color:var(--mut);border-radius:8px;padding:.4rem .7rem;font:inherit;font-size:.85rem;font-weight:700;cursor:pointer}
.sp-sort button[aria-pressed=true],.adv-f button[aria-pressed=true]{background:#4ade8022;border-color:var(--g2);color:var(--txt)}
.sp-onl{display:flex;gap:.35rem;align-items:center;font-size:.85rem;color:var(--mut);font-weight:600;cursor:pointer;padding:0 .3rem}
.sp-count{margin:1rem 0 .6rem;min-height:1.4em}
.sp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem}
.sp-card{display:grid;grid-template-columns:56px 1fr;gap:.4rem .9rem;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--rad);padding:1rem;color:var(--txt);text-decoration:none;position:relative;transition:transform .15s,border-color .15s,box-shadow .2s;min-height:150px}
.sp-card:hover,.sp-card:focus-visible{transform:translateY(-3px);border-color:var(--g2);box-shadow:0 10px 30px #16a34a22;outline:none}
.sp-card.is-on{border-color:#16a34a88}
.sp-av .face,.face{image-rendering:pixelated;border-radius:6px;box-shadow:0 0 0 2px #0008,0 6px 14px #0008;display:block}
.sp-meta{min-width:0;display:flex;flex-direction:column}.sp-name{font-size:1.1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-st,.pf-st{display:flex;align-items:center;gap:.4rem;color:var(--mut);font-size:.85rem}
.dot{width:9px;height:9px;border-radius:2px;background:#4b5563;display:inline-block;flex:none}.dot.on{background:var(--g);box-shadow:0 0 8px var(--g)}
.sp-facts{grid-column:1/-1;display:flex;gap:1rem;font-size:.85rem;font-weight:700;margin-top:.3rem}
.bar{grid-column:1/-1;height:8px;background:#0b0f14;border:1px solid var(--line);border-radius:2px;overflow:hidden}
.bar i{display:block;height:100%;background:repeating-linear-gradient(90deg,var(--g) 0 6px,var(--g2) 6px 8px)}
.bar.unk i{background:repeating-linear-gradient(135deg,#243041 0 6px,#1a2330 6px 12px)}
.sp-feat{grid-column:1/-1;font-size:.8rem;font-weight:700;color:var(--gold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-feat.fr-challenge{color:#c084fc}
.skelc{background:linear-gradient(90deg,var(--card),#1d2734,var(--card));background-size:200%;animation:sh 1.2s infinite;border-color:transparent}
.sp-more{text-align:center;margin:1.5rem 0}
.sp-empty{grid-column:1/-1;text-align:center;padding:3rem 1rem;border:2px dashed var(--line);border-radius:var(--rad);color:var(--mut)}
.sp-empty h2{color:var(--txt);margin:.4rem 0}.sp-empty-ico{font-size:2.6rem}.sp-empty .btn{margin-top:1rem}
.sp-priv{font-size:.8rem;text-align:center;margin:2rem 0 3rem}
/* Profiel */
.pf-hero{display:grid;grid-template-columns:minmax(200px,300px) 1fr;gap:2rem;align-items:center;background:radial-gradient(circle at 18% 60%,#4ade8018,transparent 55%),var(--card);border:1px solid var(--line);border-radius:var(--rad);padding:1.5rem 2rem;min-height:320px}
.pf-hero.skelc{min-height:360px}
.pf-skin{position:relative;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}
.pf-skin canvas#sv{display:block;cursor:grab;position:relative;z-index:1;max-width:100%}
.pf-ped{position:absolute;bottom:16%;width:60%;height:18px;border-radius:50%;background:radial-gradient(#000a,transparent 70%)}
.pf-skin.fb{padding:2rem 0}.pf-skin.fb .face{width:160px!important;height:160px!important}
.pf-id h1{font-size:clamp(1.8rem,5vw,2.8rem);line-height:1.1;margin-bottom:.4rem;word-break:break-word}
.pf-st{font-size:1rem;margin-bottom:.4rem}
.pf-feat{display:flex;gap:.8rem;align-items:center;margin:1rem 0;padding:.7rem 1rem;border:2px solid #facc1566;background:#facc1510;border-radius:6px;max-width:440px}
.pf-feat.fr-challenge{border-color:#c084fc88;background:#c084fc14}
.pf-feat-ico{font-size:1.6rem;color:var(--gold)}.pf-feat.fr-challenge .pf-feat-ico{color:#c084fc}
.pf-feat div{display:flex;flex-direction:column}.pf-feat small{color:var(--mut);font-size:.75rem}
.pf-btns{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1rem}
.tiny{font-size:.78rem;margin-top:.6rem}
.pf-sec{margin:2rem 0}.pf-sec h2{margin-bottom:1rem;font-size:1.4rem}.pf-sec h2 small{font-size:.85rem;font-weight:600}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.7rem}
.tile{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:.9rem;display:flex;flex-direction:column;gap:.1rem;position:relative}
.tile::after{content:"";position:absolute;top:6px;right:6px;width:6px;height:6px;background:var(--line)}
.t-ico{font-size:1.3rem}.t-val{font-size:1.35rem;font-weight:800}.t-lab{color:var(--mut);font-size:.85rem;font-weight:600}.tile small{color:var(--mut);font-size:.72rem}
.na{color:var(--mut);cursor:help}
.tops{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.7rem;margin-top:.8rem}
.top{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:.9rem}.top h3{font-size:.95rem;margin-bottom:.5rem}
.top ol{list-style:none;padding:0;display:flex;flex-direction:column;gap:.3rem}.top li{display:flex;justify-content:space-between;gap:.5rem;font-size:.9rem;text-transform:capitalize}
.pend{border:2px dashed var(--line);border-radius:var(--rad);padding:1.4rem;color:var(--mut)}.pend b{color:var(--txt)}
.adv-packs{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem}
.adv-pack{background:var(--card);border:1px solid var(--line);border-radius:var(--rad);padding:1.1rem}
.adv-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.5rem}.adv-h h3{font-size:1.05rem}
.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.6rem;margin-top:1rem}
.cat{display:grid;grid-template-columns:1fr auto;gap:.2rem .4rem;font-size:.82rem;font-weight:600}.cat small{color:var(--mut)}
.adv-rh{margin:1.4rem 0 .6rem}.adv-f{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.8rem}
.adv-list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.5rem}
.adv-list:not(.full) li:nth-child(n+13){display:none}
.adv-list li{display:grid;grid-template-columns:36px 1fr auto;gap:.7rem;align-items:center;background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:.55rem .7rem}
.adv-list li[hidden]{display:none!important}
.adv-list li div{display:flex;flex-direction:column;min-width:0}.adv-list li div small{color:var(--mut);font-size:.75rem}
.adv-list li>small{font-size:.72rem;text-align:right}
.adv-ico{width:36px;height:36px;display:grid;place-items:center;background:#facc1522;border:2px solid #facc1588;color:var(--gold);font-size:1rem;clip-path:polygon(15% 0,85% 0,100% 15%,100% 85%,85% 100%,15% 100%,0 85%,0 15%)}
.fr-challenge .adv-ico{background:#c084fc22;border-color:#c084fc;color:#c084fc}.fr-goal .adv-ico{border-radius:50%;clip-path:none}
.rare{color:#c084fc;font-weight:800}
.big-prog{display:grid;grid-template-columns:auto 1fr;gap:.3rem 1rem;align-items:center;font-size:1.1rem;margin-bottom:.8rem}.big-prog .bar{grid-column:1/-1;height:12px}
.chips{display:flex;flex-wrap:wrap;gap:.4rem}.chip{background:var(--bg2);border:1px solid var(--line);border-radius:6px;padding:.2rem .6rem;font-size:.8rem;text-transform:capitalize}.chip.gold{border-color:#facc1588;color:var(--gold)}
.smp-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem}
@media (max-width:700px){.pf-hero{grid-template-columns:1fr;padding:1.2rem;text-align:center}.pf-skin{max-width:240px;margin:0 auto}.pf-st,.pf-btns{justify-content:center}.pf-feat{margin-inline:auto;text-align:left}
 .sp-search{top:58px}.sp-sort{width:100%}.tiles{grid-template-columns:repeat(2,1fr)}.adv-list{grid-template-columns:1fr}}
.sp [hidden]{display:none!important}
@media(max-width:700px){.pf-hero.skelc{min-height:540px}}
.pf-skin:not(.fb){aspect-ratio:4/5}
main.sp{min-height:100vh}
