.spelmain{padding-block:2.5rem 4rem}.spelrubrik{display:flex;justify-content:space-between;align-items:end;margin-bottom:2rem;gap:1rem}.spelrubrik h1{font-size:clamp(3.8rem,10vw,8rem);font-style:italic;letter-spacing:-.06em}.spelrubrik h1 span,.topplista h2 span{color:var(--marke)}.spelrubrik>p{color:var(--text-dov);margin:0}.spelrubrik strong{color:var(--marke)}.spelgrid{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:1.5rem;align-items:start}.arena{padding:0;border:2px solid var(--kant-stark);background:var(--svart);min-width:0}.spelstatus{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;padding:.7rem 1rem;font: .75rem var(--mono);color:var(--text-dov)}.spelstatus b{color:var(--marke)}.spelstatus button{background:none;color:var(--text);border:0;text-decoration:underline;cursor:pointer;font-size:.75rem;padding:.3rem}.spelstatus button:disabled{opacity:.4;cursor:default}.spelstatus #byt-namn{margin-left:auto}.spelvy{position:relative;isolation:isolate;background:#132532}.spelvy canvas{width:100%;height:auto;display:block;touch-action:none}.hud{position:absolute;inset:1rem 1rem auto;display:flex;justify-content:space-between;pointer-events:none;color:#f4f8fb;text-shadow:1px 2px #0b1825;gap:1rem}.hud small{display:block;font:700 .6rem var(--mono);letter-spacing:.12em}.hud b{font:900 italic 2rem var(--display);line-height:1.1}.boosthud{width:28%;max-width:150px}.boostmat{height:8px;margin-top:.4rem;border:1px solid #e0e7ea88;background:#0b1825}.boostmat i{display:block;background:#b1d3dd;height:100%;width:0;transition:width .1s}.boosthud span{font-size:.65rem}.speloverlay{position:absolute;inset:0;display:grid;place-items:center;padding:1rem;background:#06111ac9;backdrop-filter:blur(5px)}.speloverlay[hidden]{display:none}.spelpanel{width:min(100%,400px);max-height:100%;overflow:auto;text-align:center}.spelpanel h2{font-size:clamp(1.8rem,4vw,3.2rem);line-height:1}.spelpanel>p{margin:.8rem 0;font-size:.88rem}.spelpanel .ogon{font-size:.65rem}.spelpanel label{display:block;font-weight:700;font-size:.9rem}.spelpanel input{display:block;width:100%;margin:.6rem 0;background:#0b1825;border:2px solid var(--marke);padding:.7rem}.spelpanel .namninfo{font-size:.73rem;color:var(--text-dov)}.spelpanel .knapp{margin:.3rem;font-size:.75rem}.spelpanel [role=status]{font-size:.8rem;color:var(--marke-ljus)}.spelknappar{display:grid;grid-template-columns:1fr 1fr 1fr;gap:2px;background:var(--kant-stark)}.spelknappar button{background:#1b252c;border:0;border-top:3px solid var(--marke-djup);padding:1rem .4rem;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}.spelknappar button b{font-size:.8rem;color:var(--marke-ljus)}.spelknappar button small{display:block;color:var(--text-dov);font-size:.65rem;margin-top:.3rem}.spelknappar button.actief{background:var(--marke);color:var(--svart)}.spelknappar button.actief b,.spelknappar button.actief small{color:var(--svart)}.speltips{font-size:.76rem;color:var(--text-dov);padding:.75rem 1rem;margin:0}.topplista{padding:1.5rem;background:var(--yta);border-top:4px solid var(--marke);scroll-margin-top:7rem}.topplista h2{font-size:2.8rem;line-height:.9}.topplista>p{font-size:.8rem}.topplista ol{padding:0;list-style:none;margin:1.5rem 0}.topplista li{display:grid;grid-template-columns:1.5rem 1fr auto;gap:.6rem;border-bottom:1px solid var(--kant);padding:.8rem 0;font-size:.82rem;align-items:center}.topplista li b{color:var(--marke);font-family:var(--mono)}.topplista li span{overflow-wrap:anywhere}.topplista li.mitt-rekord{background:#b1d3dd10;box-shadow:-6px 0 var(--marke)}.topplista li small{color:var(--text-dov)}.spelregler{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-block:2.5rem}.spelregler article{border-top:1px solid var(--kant);padding-top:1rem}.spelregler span{font:700 .65rem var(--mono);letter-spacing:.12em;color:var(--marke)}.spelregler h3{font-style:italic;text-transform:uppercase;font-size:1.4rem;margin:.4rem 0}.spelregler p,.spelinfo{color:var(--text-dov);font-size:.83rem}.spelinfo a{text-decoration:underline}button[hidden],form[hidden]{display:none!important}
@media(max-width:1000px){.spelgrid{grid-template-columns:minmax(0,1fr)}.topplista h2 br{display:none}.topplista h2{font-size:2rem}.topplista ol{display:grid;grid-template-columns:1fr 1fr;column-gap:2rem}}
@media(max-width:560px){.spelmain{padding-top:1.5rem}.spelrubrik{align-items:start;flex-direction:column}.spelrubrik h1{font-size:4.6rem}.spelrubrik>p br{display:none}.spelvy canvas{aspect-ratio:4/3;object-fit:cover}.hud{inset:.6rem .6rem auto}.hud b{font-size:1.6rem}.speloverlay{padding:.7rem}.spelpanel h2{font-size:1.8rem}.spelpanel .ogon{margin-bottom:.6rem}.spelpanel p{font-size:.75rem}.spelpanel .namninfo{font-size:.65rem}.spelpanel input{padding:.5rem;margin:.3rem 0}.spelpanel .knapp{padding:.6rem .8rem}.spelstatus{gap:.6rem;padding:.5rem;font-size:.65rem}.spelknappar button{padding:1rem .3rem}.spelknappar button b{font-size:.7rem}.spelregler{grid-template-columns:1fr;gap:1rem}.spelregler p{margin:.3rem 0}.topplista ol{display:block}}

.topplista li.tom-lista{display:block;color:var(--text-dov)}
@media(max-width:560px){.spelrubrik>p strong::before{content:" "}}
/* Sajtens gulsvarta graffiti återkommer i arenan och menyerna. */
.spelrubrik h1{font-size:clamp(3rem,8vw,6.6rem);text-shadow:3px 3px #111,5px 5px #ff4da6}
.arena{border-radius:4px;overflow:hidden;border-color:#ffdb26;box-shadow:6px 6px 0 #ff4da6}
.spelvy{background:#122c40}.hud{color:#fffbe9;text-shadow:1px 2px #111}.boostmat{background:#111;border-color:#ffdb26;border-radius:0;overflow:hidden}.boostmat i{background:#ffdb26}.speloverlay{background:#101012ed;backdrop-filter:blur(6px)}
.spelpanel input{background:#202024;color:#fffbe9;border-radius:0}.spelpanel [role=status]{color:#2fe6ee}
.spelknappar{gap:6px;background:#101012;padding:8px}.spelknappar button{background:#ffdb26;border:0;border-radius:2px;min-height:70px}.spelknappar button:nth-child(2){background:#2fe6ee}.spelknappar button:nth-child(3){background:#ff4da6}.spelknappar button b,.spelknappar button small{color:#101012}.spelknappar button.actief{background:#fffbe9;box-shadow:inset 0 0 0 3px #111}.spelknappar button.actief b,.spelknappar button.actief small{color:#101012}
.topplista{border-radius:2px;border-color:#2fe6ee}.topplista li.mitt-rekord{background:#ffdb261a}.spelregler article{background:#1b1b21;border:1px solid #ffdb26;border-radius:2px;padding:1.3rem}.spelregler article:nth-child(2){border-color:#2fe6ee}.spelregler article:nth-child(3){border-color:#ff4da6}.spelregler article:nth-child(2) span{color:#2fe6ee}.spelregler article:nth-child(3) span{color:#ff77ba}
@media(max-width:560px){.spelrubrik h1{font-size:clamp(2.8rem,12vw,4rem)}.spelpanel{width:100%}.spelstatus{gap:.4rem}.spelstatus button{min-height:36px}.hud{gap:.5rem}.spelregler{margin-block:1.5rem}.spelvy:has(#namnform:not([hidden])){min-height:380px}}
/* 45 sekunder: distans, energi och progression syns utan att skymma banan. */
.hud{gap:.7rem;align-items:start}.hud>div{min-width:0}.hud small{font-size:.56rem}.hud .boosthud small span{display:inline;font:inherit}.hud b{font-variant-numeric:tabular-nums;font-size:1.8rem}.hud .boosthud{width:24%}
.tempohud{position:absolute;inset:5rem 1rem auto;display:flex;justify-content:space-between;gap:.5rem;pointer-events:none;font:700 .65rem var(--mono);color:#fffbe9}.tempohud span,.tempohud strong{background:#101012cc;padding:.3rem .5rem;border-radius:6px}.tempohud strong{background:#ffdb26;color:#101012}
.resultat{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:1rem 0}.resultat[hidden]{display:none}.resultat div{background:#29252f;border-radius:10px;padding:.5rem}.resultat div:nth-child(3n){background:#153c3d}.resultat dt{font:700 .6rem var(--mono);text-transform:uppercase;color:#ffdb26}.resultat dd{margin:0;font-size:1.1rem;font-weight:800;font-variant-numeric:tabular-nums}.spelvy:has(#resultat:not([hidden])){min-height:560px}.spelpanel:has(#resultat:not([hidden])){width:min(100%,440px)}
@media(max-width:560px){.hud{gap:.5rem}.hud b{font-size:1.3rem}.hud small{font-size:.48rem;letter-spacing:.04em}.hud .boosthud{width:28%}.boosthud span{font-size:.54rem}.tempohud{inset:4rem .6rem auto;font-size:.55rem}.tempohud span,.tempohud strong{padding:.2rem .4rem}.resultat{gap:.4rem;margin:.6rem 0}.resultat dd{font-size:.95rem}.spelvy:has(#resultat:not([hidden])){min-height:540px}.spelknappar button small{font-size:.58rem}}

/* Veckans tävling har egen tavla; rekord från alla tider ligger kvar bredvid spelet. */
.turnering[hidden],.turnering-board[hidden],.turnering-fel[hidden],.turnering-faser[hidden],#turnering-regler[hidden]{display:none}
.turnering{padding:1.5rem;margin:0 0 2rem;border:2px solid var(--marke);border-left-width:7px;background:var(--yta);box-shadow:6px 6px 0 var(--rosa);scroll-margin-top:7rem}
.turnering-topp{display:flex;justify-content:space-between;gap:1.5rem;align-items:center}.turnering-topp .ogon{margin:0 0 .5rem}.turnering h2{font-size:clamp(1.8rem,4vw,3rem);line-height:1.05;margin:0}.turnering-tid{display:grid;gap:.35rem;text-align:right;max-width:48%;min-width:0}.turnering-tid>b{color:var(--marke);font:800 1rem var(--mono);overflow-wrap:anywhere}.turnering-tid>span{font:700 .78rem var(--mono);font-variant-numeric:tabular-nums}.turnering-tid small{color:var(--text-dov)}.turnering-tid strong{color:var(--is);overflow-wrap:anywhere}
.turnering-faser{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.55rem;list-style:none;padding:0;margin:1.25rem 0}.turnering-faser li{border:1px solid var(--kant-stark);padding:.65rem .8rem;border-top:3px solid var(--kant-stark);min-width:0}.turnering-faser b{display:block;font-size:.85rem}.turnering-faser span{display:block;color:var(--text-dov);font: .65rem/1.65 var(--mono);margin-top:.2rem}.turnering-faser .turnering-fas--nu{border-color:var(--marke);background:#ffdb2612}.turnering-fas--nu b{color:var(--marke)}.turnering-faser .turnering-fas--klar{border-top-color:var(--is)}
#turnering-regler{font-size:.83rem;color:var(--text-dov);margin:.8rem 0}.turnering-jag{padding:.65rem .8rem;border-left:3px solid var(--kant-stark);background:#101012;font-size:.85rem;overflow-wrap:anywhere}.turnering-jag--redo{border-color:var(--is)}.turnering-lagen{display:flex;flex-wrap:wrap;gap:.6rem}.turnering-lagen button{min-height:44px}.turnering-lagen [aria-pressed=true]{color:var(--svart);background:var(--marke);border-color:var(--marke)}.turnering-lagestatus{font-size:.73rem;color:var(--text-dov);margin:.7rem 0 0}.turnering-fel{padding:.75rem;border:1px solid var(--eld);color:var(--text);background:#512738;font-size:.85rem}
.turnering-board{padding:0;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:1.5rem;margin-top:2rem;border:0}.turnering-tabell,.turnering-vinnare{padding:1.3rem;background:var(--yta);border-top:4px solid var(--is);min-width:0}.turnering-vinnare{border-color:var(--rosa)}.turnering-board .ogon{font-size:.65rem;margin-top:0}.turnering-board h3{font-size:1.3rem;margin:.4rem 0 1rem}.turnering-lista,.turnering-historik{padding:0;list-style:none;margin:0}.turnering-lista li{display:grid;grid-template-columns:2rem minmax(0,1fr) auto;gap:.4rem .7rem;align-items:center;padding:.7rem .4rem;border-bottom:1px solid var(--kant);font-size:.82rem}.turnering-lista b{color:var(--marke);font-family:var(--mono);font-variant-numeric:tabular-nums}.turnering-placering{font: .7rem var(--mono);color:var(--text-dov)}.turnering-namn{overflow-wrap:anywhere}.turnering-lista small{grid-column:2 / -1;font-size:.65rem}.turnering-vidare{color:var(--is)}.turnering-status{color:var(--text-dov)}.turnering-lista .turnering-rad--du{background:#ffdb2612;box-shadow:inset 3px 0 var(--marke)}.turnering-historik li{display:grid;gap:.2rem;padding:.8rem 0;border-bottom:1px solid var(--kant);font-size:.8rem;overflow-wrap:anywhere}.turnering-historik span{font: .65rem var(--mono);color:var(--text-dov)}.turnering-historik b{color:var(--is)}.turnering-tomt{font-size:.8rem;color:var(--text-dov)}
@media(max-width:700px){.turnering-topp{display:block}.turnering-tid{max-width:none;text-align:left;margin-top:1rem}.turnering-board{grid-template-columns:minmax(0,1fr)}.turnering{padding:1rem;scroll-margin-top:8rem}.turnering-faser{grid-template-columns:1fr}.turnering-faser li{display:grid;grid-template-columns:minmax(5rem,.5fr) minmax(0,1fr);gap:.7rem;align-items:start}.turnering-faser span{margin:0}.turnering-lagen{display:grid;grid-template-columns:1fr 1fr}.turnering-lagen .knapp{padding:.65rem .5rem;font-size:.65rem}.turnering-lista li{grid-template-columns:1.5rem minmax(0,1fr) auto;gap:.4rem}.turnering-tabell,.turnering-vinnare{padding:1rem}}

.turnering-regeldetaljer{margin:1rem 0;color:var(--text-dov);font-size:.85rem}.turnering-regeldetaljer summary{cursor:pointer;color:var(--is);font-weight:700}.turnering-regeldetaljer p{margin:.7rem 0}
/* Geometry-arcade med tre stora mobilknappar och appvy under åket. */
.spelrubrik{margin-bottom:1rem}.spelrubrik h1{font-size:clamp(2.8rem,7vw,5rem)}.arena{scroll-margin-top:7rem}.spelgrid{grid-template-columns:minmax(0,1fr)}.topplista[hidden]{display:none}
.app-installation{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:0 0 1rem;padding:.8rem 1rem;background:#1b1b21;border-left:3px solid var(--is);font-size:.8rem;flex-wrap:wrap}.app-installation[hidden],.mina-presentkort[hidden]{display:none}.app-installation span{display:block;color:var(--text-dov);font-size:.72rem}.app-installation p{flex-basis:100%;margin:0;color:var(--text-dov)}.app-installation .knapp{min-height:44px}
.spelknappar{flex-shrink:0}.spelknappar button{min-height:88px}.trickguide{padding:.6rem 1rem;color:var(--text-dov);font-size:.75rem}.trickguide summary{cursor:pointer;min-height:32px;align-content:center}.turnering{margin-top:2rem}.mina-presentkort{margin-block:2rem;padding:1.5rem;border:1px solid var(--is);background:var(--yta)}.presentkort{padding:1rem;border-bottom:1px solid var(--kant)}.presentkort code{display:block;overflow-wrap:anywhere;font-size:.8rem;margin:.6rem 0}.presentkort small{color:var(--text-dov)}
@media(max-width:560px){.spelmain{padding-top:1rem}.spelrubrik{gap:.5rem}.spelrubrik>p{font-size:.82rem}.spelrubrik h1{font-size:3.2rem}.spelstatus span:nth-child(2){display:none}.spelstatus{gap:.4rem}.spelstatus #byt-namn{margin-left:auto}.app-installation{padding:.6rem;gap:.6rem}.app-installation .knapp{font-size:.65rem;padding:.5rem .65rem}.topp nav{gap:.45rem}}
@media(max-width:900px),(pointer:coarse){
 body.spelar{height:100dvh;overflow:hidden;overscroll-behavior:none}
 .spelar .topp,.spelar .fot,.spelar .spelrubrik,.spelar .app-installation,.spelar .topplista,.spelar .turnering,.spelar .turnering-board,.spelar .trickguide,.spelar .spelinfo,.spelar .mina-presentkort{display:none!important}
 .spelar .spelmain{padding:0;width:100%;max-width:none;height:100dvh;overflow:hidden}.spelar .spelgrid{display:block;height:100%;margin:0}
 .spelar .arena{height:100%;display:flex;flex-direction:column;box-shadow:none;border:0;border-radius:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
 .spelar .spelstatus{flex-shrink:0;min-height:42px;padding:.25rem .5rem;gap:.5rem;flex-wrap:nowrap;white-space:nowrap}.spelar .spelstatus>span{font-size:.6rem;overflow:hidden;text-overflow:ellipsis}.spelar #byt-namn{display:none}.spelar #musik{margin-left:auto}.spelar .spelstatus button{min-height:36px;flex-shrink:0}
 .spelar .spelvy{flex:1;min-height:160px!important;overflow:hidden}.spelar .spelvy canvas{width:100%;height:100%;aspect-ratio:auto;object-fit:fill}.spelar .speltips{display:none}
 .spelar .spelknappar{height:108px;padding:8px}.spelar .spelknappar button{min-height:80px;font-size:.8rem}.spelar .spelknappar small{font-size:.53rem;max-width:11ch;margin-inline:auto}
 .spelar .spelpanel{max-height:100%;padding:.6rem}.spelar .spelpanel h2{font-size:1.8rem}.spelar .spelpanel>p{font-size:.78rem}
}
@media(max-height:500px) and (orientation:landscape){
 .spelar .arena{position:relative;padding-right:160px}.spelar .spelknappar{position:absolute;right:0;top:0;bottom:0;width:160px;height:auto;grid-template-columns:1fr;grid-template-rows:repeat(3,1fr);padding:8px}.spelar .spelknappar button{min-height:60px}.spelar .hud{inset:.4rem .5rem auto}.spelar .tempohud{inset:3.6rem .5rem auto}
}

/* Ett race och en resultattavla. Servern väljer kval/final eller träning när finalen är låst. */
.turnering-lagen,.turnering-lagestatus{display:none}

.spelpanel .namninfo a{color:var(--is);text-decoration:underline}#parningskod{letter-spacing:.4em;text-align:center;font-family:var(--mono)}
@media(max-width:560px){.spelvy:has(#namnform:not([hidden])){min-height:540px}}

/* Start- och målsignaler ligger utanför åkets 45 sekunder. */
.spelpanel .spelstarttal{font-family:var(--display,"Arial Black",sans-serif);font-size:clamp(4rem,16vw,7rem);font-weight:900;line-height:1;color:#ffdb26;text-shadow:4px 4px #ff56a7;letter-spacing:-.04em;margin:.4rem auto 1rem;animation:spelstart-puls 1s ease-out infinite}.spelstarttal[hidden]{display:none}.speloverlay[data-stage=start] .spelpanel{border:3px solid #ffdb26;padding:1.3rem;background:#101012}.speloverlay[data-stage=start] #paneltitel{color:#2fe6ee;font-size:clamp(1.5rem,5vw,2.3rem)}.speloverlay[data-stage=over] #paneltitel{color:#ffdb26;text-shadow:3px 3px #ff56a7}.speloverlay[data-stage=over] .resultat div:nth-child(2){border:2px solid #ffdb26}.speloverlay[data-stage=over] #resultat-poang{font-size:1.5rem}
@keyframes spelstart-puls{from{transform:scale(1.08);opacity:.8}35%,to{transform:scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.spelstarttal{animation:none}}

/* Tydlig målgång; resultatet kan läsas innan nästa åk låses upp. */
.speloverlay[data-stage=over] .spelpanel{border:3px solid #ffdb26;border-bottom:6px solid #ff56a7;padding:1.1rem;background:#101012}
.speloverlay[data-stage=over] #paneltitel{font-family:var(--display,sans-serif);font-size:clamp(3.3rem,15vw,6rem);font-weight:900;line-height:.9;max-width:7ch;margin:.8rem auto 1rem;letter-spacing:-.035em;text-shadow:4px 4px #ff56a7}

/* Målvyn stannar i samma arena. Tre sekunder betoning är ingen restartspärr. */
.spelactions{display:contents}.game-over .spelknappar{visibility:hidden;pointer-events:none}.game-over .spelvy:has(#resultat:not([hidden])){min-height:0!important}.game-over .speloverlay{padding:.6rem;overflow:hidden}.game-over .speloverlay .spelpanel{max-height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;box-sizing:border-box;padding:.8rem}.game-over .spelactions{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;position:sticky;top:0;z-index:2;padding:.45rem 0;background:#101012}.game-over #starta{min-height:50px;font-size:1rem;border:3px solid #fff8dc}.game-over .spelactions .knapp{margin:0}.game-over .speloverlay[data-stage=over] #paneltitel{max-width:none;font-size:clamp(2.4rem,10vw,4.5rem);line-height:1;margin:.4rem auto}.game-over-emphasis #starta{box-shadow:0 0 0 3px #ff56a7,0 0 18px #ffdb2666}.game-over-emphasis .speloverlay[data-stage=over] #paneltitel{color:#fff8dc}
@media(max-width:900px),(pointer:coarse){.game-over.spelar .spelknappar{display:none!important}.game-over.spelar .arena{padding-right:env(safe-area-inset-right)}.game-over.spelar .spelvy{min-height:0!important}.game-over.spelar .speloverlay{align-items:stretch}.game-over.spelar .spelpanel{margin:auto;max-height:100%;width:min(100%,560px)}}
@media(max-height:520px) and (orientation:landscape){.game-over .speloverlay{padding:.3rem}.game-over .speloverlay .spelpanel{padding:.4rem .7rem}.game-over .speloverlay[data-stage=over] #paneltitel{font-size:2.2rem;margin:.2rem auto}.game-over .spelpanel>.ogon{margin:.1rem 0;font-size:.6rem}.game-over .spelpanel>#paneltext{margin:.2rem 0;font-size:.7rem}.game-over .spelactions{padding:.3rem 0}.game-over #starta{min-height:44px;font-size:.85rem}.game-over .resultat{grid-template-columns:repeat(4,minmax(0,1fr));gap:.3rem;margin:.4rem 0}.game-over .resultat dd{font-size:.9rem}.game-over .resultat dt{font-size:.5rem}}