:root{--bg:#0b0f14;--bg2:#121821;--card:#161e29;--line:#243041;--txt:#e6edf3;--mut:#8b98a9;--g:#4ade80;--g2:#16a34a;--r:#f87171;--gold:#facc15;--rad:14px}
*{box-sizing:border-box;margin:0}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--txt);line-height:1.6;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}a{color:var(--g)}code{background:#0006;padding:.1em .4em;border-radius:6px}
.wrap{width:min(1100px,92%);margin-inline:auto}
header{min-height:65px;box-sizing:border-box;position:sticky;top:0;z-index:10;background:#0b0f14cc;backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;height:64px;flex-wrap:wrap}
.logo{font-weight:800;font-size:1.25rem;color:var(--txt);text-decoration:none}.logo span{color:var(--g)}
.nav ul{list-style:none;padding:0;display:none;flex-direction:column;width:100%;gap:.25rem;padding-bottom:1rem;background:var(--bg)}
.nav ul.open{display:flex}.nav ul a{color:var(--mut);text-decoration:none;font-weight:600;padding:.4rem 0;display:inline-block}
.nav ul a:hover,.nav ul a.active{color:var(--txt)}
.burger{background:none;border:1px solid var(--line);color:var(--txt);font-size:1.3rem;border-radius:8px;padding:.2rem .6rem;cursor:pointer}
@media(min-width:800px){.burger{display:none}.nav ul{display:flex;flex-direction:row;width:auto;padding:0;gap:1.5rem;background:none;align-items:center}}
.btn{display:inline-flex;align-items:center;gap:.6rem;background:linear-gradient(135deg,var(--g),var(--g2));color:#04140a!important;font-weight:800;border:0;border-radius:10px;padding:.85rem 1.4rem;cursor:pointer;text-decoration:none;transition:transform .15s,box-shadow .2s;font-size:1rem}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 30px #4ade8055}.btn.sm{padding:.4rem .9rem}.btn.ok{background:var(--gold)}
.btn.ghost{background:none;border:1px solid var(--line);color:var(--txt)!important}
.hero{position:relative;padding:6rem 0 5rem;text-align:center;overflow:hidden;background:radial-gradient(ellipse at top,#16a34a33,transparent 60%),linear-gradient(#0b0f14,#0b0f14)}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:40px 40px;mask:radial-gradient(circle,#000,transparent 75%)}
.hero>*{position:relative}
h1{font-size:clamp(2.2rem,7vw,4.2rem);line-height:1.1;font-weight:900;letter-spacing:-.02em}
h1 em{font-style:normal;background:linear-gradient(90deg,var(--g),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
h2{font-size:clamp(1.6rem,4vw,2.3rem);margin-bottom:1rem}
.lead{color:var(--mut);font-size:1.15rem;max-width:620px;margin:1rem auto 2rem}
.ipbox{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:.8rem;align-items:center;background:var(--card);border:1px solid var(--line);padding:.6rem;border-radius:var(--rad)}
.ipbox code{font-size:1.15rem;background:none;padding:0 .8rem}
.status{display:inline-flex;align-items:center;gap:.5rem;margin-top:1.5rem;padding:.4rem 1rem;border-radius:99px;background:var(--card);border:1px solid var(--line);font-weight:600}
.status i{width:10px;height:10px;border-radius:50%;background:var(--mut)}
.status.on i{background:var(--g);box-shadow:0 0 0 0 var(--g);animation:pulse 1.8s infinite}.status.off i{background:var(--r)}
@keyframes pulse{70%{box-shadow:0 0 0 10px #4ade8000}}
section{padding:4rem 0}.alt{background:var(--bg2);border-block:1px solid var(--line)}
.grid{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--rad);padding:1.6rem;transition:transform .2s,border-color .2s}
.card:hover{transform:translateY(-4px);border-color:var(--g2)}.card h3{margin-bottom:.5rem}.card p{color:var(--mut);margin-bottom:1rem}
.page-head{padding:4rem 0 1rem}.page-head p{color:var(--mut)}
.board{list-style:none;padding:0;display:grid;gap:.6rem}
.board li{display:grid;grid-template-columns:3rem 40px 1fr auto auto;gap:1rem;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:.7rem 1rem}
.board img{border-radius:6px;image-rendering:pixelated}.rank{font-weight:900;color:var(--mut)}.pname{font-weight:700;overflow:hidden;text-overflow:ellipsis}
.stat{text-align:right;font-weight:700}.stat small{display:block;font-size:.7rem;color:var(--mut);font-weight:400}
.r1{border-color:var(--gold)!important}.r1 .rank{color:var(--gold)}.r2 .rank{color:#cbd5e1}.r3 .rank{color:#d97706}
@media(max-width:520px){.board li{grid-template-columns:2.2rem 32px 1fr auto}.board li .stat:last-child{display:none}.board img{width:32px;height:32px}}
.fallback,.note{padding:1.4rem;border:1px dashed var(--line);border-radius:var(--rad);color:var(--mut);text-align:center}.note{padding:.6rem;margin-bottom:1rem;font-size:.9rem}
.skel{height:300px;border-radius:var(--rad);background:linear-gradient(90deg,var(--card),#1d2734,var(--card));background-size:200%;animation:sh 1.2s infinite}@keyframes sh{to{background-position:-200%}}
.cd{text-align:center;padding:3rem 1rem;background:radial-gradient(circle at center,#f8717122,transparent 70%);border:1px solid var(--line);border-radius:var(--rad)}
.cd-grid{display:flex;justify-content:center;gap:clamp(.5rem,3vw,1.5rem);margin-top:1.5rem}
.cd-grid div{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:1rem;min-width:72px}
.cd-grid b{display:block;font-size:clamp(1.8rem,7vw,3rem);font-variant-numeric:tabular-nums;color:var(--r)}.cd-grid span{color:var(--mut);font-size:.8rem}
table{width:100%;border-collapse:collapse;background:var(--card);border-radius:var(--rad);overflow:hidden}
td{padding:.9rem 1.2rem;border-bottom:1px solid var(--line)}td:last-child{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
ol.rules{padding-left:1.2rem;display:grid;gap:.8rem}ol.rules li::marker{color:var(--g);font-weight:800}
.steps{padding-left:1.2rem;color:var(--mut)}.steps b{color:var(--txt)}
footer{min-height:7.5rem;box-sizing:border-box;border-top:1px solid var(--line);padding:2rem 0;color:var(--mut);font-size:.9rem}.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.hero-logo{display:block;width:min(100%,560px);height:auto;margin:0 auto 1.5rem;filter:drop-shadow(0 8px 30px rgba(0,0,0,.5))}
.logo{display:inline-flex;align-items:center;gap:.5rem}
.brand-icon{width:32px;height:32px;image-rendering:pixelated}
/* === Bloempot huisstijl-accenten & animaties === */
:root{--terra:#e2733b;--terra2:#b4532a;--grass:#5cb85c}
.hero{background:radial-gradient(ellipse at top,#16a34a33,transparent 60%),radial-gradient(ellipse at 50% 85%,#e2733b1f,transparent 55%),#0b0f14}
.hero-fx{position:absolute!important;inset:0;pointer-events:none;overflow:hidden}
.hero-fx i{position:absolute;top:-20px;width:var(--s);height:var(--s);background:var(--c);opacity:.55;image-rendering:pixelated;animation:fall linear infinite}
@keyframes fall{to{transform:translate(var(--d),110vh) rotate(360deg);opacity:0}}
.logo-stage{position:relative;width:min(100%,560px);margin:0 auto 1.5rem;animation:enter .9s cubic-bezier(.2,.9,.3,1.3) both}
.logo-stage picture{display:block;position:relative;z-index:1}.logo-stage .hero-logo{margin:0;animation:bob 4.5s ease-in-out infinite;position:relative;z-index:1}
.logo-glow{position:absolute;inset:15% 10%;border-radius:50%;background:radial-gradient(circle,#facc1540,#e2733b25 45%,transparent 70%);filter:blur(20px);animation:glow 4.5s ease-in-out infinite}
@keyframes enter{from{opacity:0;transform:scale(.85) translateY(20px)}}
@keyframes bob{50%{transform:translateY(-10px) rotate(-.6deg)}}
@keyframes glow{50%{opacity:.55;transform:scale(1.08)}}
.sparkles{position:absolute;inset:0;z-index:2;pointer-events:none}
.sparkles i{position:absolute;width:var(--s);height:var(--s);background:var(--c);box-shadow:0 0 6px var(--c);animation:twinkle ease-in-out infinite;opacity:0}
@keyframes twinkle{50%{opacity:1;transform:scale(1.3)}}
.bee{position:absolute;z-index:3;width:4px;height:4px;background:transparent;image-rendering:pixelated;
box-shadow:4px 0 #111,8px 0 #facc15,12px 0 #111,16px 0 #facc15,4px 4px #facc15,8px 4px #111,12px 4px #facc15,16px 4px #111,8px -4px #e0f2fe,12px -4px #e0f2fe,12px -8px #e0f2fe;pointer-events:none}
.bee.b1{top:18%;left:8%;animation:fly1 9s ease-in-out infinite}
.bee.b2{top:70%;right:10%;animation:fly2 11s ease-in-out infinite}
@keyframes fly1{25%{transform:translate(60px,-20px)}50%{transform:translate(120px,10px) scaleX(-1)}75%{transform:translate(50px,25px) scaleX(-1)}}
@keyframes fly2{25%{transform:translate(-70px,15px) scaleX(-1)}50%{transform:translate(-130px,-15px) scaleX(-1)}75%{transform:translate(-40px,-30px)}}
.pot-load{image-rendering:pixelated;animation:potbob .8s ease-in-out infinite alternate}
@keyframes potbob{to{transform:translateY(-4px) rotate(8deg)}}
.pot-divider{display:flex;align-items:center;gap:1rem;width:min(1100px,92%);margin:0 auto;padding:1.2rem 0}
.pot-divider::before,.pot-divider::after{content:"";flex:1;height:2px;background:linear-gradient(90deg,transparent,var(--terra),var(--grass),transparent)}
.pot-divider img{image-rendering:pixelated;filter:drop-shadow(0 0 8px #e2733b88)}
.card-ico{width:24px;height:24px;image-rendering:pixelated;vertical-align:-4px;margin-right:.4rem;transition:transform .3s}
.card:hover .card-ico{transform:rotate(-12deg) scale(1.15)}
.card{border-top:3px solid var(--terra2)}.card:hover{border-color:var(--terra)}
.foot-mark{width:20px;height:20px;image-rendering:pixelated;vertical-align:-4px;margin-right:.5rem}
footer{border-top:2px solid var(--terra2)}
.r3 .rank{color:var(--terra)}
@media(max-width:600px){.bee{transform:scale(.8)}.sparkles i:nth-child(n+9){display:none}}

/* pot variants */
.pix,.card-ico,.head-ico,.st-ico,.rank-ico{image-rendering:pixelated;image-rendering:crisp-edges}
.head-ico{width:48px;height:48px;vertical-align:-6px;margin-right:.6rem;filter:drop-shadow(0 0 10px #e2733b55)}
.st-ico{width:20px;height:20px}.status.on .st-ico{animation:potbob 1.6s ease-in-out infinite alternate}.status.off .st-ico{opacity:.8}
.rank-ico{width:22px;height:22px;vertical-align:-5px;margin-right:.3rem}
.pot-load{display:inline-block;width:18px;height:18px;background:url(../img/pots/pots-sprite.png) 0 0/144px 18px;image-rendering:pixelated;animation:potcycle 2.4s steps(8) infinite,potbob .8s ease-in-out infinite alternate}
@keyframes potcycle{to{background-position:-144px 0}}
@media (prefers-reduced-motion:reduce){.pot-load,.st-ico{animation:none}}
/* Seizoensdeelnemers */
.pt{margin-top:2.5rem}.pt-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.5rem;margin-bottom:1rem}
.pt-head h2{display:flex;align-items:center;gap:.5rem}.pt-head .head-ico{width:32px;height:32px;image-rendering:pixelated;margin:0}
.pt-upd{color:var(--mut);font-size:.9rem}.pt-upd.stale{color:var(--gold)}.pt-upd.stale::before{content:"⚠ "}
.pt-count{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-bottom:1.75rem}
.pt-count div{background:var(--card);border:1px solid var(--line);border-radius:var(--rad);padding:1rem;text-align:center;border-top:3px solid var(--gold)}
.pt-count .ok{border-top-color:var(--grass)}.pt-count .ko{border-top-color:var(--terra2)}
.pt-count b{display:block;font-size:clamp(1.6rem,5vw,2.4rem);line-height:1.1}.pt-count span{color:var(--mut);font-size:.85rem}
.pt-group+.pt-group{margin-top:1.75rem}.pt-gt{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem;font-size:1.1rem}
.pt-gt small{background:#0006;border:1px solid var(--line);border-radius:99px;padding:0 .6rem;color:var(--mut);font-size:.8rem}
.pt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.75rem}
.pc{display:flex;align-items:center;gap:.8rem;background:var(--card);border:1px solid var(--line);border-left:3px solid var(--grass);border-radius:12px;padding:.75rem .9rem;transition:transform .2s,border-color .2s;animation:pcIn .4s ease both}
.pc:hover{transform:translateY(-3px);border-color:var(--g2)}
.pc.fallen{border-left-color:var(--terra2);background:linear-gradient(135deg,#1a1416,var(--card))}.pc.fallen:hover{border-color:var(--terra2)}
.pc-avw{position:relative;flex:none}.pc-av{display:block;width:48px;height:48px;border-radius:8px;image-rendering:pixelated;background:#0006}
.fallen .pc-av{filter:grayscale(1) brightness(.7)}
.pc-dot{position:absolute;right:-3px;bottom:-3px;width:13px;height:13px;border-radius:50%;background:var(--g);border:2px solid var(--card);box-shadow:0 0 8px var(--g);animation:pcPulse 2s ease-in-out infinite}
.pc-info{flex:1;min-width:0}.pc-name{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pc-sub,.pc-cause{display:block;color:var(--mut);font-size:.82rem;line-height:1.35}.pc-cause{color:#d8a28a}
.pc-pot{width:28px;height:28px;image-rendering:pixelated;flex:none}.fallen .pc-pot{opacity:.85}
.pc.sk{min-height:74px;border-left-color:var(--line);animation:none}.pc.sk i{width:48px;height:48px;border-radius:8px}.pc.sk span{flex:1;height:14px;border-radius:6px}
.pc.sk i,.pc.sk span{background:linear-gradient(90deg,#1f2935 25%,#2a3646 50%,#1f2935 75%);background-size:200% 100%;animation:sk 1.4s linear infinite}
@keyframes sk{to{background-position:-200% 0}}@keyframes pcIn{from{opacity:0;transform:translateY(8px)}}@keyframes pcPulse{50%{box-shadow:0 0 2px var(--g)}}
@media(max-width:480px){.pt-count{gap:.4rem}.pt-count div{padding:.7rem .3rem}}
@media(prefers-reduced-motion:reduce){.pc,.pc-dot,.pc.sk i,.pc.sk span{animation:none}}
/* whitelist-aanvraag */
.ap{margin-top:2rem;background:linear-gradient(160deg,#facc1510,transparent 60%),var(--card);border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:var(--rad);padding:clamp(1.2rem,4vw,2.2rem)}
.ap-head h2{display:flex;align-items:center;gap:.5rem}.ap-head p{color:var(--mut);margin:.3rem 0 1.4rem}
.ap form{display:grid;gap:1rem}.ap-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.ap label{display:grid;gap:.35rem;font-weight:600;font-size:.95rem;position:relative}
.ap input:not([type=checkbox]):not([type=radio]),.ap select,.ap textarea{font:inherit;color:var(--txt);background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:.7rem .85rem;transition:border-color .2s,box-shadow .2s;width:100%}
.ap textarea{resize:vertical;min-height:110px}
.ap input:focus,.ap select:focus,.ap textarea:focus{outline:0;border-color:var(--g);box-shadow:0 0 0 3px #4ade8033}
.ap-ed{border:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.5rem;align-content:end}.ap-ed legend{font-weight:600;font-size:.95rem;margin-bottom:.35rem}
.ap-ed label{display:block}.ap-ed input{position:absolute;opacity:0}
.ap-ed span{display:block;text-align:center;padding:.7rem;border:1px solid var(--line);border-radius:10px;background:var(--bg2);cursor:pointer;transition:.2s}
.ap-ed input:checked+span{border-color:var(--g);background:#4ade8018;color:var(--g)}.ap-ed input:focus-visible+span{box-shadow:0 0 0 3px #4ade8055}
.ap-cnt{color:var(--mut);font-weight:400;justify-self:end;font-size:.8rem}
.ap-chk{display:flex!important;align-items:center;gap:.6rem;font-weight:500!important;cursor:pointer}.ap-chk input{width:18px;height:18px;accent-color:var(--g)}
.ap-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ap .btn{justify-self:start}.ap .btn:disabled{opacity:.6;cursor:default}
.ap-msg{min-height:1.4em;font-weight:600}.ap-msg.ok{color:var(--g)}.ap-msg.ko{color:var(--r)}
.ap form.done{opacity:.85}
@media (prefers-reduced-motion:reduce){.ap *{transition:none!important}}
.prose{max-width:760px}.prose h2{margin:1.6rem 0 .5rem}.prose p,.prose li{color:var(--mut);margin-bottom:.6rem}.prose ul{padding-left:1.2rem}
.map iframe{width:100%;height:70vh;min-height:360px;border:1px solid var(--line);border-radius:var(--rad);background:#000}

.dd-btn{background:none;border:0;color:var(--mut);font:inherit;font-weight:600;padding:.4rem 0;cursor:pointer}.dd-btn:hover,.dd-btn.active,.dd-btn[aria-expanded="true"]{color:var(--txt)}
.nav ul.sub{display:none;padding:0 0 0 1rem;width:auto;background:none}.dd-btn[aria-expanded="true"]+.sub{display:flex}
@media(min-width:800px){.dd{position:relative}.nav ul.sub{position:absolute;top:100%;left:-.75rem;flex-direction:column;gap:0;padding:.4rem .75rem;min-width:9rem;background:var(--bg);border:1px solid var(--line);border-radius:10px;z-index:50}.dd:hover>.sub,.dd:focus-within>.sub{display:flex}}

/* Seizoensroadmap */
.rm{list-style:none;padding:0;margin-top:1.25rem;display:grid;gap:.6rem;border-left:2px solid var(--line);padding-left:1.25rem}
.rm-i{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--rad);padding:.7rem 1rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.rm-i::before{content:"";position:absolute;left:calc(-1.25rem - 7px);top:1rem;width:12px;height:12px;border-radius:50%;background:var(--line)}
.rm-i time{color:var(--mut);font-size:.9rem}.rm-i.done{opacity:.55}.rm-i.done::before{background:var(--g2)}
.rm-i.next{border-color:var(--terra,#e2733b)}.rm-i.next::before{background:var(--terra,#e2733b);box-shadow:0 0 10px var(--terra,#e2733b)}
.rm-next{margin-top:1rem}.rm-next .cd-title{font-size:1.05rem}
.facts{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.5rem;margin:.5rem 0 0}.facts li{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:.3rem .9rem;font-weight:600;font-size:.9rem}
.rm-i b small{display:block;font-weight:400;color:var(--mut);font-size:.85rem}.rm-up{margin-top:1.25rem;color:var(--mut)}.rm-up b{color:var(--txt)}
.sched-ex{margin-top:1.25rem}.sched-ex h3{font-size:1rem;margin-bottom:.4rem}.sched-ex ul{padding-left:1.1rem;color:var(--mut)}.sched-ex b{color:var(--txt)}
.cd-name{color:var(--g);font-weight:700;margin-bottom:.25rem}.ap-window{color:var(--gold);font-size:.9rem;margin-top:.4rem}
.pc-ex{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.2rem;font-size:.75rem}.pc-ex span{border:1px solid var(--line);border-radius:99px;padding:0 .5rem;color:var(--mut)}.pc-rec{color:var(--gold)!important}
.fd{margin-top:2.5rem}.fd h2{margin-bottom:.75rem}.fd-list{list-style:none;padding:0;display:grid;gap:.4rem;max-height:420px;overflow:auto}
.fd-i{display:flex;flex-wrap:wrap;gap:.35rem;align-items:baseline;background:var(--card);border:1px solid var(--line);border-left:3px solid var(--line);border-radius:10px;padding:.5rem .8rem}
.fd-death{border-left-color:var(--r)}.fd-milestone{border-left-color:var(--gold)}.fd-revive{border-left-color:var(--g)}
.fd-i time{margin-left:auto;color:var(--mut);font-size:.8rem}.fd-empty{color:var(--mut)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.site-banner{--bc:#22c55e;position:sticky;top:var(--hdr-h,64px);z-index:9;pointer-events:none;height:0;overflow:visible}.site-banner.lv-warn{--bc:#eab308}.site-banner.lv-alert{--bc:#ef4444}.site-banner .wrap{display:block}.sb-pill{pointer-events:auto;display:inline-flex;align-items:center;gap:.5rem;width:fit-content;max-width:100%;box-sizing:border-box;padding:.26rem .35rem .26rem .7rem;font-weight:500;font-size:.8rem;line-height:1.35;text-align:left;color:#eef2f6;text-shadow:0 1px 2px rgba(0,0,0,.45);background:rgba(255,255,255,.08);background:linear-gradient(color-mix(in srgb,var(--bc) 10%,rgba(255,255,255,.1)),color-mix(in srgb,var(--bc) 6%,rgba(255,255,255,.05)));-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);border:1px solid rgba(255,255,255,.15);border-top:0;border-radius:0 0 12px 12px;box-shadow:inset 0 -1px 0 rgba(255,255,255,.06),inset 0 1px 0 rgba(255,255,255,.12),0 4px 14px rgba(0,0,0,.22)}.sb-pill>span::before{content:'';display:inline-block;width:.45rem;height:.45rem;border-radius:50%;background:var(--bc);margin-right:.45rem;vertical-align:.08em}.site-banner a{color:var(--bc);text-decoration:underline;text-underline-offset:2px}.sb-x{flex:none;background:none;border:0;color:#9aa4ae;font-size:1rem;line-height:1;padding:.2rem .4rem;cursor:pointer;border-radius:6px}.sb-x:hover{color:#fff;background:rgba(255,255,255,.08)}@media(max-width:600px){.sb-pill{font-size:.75rem;padding:.22rem .3rem .22rem .6rem}}
.note.maint{border-color:var(--gold);color:var(--txt)}#notices{margin-top:1rem;max-width:40rem}.smp-rules{line-height:1.8}
/* deploy13: rustige mededelingen, modpack, nieuws, kaart, Hardcore open/gesloten */
#notices{margin:1.1rem auto 0;max-width:40rem;display:flex;flex-direction:column;align-items:center;gap:.4rem}
.notice{display:inline-flex;align-items:center;gap:.5rem;max-width:100%;margin:0;padding:.35rem .9rem .35rem .6rem;border-radius:99px;background:#ffffff0a;border:1px solid #ffffff14;color:var(--txt);font-size:.88rem;line-height:1.35;text-align:left;backdrop-filter:blur(4px)}
.notice .ico{flex:none;width:1.05rem;height:1.05rem;color:var(--g)}.notice.maint{border-color:#facc1555;background:#facc1510}.notice.maint .ico{color:var(--gold)}
.mod-sec{padding:2rem 0 0}.modpack{display:flex;flex-wrap:wrap;gap:1rem 1.5rem;align-items:center;justify-content:space-between;padding:1.1rem 1.25rem;border:1px solid var(--line);border-radius:var(--rad);background:linear-gradient(135deg,#16a34a14,#0000 60%),var(--card)}
.modpack h2,.modpack h3{margin:0;font-size:1.1rem}.modpack h2 small,.modpack h3 small{font-size:.72rem;font-weight:700;color:var(--mut);border:1px solid var(--line);border-radius:99px;padding:.05rem .5rem;margin-left:.3rem;vertical-align:.15em}.modpack p{margin:.25rem 0 0;color:var(--mut);font-size:.92rem}
.mp-btns{display:flex;flex-wrap:wrap;gap:.5rem}.mp-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1rem;border-radius:10px;font-weight:800;text-decoration:none;color:var(--txt);background:var(--bg2);border:1px solid var(--line);transition:transform .15s,border-color .15s}
.mp-btn:hover{transform:translateY(-2px)}.mp-btn .ico{width:1.25rem;height:1.25rem}.mp-modrinth:hover{border-color:#1bd96a}.mp-curseforge:hover{border-color:#f16436}.mp-forge:hover,.mp-neoforge:hover{border-color:#e0a56b}.mp-fabric:hover{border-color:#dbd0b4}.mp-custom:hover{border-color:var(--g)}
.card.news time{display:block;font-size:.8rem;color:var(--mut);margin-bottom:.3rem}
.map-info{color:var(--g);font-size:.9rem;margin-bottom:1rem}.map-info:empty{display:none}
.hc-open{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .9rem;border-radius:99px;margin-bottom:1rem;border:1px solid var(--line);font-size:.92rem}.hc-open .dot{width:.65rem;height:.65rem;border-radius:50%}
.hc-open.on{border-color:#4ade8066}.hc-open.on .dot{background:var(--g);box-shadow:0 0 0 3px #4ade8033}.hc-open.off{border-color:#e2733b66}.hc-open.off .dot{background:#e2733b}


/* Plekhouders tegen layout shift (CLS) */
.hc-ph{min-height:389px;margin-bottom:1.5rem}@media(min-width:700px){.hc-ph{min-height:396px}}

@media(max-width:600px){footer{min-height:9.5rem}}

/* Verbinden: toestel-accordeon en modpack */
details.dev{border:1px solid var(--line);border-radius:10px;margin:.6rem 0;padding:.2rem .9rem}details.dev>summary{cursor:pointer;font-weight:600;padding:.55rem 0;list-style-position:inside}details.dev[open]>summary{border-bottom:1px solid var(--line);margin-bottom:.6rem}details.dev h4{margin:.9rem 0 .3rem;font-size:.95rem}.tiny{font-size:.82rem}.mp-links{margin:1rem 0 1.4rem}#mp-sec h2 small{font-size:.6em;color:var(--mut);font-weight:500}
.mut{color:var(--mut)}

/* Kaart (BlueMap): vult het scherm onder de menubalk, vaste hoogte = geen CLS */
.km-bar{padding:1.7rem 0 .6rem}.km-row{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center;justify-content:space-between}.km-bar h1{font-size:1.4rem;margin:0}.km-bar .map-info{margin:.15rem 0 0}
.km-ctl{display:flex;flex-wrap:wrap;gap:.4rem}.km-b{display:inline-flex;align-items:center;min-height:36px;padding:.35rem .8rem;font:inherit;font-size:.88rem;font-weight:600;color:var(--txt,#eef2f6);background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:10px;cursor:pointer;text-decoration:none}.km-b:hover{background:rgba(255,255,255,.12)}.km-b:focus-visible{outline:2px solid var(--g);outline-offset:2px}.km-ctl [aria-pressed="true"]{background:var(--g);color:#06110a;border-color:var(--g)}
.km-map{height:calc(100dvh - var(--hdr-h,65px) - 8.5rem);min-height:320px;margin:0 auto;padding:0 .6rem .6rem;max-width:none}.km-map iframe{width:100%;height:100%;min-height:0;display:block;border:1px solid var(--line);border-radius:var(--rad);background:#000}
.km-map .fallback{height:100%;box-sizing:border-box;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.5rem}
.km-map:fullscreen{padding:0;background:#000}.km-map:fullscreen iframe{border:0;border-radius:0}
@media(max-width:600px){.km-map{height:calc(100dvh - var(--hdr-h,65px) - 12rem)}}
.km-ctl [hidden]{display:inline-flex;visibility:hidden}

/* Potgrond-knop (eigen, opvallende menuknop) */
.nav ul a.pg-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .75rem .3rem .45rem;border-radius:10px;background:linear-gradient(#5a3a2a,#3e2820);border:2px solid #8a5a3a;color:#ffe9c4;box-shadow:inset 0 -3px 0 #2c1c16,0 0 0 1px #00000040;image-rendering:pixelated}
.nav ul a.pg-btn img{image-rendering:pixelated}
.nav ul a.pg-btn:hover,.nav ul a.pg-btn.active{color:#fff;background:linear-gradient(#6b8f3a,#4a6e28);border-color:#9fd36a}
