:root{
    --font-score:'Bebas Neue',Impact,'Arial Narrow',sans-serif;
    --font-trick:'Rubik Spray Paint','Permanent Marker',cursive;
    --font-shout:'Bungee',Impact,sans-serif;
    --font-event:'Bowlby One SC','Bungee',Impact,sans-serif;
    --font-tag:'Russo One',Impact,sans-serif;
    --skate-sticker:0 2px 0 rgba(0,0,0,.55),0 4px 12px rgba(0,0,0,.45);
    --skate-glow:0 0 18px currentColor;
    --anaglyph-off:5px;
    --anaglyph-depth:2px;
    --anaglyph-a:.72;
    --anaglyph-red:rgba(255,42,98,var(--anaglyph-a));
    --anaglyph-cyan:rgba(42,196,255,var(--anaglyph-a));
    --anaglyph-3d:
      calc(-1 * var(--anaglyph-off)) 0 0 var(--anaglyph-red),
      var(--anaglyph-off) 0 0 var(--anaglyph-cyan),
      calc(-1 * var(--anaglyph-off)) var(--anaglyph-depth) 0 rgba(255,42,98,calc(var(--anaglyph-a)*.48)),
      var(--anaglyph-off) var(--anaglyph-depth) 0 rgba(42,196,255,calc(var(--anaglyph-a)*.48));
    --skate-anaglyph:var(--anaglyph-3d),0 0 22px rgba(255,255,255,.16),0 4px 14px rgba(0,0,0,.38);
    --pop-dur:1.15s;
    --pop-life:1180ms;
    --hud-scale:1.1;
    --app-width:100vw;
    --app-height:100svh;
  }
  html,body{margin:0;padding:0;width:100%;height:var(--app-height);min-height:100svh;overflow:hidden;background:#04030a;font-family:'Segoe UI',Verdana,sans-serif;color:#eaf6ff;user-select:none;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;}
  canvas{display:block;}
  .hud{position:absolute;z-index:5;pointer-events:none;text-shadow:0 0 8px rgba(90,220,255,.8),0 1px 2px #000;}
  #topLeft{bottom:118px;left:14px;top:auto;max-width:172px;text-shadow:0 1px 2px rgba(0,0,0,.88);transform:scale(var(--hud-scale));transform-origin:left bottom;}
  #planetName{font-family:var(--font-score);font-size:15px;font-weight:400;letter-spacing:.06em;color:#aef3ff;text-transform:uppercase;line-height:1.1;}
  #planetSub{font-size:9px;color:#8fa2bd;letter-spacing:.4px;margin-top:1px;opacity:.85;line-height:1.25;max-width:172px;}
  #energyText{font-size:10px;margin-top:3px;color:#ffe28a;text-shadow:0 0 6px rgba(255,200,80,.55);display:flex;align-items:center;gap:4px;}
  .energyIcon,.coinIcon,.coinHud img{width:16px;height:16px;object-fit:contain;vertical-align:-3px;filter:drop-shadow(0 0 6px rgba(255,210,80,.78));}
  .coinHud{display:inline-flex;align-items:center;gap:4px;color:#ffd24d;text-shadow:0 0 7px rgba(255,190,60,.58);}
  #energyBarWrap{width:152px;height:5px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);border-radius:4px;margin-top:2px;overflow:hidden;}
  #energyBar{height:100%;width:0%;background:linear-gradient(90deg,#ffb347,#ffe066);box-shadow:0 0 10px #ffcf5e;transition:width .2s;}
  #burstHint{font-size:9px;margin-top:2px;color:rgba(255,226,138,.4);letter-spacing:.3px;}
  #burstHint.ready{color:#ffe28a;text-shadow:0 0 8px rgba(255,200,80,.7);}
  #burstHint.active{color:#fff;animation:burstPulse .5s linear infinite;}
  @keyframes burstPulse{0%{text-shadow:0 0 10px #ff5e8a;}33%{text-shadow:0 0 10px #5eff8a;}66%{text-shadow:0 0 10px #5e8aff;}100%{text-shadow:0 0 10px #ff5e8a;}}
  #portalStatus{font-size:9px;margin-top:2px;color:#9aa7c0;}
  #portalStatus.open{color:#7dffb0;text-shadow:0 0 10px #4dffa0;font-weight:700;}
  #surgeHud{display:none;margin-top:5px;padding:4px 7px;border-radius:4px;border:1px solid rgba(255,180,60,.28);background:rgba(40,24,8,.55);box-shadow:none;font-family:var(--font-tag);}
  #surgeHud .surgeTitle{font-family:var(--font-event);font-size:13px;letter-spacing:.08em;color:rgba(255,200,96,.82);font-weight:400;text-transform:uppercase;text-shadow:var(--skate-anaglyph),0 0 14px rgba(255,160,40,.42);}
  #surgeHud .surgeTimer{font-size:20px;font-family:var(--font-score);color:#ffe8a8;margin-top:2px;letter-spacing:.04em;}
  #surgeHud .surgeBoard{margin-top:6px;font-size:10px;color:#c8b8a0;font-family:var(--font-tag);letter-spacing:.04em;}
  #surgeHud .surgeRow{display:flex;justify-content:space-between;gap:8px;padding:1px 0;}
  #surgeHud .surgeRow.surgeMe{color:#ffe8a8;}
  #surgeHud .surgeRow.dim{color:#8a7a68;font-style:italic;}
  #raceChallengeHud{display:none;margin-top:5px;padding:4px 7px;border-radius:4px;border:1px solid rgba(90,220,255,.28);background:rgba(8,20,32,.55);font-family:var(--font-tag);}
  #raceChallengeHud .rcTitle{font-family:var(--font-event);font-size:13px;letter-spacing:.08em;color:rgba(125,255,176,.8);font-weight:400;text-transform:uppercase;text-shadow:var(--skate-anaglyph),0 0 12px rgba(90,220,255,.38);}
  #raceChallengeHud .rcBody{margin-top:6px;font-size:10px;color:#b8d8e8;font-family:var(--font-tag);}
  #raceChallengeHud .rcRow{display:flex;justify-content:space-between;gap:8px;padding:1px 0;}
  #raceChallengeHud .rcRow.rcMe{color:#aef3ff;}
  #rewardTag{font-family:var(--font-tag);font-size:11px;margin-top:4px;color:#9fdcff;display:none;letter-spacing:.06em;text-transform:uppercase;}
  body.in-intro .hud,body.in-intro #hint,body.in-menu .hud,body.in-menu #hint,body.map-mode #hint{display:none!important;}
  body.map-mode #topLeft{display:none;}
  body.map-mode #bottomLeft{display:none;}
  #topRight{top:10px;right:14px;text-align:right;font-family:var(--font-score);max-width:min(200px,42vw);text-shadow:0 1px 2px rgba(0,0,0,.88);transform:scale(var(--hud-scale));transform-origin:right top;}
  #score{font-family:var(--font-score);font-size:28px;font-weight:400;letter-spacing:.05em;color:#fff;transition:transform .12s ease,color .2s;line-height:1;}
  #score.score-bump{transform:scale(1.1);color:#ffe066;text-shadow:0 0 12px rgba(255,224,102,.75);}
  #comboMeter{margin-top:4px;padding:4px 8px 3px;border-radius:5px;background:rgba(8,6,24,.5);border:1px solid rgba(255,120,230,.22);box-shadow:none;transition:transform .15s ease,box-shadow .2s,border-color .2s;}
  #comboMeter.hidden{display:none;}
  #comboMeter.combo-pulse{animation:comboPulse .35s ease-out;}
  #comboMeter.t-nice{border-color:rgba(120,255,180,.4);box-shadow:0 0 14px rgba(80,255,160,.18);}
  #comboMeter.t-sick{border-color:rgba(255,180,80,.45);box-shadow:0 0 16px rgba(255,160,60,.22);}
  #comboMeter.t-insane{border-color:rgba(255,100,200,.5);box-shadow:0 0 18px rgba(255,77,210,.28);animation:comboPulseInsane .5s ease-in-out infinite alternate;}
  #comboMeter.t-legendary{border-color:rgba(255,230,100,.6);box-shadow:0 0 22px rgba(255,210,60,.32);animation:comboPulseInsane .35s ease-in-out infinite alternate;}
  #comboLive{font-family:var(--font-score);font-size:30px;font-weight:400;letter-spacing:.03em;color:rgba(255,255,255,.9);line-height:.95;text-shadow:var(--skate-anaglyph),0 0 10px rgba(255,180,240,.45);}
  #comboMultDisplay{font-family:var(--font-shout);font-size:10px;font-weight:400;color:rgba(255,138,240,.82);margin-top:2px;letter-spacing:.1em;text-transform:uppercase;}
  #comboBox{font-family:var(--font-trick);font-size:11px;margin-top:3px;min-height:0;max-width:188px;color:rgba(255,210,245,.68);text-shadow:var(--skate-anaglyph),0 0 8px rgba(255,120,230,.32);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  #comboMult{font-family:var(--font-tag);font-size:9px;font-weight:400;color:#a898b8;margin-top:1px;letter-spacing:.06em;text-transform:uppercase;}
  @keyframes comboPulse{0%{transform:scale(1);}40%{transform:scale(1.06);}100%{transform:scale(1);}}
  @keyframes comboPulseInsane{from{transform:scale(1);}to{transform:scale(1.03);}}
  #comboFlash{position:fixed;inset:0;z-index:4;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 40%,rgba(255,220,100,.28),transparent 70%);transition:opacity .12s;}
  #comboFlash.on{opacity:.75;}
  #comboFlash.flop{background:radial-gradient(ellipse at 50% 50%,transparent 42%,rgba(255,50,50,.22) 100%);}
  /* RGB chromatic hit — canvas filter + light fringe (no dark vignette) */
  #gameCanvas.rgb-shift{
    filter:
      drop-shadow(calc(-1 * var(--rgbpx,6px)) 0 0 rgba(255,52,118,var(--rgba,.42)))
      drop-shadow(var(--rgbpx,6px) 0 0 rgba(52,200,255,var(--rgba,.42)));
    transition:filter .04s ease-out;
  }
  #gameCanvas.rgb-shift-hard{
    filter:
      drop-shadow(calc(-1.15 * var(--rgbpx,9px)) 0 0 rgba(255,32,96,var(--rgba,.58)))
      drop-shadow(calc(1.15 * var(--rgbpx,9px)) 0 0 rgba(32,176,255,var(--rgba,.58)))
      drop-shadow(0 calc(var(--rgbpx,9px)*.12) 0 rgba(255,210,120,calc(var(--rgba,.22))));
  }
  #gameCanvas.cam-shake{animation:camShake .42s ease-out;}
  @keyframes camShake{
    0%,100%{transform:translate(0,0);}
    14%{transform:translate(calc(-5px*var(--shk,1)),calc(2px*var(--shk,1)));}
    28%{transform:translate(calc(4px*var(--shk,1)),calc(-3px*var(--shk,1)));}
    42%{transform:translate(calc(-3px*var(--shk,1)),calc(-1px*var(--shk,1)));}
    58%{transform:translate(calc(3px*var(--shk,1)),calc(2px*var(--shk,1)));}
    74%{transform:translate(calc(-1px*var(--shk,1)),calc(1px*var(--shk,1)));}
  }
  #backroomsStatic{
position:fixed;inset:0;z-index:4;pointer-events:none;opacity:0;
mix-blend-mode:screen;
background:
repeating-linear-gradient(0deg,rgba(255,255,255,.16) 0 1px,rgba(0,0,0,0) 1px 4px),
repeating-linear-gradient(90deg,rgba(120,240,255,.09) 0 2px,rgba(255,80,180,.08) 2px 4px,rgba(0,0,0,0) 4px 7px),
radial-gradient(circle at var(--brsx,50%) var(--brsy,50%),rgba(255,255,255,.22),rgba(255,255,255,0) 18%);
filter:contrast(1.5) saturate(1.25);
transform:translate3d(var(--brdx,0),var(--brdy,0),0);
transition:opacity .16s linear;
}
#backroomsStatic.on{
opacity:calc(.12 + var(--brstatic,0) * .36);
animation:brStaticSweep .11s steps(2,end) infinite;
}
#backroomsStatic.hard{
mix-blend-mode:hard-light;
filter:contrast(2.1) saturate(1.5);
animation-duration:.075s;
}
@keyframes brStaticSweep{
from{background-position:0 0,0 0,0 0;}
to{background-position:0 11px,19px 0,0 0;}
}
 #impactFlash{position:fixed;inset:0;z-index:3;pointer-events:none;opacity:0;--imp:1;}
  #impactFlash.on{
    opacity:1;
    background:linear-gradient(90deg,rgba(255,56,120,calc(.14*var(--imp))) 0%,transparent 38%,transparent 62%,rgba(56,196,255,calc(.14*var(--imp))) 100%);
    animation:impactFringe .17s ease-out forwards;
  }
  #impactFlash.hard.on{
    background:linear-gradient(90deg,rgba(255,40,100,calc(.2*var(--imp))) 0%,transparent 34%,transparent 66%,rgba(40,180,255,calc(.2*var(--imp))) 100%);
    animation:impactFringe .2s ease-out forwards;
  }
  @keyframes impactFringe{0%{opacity:0;}12%{opacity:1;}100%{opacity:0;}}
  #flopOverlay{position:fixed;z-index:6;left:50%;top:42%;transform:translate(-50%,-50%) scale(calc(.7 * var(--hud-scale)));opacity:0;pointer-events:none;text-align:center;transition:opacity .15s,transform .2s cubic-bezier(.2,1.4,.4,1);transform-origin:center center;}
  #flopOverlay.on{opacity:1;transform:translate(-50%,-50%) scale(var(--hud-scale));}
  #flopOverlay .flopPts{font-family:var(--font-score);font-size:58px;font-weight:400;color:#ff3a3a;letter-spacing:.04em;text-shadow:0 0 24px rgba(255,50,50,.95),0 4px 8px #000;}
  #flopOverlay .flopSub{font-family:var(--font-shout);font-size:20px;font-weight:400;color:#ffaaaa;margin-top:6px;letter-spacing:.14em;text-transform:uppercase;text-shadow:0 2px 6px #000;}
  #flopOverlay.recovery{top:29%;width:min(560px,86vw);}
  #flopOverlay.recovery .flopPts{font-size:42px;line-height:1.02;}
  #flopOverlay.recovery .flopSub{font-size:15px;line-height:1.2;}
  @media(max-width:600px){
    #flopOverlay.recovery{top:29%;width:82vw;}
    #flopOverlay.recovery .flopPts{font-size:34px;}
    #flopOverlay.recovery .flopSub{font-size:13px;}
  }
  #bottomLeft{bottom:18px;left:18px;transform:scale(var(--hud-scale));transform-origin:left bottom;}
  #speedNum{font-size:28px;font-weight:700;color:#9fdcff;letter-spacing:1px;}
  #speedNum span{font-size:12px;color:#8fa2bd;font-weight:400;letter-spacing:1px;}
  #speedNum.flow{color:#ff4dd2;text-shadow:0 0 14px rgba(255,77,210,.9),0 1px 2px #000;}
  #stamLabel{font-size:10px;color:#8fa2bd;letter-spacing:1px;margin-top:6px;}
  #stamBarWrap{width:180px;height:6px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);border-radius:4px;margin-top:2px;overflow:hidden;}
  #stamBar{height:100%;width:100%;background:linear-gradient(90deg,#4dff9e,#b8ff4d);box-shadow:0 0 8px #6dff9e;}
  #stamBar.low{background:#ff5a5a;box-shadow:0 0 8px #ff5a5a;}
  #speedBarWrap{width:180px;height:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);border-radius:5px;margin-top:3px;overflow:hidden;}
  #speedBar{height:100%;width:0%;background:linear-gradient(90deg,#37e6ff,#b44dff);box-shadow:0 0 8px #5ad2ff;}
  #hint{bottom:18px;right:168px;font-size:12px;color:#8fa2bd;text-align:right;max-width:calc(100vw - 240px);transform:scale(var(--hud-scale));transform-origin:right bottom;}
  #planetGlobeHud{position:absolute;bottom:14px;right:16px;z-index:5;pointer-events:none;width:140px;display:none;transform:scale(var(--hud-scale));transform-origin:right bottom;}
  #planetGlobeHud .planetGlobeFrame{
    position:relative;width:140px;height:140px;border-radius:50%;
    background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.14),rgba(6,10,22,.94) 70%);
    border:1px solid rgba(120,170,220,.42);
    box-shadow:0 0 22px rgba(90,160,255,.22),inset 0 0 24px rgba(0,0,0,.55);
    overflow:hidden;
  }
  #planetGlobeHud canvas{width:100%;height:100%;display:block;}
  #planetGlobeHud .globeLbl{font-size:9px;letter-spacing:1.6px;text-transform:uppercase;color:#8fa2bd;
    text-align:center;margin-top:5px;font-family:var(--font-tag);text-shadow:0 1px 2px #000;}
  #planetGlobeHud .globeKey{font-size:8px;letter-spacing:.35px;color:#6a7a94;text-align:center;margin-top:3px;line-height:1.4;}
  #planetGlobeHud .globeKey i{font-style:normal;display:inline-block;width:6px;height:6px;border-radius:50%;margin:0 2px 0 3px;vertical-align:middle;box-shadow:0 0 4px currentColor;}
  body.map-mode #planetGlobeHud{display:none;}
  #best{font-family:var(--font-score);font-size:13px;font-weight:400;color:#9fb4d8;margin-top:1px;letter-spacing:.08em;}
  #balanceWrap{position:absolute;left:50%;bottom:92px;transform:translateX(-50%) scale(var(--hud-scale));transform-origin:center bottom;width:240px;height:14px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.35);border-radius:8px;display:none;}
  #balanceWrap::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:2px;background:rgba(255,255,255,.4);margin-left:-1px;}
  #balanceMark{position:absolute;top:-4px;left:50%;width:6px;height:20px;background:#ffe066;box-shadow:0 0 10px #ffcf5e;border-radius:3px;margin-left:-3px;}
  #railHint{position:absolute;left:50%;bottom:112px;transform:translateX(-50%) translateY(5px) scale(var(--hud-scale));transform-origin:center bottom;z-index:5;pointer-events:none;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 10px;max-width:min(420px,calc(100vw - 28px));padding:5px 11px;background:rgba(8,12,20,.82);border:1px solid rgba(120,170,220,.28);border-radius:3px;font-size:10px;line-height:1.35;letter-spacing:.35px;color:#9eb0c8;opacity:0;transition:opacity .18s ease,transform .18s ease;box-shadow:0 2px 10px rgba(0,0,0,.35);}
  #railHint.on{opacity:1;transform:translateX(-50%) translateY(0) scale(var(--hud-scale));}
  #railHint .rhTag{font-size:8px;letter-spacing:1.6px;text-transform:uppercase;color:#6d8aa8;padding-right:2px;}
  #railHint b{color:#e6f0ff;font-weight:600;}
  #railHint .rhDot{opacity:.35;}
  #railHint .rhMag b{color:#9fd4ff;}
  #railHint .rhHop b{color:#c8b0ff;}
  .accountBlock{margin-top:10px;padding:10px 12px;border:1px solid rgba(120,170,220,.28);border-radius:2px;background:linear-gradient(180deg,rgba(14,20,32,.85),rgba(8,12,20,.9));display:flex;flex-direction:column;gap:8px;}
  .lobbyBlock{margin-top:8px;padding:12px;border:1px solid rgba(100,220,160,.28);border-radius:6px;background:radial-gradient(circle at top left,rgba(125,255,176,.14),transparent 38%),linear-gradient(180deg,rgba(10,24,18,.9),rgba(6,14,10,.94));display:flex;flex-direction:column;gap:10px;font-size:11px;box-shadow:0 0 22px rgba(20,255,150,.08);}
  .lobbyBlock>b{font-size:10px;letter-spacing:1.5px;color:#8fd4a8;}
  .lbBlock{margin-top:8px;padding:10px 12px;border:1px solid rgba(120,160,255,.32);border-radius:2px;background:linear-gradient(180deg,rgba(12,18,32,.9),rgba(8,12,24,.92));font-size:11px;}
  .lbBlock>b{font-size:10px;letter-spacing:1.5px;color:#9eb8ff;}
  #lbBoard{width:100%;margin:6px 0 4px;background:#0a1020;color:#cfe3ff;border:1px solid rgba(120,160,255,.35);font-size:11px;}
  #lbList{max-height:120px;overflow-y:auto;}
  .lbRow{display:flex;justify-content:space-between;gap:8px;padding:2px 0;color:#b8c8e0;}
  .lbRow.lbMe{color:#ffe8a8;}
  .lbRow.dim{color:#7a8aa8;font-style:italic;}
  #lbYou{margin-top:4px;font-size:10px;color:#8fa2bd;}
  .replayBlock{margin-top:8px;padding:10px 12px;border:1px solid rgba(255,210,77,.32);border-radius:2px;background:linear-gradient(180deg,rgba(24,20,10,.9),rgba(14,12,8,.92));font-size:11px;}
  .replayBlock>b{font-size:10px;letter-spacing:1.5px;color:#ffd24d;}
  .replayWeekly{margin-top:6px;padding:6px 8px;border-radius:3px;background:rgba(0,0,0,.28);line-height:1.45;}
  .replayWeekly.done{border:1px solid rgba(125,255,176,.35);color:#9fd4b0;}
  .replayWeekly .rwTarget{color:#ffe8a8;font-weight:700;}
  .replayPBs{margin-top:6px;display:grid;grid-template-columns:1fr 1fr;gap:3px 10px;font-size:10px;color:#b8c8e0;}
  .replayPBs span:last-child{text-align:right;color:#dfe8ff;}
  .replayProgress{margin-top:6px;font-size:10px;color:#9eb0c8;line-height:1.4;}
  #helpPanel.pause .replayBlock{display:none;}
  #brTimer{position:absolute;top:54px;left:50%;transform:translateX(-50%) scale(var(--hud-scale));transform-origin:center top;z-index:5;display:none;padding:3px 10px;background:rgba(24,18,8,.55);border:1px solid rgba(200,184,96,.28);border-radius:2px;font-family:var(--font-tag);font-size:9px;letter-spacing:.05em;text-transform:uppercase;color:#e8d898;text-align:center;}
  #missionStrip{position:absolute;top:70px;left:14px;z-index:5;display:flex;flex-direction:column;align-items:flex-start;gap:6px;pointer-events:none;max-width:min(360px,calc(100vw - 28px));transform:scale(var(--hud-scale));transform-origin:left top;}
  #missionStrip:empty{display:none;}
  #missionStrip .missionChip{display:none;padding:6px 11px;background:rgba(4,8,14,.62);border:1px solid rgba(255,255,255,.18);border-radius:4px;font-family:var(--font-tag);font-size:13px;letter-spacing:.045em;text-transform:uppercase;color:#d8e8f8;text-align:left;line-height:1.35;box-shadow:0 3px 12px rgba(0,0,0,.28);text-shadow:0 1px 2px rgba(0,0,0,.95);}
  #missionStrip .missionChip.on{display:block;}
  #missionStrip .missionChip.done{color:#9fd4b0;border-color:rgba(125,255,176,.22);}
  #missionStrip .missionChip.hot{color:#ffe8a8;border-color:rgba(255,180,60,.22);}
  #missionStrip .missionChip b{color:#ffd24d;font-weight:600;}
  #brTimer.on{display:block;}
  #rareFindHud{position:absolute;top:20px;left:50%;transform:translateX(-50%) scale(var(--hud-scale));transform-origin:center top;z-index:5;display:none;padding:8px 16px;background:rgba(8,16,28,0.85);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid rgba(125,255,176,.7);border-radius:8px;font-family:var(--font-tag);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#ffffff;text-align:center;white-space:nowrap;text-shadow:0 1px 3px rgba(0,0,0,.95);transition:opacity 0.25s ease-in-out, transform 0.25s ease;box-shadow:0 0 18px rgba(125,255,176,.4);animation:rareFindPulse 2s infinite alternate;}
  #rareFindHud.on{display:block;}
  .itemInventoryHud{display:none;position:absolute;left:50%;bottom:16px;transform:translateX(-50%) scale(var(--hud-scale));transform-origin:center bottom;z-index:7;align-items:center;gap:4px;padding:5px 7px;border:1px solid rgba(125,255,176,.35);background:rgba(5,10,18,.88);box-shadow:0 0 16px rgba(0,0,0,.45);pointer-events:auto;}
  .itemInventoryHud.on{display:flex;}
  .itemInventorySlot{position:relative;width:42px;height:38px;border:1px solid rgba(125,255,176,.58);border-radius:3px;background:rgba(13,25,35,.95);color:#fff;cursor:pointer;display:grid;grid-template-columns:12px 1fr;grid-template-rows:1fr 12px;align-items:center;padding:2px;}
  .itemInventorySlot:disabled,.itemInventorySlot.empty{opacity:.28;cursor:default;filter:grayscale(1);}
  .itemInventorySlot .itemKey{grid-row:1/3;color:#8ba0b8;font:8px Consolas,monospace;}
  .itemInventorySlot .itemIcon{font-size:17px;line-height:1;}
  .itemInventorySlot b{font:9px Consolas,monospace;color:#7dffb0;}
  .itemInventoryHint{font:8px Consolas,monospace;color:#9fb2ca;white-space:nowrap;padding-left:3px;}
  @keyframes rareFindPulse {
    0% { box-shadow: 0 0 12px rgba(125, 255, 176, 0.3); border-color: rgba(125, 255, 176, 0.5); }
    100% { box-shadow: 0 0 22px rgba(125, 255, 176, 0.65); border-color: rgba(125, 255, 176, 0.9); }
  }
  .replayRare{margin-top:8px;font-size:10px;line-height:1.45;color:#a8b8c8;}
  .replayRare b{color:#ffd24d;font-size:10px;letter-spacing:1px;}
  .replayRare .rfGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 6px;margin-top:6px;}
  .replayRare .rfItem{padding:4px 5px;border:1px solid rgba(255,255,255,.08);border-radius:2px;background:rgba(0,0,0,.22);font-size:9px;text-align:center;opacity:.45;}
  .replayRare .rfItem.found{opacity:1;border-color:rgba(125,255,176,.35);color:#d8ffe8;}
  #huntHud b{color:#7dffb0;}
  .replayMastery{margin-top:6px;display:grid;grid-template-columns:repeat(3,1fr);gap:4px;font-size:10px;}
  .replayMastery span{padding:3px 4px;border-radius:2px;background:rgba(8,12,18,.5);text-align:center;line-height:1.3;}
  .replayMastery .t0{color:#6a7a94;}
  .replayMastery .t1{color:#cd9a6a;}
  .replayMastery .t2{color:#c8c8d8;}
  .replayMastery .t3{color:#ffd24d;}
  .styleBadgeGrid{margin-top:6px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;font-size:9px;}
  .styleBadgeGrid .styleBadge{padding:4px 5px;border-radius:3px;background:rgba(8,12,18,.48);border:1px solid rgba(255,255,255,.08);color:#6f7d91;text-align:center;line-height:1.25;text-transform:uppercase;letter-spacing:.05em;}
  .styleBadgeGrid .styleBadge.on{color:#d8ffe8;border-color:rgba(125,255,176,.35);background:rgba(30,80,58,.24);box-shadow:0 0 8px rgba(125,255,176,.12);}
  .replayDaily{margin-top:6px;font-size:10px;color:#c8b888;line-height:1.4;}
  .replayDaily.done{border:1px solid rgba(125,255,176,.35);color:#9fd4b0;border-radius:3px;padding:6px 8px;background:rgba(0,0,0,.22);}
  .milestoneList{display:flex;flex-direction:column;gap:3px;max-height:140px;overflow-y:auto;font-size:10px;}
  .milestoneRow{display:flex;align-items:center;gap:6px;padding:3px 4px;border-radius:2px;background:rgba(0,0,0,.22);color:#8a98ac;}
  .milestoneRow.done{color:#b8e8c8;}
  .milestoneRow img{width:18px;height:18px;object-fit:contain;opacity:.35;}
  .milestoneRow.done img{opacity:1;}
  .milestoneRow span{flex:1;line-height:1.25;}
  .lobbyHero{display:flex;flex-direction:column;gap:8px;padding:9px 10px;border:1px solid rgba(125,255,176,.22);background:rgba(4,10,8,.5);border-radius:4px;}
  .lobbyHero b{display:block;color:#7dffb0;font-size:12px;letter-spacing:2px;text-transform:uppercase;margin-bottom:3px;}
  #lobbyStatus{display:block;color:#cde8d8;line-height:1.35;font-size:11px;}
  .lobbyStepPills{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;}
  .lobbyStepPills span{padding:5px 4px;border:1px solid rgba(125,255,176,.22);border-radius:999px;background:rgba(125,255,176,.07);color:#aee8c7;text-align:center;font-size:8px;letter-spacing:.8px;text-transform:uppercase;}
  .lobbyAccountBlock{margin:0;border-color:rgba(120,170,255,.36);background:linear-gradient(180deg,rgba(14,20,32,.92),rgba(7,12,20,.94));}
  #lobbyJoinRow,#lobbyInRow{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch;}
  .lobbyActionGrid{display:grid;grid-template-columns:1fr 1.4fr;gap:8px;}
  .lobbyActionGrid .accountBtn{min-height:38px;}
  .lobbyActionGrid #btnLobbyQuickJoin,.lobbyActionGrid #btnLobbyJoin,.lobbyActionGrid #btnLobbyCreate{grid-column:auto;}
  .lobbyField{display:flex;flex-direction:column;gap:4px;color:#8fd4a8;font-size:9px;letter-spacing:1.2px;text-transform:uppercase;}
  .lobbyListField{min-width:0;}
  #lobbyList,#lobbyPlanet{width:100%;background:rgba(8,12,18,.9);color:#dfe8ff;border:1px solid rgba(120,160,200,.35);border-radius:4px;padding:7px 8px;font-size:11px;}
  #helpPanel.pause .lobbyBlock{display:flex;}
  #helpPanel.pause .lobbyBlock.compactLobby{padding:6px 9px;gap:4px;}
  .accountBlock>b{font-size:10px;letter-spacing:1.5px;color:#9eb0c8;}
  #accountSignedOut,#accountSignedIn{align-items:center;gap:10px;flex-wrap:wrap;}
  #accountSignedOut{display:flex;justify-content:space-between;}
  #accountSignedIn{display:none;}
  #accountHint{font-size:10px;color:#9eb0c8;line-height:1.35;flex:1;min-width:140px;}
  #accountSync{font-size:10px;color:#7dffb0;letter-spacing:.5px;}
  #accountName{font-size:12px;color:#e6f0ff;font-weight:600;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  #accountPhoto{width:28px;height:28px;border-radius:50%;border:1px solid rgba(148,162,184,.45);object-fit:cover;}
  .accountBtn{font-family:Consolas,'Courier New',monospace;font-size:10px;letter-spacing:1.2px;text-transform:uppercase;padding:7px 12px;border-radius:2px;border:1px solid rgba(148,162,184,.45);background:linear-gradient(180deg,rgba(30,38,52,.95),rgba(18,22,32,.95));color:#e6f0ff;cursor:pointer;pointer-events:auto;}
  .accountBtn:hover{border-color:rgba(159,220,255,.55);color:#fff;}
  .accountBtn.google{border-color:rgba(120,170,255,.5);color:#cfe3ff;background:linear-gradient(180deg,rgba(26,54,96,.96),rgba(14,28,54,.96));}
  .accountBtn.ghost{background:transparent;color:#9eb0c8;padding:5px 8px;}
  .optionsBlock{margin-top:10px;padding:8px 12px;border:1px solid rgba(148,162,184,.2);border-radius:2px;background:rgba(12,16,24,.45);}
  .optionsBlock>b{font-size:10px;letter-spacing:1.5px;color:#9eb0c8;}
  .devBlock{display:none;margin-top:10px;padding:8px 12px;border:1px solid rgba(255,96,48,.4);border-radius:2px;background:rgba(24,10,8,.72);}
  .devBlock.on{display:block;}
  .devBlock>b{font-size:10px;letter-spacing:1.5px;color:#ff7840;}
  #devStats{margin-top:6px;font-family:Consolas,'Courier New',monospace;font-size:10px;line-height:1.55;color:#b8c8dc;white-space:pre-wrap;}
  .devActions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
  .devBtn{font-family:Consolas,'Courier New',monospace;font-size:10px;letter-spacing:1px;padding:6px 10px;border:1px solid rgba(255,120,64,.45);border-radius:2px;background:rgba(40,18,12,.9);color:#ffd0b8;cursor:pointer;pointer-events:auto;}
  .devBtn:hover{border-color:rgba(255,160,96,.75);color:#fff;}
  #optionsRows{margin-top:6px;}
  #optionsRows .czRow{margin-top:4px;}
  #optionsRows .czLab{width:118px;font-size:10px;}
  #helpPanel.compact .optionsBlock{margin-top:6px;padding:6px 10px;}
  #helpPanel.compact #optionsRows .czLab{width:88px;font-size:9px;}
  #optionsRows .volRow .czLab{width:52px;}
  #optionsRows input[type=range].volSlider{flex:1;min-width:72px;max-width:150px;height:4px;accent-color:#ffb000;cursor:pointer;pointer-events:auto;}
  #optionsRows .volVal{min-width:34px;font-size:10px;color:#9eb0c8;font-family:Consolas,'Courier New',monospace;text-align:right;}
  #displayModeLabel{font-size:10px;color:#8a98ac;letter-spacing:.3px;flex:1;min-width:120px;line-height:1.35;}
  #helpPanel.compact #displayModeLabel{font-size:9px;}
  #helpPanel.compact .accountBlock{padding:6px 9px;margin-top:6px;gap:4px;}
  #helpPanel.pause .menuTipsShort{display:none;}
  #helpPanel.pause{font-size:78%;transform:scale(var(--hud-scale));transform-origin:center center;}
  #helpPanel.pause .accountBlock{display:flex;}
  #helpPanel.pause #titleLogo{max-height:min(11vh,80px);}
  #helpPanel.pause h2{display:none;}
  #helpPanel.pause .menuSectionLabel{margin:2px 0 3px;}
  #helpPanel.pause .menuCtrlGrid{gap:4px;font-size:9px;line-height:1.32;}
  #helpPanel.pause .menuCtrlGrid>div{padding:4px 5px;}
  #helpPanel.pause .garageLaunch{margin-top:4px;padding:5px 8px;}
  #helpPanel.pause .optionsBlock{margin-top:4px;padding:5px 8px;}
  #helpPanel.pause #btnMenuPlay{margin-top:6px;padding:5px 8px;}
  /* solar system map — z-index above #gameCanvas (fixed WebGL layer) */
  #mapOverlay{position:absolute;inset:0;z-index:6;display:none;pointer-events:none;}
  #mapHeader{position:absolute;inset:0 0 auto 0;pointer-events:none;transform:scale(var(--hud-scale));transform-origin:center top;}
  body.map-clean #mapHeader,body.map-clean #mapLabels,body.map-clean #mapBrowse,body.map-clean #mapOrbitTag{display:none!important;}
  #mapLabels{position:absolute;inset:0;pointer-events:none;overflow:visible;}
  #mapTitle{position:absolute;top:18px;left:50%;transform:translateX(-50%);font-size:26px;font-weight:700;letter-spacing:6px;color:#cfe3ff;text-shadow:0 0 16px rgba(120,160,255,.85);}
  #mapSub{position:absolute;top:50px;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:1px;color:#7a8aa8;text-align:center;max-width:560px;line-height:1.45;}
  #mapLegend{position:absolute;top:72px;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.5px;color:#8fa2bd;text-align:center;max-width:min(720px,calc(100vw - 32px));line-height:1.45;}
  #mapLegend .openDot{color:#7dffb0;font-weight:700;}
  #mapLegend .lockDot{color:#5a6378;}
  #mapHint{position:absolute;bottom:16px;left:50%;transform:translateX(-50%) scale(var(--hud-scale));transform-origin:center bottom;font-size:12px;color:#8fa2bd;text-align:center;max-width:min(720px,calc(100vw - 32px));line-height:1.5;}
  body.map-clean #mapHint{opacity:.35;}
  #mapOrbitTag{position:absolute;bottom:44px;left:50%;transform:translateX(-50%) scale(var(--hud-scale));transform-origin:center bottom;font-size:10px;letter-spacing:1.2px;color:#6a7a94;text-align:center;opacity:0;transition:opacity .2s;}
  #mapOrbitTag.on{opacity:1;}
  body.map-mode{cursor:grab;}
  body.map-mode.map-drag{cursor:grabbing;}
  #mapMenuBtn{position:absolute;top:58px;right:20px;z-index:7;font-family:Consolas,'Courier New',monospace;font-size:11px;letter-spacing:2px;padding:7px 14px;border:1px solid rgba(148,162,184,.45);border-radius:2px;background:linear-gradient(180deg,rgba(42,48,58,.95),rgba(24,28,36,.98));color:#dce6f4;cursor:pointer;pointer-events:auto;transition:border-color .15s,box-shadow .15s;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 2px 8px rgba(0,0,0,.35);transform:scale(var(--hud-scale));transform-origin:right top;}
  #mapMenuBtn:hover{border-color:rgba(255,176,0,.65);color:#ffb000;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 14px rgba(11,61,145,.35);}
  #mapInfoToggleBtn{position:absolute;top:58px;right:190px;z-index:7;font-family:Consolas,'Courier New',monospace;font-size:10px;letter-spacing:1.5px;padding:7px 14px;border:1px solid rgba(148,162,184,.42);border-radius:2px;background:linear-gradient(180deg,rgba(24,36,46,.92),rgba(12,18,28,.95));color:#aef3ff;cursor:pointer;pointer-events:auto;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 2px 8px rgba(0,0,0,.28);transform:scale(var(--hud-scale));transform-origin:right top;}
  #mapInfoToggleBtn[aria-pressed="false"]{color:#8fa2bd;border-color:rgba(90,100,120,.45);background:linear-gradient(180deg,rgba(22,24,30,.82),rgba(10,12,18,.9));}
  #mapTouchControls{position:absolute;left:50%;bottom:18px;transform:translateX(-50%) scale(var(--hud-scale));transform-origin:center bottom;z-index:8;display:none;gap:8px;align-items:center;justify-content:center;pointer-events:auto;}
  .mapTouchHelp{display:none;}
  .mapTouchBtn{min-width:48px;min-height:44px;padding:9px 12px;border:1px solid rgba(148,162,184,.45);border-radius:10px;background:linear-gradient(180deg,rgba(32,38,52,.92),rgba(10,13,22,.95));color:#e6f2ff;font-family:Consolas,'Courier New',monospace;font-size:11px;letter-spacing:1px;text-transform:uppercase;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 4px 16px rgba(0,0,0,.38);touch-action:manipulation;pointer-events:auto;}
  .mapTouchBtn.primary{min-width:92px;color:#0a1a12;border-color:rgba(125,255,176,.72);background:linear-gradient(180deg,rgba(125,255,176,.92),rgba(61,255,122,.74));font-weight:700;}
  .mapTouchBtn.secondary{color:#ffdf8a;border-color:rgba(255,176,0,.52);}
  .mapTouchBtn:disabled{opacity:.72;color:#8a94a8;border-color:rgba(90,100,120,.45);background:linear-gradient(180deg,rgba(35,38,48,.82),rgba(18,20,28,.9));}
  .mapTouchBtn:active{transform:translateY(1px);filter:brightness(1.18);}
  .mapLabel{position:absolute;transform:translate(-50%,-160%) scale(var(--hud-scale));transform-origin:center bottom;font-size:12px;letter-spacing:1px;white-space:nowrap;}
  .mapLabel.open{color:#b8f0d0;text-shadow:0 1px 3px #000,0 0 10px rgba(80,255,170,.55);}
  .mapLabel.open.sel{color:#ffe066;font-weight:700;text-shadow:0 0 12px rgba(255,224,102,.85),0 1px 3px #000;}
  .mapLabel.locked{color:#6a7488;opacity:.82;text-shadow:0 1px 2px #000;}
  .mapLabel.locked.sel{color:#9aa8c0;font-weight:600;text-shadow:0 0 8px rgba(100,120,150,.4),0 1px 3px #000;}
  .mapLabel.moonLabel{color:#a0c0e0;opacity:.78;text-shadow:0 1px 2px #000;}
  .mapLabel.moonLabel.sel{color:#ffd24d;font-weight:600;text-shadow:0 0 8px rgba(255,210,77,.6),0 1px 3px #000;}
  .mapLabel.here{color:#7dffb0;font-weight:700;text-shadow:0 0 10px rgba(80,255,170,.8),0 1px 3px #000;}
  .mapLabel.dim{opacity:.28;}
  #mapBrowse .mapBadge{display:inline-block;font-size:10px;letter-spacing:2px;padding:3px 8px;border-radius:3px;margin-left:8px;vertical-align:middle;}
  #mapBrowse .mapBadge.open{color:#0a1a12;background:rgba(80,255,170,.18);border:1px solid rgba(125,255,176,.55);}
  #mapBrowse .mapBadge.locked{color:#8a94a8;background:rgba(40,44,56,.85);border:1px solid rgba(90,100,120,.45);}
  #mapBrowse{position:absolute;left:24px;top:24px;width:336px;max-height:calc(100vh - 120px);overflow-y:auto;background:rgba(10,8,32,.92);border:1px solid rgba(120,160,255,.4);border-radius:10px;padding:14px 16px;pointer-events:none;box-shadow:0 0 28px rgba(90,80,255,.3);transform:scale(var(--hud-scale));transform-origin:left top;}
  #mapBrowse .counter{font-size:11px;color:#7a8aa8;letter-spacing:1px;margin-bottom:6px;}
  #mapBrowse .gline{font-size:11px;color:#9fb4d8;letter-spacing:1px;margin-bottom:8px;}
  #mapBrowse .desc{font-size:12px;color:#cfe3ff;line-height:1.5;margin-bottom:8px;}
  #mapBrowse .course{font-size:12px;color:#ffd2f5;margin:2px 0;}
  #mapBrowse .facts{font-size:11px;color:#9fb4d8;line-height:1.55;margin:8px 0;padding:8px 0;border-top:1px solid rgba(120,160,255,.2);border-bottom:1px solid rgba(120,160,255,.15);}
  #mapBrowse .facts b{color:#aef3ff;font-weight:600;}
  #mapBrowse .act{margin-top:10px;font-size:12px;color:#7dffb0;letter-spacing:1px;}
  #mapBrowse .act.lock{color:#5a6378;}
  #mapBrowse .mobileOnly{display:none;}
  .mapAccountPill{position:absolute;top:18px;right:244px;z-index:8;min-width:174px;max-width:260px;padding:7px 12px;border:1px solid rgba(125,255,176,.46);border-radius:999px;background:linear-gradient(180deg,rgba(10,28,24,.88),rgba(5,12,18,.94));color:#d8f6ff;font:800 10px/1.15 Consolas,'Courier New',monospace;letter-spacing:.08em;text-transform:uppercase;display:flex;align-items:center;justify-content:space-between;gap:10px;box-shadow:0 0 18px rgba(90,255,190,.16),inset 0 1px 0 rgba(255,255,255,.08);cursor:pointer;pointer-events:auto;transform:scale(var(--hud-scale));transform-origin:right top;}
  .mapAccountPill span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;}
  .mapAccountPill span:last-child{color:#7dffb0;font-size:9px;white-space:nowrap;}
  .mapAccountPill.signedOut{border-color:rgba(120,170,255,.45);background:linear-gradient(180deg,rgba(18,32,56,.9),rgba(8,14,28,.95));}
  .mapAccountPill.signedOut span:last-child{color:#cfe3ff;}
  .mapAccountPill.needsHandle{border-color:rgba(255,210,77,.55);}
  .mapAccountPill.needsHandle span:last-child{color:#ffd24d;}
  .sessionDock{position:absolute;right:48px;top:108px;z-index:8;width:336px;max-height:calc(100vh - 170px);overflow-y:auto;padding:12px;border:1px solid rgba(125,255,176,.36);border-radius:14px;background:radial-gradient(circle at top right,rgba(125,255,176,.13),transparent 38%),linear-gradient(180deg,rgba(7,16,24,.92),rgba(4,8,16,.96));box-shadow:0 0 28px rgba(60,255,180,.14),0 8px 28px rgba(0,0,0,.45);pointer-events:auto;transform:scale(calc(var(--hud-scale,1) * 0.8));transform-origin:right top;color:#d8f6ff;font-family:Consolas,'Courier New',monospace;}
  .sessionDockHeader{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:9px;}
  .sessionDockHeader b{display:block;color:#7dffb0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;}
  .sessionDockHeader span{display:block;margin-top:3px;color:#9fb4d8;font-size:10px;line-height:1.35;}
  #mapSessionCollapse{flex:0 0 auto;border:1px solid rgba(148,162,184,.36);border-radius:8px;background:rgba(12,18,28,.82);color:#cfe3ff;font:800 9px Consolas,monospace;text-transform:uppercase;letter-spacing:.08em;padding:6px 8px;cursor:pointer;}
  .sessionTabs{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:9px;}
  .sessionTab,.sessionPrimary{min-height:40px;border:1px solid rgba(148,162,184,.38);border-radius:10px;background:linear-gradient(180deg,rgba(28,38,52,.88),rgba(10,14,24,.96));color:#e6f2ff;font:900 10px Consolas,'Courier New',monospace;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;}
  .sessionTab.active{color:#081a12;border-color:rgba(125,255,176,.72);background:linear-gradient(180deg,rgba(125,255,176,.92),rgba(61,255,122,.72));}
  .sessionPane{display:none;}
  .sessionPane.active{display:block;}
  .sessionPrimary{width:100%;color:#06131d;border-color:rgba(125,255,176,.75);background:linear-gradient(180deg,#7dffb0,#3dff7a);}
  .sessionHint,.sessionGate span{display:block;margin-top:8px;color:#9fb4d8;font-size:10px;line-height:1.4;}
  .sessionGate{padding:10px;border:1px solid rgba(120,170,220,.18);border-radius:10px;background:rgba(8,12,22,.58);}
  .sessionGate b{display:block;color:#ffe8a8;font-size:11px;letter-spacing:.12em;text-transform:uppercase;}
  .mapLobbyControls{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  .sessionField{display:flex;flex-direction:column;gap:4px;color:#8fa2bd;font-size:9px;letter-spacing:.1em;text-transform:uppercase;}
  .sessionField select{min-height:34px;width:100%;border:1px solid rgba(120,170,220,.32);border-radius:8px;background:#08101d;color:#d8f6ff;font:800 10px Consolas,monospace;padding:5px 7px;}
  .sessionListField{grid-column:1/-1;}
  .sessionActionGrid{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;}
  .sessionActionGrid .accountBtn{min-height:38px;padding:7px 8px;font-size:9px;letter-spacing:.08em;border-radius:9px;}
  .mapLobbyInRow{display:flex;flex-direction:column;gap:8px;}
  #mapLobbyMembersList{display:flex;flex-direction:column;gap:4px;max-height:112px;overflow-y:auto;padding:8px;border:1px solid rgba(255,255,255,.09);border-radius:9px;background:rgba(0,0,0,.22);font-size:10px;color:#d8f8e0;}
  .sessionDock.collapsed .sessionTabs,.sessionDock.collapsed .sessionPane{display:none!important;}
  .sessionDock.collapsed{max-height:none;overflow:hidden;}
  /* Map browse panel collapse (R3 / M toggle) */
  #mapBrowse.collapsed{max-height:none;overflow:hidden;}
  #mapBrowse.collapsed .browse-details{display:none!important;}
  #mapBrowse.collapsed{padding:10px 14px;}
  .riderNameModal{position:fixed;inset:0;z-index:10050;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(2,4,10,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:auto;}
  .riderNameCard{width:min(420px,calc(100vw - 32px));border:1px solid rgba(125,255,176,.42);border-radius:18px;background:radial-gradient(circle at top,rgba(125,255,176,.14),transparent 42%),linear-gradient(180deg,rgba(8,16,28,.98),rgba(3,7,14,.98));box-shadow:0 0 42px rgba(80,255,170,.18),0 14px 44px rgba(0,0,0,.62);padding:22px;color:#d8f6ff;font-family:Consolas,'Courier New',monospace;}
  .riderNameKicker{color:#7dffb0;font-size:10px;font-weight:900;letter-spacing:.22em;text-transform:uppercase;margin-bottom:8px;}
  .riderNameCard h2{margin:0;color:#fff;font:900 24px/1.1 var(--font-shout);letter-spacing:.06em;text-transform:uppercase;text-shadow:var(--skate-anaglyph);}
  .riderNameCard p{margin:12px 0;color:#a9bdd8;font-size:12px;line-height:1.45;}
  #inputRiderHandle{box-sizing:border-box;width:100%;min-height:48px;border:1px solid rgba(125,255,176,.52);border-radius:12px;background:#07101c;color:#fff;font:900 17px Consolas,'Courier New',monospace;letter-spacing:.08em;text-transform:none;padding:10px 12px;outline:none;}
  #inputRiderHandle:focus{box-shadow:0 0 18px rgba(125,255,176,.24);}
  #riderHandleHint{min-height:36px;margin-top:8px;color:#9fb4d8;font-size:11px;line-height:1.35;}
  #riderHandleHint.bad{color:#ff9a9a;}
  #riderHandleHint.good{color:#7dffb0;}
  .riderNameActions{display:grid;grid-template-columns:1.4fr .8fr;gap:10px;margin-top:14px;}
  .riderNameActions .accountBtn{min-height:44px;border-radius:10px;}
  
  #mapSpectrumNav{position:absolute;left:24px;bottom:24px;display:flex;gap:8px;background:rgba(10,8,32,.85);border-radius:24px;padding:6px;border:1px solid rgba(120,160,255,.3);transform:scale(var(--hud-scale));transform-origin:left bottom;pointer-events:auto;box-shadow:0 0 20px rgba(90,80,255,.25);}
  #mapSpectrumNav .specBtn{background:transparent;border:none;color:#7a8aa8;font-family:inherit;font-size:11px;font-weight:700;letter-spacing:1px;padding:8px 16px;border-radius:18px;cursor:pointer;transition:all .2s ease;outline:none;}
  #mapSpectrumNav .specBtn:hover{color:#aef3ff;background:rgba(120,160,255,.15);}
  #mapSpectrumNav .specBtn.active{color:#fff;background:rgba(120,160,255,.35);box-shadow:0 0 12px rgba(120,160,255,.5);}
  @media (pointer:coarse){
    #mapMenuBtn,#mapInfoToggleBtn{display:none;}
    #mapTouchControls{display:flex;}
    #mapBrowse{bottom:76px;top:auto;max-height:calc(100vh - 160px);pointer-events:none;transform-origin:left bottom;}
    .mapAccountPill{top:calc(10px + env(safe-area-inset-top));right:calc(10px + env(safe-area-inset-right));min-width:144px;max-width:46vw;min-height:38px;padding:6px 10px;font-size:9px;transform:none;}
    .sessionDock{transform:none;}
  }
  @media (pointer:coarse) and (orientation:landscape), (max-height:520px) and (max-width:980px){
    #mapTitle{top:8px;font-size:15px;letter-spacing:3px;}
    #mapSub,#mapLegend,#mapHint{display:none;}
    #mapMenuBtn{top:8px;right:8px;padding:8px 10px;min-height:40px;font-size:9px;letter-spacing:1px;display:none;}
    #mapTouchControls{display:flex;bottom:8px;width:calc(100vw - 12px);}
    .mapTouchBtn{flex:1;min-width:0;max-width:132px;min-height:44px;padding:8px 5px;font-size:9px;letter-spacing:.5px;border-radius:8px;}
    .mapTouchBtn.primary{flex:1.45;max-width:162px;}
    #mapOrbitTag{display:none;}
    #mapBrowse{
      left:8px;right:auto;top:44px;bottom:auto;transform:none;
      transform-origin:left top;
      width:min(35vw,360px);max-height:31vh;overflow-y:auto;
      padding:8px 10px;border-radius:8px;background:rgba(8,8,20,.78);
      pointer-events:none;box-shadow:0 0 18px rgba(90,80,255,.25);
    }
    .sessionDock{
      right:calc(8px + env(safe-area-inset-right));left:auto;top:auto;
      bottom:64px;width:min(38vw,420px);max-height:calc(100vh - 126px);
      padding:9px;border-radius:12px;background:rgba(5,10,18,.82);
    }
    .sessionDockHeader b{font-size:10px;}
    .sessionDockHeader span,.sessionHint,.sessionGate span{font-size:9px;}
    .sessionTab,.sessionPrimary{min-height:36px;font-size:9px;}
    .mapLobbyControls{gap:6px;}
    .sessionActionGrid{grid-template-columns:1fr 1fr;gap:6px;}
    .sessionActionGrid .accountBtn{min-height:34px;}
    #btnMapLobbyCreate,#btnMapLobbyStart{grid-column:1/-1;}
    #mapBrowse .counter{font-size:8px;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    #mapBrowse h3{font-size:14px!important;margin-bottom:0!important;}
    #mapBrowse .mapBadge{font-size:8px;letter-spacing:1px;padding:2px 5px;margin-left:5px;}
    #mapBrowse .gline{font-size:9px;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    #mapBrowse .facts,#mapBrowse .desc,#mapBrowse .course{display:none;}
    #mapBrowse .act{font-size:9px;margin-top:3px;}
    #mapBrowse .mobileOnly{display:inline;color:#8fa2bd;}
    .mapLabel{font-size:10px;}
  }
  @media (pointer:coarse) and (orientation:portrait){
    #mapTitle{top:calc(10px + env(safe-area-inset-top));font-size:18px;letter-spacing:3px;}
    #mapSub,#mapLegend,#mapHint,#mapOrbitTag{display:none;}
    #mapLabels{display:none;}
    #mapTouchControls{
      display:grid;
      grid-template-columns:1fr 1.25fr 1fr 1fr;
      gap:8px;
      left:calc(10px + env(safe-area-inset-left));
      right:calc(10px + env(safe-area-inset-right));
      bottom:calc(12px + env(safe-area-inset-bottom));
      transform:none;
      width:auto;
      padding:8px;
      border:1px solid rgba(120,160,255,.34);
      border-radius:12px;
      background:linear-gradient(180deg,rgba(8,10,22,.68),rgba(4,6,14,.88));
      box-shadow:0 -8px 30px rgba(0,0,0,.42),0 0 22px rgba(90,120,255,.18);
      backdrop-filter:blur(8px);
    }
    .mapTouchHelp{display:none;}
    .mapTouchBtn{
      min-width:0;
      width:100%;
      min-height:42px;
      padding:7px 4px;
      border-radius:9px;
      font-size:9px;
      letter-spacing:.55px;
    }
    .mapTouchBtn.primary{
      min-width:0;
      min-height:42px;
      font-size:10px;
      grid-column:auto;
    }
    #mapScanBtn,#mapClaimBtn,#mapInfoBtn,#mapMenuTouchBtn{font-size:9px;}
    #mapScanBtn,#mapClaimBtn,#mapInfoBtn{opacity:.78;}
    #mapMenuTouchBtn{border-color:rgba(255,210,125,.42);color:#ffe8a8;}
    #mapTouchControls:not(.expanded) .mapExtraControl{display:none;}
    #mapTouchControls.expanded{grid-template-columns:repeat(3,1fr);}
    #mapTouchControls.expanded .mapExtraControl{display:block;}
    #mapBrowse{
      left:calc(10px + env(safe-area-inset-left));
      right:auto;
      top:calc(58px + env(safe-area-inset-top));
      bottom:auto;
      width:min(250px,calc(62vw - env(safe-area-inset-left)));
      max-height:31svh;
      overflow-y:auto;
      padding:10px 12px;
      border-radius:14px;
      background:rgba(8,8,22,.82);
      transform:none;
      pointer-events:none;
    }
    #mapBrowse.collapsed{max-height:none;padding:7px 10px;pointer-events:auto;cursor:pointer;}
    #mapBrowse.collapsed .gline{display:none;}
    #mapBrowse.collapsed .counter{margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    #mapBrowse.collapsed h3{font-size:15px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    #mapBrowse:not(.collapsed){pointer-events:auto;}
    #mapBrowse .counter{font-size:9px;margin-bottom:4px;}
    #mapBrowse h3{font-size:18px!important;margin:0 0 2px!important;}
    #mapBrowse .gline{font-size:10px;margin-bottom:4px;}
    #mapBrowse .desc,#mapBrowse .course{font-size:10px;line-height:1.35;margin-bottom:4px;}
    #mapBrowse .facts{display:none;}
    #mapBrowse .act{font-size:10px;margin-top:4px;}
    #mapBrowse .mobileOnly{display:inline;color:#8fa2bd;}
    .mapAccountPill{left:calc(10px + env(safe-area-inset-left));right:calc(10px + env(safe-area-inset-right));top:calc(10px + env(safe-area-inset-top));max-width:none;justify-content:center;gap:12px;}
    .sessionDock{
      left:calc(10px + env(safe-area-inset-left));right:calc(10px + env(safe-area-inset-right));
      top:auto;bottom:calc(74px + env(safe-area-inset-bottom));width:auto;
      max-height:31svh;padding:10px;border-radius:16px;
    }
    .sessionDock.collapsed{display:none;}
    .sessionDockHeader{margin-bottom:7px;}
    .sessionTabs{gap:8px;margin-bottom:8px;}
    .sessionTab,.sessionPrimary{min-height:46px;font-size:10px;border-radius:13px;}
    .mapLobbyControls{grid-template-columns:1fr;gap:7px;}
    .sessionActionGrid{grid-template-columns:1fr;gap:7px;}
    .sessionActionGrid .accountBtn{min-height:44px;font-size:10px;}
    #mapLobbyMembersList{max-height:74px;}
  }
  #raceTimer{position:absolute;z-index:5;top:14px;left:50%;transform:translateX(-50%) scale(var(--hud-scale));transform-origin:center top;font-family:var(--font-shout);font-size:16px;font-weight:400;letter-spacing:.14em;color:#aef3ff;display:none;text-shadow:0 0 10px rgba(90,220,255,.8);text-transform:uppercase;}
  #raceRetryBtn{display:none;position:fixed;left:50%;bottom:calc(218px + env(safe-area-inset-bottom));z-index:10;transform:translateX(-50%);min-height:38px;padding:8px 14px;border:1px solid rgba(125,255,176,.82);border-radius:7px;background:rgba(7,28,20,.92);color:#d8ffe8;font:800 11px Consolas,monospace;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 0 16px rgba(70,255,160,.24);pointer-events:auto;touch-action:manipulation;}
  #raceRetryBtn.on{display:block;}
  #moonballHud{display:none;position:fixed;top:calc(12px + env(safe-area-inset-top));left:50%;z-index:12;transform:translateX(-50%);min-width:250px;padding:8px 12px;border:1px solid rgba(57,232,255,.7);border-radius:6px;background:rgba(5,10,20,.88);color:#e9fbff;text-align:center;font:800 12px/1.2 Consolas,monospace;box-shadow:0 0 20px rgba(57,232,255,.18);pointer-events:none;}
  #moonballHud.on{display:block;}#moonballHud b,#moonballHud span{display:block;}#moonballHud span{margin-top:3px;color:#9fbad0;font-size:9px;}
  body.moonball-mode #missionStrip,body.moonball-mode #topLeft,body.moonball-mode #topRight,body.moonball-mode #bottomLeft,body.moonball-mode #tutorialHud,body.moonball-mode #rareFindHud,body.moonball-mode #hint,body.moonball-mode #planetGlobeHud,body.moonball-mode #universeHud,body.moonball-mode #message{display:none!important;}
  /* skater customizer */
  .czRow{display:flex;align-items:center;gap:4px;margin-top:6px;flex-wrap:wrap;}
  .czLab{width:76px;font-size:10px;color:#9eb0c8;letter-spacing:1px;flex-shrink:0;font-family:Consolas,'Courier New',monospace;text-transform:uppercase;}
  .swatch{width:18px;height:18px;border-radius:2px;border:1px solid rgba(148,162,184,.4);cursor:pointer;pointer-events:auto;display:inline-block;vertical-align:middle;}
  .swatch.alien{border-color:rgba(180,120,255,.55);box-shadow:0 0 7px rgba(140,90,255,.35);}
  .swatch.eyeGlow{box-shadow:0 0 8px currentColor;}
  .czRowSkin .swatch,.czRowEye .swatch,.czRowDeck .swatch{width:16px;height:16px;}
  .czRowDeck .czLab{width:58px;}
  .czRowDeck .optBtn{font-size:9px;padding:3px 6px;letter-spacing:.5px;}
  .cz.locked{opacity:.38;cursor:pointer;filter:grayscale(.55);position:relative;}
  .cz.locked::after{content:'';position:absolute;top:1px;right:1px;width:5px;height:5px;padding:0;background:#ffd24d;border:1px solid #fff0a8;border-radius:50%;}
  .cz.locked.affordable{opacity:.92;filter:none;border-color:rgba(61,255,122,.85);box-shadow:0 0 9px rgba(61,255,122,.28);}
  .cz.locked.affordable::after{content:'BUY';top:-6px;right:-4px;width:auto;height:auto;padding:1px 2px;color:#07110b;background:#7dffb0;border-color:#d8ffe6;border-radius:2px;font-size:6px;line-height:1.2;font-weight:bold;white-space:nowrap;}
  .cz.locked.premiumLocked::after{content:'PREMIUM ' attr(data-premium-price);top:-6px;right:-4px;width:auto;height:auto;padding:1px 2px;color:#fff;background:#8a2be2;border-color:#d7a8ff;border-radius:2px;font-size:6px;line-height:1.2;white-space:nowrap;}
  .cz.locked.swatch::after{content:'';top:1px;right:1px;width:5px;height:5px;padding:0;border-radius:50%;background:#ffd24d;border-color:#fff0a8;}
  .cz.locked.affordable.swatch::after{content:'';background:#7dffb0;border-color:#d8ffe6;}
  /* emoji loadout */
  .emojiHint{font-size:10px;color:#8a98ac;margin:0 0 10px;line-height:1.45;text-align:center;}
  .emojiSection{margin-bottom:12px;}
  .emojiSectionLabel{font-family:Consolas,'Courier New',monospace;font-size:10px;letter-spacing:2px;color:#fc3d21;text-transform:uppercase;margin:0 0 6px;}
  .emojiSlotGrid{display:grid;gap:6px;justify-content:center;}
  .emojiDpadGrid{grid-template-columns:repeat(3,52px);grid-template-rows:repeat(3,52px);}
  .emojiNumpadGrid{grid-template-columns:repeat(3,48px);gap:5px;}
  .emojiSlot{width:100%;height:100%;min-height:46px;border:1px dashed rgba(148,162,184,.4);border-radius:4px;background:rgba(8,10,16,.55);display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;transition:border-color .15s,box-shadow .15s;}
  .emojiSlot:hover{border-color:rgba(255,176,0,.5);}
  .emojiSlot.sel{border-color:#ffb000;box-shadow:0 0 10px rgba(255,176,0,.35);}
  .emojiSlot.filled{border-style:solid;border-color:rgba(148,162,184,.5);}
  .emojiSlot img{width:38px;height:38px;object-fit:contain;pointer-events:none;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45));}
  .emojiSlot .slotKey{position:absolute;bottom:2px;right:4px;font-size:8px;color:#7a8aa8;font-family:Consolas,'Courier New',monospace;}
  .emojiLibrary{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:5px;max-height:200px;overflow-y:auto;padding:6px;border:1px solid rgba(148,162,184,.25);border-radius:3px;background:rgba(6,8,12,.5);}
  .emojiLibItem{width:44px;height:44px;border:1px solid rgba(148,162,184,.28);border-radius:3px;background:rgba(12,14,20,.8);display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;}
  .emojiLibItem img{width:36px;height:36px;object-fit:contain;}
  .emojiLibItem.locked{opacity:.32;cursor:pointer;filter:grayscale(.85);}
  .emojiLibItem.locked::after{content:attr(data-lock-cost) ' C';position:absolute;font-size:7px;line-height:1.1;bottom:1px;right:2px;padding:1px 2px;color:#ffd24d;background:rgba(8,10,16,.88);border:1px solid rgba(255,210,77,.45);border-radius:2px;opacity:1;}
  .emojiLibItem.locked.affordable{opacity:.92;filter:none;border-color:rgba(61,255,122,.85);box-shadow:0 0 9px rgba(61,255,122,.28);}
  .emojiLibItem.locked.affordable::after{content:'BUY ' attr(data-lock-cost) ' C';color:#07110b;background:#7dffb0;border-color:#d8ffe6;font-weight:bold;}
  .emojiLibItem:not(.locked):hover{border-color:rgba(61,255,122,.55);box-shadow:0 0 8px rgba(61,255,122,.2);}
  .emojiUnlockCount{color:#3dff7a;}
  #emojiPopups{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:8;}
  .emojiBurst{position:absolute;width:72px;height:72px;object-fit:contain;transform:translate(-50%,-50%);pointer-events:none;animation:emojiFloat 1.35s ease-out forwards;filter:drop-shadow(0 4px 12px rgba(0,0,0,.5));}
  @keyframes emojiFloat{0%{opacity:0;transform:translate(-50%,-50%) scale(.4);}15%{opacity:1;transform:translate(-50%,-60%) scale(1.08);}70%{opacity:1;}100%{opacity:0;transform:translate(-50%,-130%) scale(.85);}}
  #qcWheel{position:absolute;right:6%;bottom:16%;width:240px;height:240px;pointer-events:none;z-index:8;opacity:0;transform:scale(.82);transition:opacity .12s,transform .12s;}
  #qcWheel.open{opacity:1;transform:scale(1);pointer-events:auto;}
  #qcWheel .qcWheelCore{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;border:1px dashed rgba(148,162,184,.45);background:rgba(8,10,16,.72);display:flex;align-items:center;justify-content:center;font-family:Consolas,'Courier New',monospace;font-size:8px;letter-spacing:1px;color:#8a98ac;text-transform:uppercase;text-align:center;line-height:1.2;}
  .qcWheelSeg{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:5px 8px;border-radius:3px;border:1px solid rgba(148,162,184,.35);background:rgba(10,12,18,.88);font-family:Consolas,'Courier New',monospace;font-size:10px;letter-spacing:.5px;color:#c5d2e6;white-space:nowrap;cursor:default;transition:border-color .1s,box-shadow .1s,color .1s,background .1s;}
  .qcWheelSeg.sel{border-color:#ffb000;color:#fff;background:rgba(24,20,8,.94);box-shadow:0 0 12px rgba(255,176,0,.35);}
  .qcWheelSeg.ctx{border-color:rgba(61,255,122,.55);color:#d8ffe8;}
  .qcWheelSeg.ctx.sel{border-color:#3dff7a;box-shadow:0 0 12px rgba(61,255,122,.35);}

  #emojiWheel{position:absolute;left:6%;bottom:16%;width:240px;height:240px;pointer-events:none;z-index:8;opacity:0;transform:scale(.82);transition:opacity .12s,transform .12s;}
  #emojiWheel.open{opacity:1;transform:scale(1);pointer-events:auto;}
  #emojiWheel .emojiWheelCore{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;border:1px dashed rgba(148,162,184,.45);background:rgba(8,10,16,.72);display:flex;align-items:center;justify-content:center;font-family:Consolas,'Courier New',monospace;font-size:8px;letter-spacing:1px;color:#8a98ac;text-transform:uppercase;text-align:center;line-height:1.2;}
  .emojiWheelSeg{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:6px;border-radius:50%;border:1px solid rgba(148,162,184,.35);background:rgba(10,12,18,.88);width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:default;transition:border-color .1s,box-shadow .1s,color .1s,background .1s;}
  .emojiWheelSeg.sel{border-color:#ffb000;background:rgba(24,20,8,.94);box-shadow:0 0 12px rgba(255,176,0,.35);}
  .qcCallBubble{position:absolute;transform:translate(-50%,-50%);pointer-events:none;padding:8px 13px;border:2px solid #111827;background:#fff8d8;font-family:Consolas,'Courier New',monospace;font-size:12px;font-weight:800;letter-spacing:.35px;color:#111827;white-space:normal;animation:qcBubbleFloat 2.1s ease-out forwards;filter:drop-shadow(0 5px 0 rgba(0,0,0,.6)) drop-shadow(0 0 12px rgba(255,255,255,.18));max-width:min(48vw,240px);text-align:center;line-height:1.12;text-transform:uppercase;box-shadow:inset 0 0 0 2px rgba(255,255,255,.55);}
  .qcCallBubble::after{content:'';position:absolute;left:42%;bottom:-12px;width:18px;height:18px;background:inherit;border-right:2px solid #111827;border-bottom:2px solid #111827;transform:rotate(45deg) skew(8deg,8deg);z-index:-1;}
  .qcCallBubble.pop{border-radius:52% 48% 46% 54%/45% 57% 43% 55%;background:#fff3a6;color:#17120a;}
  .qcCallBubble.shout{border-radius:8px;background:#fffbeb;color:#050505;border-width:3px;clip-path:polygon(3% 18%,13% 6%,22% 14%,34% 3%,43% 15%,56% 5%,64% 16%,78% 6%,85% 20%,97% 17%,91% 38%,99% 50%,89% 61%,96% 82%,81% 79%,72% 96%,60% 84%,48% 97%,39% 84%,25% 96%,20% 80%,4% 84%,11% 63%,1% 51%,11% 39%);}
  .qcCallBubble.shout::after{display:none;}
  .qcCallBubble.radio{border-radius:18px 18px 18px 5px;background:#d8fff0;color:#062016;border-color:#063b2b;box-shadow:inset 0 0 0 2px rgba(255,255,255,.5),0 0 0 1px rgba(61,255,122,.35);}
  .qcCallBubble.radio::after{left:20%;border-color:#063b2b;}
  .qcCallBubble.cosmic{border-radius:22px 10px 22px 10px;background:#efe8ff;color:#1e1238;border-color:#2b1858;text-shadow:1px 0 rgba(255,70,120,.35),-1px 0 rgba(70,220,255,.45);}
  .qcCallBubble.cosmic::after{left:70%;border-color:#2b1858;}
  @media (pointer:coarse){
    .qcCallBubble{font-size:10px;max-width:min(54vw,210px);padding:7px 10px;}
  }
  @keyframes qcBubbleFloat{0%{opacity:0;transform:translate(-50%,-50%) scale(.45) rotate(-2deg);}10%{opacity:1;transform:translate(-50%,-64%) scale(1.08) rotate(1deg);}18%{transform:translate(-50%,-60%) scale(.98) rotate(-.6deg);}75%{opacity:1;}100%{opacity:0;transform:translate(-50%,-128%) scale(.9) rotate(2deg);}}
  .optBtn{font-family:Consolas,'Courier New',monospace;font-size:10px;padding:3px 9px;border:1px solid rgba(148,162,184,.35);border-radius:2px;cursor:pointer;pointer-events:auto;color:#dce6f4;letter-spacing:1px;background:rgba(18,22,30,.8);}
  .cz.sel{outline:2px solid #ffb000;box-shadow:0 0 8px rgba(255,176,0,.45);}
  #popups{position:absolute;z-index:5;top:86px;right:clamp(300px,24vw,460px);left:auto;transform:skewX(-3deg) scale(var(--hud-scale));transform-origin:right top;text-align:right;pointer-events:none;width:min(300px,34vw);mix-blend-mode:screen;}
  .popup{font-family:var(--font-trick);font-size:22px;font-weight:400;color:rgba(155,255,224,.76);line-height:1.05;
    text-shadow:var(--skate-anaglyph),0 0 12px rgba(70,255,190,.35);animation:popFly var(--pop-dur) ease-out forwards;margin:2px 0;}
  .popup.trick{font-size:24px;}
  .popup.trick.big{font-size:28px;color:rgba(184,255,240,.8);text-shadow:var(--skate-anaglyph),0 0 14px rgba(100,255,220,.38);}
  .popup.trick.mega{font-size:34px;color:rgba(255,255,255,.86);text-shadow:var(--skate-anaglyph),0 0 18px rgba(255,200,255,.45),0 0 24px rgba(120,255,200,.25);}
  .popup.bank{font-family:var(--font-score);color:rgba(255,224,102,.82);font-size:28px;letter-spacing:.05em;text-shadow:var(--skate-anaglyph),0 0 12px rgba(255,210,90,.42);}
  .popup.bank.huge{font-size:38px;letter-spacing:.04em;}
  .popup.comboBonus{font-family:var(--font-event);color:rgba(255,142,245,.78);font-size:20px;letter-spacing:.05em;text-transform:uppercase;
    text-shadow:var(--skate-anaglyph),0 0 12px rgba(255,120,230,.38);}
  .popup.event{font-family:var(--font-event);color:rgba(255,190,74,.82);font-size:22px;letter-spacing:.05em;text-transform:uppercase;
    text-shadow:var(--skate-anaglyph),0 0 14px rgba(255,150,40,.35);}
  .popup.bad{font-family:var(--font-event);color:rgba(255,106,106,.8);font-size:18px;letter-spacing:.05em;text-transform:uppercase;text-shadow:var(--skate-anaglyph),0 0 10px rgba(255,80,80,.38);}
  .popup.bad.crush{font-size:26px;color:rgba(255,51,51,.84);letter-spacing:.04em;}
  #liteMapBtn{display:none;position:fixed;right:18px;bottom:52px;z-index:8;min-width:64px;min-height:42px;padding:9px 14px;border:1px solid rgba(90,210,255,.72);border-radius:10px;background:linear-gradient(180deg,rgba(18,42,70,.92),rgba(5,12,26,.96));color:#d7fbff;font-family:var(--font-shout);font-size:13px;letter-spacing:.12em;text-transform:uppercase;text-shadow:0 0 10px rgba(68,231,255,.9);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 18px rgba(40,180,255,.38);pointer-events:auto;cursor:pointer;touch-action:manipulation;}
  body.portal-lite:not(.map-mode):not(.in-menu):not(.in-intro) #liteMapBtn{display:block;}
  #liteMapBtn:active{transform:translateY(1px);filter:brightness(1.18);}
  #mobileControls{display:none;position:fixed;inset:0;z-index:8;pointer-events:none;touch-action:none;user-select:none;-webkit-user-select:none;--mobile-edge-x:14px;--mobile-edge-bottom:16px;--mobile-stick-zone:184px;--mobile-stick-base:132px;--mobile-knob:62px;--mobile-action-w:268px;--mobile-action-h:204px;}
  #mobileBuilderControls{display:none;position:fixed;left:calc(10px + env(safe-area-inset-left));right:calc(10px + env(safe-area-inset-right));bottom:calc(10px + env(safe-area-inset-bottom));z-index:12;pointer-events:auto;touch-action:manipulation;user-select:none;-webkit-user-select:none;gap:7px;padding:8px;border:1px solid rgba(145,226,255,.72);border-radius:8px;background:rgba(5,13,29,.94);box-shadow:0 8px 28px rgba(0,0,0,.45),0 0 18px rgba(52,196,255,.2);}
  #mobileCreatorTestHud{display:none;position:fixed;right:calc(10px + env(safe-area-inset-right));top:calc(10px + env(safe-area-inset-top));z-index:12;max-width:44vw;padding:8px 10px;border:1px solid rgba(125,255,176,.78);border-radius:6px;background:rgba(5,24,20,.9);color:#d9ffe7;font:800 10px/1.25 Consolas,monospace;letter-spacing:0;text-align:right;text-shadow:0 0 8px rgba(125,255,176,.7);box-shadow:0 0 16px rgba(125,255,176,.2);}
  .mobileBuilderPieces,.mobileBuilderActions{display:grid;gap:5px;grid-template-columns:repeat(7,minmax(0,1fr));}
  .mobileBuilderActions{grid-template-columns:repeat(6,minmax(0,1fr));}
  #mobileBuilderControls button{min-height:40px;padding:4px 3px;border:1px solid rgba(170,226,255,.54);border-radius:5px;background:#172a43;color:#e6faff;font:800 10px/1 Consolas,monospace;letter-spacing:0;text-transform:uppercase;text-shadow:0 0 8px rgba(83,220,255,.65);}
  #mobileBuilderControls button.selected{background:#9fe8ff;color:#06131d;border-color:#e0fbff;text-shadow:none;box-shadow:0 0 14px rgba(91,226,255,.65);}
  #mobileBuilderControls .mobileBuilderPlace{grid-column:span 2;background:#7dffb0;color:#062014;border-color:#d9ffe7;font-size:11px;text-shadow:none;}
  #mobileBuilderControls .mobileBuilderRide{background:#a182ff;color:#100625;border-color:#decfff;text-shadow:none;}
  .mobileStickZone{position:absolute;left:calc(var(--mobile-edge-x) + env(safe-area-inset-left));bottom:calc(var(--mobile-edge-bottom) + env(safe-area-inset-bottom));width:var(--mobile-stick-zone);height:var(--mobile-stick-zone);pointer-events:auto;touch-action:none;}
  .mobileStickBase{position:absolute;left:26px;bottom:26px;width:var(--mobile-stick-base);height:var(--mobile-stick-base);border-radius:50%;background:radial-gradient(circle at 38% 32%,rgba(255,255,255,.18),rgba(49,61,88,.68) 45%,rgba(8,12,22,.78) 100%);border:2px solid rgba(205,235,255,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 9px 30px rgba(0,0,0,.34),0 0 22px rgba(80,180,255,.22);}
  .mobileStickKnob{position:absolute;left:50%;top:50%;width:var(--mobile-knob);height:var(--mobile-knob);margin:-31px 0 0 -31px;border-radius:50%;background:radial-gradient(circle at 34% 26%,rgba(255,255,255,.48),rgba(159,220,255,.96) 38%,rgba(42,90,150,.98) 100%);border:2px solid rgba(238,250,255,.82);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 4px 18px rgba(0,0,0,.42),0 0 20px rgba(90,220,255,.56);transform:translate3d(0,0,0);transition:transform .04s linear;}
  .mobileStickLabel{position:absolute;left:8px;right:8px;bottom:4px;padding:4px 7px;border-radius:999px;background:rgba(3,8,18,.48);text-align:center;font:900 11px/1 Consolas,'Courier New',monospace;letter-spacing:.18em;color:rgba(232,245,255,.86);text-shadow:0 1px 4px #000;pointer-events:none;}
  .mobileActionCluster{position:absolute;right:calc(var(--mobile-edge-x) + env(safe-area-inset-right));bottom:calc(var(--mobile-edge-bottom) + env(safe-area-inset-bottom));width:var(--mobile-action-w);height:var(--mobile-action-h);pointer-events:none;}
  .mobileAct{position:absolute;display:flex;align-items:center;justify-content:center;min-width:66px;min-height:66px;border-radius:50%;border:2px solid rgba(225,244,255,.56);background:radial-gradient(circle at 36% 24%,rgba(255,255,255,.22),rgba(28,36,54,.84) 54%,rgba(8,10,18,.9) 100%);color:#f2f9ff;font:900 10px/1.05 Consolas,'Courier New',monospace;letter-spacing:.07em;text-align:center;text-transform:uppercase;text-shadow:0 1px 2px rgba(0,0,0,.62);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 8px 22px rgba(0,0,0,.34),0 0 16px rgba(90,170,255,.18);pointer-events:auto;touch-action:none;padding:0;-webkit-tap-highlight-color:transparent;}
  .mobileAct:active,.mobileAct.isDown{filter:brightness(1.2) saturate(1.08);transform:translateY(1px) scale(.97);box-shadow:inset 0 1px 0 rgba(255,255,255,.26),0 4px 14px rgba(0,0,0,.34),0 0 22px rgba(90,220,255,.52);}
  .mobileActJump{right:8px;bottom:26px;min-width:88px;min-height:88px;color:#06131d;border-color:rgba(176,255,210,.86);background:radial-gradient(circle at 38% 28%,rgba(255,255,255,.42),rgba(125,255,176,.96) 45%,rgba(35,150,90,.98) 100%);font-size:12px;}
  .mobileActTrick{right:102px;bottom:82px;min-width:78px;min-height:78px;color:#21071d;border-color:rgba(255,184,248,.78);background:radial-gradient(circle at 38% 28%,rgba(255,255,255,.34),rgba(255,138,245,.94) 45%,rgba(140,50,145,.98) 100%);font-size:11px;}
  .mobileActHold[data-action="grind"]{right:102px;bottom:8px;min-width:72px;min-height:72px;color:#07131d;border-color:rgba(180,230,255,.82);background:radial-gradient(circle at 38% 28%,rgba(255,255,255,.3),rgba(159,220,255,.92) 45%,rgba(42,96,150,.98) 100%);}
  .mobileActHold[data-action="boost"]{right:8px;bottom:126px;min-width:76px;min-height:76px;color:#1c1000;border-color:rgba(255,224,116,.86);background:radial-gradient(circle at 38% 28%,rgba(255,255,255,.36),rgba(255,210,77,.98) 45%,rgba(190,96,20,.98) 100%);font-size:11px;}
  .mobileActSmall{min-width:54px;min-height:54px;font-size:8px;letter-spacing:.04em;color:#dcecff;background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.18),rgba(30,38,54,.76) 56%,rgba(8,10,18,.86) 100%);border-color:rgba(185,220,255,.42);}
  .mobileMapAct{position:fixed;left:calc(12px + env(safe-area-inset-left));top:calc(12px + env(safe-area-inset-top));right:auto;bottom:auto;width:46px;height:46px;min-width:46px;min-height:46px;border-radius:14px;z-index:12;font-size:8px;letter-spacing:.04em;}
  .mobileActSmall[data-action="grab"]{right:184px;bottom:78px;}
  .mobileActSmall[data-action="crouch"]{right:184px;bottom:18px;}
  @media (pointer:coarse){
    body:not(.in-menu):not(.map-mode):not(.in-intro):not(.has-gamepad) #mobileControls{display:block;}
    body.builder-mode:not(.in-menu):not(.map-mode):not(.in-intro) #mobileControls{display:none!important;}
    body.builder-mode:not(.in-menu):not(.map-mode):not(.in-intro) #mobileBuilderControls{display:grid;}
    body.creator-test-mode:not(.in-menu):not(.map-mode):not(.in-intro) #mobileCreatorTestHud{display:block;}
    body.portal-lite:not(.in-menu):not(.map-mode):not(.in-intro):not(.has-gamepad) #liteMapBtn{display:none!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro):not(.has-gamepad) #hint{display:none;}
  }
  @media (pointer:coarse) and (orientation:portrait){
    #mobileControls{--mobile-edge-x:8px;--mobile-edge-bottom:10px;--mobile-stick-zone:162px;--mobile-stick-base:118px;--mobile-knob:56px;--mobile-action-w:238px;--mobile-action-h:188px;}
    .mobileStickBase{left:22px;bottom:24px;}
    .mobileStickKnob{margin:-28px 0 0 -28px;}
    .mobileActionCluster{transform:scale(.88);transform-origin:right bottom;}
    .mobileActJump{min-width:84px;min-height:84px;}
    .mobileActTrick{right:88px;bottom:78px;}
    .mobileActHold[data-action="grind"]{right:88px;}
    .mobileActHold[data-action="boost"]{bottom:118px;}
    .mobileActSmall{min-width:52px;min-height:52px;}
    .mobileMapAct{left:calc(10px + env(safe-area-inset-left));top:calc(10px + env(safe-area-inset-top));right:auto;bottom:auto;width:44px;height:44px;min-width:44px;min-height:44px;}
    .mobileActSmall[data-action="grab"]{right:154px;bottom:72px;}
    .mobileActSmall[data-action="crouch"]{right:154px;bottom:14px;}
  }
  @media (pointer:coarse) and (orientation:landscape){
    #mobileControls{--mobile-edge-x:18px;--mobile-edge-bottom:14px;}
    .mobileStickLabel{bottom:2px;}
  }
  @media (pointer:coarse) and (max-height:430px){
    #mobileControls{--mobile-edge-bottom:8px;--mobile-stick-zone:160px;--mobile-stick-base:112px;--mobile-knob:52px;--mobile-action-w:238px;--mobile-action-h:174px;}
    .mobileStickZone{transform:scale(.82);transform-origin:left bottom;}
    .mobileStickBase{left:22px;bottom:24px;}
    .mobileStickKnob{margin:-26px 0 0 -26px;}
    #mobileBuilderControls{bottom:calc(6px + env(safe-area-inset-bottom));padding:6px;gap:4px;}
    .mobileBuilderPieces,.mobileBuilderActions{gap:4px;}
    #mobileBuilderControls button{min-height:34px;font-size:9px;}
    .mobileActionCluster{transform:scale(.82);transform-origin:right bottom;}
    .mobileAct{min-width:58px;min-height:58px;font-size:9px;}
    .mobileActJump{min-width:78px;min-height:78px;}
    .mobileActTrick{min-width:68px;min-height:68px;}
    .mobileActHold[data-action="boost"]{bottom:112px;}
    .mobileMapAct{left:calc(10px + env(safe-area-inset-left));top:calc(10px + env(safe-area-inset-top));right:auto;bottom:auto;width:42px;height:42px;min-width:42px;min-height:42px;}
    .mobileActSmall[data-action="grab"]{right:166px;bottom:66px;}
    .mobileActSmall[data-action="crouch"]{right:166px;bottom:12px;}
    #bottomLeft{display:none;}
  }
  @media (max-width: 760px){
    #popups{top:76px;right:18px;width:min(250px,62vw);}
  }
  @keyframes popFly{0%{opacity:0;transform:translateY(12px) scale(.82) rotate(-3deg);}14%{opacity:1;transform:translateY(0) scale(1.04) rotate(1deg);}26%{transform:translateY(-2px) scale(1) rotate(0);}72%{opacity:1;}100%{opacity:0;transform:translateY(-28px) scale(.94) rotate(2deg);}}
  #message{position:absolute;z-index:7;left:50%;top:8%;transform:translateX(-50%) skewX(-4deg) scale(var(--hud-scale));transform-origin:center top;font-family:var(--font-event);font-size:28px;font-weight:400;letter-spacing:.05em;text-transform:uppercase;color:rgba(255,255,255,.82);line-height:1.05;
    text-shadow:var(--skate-anaglyph),0 0 16px rgba(160,120,255,.35);opacity:0;transition:opacity .2s;pointer-events:none;text-align:center;max-width:min(88vw,520px);mix-blend-mode:screen;}
  #message.msg-surge{font-size:30px;color:rgba(255,200,96,.84);text-shadow:var(--skate-anaglyph),0 0 18px rgba(255,150,40,.38);}
  #message.msg-sick{font-size:32px;color:rgba(255,224,102,.84);text-shadow:var(--skate-anaglyph),0 0 18px rgba(255,220,80,.42);}
  #message.msg-insane{font-size:36px;color:rgba(255,106,213,.82);text-shadow:var(--skate-anaglyph),0 0 20px rgba(255,77,210,.42);}
  #message.msg-legendary{font-size:40px;color:rgba(255,255,255,.88);text-shadow:var(--skate-anaglyph),0 0 22px rgba(255,230,100,.45);animation:msgLegend .6s ease-in-out infinite alternate;}
  #message.msg-compact{font-size:17px;max-width:min(72vw,360px);padding:4px 8px;border:1px solid rgba(125,255,176,.32);border-radius:4px;background:rgba(5,12,20,.78);line-height:1.16;mix-blend-mode:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  @keyframes msgLegend{from{filter:brightness(1) drop-shadow(calc(-1 * var(--anaglyph-off)) 0 0 var(--anaglyph-red)) drop-shadow(var(--anaglyph-off) 0 0 var(--anaglyph-cyan));}to{filter:brightness(1.15) drop-shadow(calc(-1.2 * var(--anaglyph-off)) 0 0 var(--anaglyph-red)) drop-shadow(calc(1.2 * var(--anaglyph-off)) 0 0 var(--anaglyph-cyan));}}
  #fade{position:absolute;z-index:9;inset:0;background:#0a0618;opacity:0;pointer-events:none;transition:opacity .1s;}
  #help{position:absolute;inset:0;display:none;align-items:center;justify-content:center;z-index:10;overflow:hidden;background:
    radial-gradient(ellipse 90% 70% at 50% 110%,rgba(11,61,145,.28),transparent 58%),
    radial-gradient(circle at 50% 40%,rgba(8,10,18,.96),rgba(2,3,8,.99)),
    repeating-linear-gradient(0deg,transparent,transparent 39px,rgba(100,130,170,.045) 39px,rgba(100,130,170,.045) 40px),
    repeating-linear-gradient(90deg,transparent,transparent 39px,rgba(100,130,170,.045) 39px,rgba(100,130,170,.045) 40px);touch-action:manipulation;}
  #menuStars{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;}
  #help::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:1;background:linear-gradient(180deg,rgba(255,255,255,.02),transparent 18%,transparent 82%,rgba(0,0,0,.4));opacity:.55;}
  #helpPanel{position:relative;z-index:2;max-width:920px;width:min(920px,calc(100vw - 24px));max-height:calc(100vh - 20px);overflow:hidden;display:flex;flex-direction:column;border:1px solid rgba(148,162,184,.42);border-radius:3px;background:
    linear-gradient(168deg,rgba(48,54,64,.97) 0%,rgba(26,30,38,.98) 42%,rgba(14,16,22,.99) 100%);
    box-shadow:0 0 0 1px rgba(11,61,145,.32) inset,0 28px 90px rgba(0,0,0,.72),0 0 48px rgba(11,61,145,.14);pointer-events:auto;touch-action:manipulation;}
  #helpPanel.compact{max-height:calc(100vh - 16px);max-width:440px;font-size:82%;transition:max-width .2s ease;}
  #helpPanel.compact.garageOpen,#helpPanel.compact.menuSubOpen{max-width:740px;}
  #helpPanel.compact .menuStatusBar{padding:5px 12px;font-size:8px;letter-spacing:1.3px;}
  #helpPanel::before,#helpPanel::after{content:'';position:absolute;width:26px;height:26px;border:2px solid #fc3d21;pointer-events:none;z-index:2;}
  #helpPanel::before{top:9px;left:9px;border-right:none;border-bottom:none;}
  #helpPanel::after{bottom:9px;right:9px;border-left:none;border-top:none;}
  .menuStatusBar{display:flex;align-items:center;gap:12px;padding:9px 16px;background:linear-gradient(180deg,rgba(11,61,145,.62),rgba(11,61,145,.28));border-bottom:1px solid rgba(148,162,184,.35);font-family:Consolas,'Courier New',monospace;font-size:10px;letter-spacing:2px;color:#c5d2e6;text-transform:uppercase;flex-shrink:0;}
  .menuStatusBar .spacer{flex:1;}
  .menuStatusLed{width:7px;height:7px;border-radius:50%;background:#3dff7a;box-shadow:0 0 8px #3dff7a;animation:menuLed 2.4s ease-in-out infinite;}
  @keyframes menuLed{0%,100%{opacity:.45}50%{opacity:1}}
  #helpPanelBody{padding:22px 34px 12px;flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;}
  #helpMain{flex:1;min-height:0;overflow:visible;}
  #helpPanel.compact #helpPanelBody{padding:8px 14px 8px;}
  #helpPanel.menuSubOpen #helpPanelBody,
  #helpPanel.compact.garageOpen #helpPanelBody{overflow:hidden;}
  #helpPanel.pause #helpPanelBody{overflow:hidden;}
  #helpPanel.pause #helpMain{display:none;}
  #helpPanel.menuSubOpen #helpMain{display:none;}
  #helpPanel.garageOpen .menuSubPanel{display:none!important;}
  #helpPanel.menuSubOpen .garagePanel{display:none!important;}
  #titleLogoWrap{text-align:center;margin:0 0 6px;padding:4px 0 2px;}
  #titleLogo{display:inline-block;max-width:min(420px,88vw);max-height:min(36vh,200px);width:auto;height:auto;object-fit:contain;mix-blend-mode:screen;filter:drop-shadow(0 6px 28px rgba(255,180,60,.22)) drop-shadow(0 0 40px rgba(120,80,255,.18));}
  #titleLiteBadge{display:none;margin-left:12px;vertical-align:middle;font-family:'Bungee','Russo One',system-ui,sans-serif;font-size:clamp(24px,5vw,54px);line-height:1;letter-spacing:.08em;color:#d7fbff;text-transform:uppercase;text-shadow:0 0 4px #fff,0 0 12px #44e7ff,0 0 28px #0b8fff,0 0 48px rgba(0,112,255,.72);filter:drop-shadow(0 0 18px rgba(53,216,255,.78));}
  body.portal-lite #titleLiteBadge{display:inline-block;}
  #helpPanel.compact #titleLogo{max-height:min(18vh,118px);max-width:min(300px,52vw);}
  #helpPanel.compact #titleLogoWrap{margin:0;padding:0;}
  #helpPanel.compact #titleLiteBadge{font-size:clamp(20px,4.2vw,38px);margin-left:9px;}
  #helpPanel h2{margin:4px 0 16px;font-size:12px;font-weight:400;color:#9eb0c8;letter-spacing:2px;text-align:center;text-transform:uppercase;line-height:1.6;border-bottom:1px solid rgba(148,162,184,.22);padding-bottom:12px;}
  #helpPanel.compact h2{margin:2px 0 8px;font-size:10px;letter-spacing:1px;line-height:1.45;padding-bottom:6px;}
  .menuSectionLabel{font-family:Consolas,'Courier New',monospace;font-size:10px;letter-spacing:3px;color:#fc3d21;text-transform:uppercase;margin:14px 0 8px;}
  #helpPanel.compact .menuSectionLabel{margin:4px 0 4px;font-size:9px;letter-spacing:2px;}
  .menuTipsLong{display:block;}
  .menuTipsShort{display:none;color:#8a98ac;font-size:11px;margin-top:8px;line-height:1.45;text-align:center;letter-spacing:.3px;}
  #helpPanel.compact .menuTipsLong{display:none;}
  #helpPanel.compact .menuTipsShort{display:block;margin-top:6px;font-size:10px;}
  .garageLaunch{margin-top:14px;border:1px solid rgba(148,162,184,.28);border-radius:2px;padding:12px 14px;text-align:center;background:linear-gradient(180deg,rgba(18,22,30,.75),rgba(10,12,18,.85));box-shadow:inset 0 1px 0 rgba(255,255,255,.04);}
  .garageLaunch>b{display:block;color:#ffb000;font-size:11px;letter-spacing:3px;font-family:Consolas,'Courier New',monospace;}
  #garageBtns{display:flex;gap:10px;justify-content:center;margin-top:10px;}
  .garageBtn{font-family:Consolas,'Courier New',monospace;font-size:11px;letter-spacing:2px;padding:9px 20px;border:1px solid rgba(148,162,184,.45);border-radius:2px;background:linear-gradient(180deg,rgba(42,48,58,.95),rgba(24,28,36,.98));color:#dce6f4;cursor:pointer;pointer-events:auto;transition:background .15s,border-color .15s,box-shadow .15s;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 2px 8px rgba(0,0,0,.35);}
  .garageBtn:hover{border-color:rgba(252,61,33,.65);background:linear-gradient(180deg,rgba(52,58,70,.98),rgba(30,34,44,.98));box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 14px rgba(11,61,145,.35);}
  .menuFocus{outline:2px solid #ffb000!important;outline-offset:-2px;box-shadow:0 0 14px rgba(255,176,0,.4)!important;}
  #helpPanelBody #btnMenuPlay.menuFocus{border-color:rgba(125,255,176,.85)!important;box-shadow:0 0 24px rgba(125,255,176,.45),inset 0 0 20px rgba(125,255,176,.12)!important;}
  .emojiSlot.menuFocus,.emojiLibItem.menuFocus{border-color:#ffb000!important;box-shadow:0 0 12px rgba(255,176,0,.4)!important;}
  .garagePanel{display:none;pointer-events:auto;}
  .garagePanel.open{display:flex;flex-direction:column;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-y;padding-right:2px;}
  .menuSubPanel{display:none;pointer-events:auto;}
  .menuSubPanel.open{display:flex;flex-direction:column;flex:1;min-height:0;}
  .menuSubScroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding-right:2px;}
  .menuHubGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:10px 0 8px;}
  .menuHubGrid #btnMenuOptions{grid-column:1/-1;}
  #helpPanel.compact .menuHubGrid{gap:6px;margin:6px 0 4px;}
  .menuHubBtn{font-family:Consolas,'Courier New',monospace;font-size:10px;letter-spacing:1.5px;padding:10px 8px;border:1px solid rgba(148,162,184,.4);border-radius:2px;background:linear-gradient(180deg,rgba(32,38,48,.95),rgba(18,22,30,.98));color:#dce6f4;cursor:pointer;pointer-events:auto;text-align:center;text-transform:uppercase;transition:border-color .15s,box-shadow .15s;}
  .menuHubBtn:hover{border-color:rgba(252,61,33,.6);color:#fff;box-shadow:0 0 12px rgba(11,61,145,.28);}
  #helpPanel.compact .menuHubBtn{padding:8px 6px;font-size:9px;letter-spacing:1px;}
  /* #helpPanel.pause .menuHubGrid,#helpPanel.pause .garageLaunch,#helpPanel.pause .accountBlock,#helpPanel.pause .menuTipsShort{display:none;} */
  #helpPanel.pause .menuSubPanel.open .menuSubScroll{max-height:none;}
  .garageBack{font-family:Consolas,'Courier New',monospace;font-size:10px;letter-spacing:2px;padding:5px 12px;border:1px solid rgba(148,162,184,.35);border-radius:2px;background:rgba(18,22,30,.9);color:#9eb0c8;cursor:pointer;margin-bottom:8px;text-transform:uppercase;}
  .garageBack:hover{color:#ffb000;border-color:rgba(255,176,0,.55);}
  .garageTitle{margin:0 0 10px;font-size:14px;letter-spacing:3px;color:#dce6f4;text-align:center;font-family:Consolas,'Courier New',monospace;text-transform:uppercase;}
  .garageEconomySummary{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:0 20px;padding:8px 10px;border:1px solid rgba(255,210,77,.3);background:rgba(15,20,29,.8);color:#cbd8e8;font:10px/1.35 Consolas,'Courier New',monospace;text-align:center;}
  .garageEconomySummary .coinHud{color:#ffe29a;}
  .garageEconomySummary .coinHud img{width:13px;height:13px;vertical-align:-2px;margin-right:3px;}
  .garageEconomySummary .garageReady{color:#7dffb0;}
  .garageEconomySummary .garagePremium{color:#d7a8ff;}
  .garageEconomySummary .garageNext{width:100%;color:#9fb2ca;}
  .garageEconomySummary .garageEarn{width:100%;color:#7dffb0;border-top:1px solid rgba(125,255,176,.18);padding-top:4px;}
  .supplyDepotScroll{padding:0 12px 12px;}
  .supplyEconomySummary{margin:0 0 10px;}
  .supplySectionLabel{font:10px Consolas,'Courier New',monospace;letter-spacing:2px;text-transform:uppercase;color:#ffb000;margin:11px 0 6px;}
  .supplyShopRows,.supplyInventoryRows{display:flex;flex-direction:column;gap:5px;}
  .supplyShopRow{display:grid;grid-template-columns:30px minmax(0,1fr) 36px 84px;gap:7px;align-items:center;min-height:42px;padding:5px 7px;border-top:1px solid rgba(148,162,184,.2);background:rgba(8,12,20,.52);}
  .supplyIcon{font-size:20px;text-align:center;}
  .supplyCopy{min-width:0;display:flex;flex-direction:column;gap:2px;}
  .supplyCopy b{font:10px Consolas,monospace;color:#e8f1ff;text-transform:uppercase;}
  .supplyCopy small{font:8px/1.25 Consolas,monospace;color:#8fa3bb;white-space:normal;}
  .supplyOwned{font:10px Consolas,monospace;color:#7dffb0;text-align:center;}
  .supplyBuyBtn{height:29px;border:1px solid rgba(125,255,176,.55);border-radius:2px;background:rgba(24,64,45,.85);color:#caffd9;font:8px Consolas,monospace;cursor:pointer;}
  .supplyBuyBtn:disabled{opacity:.34;cursor:default;filter:grayscale(.8);}
  .supplyLoadoutSlot{display:grid;grid-template-columns:22px minmax(0,1fr) 34px;align-items:center;gap:6px;min-height:31px;padding:4px 7px;border:1px solid rgba(125,255,176,.32);border-radius:2px;background:rgba(11,21,29,.82);color:#dce8f5;text-align:left;cursor:pointer;}
  .supplyLoadoutSlot span,.supplyLoadoutSlot em{font:9px Consolas,monospace;color:#8fa3bb;font-style:normal;}
  .supplyLoadoutSlot b{font:9px Consolas,monospace;}
  .supplyLoadoutSlot.empty{opacity:.3;cursor:default;}
  .garagePreviewWrap{width:100%;height:200px;border-radius:2px;overflow:hidden;background:
    radial-gradient(ellipse at 50% 65%,rgba(11,61,145,.22),rgba(6,8,14,.96)),
    repeating-linear-gradient(0deg,transparent,transparent 11px,rgba(100,130,170,.06) 11px,rgba(100,130,170,.06) 12px);border:1px solid rgba(148,162,184,.32);margin-bottom:12px;box-shadow:inset 0 0 30px rgba(0,0,0,.45);}
  .garagePreviewWrap canvas{display:block;width:100%;height:100%;}
  .ctrlCols{display:flex;gap:28px;font-size:13px;line-height:1.85;color:#b8c6d8;}
  .ctrlCols>div{flex:1;padding:10px 12px;border:1px solid rgba(148,162,184,.2);border-radius:2px;background:rgba(8,10,16,.45);box-shadow:inset 0 1px 0 rgba(255,255,255,.03);}
  .ctrlCols b{color:#ffb000;font-weight:700;font-family:Consolas,'Courier New',monospace;font-size:12px;letter-spacing:.5px;}
  .controlsSectionTitle{font-size:11px;letter-spacing:1.5px;color:#9eb8ff;text-transform:uppercase;margin:8px 0 6px 0;padding-left:2px;font-family:Consolas,'Courier New',monospace;}
  .advancedControlsDetails summary{cursor:pointer;user-select:none;outline:none;}
  .advancedControlsDetails summary::-webkit-details-marker{display:none;}
  .advancedControlsDetails summary::before{content:'▶ ';font-size:9px;color:#6a7a94;display:inline-block;width:14px;}
  .advancedControlsDetails[open] summary::before{content:'▼ ';}
  .menuCtrlGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
  #helpPanel.compact .menuCtrlGrid{grid-template-columns:repeat(2,1fr);gap:4px;font-size:9px;line-height:1.32;}
  #helpPanel.compact .menuCtrlGrid>div{padding:4px 6px;}
  #helpPanel.compact .menuCtrlGrid b{font-size:9px;}
  #helpPanel.compact .menuCtrlGrid .dim{font-size:8px;margin-top:2px;line-height:1.3;border-left:none;padding-left:0;display:inline;}
  #helpPanel.compact .optionsBlock{margin-top:0;border:none;background:transparent;padding:0;}
  #helpPanel.compact .lobbyBlock{margin-top:0;}
  #helpPanel.compact .lbBlock{margin-top:0;border:none;background:transparent;padding:0;}
  #helpPanel.compact .replayBlock{margin-top:0;border:none;background:transparent;padding:0;}
  #helpPanel.compact .garageLaunch{margin-top:8px;padding:7px 10px;}
  #helpPanel.compact .garageLaunch>b{font-size:10px;}
  #helpPanel.compact .garageBtn{padding:6px 14px;font-size:10px;}
  #helpPanel.compact #garageBtns{margin-top:6px;gap:8px;}
  #helpPanelBody #btnMenuPlay{margin-top:0;padding:10px 14px;flex-shrink:0;font-family:Consolas,'Courier New',monospace;font-size:13px;letter-spacing:3px;color:#7dffb0;text-shadow:0 0 8px rgba(125,255,176,.6);text-align:center;text-transform:uppercase;border:1px solid rgba(125,255,176,.45);border-radius:2px;background:rgba(8,32,20,.65);box-shadow:0 0 20px rgba(125,255,176,.15),inset 0 0 20px rgba(125,255,176,.08);animation:launchPulse 2.8s ease-in-out infinite;cursor:pointer;outline:none;transition:background .2s,border-color .2s,box-shadow .2s;}
  #helpPanelBody #btnMenuPlay:hover,#helpPanelBody #btnMenuPlay.menuFocus{border-color:rgba(125,255,176,.85)!important;background:rgba(12,48,30,.8)!important;box-shadow:0 0 24px rgba(125,255,176,.45),inset 0 0 20px rgba(125,255,176,.12)!important;}
  #help button,#help select,#help input,#btnMenuPlay{touch-action:manipulation;pointer-events:auto;}
  @media (pointer:coarse){
    .menuHubBtn,.garageBtn,.garageBack,.accountBtn,.devBtn,.optBtn,#btnMenuPlay{min-height:44px;}
    .menuHubGrid{gap:10px;}
    #garageBtns{flex-wrap:wrap;}
    #help{align-items:flex-start;padding:8px 6px;overflow-y:auto;-webkit-overflow-scrolling:touch;}
    #helpPanel{width:calc(100vw - 12px);max-height:none;min-height:calc(100svh - 16px);}
    #helpPanel.compact #titleLogo{max-height:min(13vh,86px);max-width:min(280px,62vw);}
    #helpPanel.compact #helpPanelBody{padding:7px 10px 7px;}
    #helpPanel.compact .menuHubGrid{grid-template-columns:1fr 1fr;gap:8px;}
    #helpPanel.compact .menuHubBtn{font-size:9px;letter-spacing:.8px;padding:9px 6px;}
    #helpPanel.compact .accountBlock{padding:7px 8px;}
    .lobbyActionGrid{grid-template-columns:1fr;}
    .lobbyStepPills{grid-template-columns:repeat(2,1fr);}
    #lobbyJoinRow .accountBtn,#lobbyInRow .accountBtn{width:100%;}
    #helpPanel.compact .garageLaunch{padding:8px 8px;}
    #helpPanel.compact #btnMenuPlay{min-height:46px;display:flex;align-items:center;justify-content:center;}
    #helpPanel.garageOpen #helpPanelBody{min-height:0;}
    #helpPanel.garageOpen .garagePanel.open{max-height:calc(100svh - 78px);padding-bottom:calc(18px + env(safe-area-inset-bottom));}
    #helpPanel.garageOpen .garagePreviewWrap{height:clamp(112px,24svh,170px);flex-shrink:0;}
    #skaterRows,#deckRows{padding-bottom:14px;}
    .emojiLibrary{max-height:34svh;touch-action:pan-y;}
  }
  #helpPanel.compact #btnMenuPlay{margin-top:6px;padding:6px 10px;font-size:10px;letter-spacing:1px;}
  @media (max-height:760px){
    #helpPanel.compact #titleLogo{max-height:min(12vh,80px);}
    #helpPanel.compact #helpPanelBody{padding:6px 12px 6px;}
    #helpPanel.compact h2{display:none;}
    #helpPanel.compact .menuHubBtn{padding:7px 5px;font-size:8px;}
  }
  @keyframes launchPulse{0%,100%{border-color:rgba(61,255,122,.28)}50%{border-color:rgba(61,255,122,.55)}}
  .dim{color:#8a98ac;font-size:12px;margin-top:10px;line-height:1.55;border-left:2px solid rgba(11,61,145,.65);padding-left:10px;}
  #helpPanel .dim b{color:#dce6f4;}
  /* studio intro — must sit above the WebGL canvas */
  #introOverlay{position:fixed;inset:0;z-index:100000;background:#000;display:flex;align-items:center;justify-content:center;cursor:pointer;pointer-events:auto;}
  #gameCanvas{position:fixed;inset:0;width:var(--app-width)!important;height:var(--app-height)!important;z-index:1;}
  #introVideo{width:100%;height:100%;object-fit:contain;background:#000;pointer-events:none;}
  #introSkip{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font-size:13px;letter-spacing:1px;color:rgba(234,246,255,.85);text-shadow:0 1px 4px #000;pointer-events:auto;cursor:pointer;padding:8px 16px;border-radius:6px;background:rgba(0,0,0,.35);animation:introPulse 2.2s ease-in-out infinite;}
  @keyframes introPulse{0%,100%{opacity:.55}50%{opacity:1}}
  
  .cz.unselectable, .czLab.unselectable {
    opacity: 0.3 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
  }
  #universeHud{position:relative;z-index:5;display:flex;flex-direction:column;gap:4px;max-width:min(340px,42vw);font:700 10px/1.25 Consolas,monospace;color:#d8f6ff;text-shadow:0 0 6px #57e8ff88;pointer-events:none;margin-top:6px}
  #universeHud>div:not(#universeActions){padding:4px 6px;border-left:2px solid #57e8ff;background:linear-gradient(90deg,rgba(5,12,22,.62),rgba(5,12,22,.08));border-radius:4px}
  #universeActions{display:flex;flex-wrap:wrap;gap:6px;pointer-events:auto;margin-top:2px}
  #universeActions button{font:800 10px/1 Consolas,monospace;color:#06131d;background:#9fdcff;border:1px solid #d8f6ff;border-radius:5px;padding:6px 8px;box-shadow:0 0 12px #57e8ff66;cursor:pointer}
  #builderCurveBtn{background:#7dffb0!important;color:#062014!important;border-color:#d9ffe7!important}
  #builderBoostBtn{background:#ff4dd2!important;color:#150716!important;border-color:#ffd8ff!important}
  #builderLaunchBtn{background:#66e8ff!important;color:#06131d!important;border-color:#d8f6ff!important}
  #builderTurnBtn,#builderRaiseBtn,#builderLowerBtn{background:#17283a!important;color:#d8f6ff!important;border-color:#57e8ff!important}
  #builderUndoBtn{background:#1c2838!important;color:#d8f6ff!important;border-color:#6f8fb4!important}
  body.in-menu #universeHud,body.in-intro #universeHud,body.map-mode #universeHud,body.portal-lite #universeHud{display:none}
  @media (max-width:760px){#universeHud{max-width:52vw;font-size:9px}#universeActions button{padding:5px 6px;font-size:9px}}
  @media (pointer:coarse){
    body:not(.in-menu):not(.map-mode):not(.in-intro) #universeHud{display:none!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip{
      top:calc(10px + env(safe-area-inset-top));left:calc(10px + env(safe-area-inset-left));
      gap:4px;max-width:min(47vw,360px);transform:none;
    }
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip .missionChip{
      padding:5px 8px;font-size:11px;line-height:1.2;letter-spacing:.025em;
      max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      background:rgba(4,8,14,.72);
    }
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip .missionChip.on{display:none;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip #sessionGoal.on,
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip #lineChallengeHud.on{display:block;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #rareFindHud{top:calc(48px + env(safe-area-inset-top));left:50%;transform:translateX(-50%) scale(var(--hud-scale));transform-origin:center top;font-size:11px;max-width:calc(100vw - 96px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #topRight{top:calc(10px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));transform:none;max-width:34vw;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #score{font-size:26px;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #best{font-size:11px;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #planetGlobeHud{display:none!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #bottomLeft{
      left:calc(12px + env(safe-area-inset-left));bottom:calc(112px + env(safe-area-inset-bottom));transform:scale(.82);max-width:210px;
    }
    body:not(.in-menu):not(.map-mode):not(.in-intro) #speedNum,
    body:not(.in-menu):not(.map-mode):not(.in-intro) #speedBarWrap,
    body:not(.in-menu):not(.map-mode):not(.in-intro) #stamLabel,
    body:not(.in-menu):not(.map-mode):not(.in-intro) #stamBarWrap{display:none!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #bottomLeft #surgeHud,
    body:not(.in-menu):not(.map-mode):not(.in-intro) #bottomLeft #raceChallengeHud{display:none!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #tutorialHud{
      position:fixed!important;left:calc(10px + env(safe-area-inset-left))!important;right:auto!important;
      top:calc(64px + env(safe-area-inset-top))!important;bottom:auto!important;transform:none!important;
      width:auto!important;max-width:calc(48vw - 12px)!important;padding:5px 8px!important;
      font-size:10px!important;line-height:1.15!important;text-align:left!important;z-index:9!important;
      pointer-events:none!important;
    }
    body:not(.in-menu):not(.map-mode):not(.in-intro) #tutorialTitle{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #tutorialInstruction{
      position:fixed;left:calc(10px + env(safe-area-inset-left));right:calc(10px + env(safe-area-inset-right));
      bottom:calc(218px + env(safe-area-inset-bottom));z-index:9;display:block!important;overflow:hidden;
      padding:3px 8px;border-radius:3px;background:rgba(4,8,14,.58);white-space:nowrap;text-overflow:ellipsis;color:#d8f8e0;font:700 10px/1.2 Consolas,monospace;
      letter-spacing:.02em;text-align:center;text-shadow:0 1px 3px #000;pointer-events:none;
    }
  }
  @media (pointer:coarse) and (orientation:landscape){
    body:not(.in-menu):not(.map-mode):not(.in-intro) #bottomLeft{display:none!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip{max-width:min(42vw,390px);}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #tutorialHud{top:calc(52px + env(safe-area-inset-top))!important;max-width:min(42vw,360px)!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #tutorialInstruction{bottom:calc(56px + env(safe-area-inset-bottom));}
  }
  @media (pointer:coarse) and (orientation:portrait){
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip{
      top:calc(86px + env(safe-area-inset-top));max-width:calc(100vw - 24px);
    }
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip .missionChip{font-size:12px;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip #lineChallengeHud.on{display:none;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #topRight{top:calc(18px + env(safe-area-inset-top));}
    #helpPanel.compact .garageLaunch{padding:8px 8px;}
    #helpPanel.compact #btnMenuPlay{min-height:46px;display:flex;align-items:center;justify-content:center;}
    #helpPanel.garageOpen #helpPanelBody{min-height:0;}
    #helpPanel.garageOpen .garagePanel.open{max-height:calc(100svh - 78px);padding-bottom:calc(18px + env(safe-area-inset-bottom));}
    #helpPanel.garageOpen .garagePreviewWrap{height:clamp(112px,24svh,170px);flex-shrink:0;}
    #skaterRows,#deckRows{padding-bottom:14px;}
    .emojiLibrary{max-height:34svh;touch-action:pan-y;}
  }
  #helpPanel.compact #btnMenuPlay{margin-top:6px;padding:6px 10px;font-size:10px;letter-spacing:1px;}
  @media (max-height:760px){
    #helpPanel.compact #titleLogo{max-height:min(12vh,80px);}
    #helpPanel.compact #helpPanelBody{padding:6px 12px 6px;}
    #helpPanel.compact h2{display:none;}
    #helpPanel.compact .menuHubBtn{padding:7px 5px;font-size:8px;}
  }
  @keyframes launchPulse{0%,100%{border-color:rgba(61,255,122,.28)}50%{border-color:rgba(61,255,122,.55)}}
  .dim{color:#8a98ac;font-size:12px;margin-top:10px;line-height:1.55;border-left:2px solid rgba(11,61,145,.65);padding-left:10px;}
  #helpPanel .dim b{color:#dce6f4;}
  /* studio intro — must sit above the WebGL canvas */
  #introOverlay{position:fixed;inset:0;z-index:100000;background:#000;display:flex;align-items:center;justify-content:center;cursor:pointer;pointer-events:auto;}
  #gameCanvas{position:fixed;inset:0;width:var(--app-width)!important;height:var(--app-height)!important;z-index:1;}
  #introVideo{width:100%;height:100%;object-fit:contain;background:#000;pointer-events:none;}
  #introSkip{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font-size:13px;letter-spacing:1px;color:rgba(234,246,255,.85);text-shadow:0 1px 4px #000;pointer-events:auto;cursor:pointer;padding:8px 16px;border-radius:6px;background:rgba(0,0,0,.35);animation:introPulse 2.2s ease-in-out infinite;}
  @keyframes introPulse{0%,100%{opacity:.55}50%{opacity:1}}
  
  .cz.unselectable, .czLab.unselectable {
    opacity: 0.3 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
  }
  #universeHud{position:relative;z-index:5;display:flex;flex-direction:column;gap:4px;max-width:min(340px,42vw);font:700 10px/1.25 Consolas,monospace;color:#d8f6ff;text-shadow:0 0 6px #57e8ff88;pointer-events:none;margin-top:6px}
  #universeHud>div:not(#universeActions){padding:4px 6px;border-left:2px solid #57e8ff;background:linear-gradient(90deg,rgba(5,12,22,.62),rgba(5,12,22,.08));border-radius:4px}
  #universeActions{display:flex;flex-wrap:wrap;gap:6px;pointer-events:auto;margin-top:2px}
  #universeActions button{font:800 10px/1 Consolas,monospace;color:#06131d;background:#9fdcff;border:1px solid #d8f6ff;border-radius:5px;padding:6px 8px;box-shadow:0 0 12px #57e8ff66;cursor:pointer}
  #builderCurveBtn{background:#7dffb0!important;color:#062014!important;border-color:#d9ffe7!important}
  #builderBoostBtn{background:#ff4dd2!important;color:#150716!important;border-color:#ffd8ff!important}
  #builderLaunchBtn{background:#66e8ff!important;color:#06131d!important;border-color:#d8f6ff!important}
  #builderTurnBtn,#builderRaiseBtn,#builderLowerBtn{background:#17283a!important;color:#d8f6ff!important;border-color:#57e8ff!important}
  #builderUndoBtn{background:#1c2838!important;color:#d8f6ff!important;border-color:#6f8fb4!important}
  body.in-menu #universeHud,body.in-intro #universeHud,body.map-mode #universeHud,body.portal-lite #universeHud{display:none}
  @media (max-width:760px){#universeHud{max-width:52vw;font-size:9px}#universeActions button{padding:5px 6px;font-size:9px}}
  @media (pointer:coarse){
    body:not(.in-menu):not(.map-mode):not(.in-intro) #universeHud{display:none!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip{
      top:calc(10px + env(safe-area-inset-top));left:calc(10px + env(safe-area-inset-left));
      gap:4px;max-width:min(47vw,360px);transform:none;
    }
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip .missionChip{
      padding:5px 8px;font-size:11px;line-height:1.2;letter-spacing:.025em;
      max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      background:rgba(4,8,14,.72);
    }
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip .missionChip.on{display:none;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip #sessionGoal.on,
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip #lineChallengeHud.on{display:block;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #rareFindHud{top:calc(48px + env(safe-area-inset-top));left:50%;transform:translateX(-50%) scale(var(--hud-scale));transform-origin:center top;font-size:11px;max-width:calc(100vw - 96px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #topRight{top:calc(10px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));transform:none;max-width:34vw;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #score{font-size:26px;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #best{font-size:11px;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #planetGlobeHud{display:none!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #bottomLeft{
      left:calc(12px + env(safe-area-inset-left));bottom:calc(112px + env(safe-area-inset-bottom));transform:scale(.82);max-width:210px;
    }
    body:not(.in-menu):not(.map-mode):not(.in-intro) #speedNum,
    body:not(.in-menu):not(.map-mode):not(.in-intro) #speedBarWrap,
    body:not(.in-menu):not(.map-mode):not(.in-intro) #stamLabel,
    body:not(.in-menu):not(.map-mode):not(.in-intro) #stamBarWrap{display:none!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #bottomLeft #surgeHud,
    body:not(.in-menu):not(.map-mode):not(.in-intro) #bottomLeft #raceChallengeHud{display:none!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #tutorialHud{
      position:fixed!important;left:calc(10px + env(safe-area-inset-left))!important;right:auto!important;
      top:calc(64px + env(safe-area-inset-top))!important;bottom:auto!important;transform:none!important;
      width:auto!important;max-width:calc(48vw - 12px)!important;padding:5px 8px!important;
      font-size:10px!important;line-height:1.15!important;text-align:left!important;z-index:9!important;
      pointer-events:none!important;
    }
    body:not(.in-menu):not(.map-mode):not(.in-intro) #tutorialTitle{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #tutorialInstruction{
      position:fixed;left:calc(10px + env(safe-area-inset-left));right:calc(10px + env(safe-area-inset-right));
      bottom:calc(218px + env(safe-area-inset-bottom));z-index:9;display:block!important;overflow:hidden;
      padding:3px 8px;border-radius:3px;background:rgba(4,8,14,.58);white-space:nowrap;text-overflow:ellipsis;color:#d8f8e0;font:700 10px/1.2 Consolas,monospace;
      letter-spacing:.02em;text-align:center;text-shadow:0 1px 3px #000;pointer-events:none;
    }
  }
  @media (pointer:coarse) and (orientation:landscape){
    body:not(.in-menu):not(.map-mode):not(.in-intro) #bottomLeft{display:none!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip{max-width:min(42vw,390px);}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #tutorialHud{top:calc(52px + env(safe-area-inset-top))!important;max-width:min(42vw,360px)!important;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #tutorialInstruction{bottom:calc(56px + env(safe-area-inset-bottom));}
  }
  @media (pointer:coarse) and (orientation:portrait){
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip{
      top:calc(86px + env(safe-area-inset-top));max-width:calc(100vw - 24px);
    }
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip .missionChip{font-size:12px;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip #lineChallengeHud.on{display:none;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #topRight{top:calc(18px + env(safe-area-inset-top));}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #score{font-size:38px;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #best{font-size:16px;}
    body:not(.in-menu):not(.map-mode):not(.in-intro) #bottomLeft{
      bottom:calc(248px + env(safe-area-inset-bottom));transform:scale(.82);max-width:42vw;
    }
  }
  @media (pointer:coarse), (max-width:700px){
    #message.msg-compact{top:calc(58px + env(safe-area-inset-top));font-size:12px;max-width:calc(100vw - 112px);text-align:left;transform:translateX(-50%) scale(var(--hud-scale));}
  }

  @media (pointer:coarse){
    body:not(.in-menu):not(.map-mode):not(.in-intro) #missionStrip #tutorialHud.missionChip.on{display:block!important;}
  }

  #courseCreatorOverlay {
    position: fixed;
    top: 0; left: 0; width: 100vw; height: 100vh;
    z-index: 1000;
    background: rgba(4, 5, 12, 0.72);
    backdrop-filter: blur(8px);
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: auto;
  }
  .creator-window {
    background: linear-gradient(135deg, rgba(14, 16, 28, 0.96), rgba(8, 9, 18, 0.98));
    border: 1px solid rgba(138, 43, 226, 0.38);
    box-shadow: 0 0 32px rgba(138, 43, 226, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    width: min(650px, 92vw);
    max-height: min(520px, 86vh);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    color: #e2e8f0;
    font-family: Consolas, Monaco, 'Courier New', monospace;
  }
  .creator-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    background: rgba(138, 43, 226, 0.12);
    border-bottom: 1px solid rgba(138, 43, 226, 0.24);
  }
  .creator-header h2 {
    margin: 0;
    font-size: 15px;
    letter-spacing: 2px;
    color: #decfff;
    text-shadow: 0 0 8px rgba(161, 130, 255, 0.6);
  }
  .creator-header .close-btn {
    background: none;
    border: none;
    color: #a0aec0;
    font-size: 24px;
    cursor: pointer;
    line-height: 1;
    padding: 0 4px;
    transition: color 0.12s;
  }
  .creator-header .close-btn:hover {
    color: #ff6666;
  }
  .creator-tabs {
    display: flex;
    background: rgba(4, 5, 12, 0.45);
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }
  .creator-tabs .tab-btn {
    flex: 1;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    color: #718096;
    padding: 12px;
    font: 800 11px Consolas, monospace;
    letter-spacing: 1px;
    text-transform: uppercase;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
  }
  .creator-tabs .tab-btn.active {
    color: #a182ff;
    border-color: #a182ff;
    background: rgba(138, 43, 226, 0.04);
  }
  .creator-tabs .tab-btn:hover:not(.active) {
    color: #decfff;
  }
  .creator-content {
    padding: 20px;
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 15px;
  }
  .tab-pane {
    display: none;
    flex-direction: column;
    gap: 15px;
  }
  .tab-pane.active {
    display: flex;
  }
  .pane-split {
    display: flex;
    gap: 15px;
  }
  .pane-info {
    flex: 1.2;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 15px;
  }
  .pane-info p {
    margin: 0;
    font-size: 11.5px;
    line-height: 1.45;
    color: #cbd5e0;
  }
  .tip-box {
    flex: 1;
    background: rgba(138, 43, 226, 0.04);
    border: 1px solid rgba(138, 43, 226, 0.15);
    border-radius: 6px;
    padding: 10px 12px;
    font-size: 10px;
    line-height: 1.45;
    color: #a0aec0;
  }
  .tip-box b {
    color: #decfff;
  }
  .creator-status {
    border: 1px solid rgba(128,247,255,.22);
    border-left: 3px solid #80f7ff;
    border-radius: 8px;
    background: rgba(6,18,28,.68);
    padding: 10px 12px;
    color: #d8f6ff;
    font-size: 10.5px;
    line-height: 1.35;
    box-shadow: inset 0 0 18px rgba(128,247,255,.06);
  }
  .creator-status.warn {
    border-color: rgba(255,210,77,.32);
    border-left-color: #ffd24d;
    color: #ffe9a6;
  }
  .creator-status.ok {
    border-left-color: #7dffb0;
  }
  .creator-status-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-top: 7px;
    color: #aeefff;
  }
  .creator-status-grid span {
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 6px;
    padding: 5px 6px;
    background: rgba(255,255,255,.04);
    text-align: center;
  }
  .creator-status-note {
    margin-top: 7px;
    color: #a0aec0;
  }
  .creator-mini-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .creator-mini-actions button {
    flex: 1 1 130px;
    min-height: 34px;
    border: 1px solid rgba(128,247,255,.36);
    border-radius: 7px;
    background: rgba(10,28,42,.82);
    color: #d8f6ff;
    font: 800 10px Consolas, monospace;
    letter-spacing: .6px;
    text-transform: uppercase;
    cursor: pointer;
  }
  .creator-mini-actions button:hover {
    filter: brightness(1.14);
  }
  .creator-primary-btn {
    background: #a182ff;
    color: #0e0624;
    border: 1px solid #decfff;
    border-radius: 6px;
    padding: 10px 18px;
    font: 800 12px Consolas, monospace;
    letter-spacing: 1px;
    text-transform: uppercase;
    cursor: pointer;
    box-shadow: 0 0 12px rgba(161, 130, 255, 0.3);
    transition: filter 0.12s, transform 0.12s;
  }
  .creator-primary-btn:hover {
    filter: brightness(1.12);
  }
  .creator-primary-btn:active {
    transform: translateY(1px);
  }
  .form-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .form-group label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #a0aec0;
  }
  .form-group input {
    background: rgba(4, 5, 12, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 6px;
    padding: 8px 12px;
    font: 12px Consolas, monospace;
    color: #f7fafc;
    outline: none;
    transition: border-color 0.12s;
  }
  .form-group input:focus {
    border-color: #a182ff;
    box-shadow: 0 0 6px rgba(161, 130, 255, 0.2);
  }
  .course-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
    margin-top: 5px;
  }
  .course-item {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    padding: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
  }
  .course-item:hover {
    background: rgba(138, 43, 226, 0.05);
    border-color: rgba(138, 43, 226, 0.28);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
  }
  .course-info {
    display: flex;
    flex-direction: column;
    gap: 3px;
  }
  .course-title {
    font-weight: 700;
    font-size: 12px;
    color: #f7fafc;
  }
  .course-meta {
    font-size: 9.5px;
    color: #718096;
  }
  .course-action-btn {
    background: #4a5568;
    color: #e2e8f0;
    border: 1px solid #718096;
    border-radius: 4px;
    padding: 5px 10px;
    font: 700 9px Consolas, monospace;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.12s, border-color 0.12s;
  }
  .course-action-btn:hover {
    background: #a182ff;
    color: #0e0624;
    border-color: #decfff;
  }
  @media (max-width: 640px) {
    .creator-window {
      width: 94vw;
      max-height: 90vh;
    }
    .pane-split {
      flex-direction: column;
    }
    .creator-status-grid {
      grid-template-columns: 1fr;
    }
    .creator-mini-actions button {
      flex-basis: 100%;
    }
    .creator-tabs .tab-btn {
      font-size: 9px;
      padding: 10px 6px;
    }
    .course-grid {
      grid-template-columns: 1fr;
    }
  }
  #readyPrompt {
    display: none;
    text-align: center;
    font-family: var(--font-tag);
    font-size: 13px;
    font-weight: 700;
    color: #7dffb0;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: .08em;
    text-shadow: 0 0 8px rgba(125, 255, 176, 0.6);
    animation: readyPulse 1.2s infinite alternate;
  }
  @keyframes readyPulse {
    from { opacity: 0.65; transform: scale(0.98); }
    to { opacity: 1; transform: scale(1.02); }
  }

  #speedVignette{
    position:fixed;
    inset:0;
    z-index:3;
    pointer-events:none;
    opacity:0;
    background:radial-gradient(circle, transparent 40%, rgba(90, 220, 255, 0.15) 100%);
    box-shadow:inset 0 0 100px rgba(90, 220, 255, 0.28);
    transition:opacity .35s ease;
  }
  #speedVignette.flow{
    opacity:1;
  }

  @media (max-width: 640px) {
    .itemInventoryHud{bottom:calc(212px + env(safe-area-inset-bottom));gap:3px;padding:4px;max-width:calc(100vw - 12px);}
    .itemInventoryHud.tutorialOffset{bottom:calc(330px + env(safe-area-inset-bottom));}
    .itemInventorySlot{width:35px;height:34px;grid-template-columns:9px 1fr;}
    .itemInventorySlot .itemIcon{font-size:15px;}
    .itemInventoryHint{display:none;}
    .supplyDepotScroll{padding:0 4px 10px;}
    .supplyShopRow{grid-template-columns:27px minmax(0,1fr) 28px 70px;gap:4px;padding:5px 4px;}
    .supplyCopy b{font-size:9px;}
    .supplyCopy small{font-size:7px;}
    .supplyBuyBtn{font-size:7px;}
  }
