/* ROTOR Final 08 — buttons in the PiP bubble glass, 3D icon orbs, UI that steps back from the 3D world,
   lime light lines on every screen. Loads last on index / arena / green-room. */
:root{
  --g8-rim:#ebf7ff96;--g8-rim-hi:#f6fbff;
  --g8-face:radial-gradient(120% 140% at 30% -20%,#ffffff2e 0,#ffffff0a 42%,#ffffff00 60%),linear-gradient(180deg,#0b10180f,#02040a38);
  --g8-shadow:inset 0 1px 0 #ffffff99,inset 0 -1px 0 #dbedff50,inset 0 0 0 1px #ffffff0d,0 8px 22px #0000004d;
  --g8-ease:cubic-bezier(.22,.61,.36,1)}

/* 1 · Bubble glass: same material as the PiP frames (clear face, silver rim, inner top/bottom light). */
html body :is(.rotor-access-route,.cm-view-rail button,.cm-view-rail summary,.cm-primary a,.cm-learning a,#cmAnglesToggle,.topActions button,.topActions a,.rotor-club-button,details.stadium-match-tools>summary,#viewControls button,#resumePanel button,.f1-coach button,.rotor36-session-tools button,.match-frame-destinations :is(a,button),.rotor-emblem-panel button,#menu .entry button,.d22-level button,#cmRacketControl,#f02Back,.f3-chip,.f3-home-court,#final02Lane #rotorSceneTraining#rotorSceneTraining):not([aria-current]):not([aria-pressed=true]):not(.cm-player-create):not(.rotor-emblem-save){
  position:relative;isolation:isolate;border:1px solid var(--g8-rim)!important;background:var(--g8-face)!important;box-shadow:var(--g8-shadow)!important;color:#f2f6f9!important;text-shadow:0 1px 2px #000,0 0 8px #0009!important}
/* Specular arc across the top third — the bubble edge. */
html body :is(.rotor-access-route,.cm-view-rail button,.cm-view-rail summary,.cm-primary a,.cm-learning a,#cmAnglesToggle,.topActions button,.topActions a,#resumePanel button,.rotor-emblem-panel button,#menu .entry button,.d22-level button,#cmRacketControl,.f3-chip,.f3-home-court,#final02Lane #rotorSceneTraining#rotorSceneTraining,#rotorSceneEnterArena)::after{
  content:""!important;position:absolute!important;left:10%;right:10%;top:2px;height:42%;border-radius:999px 999px 60% 60%/999px 999px 100% 100%;
  background:linear-gradient(180deg,#ffffff59,#ffffff00)!important;pointer-events:none;z-index:-1;opacity:.75;transition:opacity 300ms var(--g8-ease)}
html body :is(.rotor-access-route,.cm-view-rail button,.cm-view-rail summary,.cm-primary a,.cm-learning a,.topActions button,.topActions a,#cmRacketControl,.f3-chip,#final02Lane #rotorSceneTraining#rotorSceneTraining):is(:hover,:focus-visible){
  border-color:var(--g8-rim-hi)!important;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #dbedff80,0 0 0 1px #b6ef3c55,0 0 18px #b6ef3c26,0 12px 28px #0006!important;transform:translateY(-1px)}
html body :is(.rotor-access-route,.cm-view-rail button,.cm-primary a,.topActions button,.f3-chip):is(:hover,:focus-visible)::after{opacity:1}

/* Selected / primary keep their lime & gold fills, plus the same specular arc. */
html body :is(.rotor-access-route[aria-current],.cm-view-rail button[aria-pressed=true],.cm-primary .cm-player-create,.rotor-emblem-panel .rotor-emblem-save){position:relative;isolation:isolate}
html body :is(.rotor-access-route[aria-current],.cm-view-rail button[aria-pressed=true],.cm-primary .cm-player-create,.rotor-emblem-panel .rotor-emblem-save)::after{content:""!important;position:absolute;left:10%;right:10%;top:2px;height:42%;border-radius:999px 999px 60% 60%/999px 999px 100% 100%;background:linear-gradient(180deg,#ffffffaa,#ffffff00)!important;pointer-events:none;z-index:-1}

/* 2 · Icons become 3D orbs (glass sphere with lit top-left, rim shade, contact shadow). */
html body :is(.rotor-access-route,.cm-view-rail button,.f3-home-court,.f3-chip) :is(svg,.rotor-access-glyph,img){
  flex:0 0 auto;width:26px!important;height:26px!important;padding:5px!important;border-radius:50%;box-sizing:border-box;
  background:radial-gradient(circle at 34% 28%,#ffffffe0 0 6%,#ffffff55 16%,#c9d6e033 40%,#0b1220aa 78%,#1a2636 100%)!important;
  box-shadow:inset 0 0 0 1px #ffffff8c,inset 0 -3px 5px #000a,inset 0 3px 4px #ffffff4d,0 3px 6px #000b,0 0 0 1px #00000040!important;
  filter:drop-shadow(0 0 0 transparent);overflow:visible}
html body :is(.rotor-access-route,.cm-view-rail button,.f3-home-court,.f3-chip) svg :is(path,circle,ellipse,rect,line,polyline,polygon){stroke:#fff!important;filter:drop-shadow(0 1px 1px #000c)}
html body :is(.rotor-access-route[aria-current],.cm-view-rail button[aria-pressed=true]) :is(svg,.rotor-access-glyph,img){background:radial-gradient(circle at 34% 28%,#ffffff 0 6%,#f4ffd9 16%,#b6ef3c 45%,#5c8a12 85%)!important}
html body :is(.rotor-access-route[aria-current],.cm-view-rail button[aria-pressed=true]) svg :is(path,circle,ellipse,rect,line,polyline,polygon){stroke:#101706!important;filter:none}
/* Icon + word never collide: icon is a fixed slot, label starts after it. */
html body :is(.rotor-access-route,.f3-home-court,.f3-chip){gap:7px!important}
html body.rotor-access-ready .rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock .rotor-access-route{padding:0 13px 0 5px!important}

/* 3 · Rail chevrons drawn as icons (labels are font-size 0 there). */
html body nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail :is(#cmPrevious,#cmNext){width:40px!important;min-width:40px!important;padding:0!important}
html body nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail :is(#cmPrevious,#cmNext)::before{content:""!important;position:absolute!important;left:50%!important;top:50%!important;width:9px!important;height:9px!important;border:solid #fff!important;border-width:2px 2px 0 0!important;background:none!important;box-shadow:none!important;transform:translate(-70%,-50%) rotate(45deg)!important;translate:none!important;rotate:none!important;filter:drop-shadow(0 1px 1px #000)}
html body nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail #cmPrevious::before{transform:translate(-30%,-50%) rotate(-135deg)!important}

/* 4 · The UI steps back from the 3D world.
   After 3.5 s without input the chrome dims and slides toward the edges; any move/touch/key brings it back at once.
   PLAY DUEL and the music bubble stay; nothing steps back during a match, a panel, the studio or for keyboard users. */
html body :is(.rotor-access-dock,nav.cm-view-rail,#mainMenu .cm-primary,#mainMenu .cm-learning,#mainMenu .cm-angles-toggle,#mainMenu .cm-intro,#mainMenu .rotor25-player-line,#mainMenu .cm-kicker,.rotor-view-pip,#final02Lane #rotorSceneTraining,.f3-home-court,#f3Badges){transition:opacity 700ms var(--g8-ease),transform 700ms var(--g8-ease),filter 700ms var(--g8-ease)}
html body.f8-idle:not(.playing):not(.f2-identity-studio):not(.rotor-access-panel-open):not(.emblem-editor-open):not(.club-center-open):not(.f8-kbd) :is(.rotor-access-dock,.f3-home-court){opacity:.28;transform:translateY(-10px)}
html body.f8-idle:not(.playing):not(.f2-identity-studio):not(.rotor-access-panel-open):not(.emblem-editor-open):not(.club-center-open):not(.f8-kbd) nav.cm-view-rail{opacity:.28;transform:translateY(10px)}
html body.f8-idle:not(.playing):not(.f2-identity-studio):not(.rotor-access-panel-open):not(.emblem-editor-open):not(.club-center-open):not(.f8-kbd) #mainMenu :is(.cm-primary,.cm-learning,.cm-angles-toggle,.cm-intro,.rotor25-player-line,.cm-kicker){opacity:.22}
html body.f8-idle:not(.playing):not(.f2-identity-studio):not(.rotor-access-panel-open):not(.emblem-editor-open):not(.club-center-open):not(.f8-kbd) .rotor-view-pip{opacity:.5}
html body.f8-idle:not(.playing):not(.f2-identity-studio):not(.f8-kbd) #final02Lane #rotorSceneTraining{opacity:.3}
/* In a live match the HUD keeps to the edges: PiPs dim unless hovered. */
html body.stadium-arena.playing .rotor-view-pip:not(:hover){opacity:.72}

/* 5 · Lime light lines on every screen (decorative, under all UI, never catches input). */
#f8Lines{position:fixed;inset:0;pointer-events:none;z-index:2;overflow:hidden;contain:strict}
#f8Lines i{position:absolute;left:-30%;width:160%;height:1px;background:linear-gradient(90deg,transparent,#b6ef3c00 20%,#b6ef3c99 46%,#eaffb0 50%,#b6ef3c99 54%,#b6ef3c00 80%,transparent);box-shadow:0 0 8px #b6ef3c66;opacity:0;transform-origin:50% 50%}
#f8Lines i:nth-child(1){top:14%;rotate:-7deg;animation:f8-line 9s 0s linear infinite}
#f8Lines i:nth-child(2){top:22%;rotate:-4deg;animation:f8-line 11s 2.5s linear infinite}
#f8Lines i:nth-child(3){top:78%;rotate:5deg;animation:f8-line 10s 1.2s linear infinite}
#f8Lines i:nth-child(4){top:86%;rotate:8deg;animation:f8-line 12s 5s linear infinite}
#f8Lines i:nth-child(5){top:50%;rotate:-2deg;height:1px;animation:f8-line 14s 7s linear infinite;filter:hue-rotate(-30deg)}
@keyframes f8-line{0%{opacity:0;translate:-40% 0}12%{opacity:.7}50%{opacity:.45}88%{opacity:.7}100%{opacity:0;translate:40% 0}}
/* Screen change: a fast lime sweep, like the loading screen. */
#f8Lines.sweep::after{content:"";position:absolute;inset:-10% 0;background:repeating-linear-gradient(100deg,transparent 0 60px,#b6ef3c33 60px 61px,transparent 61px 140px),linear-gradient(100deg,transparent 35%,#b6ef3c55 47%,#eaffb0bb 50%,#b6ef3c55 53%,transparent 65%);background-size:100% 100%,300% 100%;animation:f8-sweep 1.1s cubic-bezier(.45,.05,.35,1) both}
@keyframes f8-sweep{from{background-position:0 0,130% 0;opacity:1}to{background-position:0 0,-130% 0;opacity:0}}
html body:is(.three-hero-opening) #f8Lines{display:none}
html body.stadium-arena.playing #f8Lines i{animation-play-state:paused;opacity:0}
@media (prefers-reduced-motion:reduce){#f8Lines i,#f8Lines.sweep::after{animation:none!important;opacity:0}}
html[data-reduce-effects="1"] #f8Lines{display:none}

/* 6 · Landing headline: EVERY RETURN / IS A STATEMENT. — white + rotor yellow, never clipped at any width or zoom. */
html body #cinematicEntry.final02-entry .cinematic-copy{min-width:0;flex:1 1 auto;max-width:min(62vw,880px)}
html body #cinematicEntry.final02-entry .cinematic-copy p{font-size:clamp(38px,min(6.4vw,11vh),104px)!important;transform:none!important;translate:none!important;white-space:normal;overflow-wrap:anywhere}
html body #cinematicEntry .cinematic-copy em.f8-y{font-style:normal;color:#ffcf00;text-shadow:0 3px 10px #000,0 0 26px #ffcf0033}
html body #cinematicEntry .cinematic-copy>span{color:#b6ef3c!important;letter-spacing:.16em;text-transform:uppercase;font:700 12px/1.4 Inter,system-ui,sans-serif!important}

/* 7 · Mid sizes (761–1199 wide, or any desktop shorter than 760): deterministic lanes, 3D world keeps the centre.
   Menu top-left (compact), PLAY lane bottom-right above the rail, world PiP off (Court/Live PiPs stay in matches). */
@media (min-width:761px) and (max-width:1199px), (min-width:761px) and (max-height:759px) and (orientation:landscape){
  html body #mainMenu#mainMenu :is(.cm-learning,.cm-intro,.cm-kicker){display:none!important}
  html body #mainMenu#mainMenu{max-height:calc(100vh - 230px)!important;overflow:visible}
  html body #mainMenu h1{font-size:clamp(34px,5.2vw,58px)!important}
  html body #final02Lane#final02Lane#final02Lane{position:fixed!important;left:auto!important;top:auto!important;right:20px!important;bottom:76px!important;transform:none!important;translate:none!important;max-width:calc(100vw - 40px)}
  html body:not(.stadium-arena) #rotorWorldView.rotor-view-pip{display:none!important}
}

/* 8 · GRAPHICS picker inside VIEW SETTINGS. */
html body #f8Graphics{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px}
html body #f8Graphics>span{font:700 9.5px/1 Inter,system-ui,sans-serif;letter-spacing:.16em;color:#e9eef2b3;margin-right:4px}
html body #f8Graphics button{min-height:32px!important;padding:0 11px!important;border:1px solid var(--g8-rim)!important;border-radius:999px!important;background:var(--g8-face)!important;box-shadow:var(--g8-shadow)!important;color:#f2f6f9!important;font:700 10px/1 Inter,system-ui,sans-serif!important;letter-spacing:.12em!important;cursor:pointer}
html body #f8Graphics button[aria-pressed=true]{background:linear-gradient(180deg,#e2ff9e,#b6ef3c 55%,#a6dc45)!important;border-color:#e8ffb8!important;color:#101706!important;text-shadow:none!important}

/* 9 · HOME BASE: the rotor in your hands, the main menu beside it, PLAY DUEL in its lane, RESUME TOUR bottom centre. */
html body.f8-home #mainMenu#mainMenu{display:block!important;opacity:1!important;visibility:visible!important}
html body.f8-home #mainMenu#mainMenu .cm-primary{display:flex!important}
html body.f8-home #mainMenu#mainMenu :is(.cm-learning,.cm-angles-toggle){display:none!important}
html body.f8-home #final02Lane#final02Lane#final02Lane{display:flex!important;visibility:visible!important;opacity:1!important}
html body.f8-home #cmRacketHint{display:none!important}
html body.f8-home.f8-idle #mainMenu#mainMenu :is(.cm-primary,.cm-intro,.rotor25-player-line,.cm-kicker){opacity:.35}
/* Landing SKIP TOUR: same family as ENTER THE STADIUM, quieter. */
html body #cinematicEntry #f8SkipTour{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:12px 22px;border:1px solid var(--g8-rim);border-radius:18px;background:var(--g8-face);box-shadow:var(--g8-shadow);color:#f2f6f9;cursor:pointer;text-align:left;pointer-events:auto}
html body #cinematicEntry #f8SkipTour strong{font:800 22px/1 'Barlow Condensed',Inter,sans-serif;letter-spacing:.04em}
html body #cinematicEntry #f8SkipTour span{font:600 12px/1.3 Inter,system-ui,sans-serif;color:#b6ef3c}
html body #cinematicEntry #f8SkipTour:is(:hover,:focus-visible){border-color:#fff;box-shadow:inset 0 1px 0 #fff,0 0 0 1px #b6ef3c66,0 12px 28px #0006}
html body nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail #f8RailSkip{order:5!important;flex:0 0 auto}
html body.f8-home #f8RailSkip,html body.try-racket #f8RailSkip{display:none!important}
/* 9b · HOME BASE wins the cascade (stadium19/final02/final03 hide the menu under .try-racket with heavier selectors). */
html body.f8-home.f8-home.f8-home #mainMenu#mainMenu#mainMenu{display:block!important;opacity:1!important;visibility:visible!important}
html body.f8-home.f8-home.f8-home #mainMenu#mainMenu#mainMenu .cm-primary{display:flex!important}
html body.f8-home.f8-home.f8-home #final02Lane#final02Lane#final02Lane{display:flex!important;visibility:visible!important;opacity:1!important}
/* Tour: lime lines stronger and a sweep on every beat. */
html body:not(.f8-home):not(.stadium-arena) #f8Lines i{box-shadow:0 0 12px #b6ef3c99}

/* 10 · Space pass (Joey: UI takes too much space / ghost overlaps).
   Idle = fully out of the way (no half-faded ghosts); narrow = one compact scrolling dock row; rail never squeezes. */
html body.f8-idle:not(.playing):not(.f2-identity-studio):not(.rotor-access-panel-open):not(.emblem-editor-open):not(.club-center-open):not(.f8-kbd) :is(.rotor-access-dock,.f3-home-court,nav.cm-view-rail,#final02Lane #rotorSceneTraining){opacity:.42!important}
html body.f8-idle:not(.playing):not(.f2-identity-studio):not(.rotor-access-panel-open):not(.emblem-editor-open):not(.club-center-open):not(.f8-kbd) #mainMenu :is(.cm-primary,.cm-learning,.cm-angles-toggle,.cm-intro,.rotor25-player-line,.cm-kicker){opacity:.42!important}
html body.f8-idle:not(.playing):not(.f2-identity-studio):not(.f8-kbd) .rotor-view-pip{opacity:.85}
/* Rail: the PREV · view · NEXT group sizes to its content; nothing overlaps the PAUSE disc. */
html body nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail #cmViewRail#cmViewRail{display:flex!important;align-items:center;gap:6px;width:auto!important;min-width:0!important;max-width:none!important;flex:0 0 auto!important;overflow:visible!important}
html body nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail{gap:6px!important;align-items:center}
@media (max-width:760px),(max-height:520px){
  /* Dock: one row, compact chips, scrolls sideways; labels stay. */
  html body.rotor-access-ready .rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none;left:184px!important;right:auto!important;transform:none!important;translate:none!important;max-width:calc(100vw - 196px)!important;height:auto!important;gap:5px!important;padding:4px!important;-webkit-mask:linear-gradient(90deg,#000 85%,transparent);mask:linear-gradient(90deg,#000 85%,transparent);grid-template-columns:none!important}
  html body.rotor-access-ready .rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock::-webkit-scrollbar{display:none}
  html body.rotor-access-ready .rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock .rotor-access-route{flex:0 0 auto!important;flex-direction:row!important;min-height:32px!important;padding:0 10px 0 4px!important}
  html body.rotor-access-ready .rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock .rotor-access-route :is(svg,.rotor-access-glyph,img){width:22px!important;height:22px!important;padding:4px!important}
  html body.rotor-access-ready .rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock .rotor-access-route :is(.f2-route-label,span:not(.rotor-access-glyph)){font-size:9px!important;letter-spacing:.1em!important}
  /* Rail: arrows + PAUSE + VIEW + HOME BASE only. */
  html body nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail #cmViewPicker{display:none!important}
  html body nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail{left:12px!important;right:12px!important;bottom:10px!important;max-width:none!important;transform:none!important;flex-wrap:nowrap!important;justify-content:space-between}
  html body nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail :is(#cmViewSettings>summary,#cmRacketControl){min-height:38px!important;padding:0 12px!important;font-size:9.5px!important;letter-spacing:.12em!important}
  html body nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail #cmViewSettings>summary{padding-left:12px!important;font-size:0!important}
  html body nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail #cmViewSettings>summary::before{content:"VIEW";font:700 9.5px/1 Inter,system-ui,sans-serif;letter-spacing:.12em;color:#f2f6f9}
  /* PLAY lane above the rail, TRAINING tucked under PLAY's right edge. */
  html body #final02Lane#final02Lane#final02Lane{left:50%!important;right:auto!important;bottom:62px!important;transform:translateX(-50%)!important;gap:8px}
  html body #final02Lane#final02Lane#final02Lane #rotorSceneEnterArena{min-width:200px!important;min-height:54px!important}
  html body #final02Lane#final02Lane#final02Lane #rotorSceneTraining{min-height:40px!important;padding:0 12px!important}
}
@media (max-width:760px),(max-height:520px){
  html body.rotor-access-ready .rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock{justify-content:flex-start!important}
  html body:not(.stadium-arena) #rotorWorldView.rotor-view-pip{display:none!important}
}
@media (max-height:520px) and (orientation:landscape){
  html body #final02Lane#final02Lane#final02Lane{left:auto!important;right:16px!important;bottom:60px!important;transform:none!important}
  html body #mainMenu#mainMenu{max-width:min(46vw,400px)!important}
}
/* 11 · Desktop: PLAY lane has ONE home at every size ≥761 wide (bottom-right, above the rail). Replaces the JS lane keeper's guesses. */
@media (min-width:761px) and (min-height:521px){
  html body #final02Lane#final02Lane#final02Lane{position:fixed!important;left:auto!important;top:auto!important;right:24px!important;bottom:84px!important;transform:none!important;translate:none!important}
  html body.f8-home #final02Lane#final02Lane#final02Lane{bottom:84px!important}
}
@media (min-width:761px) and (max-width:1199px), (min-width:761px) and (max-height:759px){
  html body #mainMenu#mainMenu#mainMenu :is(.cm-learning,.cm-intro,.cm-kicker){display:none!important}
}
@media (min-width:1200px) and (min-height:760px){
  html body:not(.stadium-arena) #rotorWorldView#rotorWorldView.rotor-view-pip{position:fixed!important;top:auto!important;left:auto!important;right:24px!important;bottom:164px!important;transform:none!important;max-height:calc(100vh - 164px - 130px)!important}
}

/* 12 · GTA headline frame: kicker above + sub-label below, always shown with the headline (never idle-hidden). */
html body #mainMenu#mainMenu#mainMenu #cmCaption.cm-kicker{display:block!important;opacity:1!important;margin:0 0 6px!important;font:700 11px/1.2 Inter,system-ui,sans-serif!important;letter-spacing:.22em!important;text-transform:uppercase;color:#b6ef3c!important;text-shadow:0 1px 2px #000c!important}
html body #mainMenu#mainMenu#mainMenu .f9-sub{display:flex;align-items:center;gap:8px;margin:8px 0 12px;font:700 11px/1.2 Inter,system-ui,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:#e9eef2;text-shadow:0 1px 2px #000c}
html body #mainMenu#mainMenu#mainMenu .f9-sub i{width:7px;height:7px;border-radius:50%;background:#b6ef3c;box-shadow:0 0 8px #b6ef3caa}
html body #mainMenu#mainMenu#mainMenu .f9-sub b{color:#ffcf00;font-weight:800}
html body.f8-idle #mainMenu#mainMenu#mainMenu :is(#cmCaption.cm-kicker,.f9-sub){opacity:1!important}
@media (max-width:480px),(max-height:520px){html body #mainMenu#mainMenu#mainMenu :is(#cmCaption.cm-kicker,.f9-sub){font-size:9.5px!important;letter-spacing:.18em!important}html body #mainMenu#mainMenu#mainMenu .f9-sub{margin:4px 0 8px}}
/* 13 · Short windows: the menu (kicker first) starts below the one-row dock, never under it. */
@media (max-height:520px){
  html body #mainMenu#mainMenu#mainMenu{top:100px!important;bottom:auto!important;transform:none!important;translate:none!important;max-height:calc(100vh - 100px - 120px)!important;overflow:visible!important}
  html body #mainMenu#mainMenu#mainMenu h1{font-size:clamp(22px,6.5vh,34px)!important;line-height:1!important}
  html body #mainMenu#mainMenu#mainMenu .cm-primary{margin-top:4px!important}
}

/* 14 · Arena pre-match: NIGHT COURT is a main menu. A real glass pane above the world, one top bar, nothing sitting on it. */
html body.stadium-arena:not(.playing):not(.online-lobby-open):not(.searching) #menu#menu#menu.f1-glass{position:fixed!important;left:38px!important;top:150px!important;right:auto!important;bottom:auto!important;width:min(360px,calc(100vw - 76px))!important;max-height:calc(100vh - 150px - 300px)!important;overflow:auto!important;scrollbar-width:none;padding:22px 22px 18px!important;border-radius:26px!important;background:linear-gradient(160deg,#0a1322d9,#02060fe6)!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;border:1px solid #ebf7ff96!important;box-shadow:inset 0 1px 0 #ffffff80,inset 0 -1px 0 #ffffff1f,0 24px 60px #000b!important;z-index:60!important;pointer-events:auto!important;opacity:1!important;visibility:visible!important;transform:none!important}
html body.stadium-arena #menu#menu#menu::-webkit-scrollbar{display:none}
html body.stadium-arena #menu#menu#menu :is(.directorLinks,#controller){display:none!important}
html body.stadium-arena #menu#menu#menu h1{font-size:clamp(44px,6vh,64px)!important;line-height:.92!important;margin:10px 0 8px!important}
html body.stadium-arena #menu#menu#menu #introText{margin:0 0 12px!important}
html body.stadium-arena #menu#menu#menu .s2-lobby{flex-wrap:wrap!important;gap:6px!important}
html body.stadium-arena.rotor-access-ready .rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock{display:none!important}
html body.rotor-access-ready.rotor-access-ready.rotor-match-frame .match-frame-status.match-frame-status{background:linear-gradient(145deg,#ffffff1f,#ffffff05 45%,#00000040)!important;border:1px solid #ebf7ff70!important;border-radius:20px!important;box-shadow:inset 0 1px 0 #ffffffa0,0 8px 20px #0006!important;max-width:calc(100vw - 260px)!important}
html body.stadium-arena #pilotCard#pilotCard{right:20px!important;left:auto!important;top:426px!important;width:176px!important;padding:12px!important;gap:10px!important;border-radius:20px!important;background:linear-gradient(145deg,#ffffff1f,#ffffff05 45%,#00000040)!important;border:1px solid #ebf7ff96!important;box-shadow:inset 0 1px 0 #ffffffa0,0 12px 30px #0006!important;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
html body.stadium-arena #pilotCard#pilotCard .pilotBadge{width:44px!important}
@media(max-width:900px){html body.stadium-arena #pilotCard#pilotCard{top:482px!important;width:146px!important;right:12px!important}}
@media(max-width:650px){html body.stadium-arena:not(.playing) #pilotCard#pilotCard{display:none!important}}
@media(max-height:620px) and (orientation:landscape){html body.stadium-arena #pilotCard#pilotCard{display:none!important}html body.stadium-arena:not(.playing) #menu#menu#menu.f1-glass{top:118px!important;max-height:calc(100vh - 118px - 150px)!important;padding:14px 16px!important}html body.stadium-arena #menu#menu#menu #introText{display:none!important}}
/* PiP panes: clear glass with a silver rim like every other bubble. Lime stays on the things you press. */
html body.stadium-arena .rotor-arena-badge.rotor-arena-badge,html body.stadium-arena .rotor-pilot-summary.rotor-pilot-summary,html body.stadium-arena .rotor-opponent-pip.rotor-opponent-pip,html body.stadium-arena #rotorOpponentGlass#rotorOpponentGlass{border:1px solid #ebf7ff96!important;background:linear-gradient(145deg,#ffffff1f,#ffffff05 45%,#00000040)!important;box-shadow:inset 0 1px 0 #ffffffa0,inset 0 -1px 0 #ffffff1f,0 15px 32px #0006!important;color:#e9eef2!important;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}

/* 15 · Silver wording: tracked labels are brushed silver. Yellow marks the headline accent, lime only what you press. */
html body :is(#menu .eyebrow,#menu #introText,.pilotInfo>small,.pilotInfo>span,.rotor-pilot-summary small,.rotor-opponent-pip small,#rotorOpponentGlass small,#mainMenu .f9-sub,#mainMenu .rotor25-player-line,.rotor-access-route .f2-route-label,.match-frame-status>span,.match-frame-status>small,#f9Sub){background:linear-gradient(180deg,#ffffff 0%,#dfe7ee 38%,#9aa8b4 52%,#eef3f7 70%,#c3ced8 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;color:#e9eef2!important;-webkit-text-fill-color:transparent!important;text-shadow:none!important}
html body :is(#mainMenu .f9-sub b,#mainMenu .rotor25-player-line b,#mainMenu .rotor25-player-line strong){-webkit-text-fill-color:#ffcf00!important}
html body :is(#mainMenu .f9-sub i,#mainMenu .rotor25-player-line i){-webkit-text-fill-color:initial!important}
/* Online lobby (FIND AN OPPONENT / ROOM CONTROLS) replaces the NIGHT COURT pane in the same lane; nothing underneath it. */
html body.stadium-arena.online-lobby-open #menu#menu#menu{visibility:hidden!important;pointer-events:none!important}
html body.stadium-arena .rotor-online-lobby.rotor-online-lobby.rotor-online-lobby{position:fixed!important;left:110px!important;top:150px!important;bottom:auto!important;right:auto!important;width:min(420px,calc(100vw - 300px))!important;max-height:calc(100vh - 150px - 160px)!important;overflow:auto!important;scrollbar-width:none;padding:20px!important;border-radius:26px!important;background:linear-gradient(160deg,#0a1322d9,#02060fe6)!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;border:1px solid #ebf7ff96!important;box-shadow:inset 0 1px 0 #ffffff80,0 24px 60px #000b!important;z-index:61!important}
html body.stadium-arena .rotor-online-lobby.rotor-online-lobby.rotor-online-lobby h2{font-size:clamp(28px,4vh,40px)!important;margin:10px 0!important}
@media(max-width:760px){html body.stadium-arena .rotor-online-lobby.rotor-online-lobby.rotor-online-lobby{left:12px!important;right:12px!important;width:auto!important;top:140px!important;max-height:calc(100vh - 140px - 150px)!important}}
/* Arena header: the wordmark starts right of the music chip's corner. */
html body.stadium-arena header .brand{margin-left:96px!important}
@media(max-width:640px){html body.stadium-arena header .brand{display:none!important}}
/* Dock never sits on the music chip's corner (the chip is 160px wide with its PLAY word). */
@media(min-width:761px){html body.rotor-access-ready.rotor-access-ready.rotor-access-ready .rotor-access-dock.rotor-access-dock{left:196px!important;right:16px!important;width:auto!important;max-width:calc(100vw - 212px)!important;transform:none!important;translate:none!important}}

/* 16 · Arena pre-match layout: one left pane (NIGHT COURT / lobby), one right column (players), controls at the bottom. */
html body.stadium-arena header .brand{display:none!important}
html body.stadium-arena:not(.playing) #f11Right{position:fixed;right:20px;top:150px;bottom:140px;width:176px;display:flex;flex-direction:column;gap:10px;overflow:auto;scrollbar-width:none;z-index:45;pointer-events:none;box-sizing:border-box}
html body.stadium-arena:not(.playing) #f11Right::-webkit-scrollbar{display:none}
html body.stadium-arena:not(.playing) #f11Right>*{position:static!important;inset:auto!important;transform:none!important;translate:none!important;margin:0!important;width:100%!important;max-width:none!important;flex:0 0 auto;pointer-events:auto;box-sizing:border-box!important;display:block!important;visibility:visible!important}
html body.stadium-arena:not(.playing) #f11Right>#pilotCard{display:flex!important}
html body.stadium-arena:not(.playing) #f11Right>.rotor-view-toggle{min-height:40px!important}
html body.stadium-arena.playing #f11Right{display:contents}
html body.stadium-arena:not(.playing) .stadium-match-tools.stadium-match-tools{bottom:124px!important;left:22px!important}
@media(max-width:900px){html body.stadium-arena:not(.playing) #f11Right{width:150px;right:12px}}
@media(max-width:650px){
  html body.stadium-arena header{top:90px!important;left:12px!important;right:12px!important}
  html body.stadium-arena .match-frame-status{display:none!important}
  html body.stadium-arena:not(.playing):not(.online-lobby-open):not(.searching) #menu#menu#menu.f1-glass{left:12px!important;top:160px!important;width:calc(100vw - 24px)!important;max-height:calc(100vh - 160px - 240px)!important;padding:16px 16px 12px!important}
  html body.stadium-arena:not(.playing) #f11Right{top:auto;bottom:66px;left:12px;right:12px;width:auto;height:150px;flex-direction:row;overflow:hidden}
  html body.stadium-arena:not(.playing) #f11Right>*{width:auto!important;flex:1 1 0;min-width:0}
  html body.stadium-arena:not(.playing) #f11Right>:is(#pilotCard,.rotor-view-toggle){display:none!important}
  html body.stadium-arena:not(.playing) #f11Right :is(.rotor-badge-stage){height:64px!important}
  html body.stadium-arena:not(.playing) #flightHud{display:none!important}
  html body.stadium-arena:not(.playing) .stadium-match-tools.stadium-match-tools{bottom:12px!important;left:12px!important}
}
@media(max-height:620px) and (orientation:landscape){
  html body.stadium-arena header{top:12px!important}
  html body.stadium-arena .match-frame-status{display:none!important}
  html body.stadium-arena:not(.playing):not(.online-lobby-open):not(.searching) #menu#menu#menu.f1-glass{left:12px!important;top:76px!important;width:300px!important;max-height:calc(100vh - 92px)!important;padding:12px 14px!important}
  html body.stadium-arena:not(.playing) #f11Right{top:76px;bottom:12px;right:12px;width:150px;height:auto;flex-direction:column}
  html body.stadium-arena:not(.playing) #f11Right>*{width:100%!important;flex:0 0 auto}
  html body.stadium-arena:not(.playing) #f11Right>#pilotCard{display:none!important}
  html body.stadium-arena:not(.playing) #flightHud{display:none!important}
  html body.stadium-arena:not(.playing) .stadium-match-tools.stadium-match-tools{left:330px!important;bottom:12px!important}
  html body.stadium-arena .rotor-online-lobby.rotor-online-lobby.rotor-online-lobby{left:12px!important;top:76px!important;width:min(420px,calc(100vw - 200px))!important;max-height:calc(100vh - 92px)!important;padding:14px!important}
}

/* 17 · HOME BASE control hints: every glyph with its word, glass chips under the headline. Touch devices get the touch stick hint. */
html body #f11Hints{display:none;position:static;margin:8px 0 10px;gap:6px;flex-wrap:wrap;max-width:none;pointer-events:none}
html body.f8-home:not(.f2-identity-studio):not(.rotor-access-panel-open):not(.emblem-editor-open):not(.club-center-open) #f11Hints{display:flex}
html body #f11Hints span{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 12px 0 6px;border-radius:15px;border:1px solid #ebf7ff70;background:linear-gradient(160deg,#ffffff1a,#ffffff05 45%,#00000055);box-shadow:inset 0 1px 0 #ffffff99,0 6px 16px #0006;font:700 9.5px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;color:#e9eef2;text-transform:uppercase;white-space:nowrap}
html body #f11Hints span b{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffffffcc,#9aa8b4 55%,#2a3340);box-shadow:inset 0 1px 1px #fff,0 1px 3px #000a;color:#0b0e12;font:900 9px/1 Inter,system-ui,sans-serif;letter-spacing:0}
html body #f11Hints span i{color:#b6ef3c;font-style:normal}
html body #f11Hints span[data-touch]{display:none}
@media(pointer:coarse){html body #f11Hints span[data-touch]{display:inline-flex}html body #f11Hints span[data-keys]{display:none}}
@media(max-height:520px),(max-width:480px){html body #f11Hints span{height:24px;font-size:8px;padding:0 9px 0 4px}html body #f11Hints span b{width:16px;height:16px;font-size:8px}}
html body.f8-home #mainMenu#mainMenu#mainMenu .cm-intro{display:none!important}
/* 18 · 3D press feedback on every glass control: lift on hover, sink and darken on press. */
html body :is(.rotor-access-route,nav.cm-view-rail button,nav.cm-view-rail summary,#mainMenu .cm-primary a,#final02Lane > a,#final02Lane > button,#menu button,.rotor-badge-actions button,.rotor-view-toggle,header .topActions > *,.f2-chip){transition:transform 160ms cubic-bezier(.2,.8,.2,1),box-shadow 160ms,filter 160ms}
html body :is(.rotor-access-route,nav.cm-view-rail button,nav.cm-view-rail summary,#mainMenu .cm-primary a,#final02Lane > a,#final02Lane > button,#menu button,.rotor-badge-actions button,.rotor-view-toggle,header .topActions > *):hover{transform:translateY(-1px);filter:brightness(1.12)}
html body :is(.rotor-access-route,nav.cm-view-rail button,nav.cm-view-rail summary,#mainMenu .cm-primary a,#final02Lane > a,#final02Lane > button,#menu button,.rotor-badge-actions button,.rotor-view-toggle,header .topActions > *,.f2-chip):active{transform:translateY(1px) scale(.985)!important;filter:brightness(.92);box-shadow:inset 0 2px 6px #000c,inset 0 -1px 0 #ffffff22!important}
/* 19 · Player Studio: gloss-black glass pane; the save note sits under the actions, never on a field. */
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio{background:linear-gradient(160deg,#1a2028e6 0%,#07090cf0 38%,#000000f2 100%)!important;border:1px solid #ebf7ff8c!important;box-shadow:inset 0 1px 0 #ffffff8c,inset 0 -1px 0 #ffffff14,inset 0 24px 40px -30px #ffffff40,0 30px 70px #000c!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:26px!important}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-status{position:static!important;order:99;margin:10px 0 0!important;padding:8px 10px!important;border-radius:10px;background:#ffffff0a;border:1px solid #ffffff14;font:500 10.5px/1.4 Inter,Arial,sans-serif!important;color:#c3ced8!important;white-space:normal!important}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio{display:flex!important;flex-direction:column}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio :is(button,select,input[type=text]){background:linear-gradient(160deg,#ffffff1f,#ffffff06 45%,#00000066)!important;border:1px solid #ebf7ff70!important;box-shadow:inset 0 1px 0 #ffffff99,inset 0 -1px 0 #00000080,0 6px 14px #0007!important;color:#e9eef2!important}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-save{background:linear-gradient(180deg,#ffe25a,#ffcf00 55%,#e0b400)!important;color:#141000!important;border-color:#fff2a0!important;box-shadow:inset 0 1px 0 #fff7c2,inset 0 -2px 0 #a07f00,0 8px 18px #0008!important}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-actions{position:static!important;bottom:auto!important;order:98;margin-top:14px!important}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio>*{flex:0 0 auto}

/* 21 · HOME BASE PiP: the world PiP carries a HOME BASE button (glyph + word). Shown on desktop and tablets; hidden while in HOME BASE. */
html body #rotorWorldView.f11-home-pip .rotor-view-window{position:relative}
html body #f11PipHome{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);z-index:5;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px 0 6px;border-radius:17px;border:1px solid #ebf7ff96;background:linear-gradient(160deg,#ffffff24,#ffffff08 45%,#00000066);box-shadow:inset 0 1px 0 #ffffffb0,0 8px 18px #000a;color:#e9eef2;font:800 10px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;white-space:nowrap;cursor:pointer}
html body #f11PipHome b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffffffcc,#9aa8b4 55%,#2a3340);box-shadow:inset 0 1px 1px #fff,0 1px 3px #000a;color:#0b0e12;font-size:11px}
html body #f11PipHome i{color:#b6ef3c;font-style:normal}
html body #f11PipHome:hover{filter:brightness(1.12);transform:translateX(-50%) translateY(-1px)}
@media(min-width:1000px) and (min-height:700px){
  html body:not(.stadium-arena):not(.f8-home):not(.f2-identity-studio) #rotorWorldView#rotorWorldView#rotorWorldView.rotor-view-pip{display:block!important;position:fixed!important;top:auto!important;left:auto!important;right:24px!important;bottom:164px!important;transform:none!important;width:min(340px,26vw)!important;max-height:calc(100vh - 164px - 130px)!important}
}

/* 22 · TAKE THE ROTOR: PLAY DUEL's twin in the lane (same rules via :is()). Hidden while you hold the rotor. */
html body #final02Lane#final02Lane#final02Lane #f11HomeBig{order:-1;cursor:pointer}
/* v17: the twin stays on the rotor screen as WATCH TOUR (see final08-ui.js §22) */
html body #final02Lane#final02Lane#final02Lane :is(#rotorSceneEnterArena,#f11HomeBig){min-width:200px}

/* 23 · Arena: header clears the chip corner; phone header may wrap to two rows; the PiP column always fits. */
@media(min-width:641px){html body.stadium-arena header{padding-left:184px!important}}
@media(max-width:650px){html body.stadium-arena:not(.playing):not(.online-lobby-open):not(.searching) #menu#menu#menu.f1-glass{top:206px!important;max-height:calc(100vh - 206px - 240px)!important}}
@media(max-height:620px) and (orientation:landscape){html body.stadium-arena:not(.playing):not(.online-lobby-open):not(.searching) #menu#menu#menu.f1-glass{top:92px!important;max-height:calc(100vh - 104px)!important}html body.stadium-arena:not(.playing) #f11Right{top:92px}}
@media(max-height:900px){html body.stadium-arena:not(.playing) #f11Right>#pilotCard{display:none!important}html body.stadium-arena:not(.playing) #f11Right .rotor-badge-stage{height:96px!important}html body.stadium-arena:not(.playing) #f11Right{bottom:132px}}
html body.stadium-arena:not(.playing) #f11Right>.rotor-view-toggle{display:inline-flex!important;align-items:center;justify-content:center}

/* 24 · Player Studio opens on the good stuff: COLOUR and ROTOR (rim, face, glow) first, then SHAPE / MATERIAL / MOTION, then NAME, PILOT, MATCH, WORLD, SOUND. */
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-fields{display:grid}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-fields>.f2-section:nth-child(5){order:1}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-fields>.f2-section:nth-child(7){order:2}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-fields>.f2-section:nth-child(2){order:3}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-fields>.f2-section:nth-child(3){order:4}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-fields>.f2-section:nth-child(4){order:5}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-fields>.f2-section:nth-child(1){order:6}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-fields>.f2-section:nth-child(6){order:7}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-fields>.f2-section:nth-child(8){order:8}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-fields>.f2-section:nth-child(9){order:9}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-fields>.f2-section:nth-child(10){order:10}
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .rotor-emblem-help{display:none!important}
@media(max-width:650px){html body.stadium-arena:not(.playing) #f11Right{bottom:66px!important;height:150px!important;top:auto!important}}
html body #f11Display{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:8px}
html body #f11Display>span{font:700 9px/1 Inter,system-ui,sans-serif;letter-spacing:.18em;color:#c3ced8;margin-right:4px}
html body #f11Display button{min-height:30px;padding:0 12px;border-radius:15px;border:1px solid #ebf7ff70;background:linear-gradient(160deg,#ffffff1a,#ffffff05 45%,#00000055);box-shadow:inset 0 1px 0 #ffffff99,0 4px 10px #0006;color:#e9eef2;font:700 9px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;cursor:pointer}
html body #f11Display button[aria-pressed=true]{background:linear-gradient(180deg,#d9ff8a,#b6ef3c)!important;color:#0d1402!important;border-color:#e4ffb0!important}

/* 26 · Controller status: the hint lights lime when a pad is live; a chip announces the pad for 5 s. */
html body #f11Hints span.on{border-color:#b6ef3cb0;box-shadow:inset 0 1px 0 #ffffff99,0 0 14px #b6ef3c66}
html body #f11Hints span.on b{background:radial-gradient(circle at 35% 30%,#ffffff,#b6ef3c 55%,#5c8a12)}
html body #f11PadChip{position:fixed;left:50%;top:12px;transform:translateX(-50%) translateY(-20px);z-index:1600;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px 0 6px;border-radius:17px;border:1px solid #b6ef3cb0;background:linear-gradient(160deg,#ffffff24,#ffffff08 45%,#00000080);box-shadow:inset 0 1px 0 #ffffffb0,0 10px 24px #000a,0 0 18px #b6ef3c55;color:#e9eef2;font:800 10px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;white-space:nowrap;opacity:0;transition:opacity 500ms,transform 500ms cubic-bezier(.22,.61,.36,1);pointer-events:none}
html body #f11PadChip.show{opacity:1;transform:translateX(-50%) translateY(0)}
html body #f11PadChip b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffffff,#b6ef3c 55%,#5c8a12);color:#0b0e12;font-size:11px}
html body #f11PadChip i{color:#b6ef3c;font-style:normal}
html body #f11PadChip[hidden]{display:none!important}
/* 27 · Mid desktop, short (zoomed Chrome ~1000×570): one compact row of primaries, the lane keeps PLAY DUEL + TRAINING only. */
@media(min-width:761px) and (max-height:640px){
  html body #final02Lane#final02Lane#final02Lane #f11HomeBig{display:none!important}
  html body #mainMenu#mainMenu#mainMenu{width:min(400px,34vw)!important;max-width:min(400px,34vw)!important}
  html body #mainMenu#mainMenu#mainMenu .cm-primary a{min-width:0!important;padding:0 12px!important;font-size:10px!important}
  html body #mainMenu#mainMenu#mainMenu h1{font-size:clamp(28px,4.6vh,44px)!important}
  html body #f11Hints span{height:24px;font-size:8px}
}
/* Studio footer is part of the flow (the sticky footer hid the fields on short panes). */
html body.f2-identity-studio #rotor25EmblemPanel#rotor25EmblemPanel#rotor25EmblemPanel.f2-studio .f2-footer{position:static!important;order:100;margin:12px 0 0!important;padding:0!important;background:none!important}

/* 28 · v13 · TAKE THE ROTOR is the main screen. Every menu stays: headline frame, CREATE PLAYER / PLAYER VS PLAYER, PLAY DUEL +
   TRAINING lane, top dock, rail (with WATCH TOUR), hints, music chip. No mid-court button, no one-line hint. */
html body.try-racket.try-racket.try-racket #mainMenu#mainMenu#mainMenu{display:block!important;opacity:1!important;visibility:visible!important}
html body.try-racket.try-racket.try-racket #mainMenu#mainMenu#mainMenu .cm-primary{display:flex!important}
html body.try-racket.try-racket.try-racket #final02Lane#final02Lane#final02Lane{display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important}
html body.try-racket.try-racket.try-racket nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail{display:flex!important}
html body.try-racket.try-racket.try-racket .cm-header.cm-header.cm-header.cm-header{display:flex!important}
html body.try-racket #cmRacketHint#cmRacketHint#cmRacketHint{display:none!important}
html body.try-racket #cmRacketControl#cmRacketControl#cmRacketControl{position:static!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important}
@media (max-width:760px){html body.try-racket.try-racket.try-racket .cm-header.cm-header.cm-header.cm-header{display:none!important}}
/* 29 · v13 · The TOUR PiP: clear glass, bottom right above the lane, only while you hold the rotor (the full-screen tour needs no PiP).
   ≥1000×700 desktop 340 px · 768–999 wide tablets 220 px · phones and short windows: the rail's WATCH TOUR instead. */
html body:not(.stadium-arena):not(.f8-home) #rotorWorldView#rotorWorldView#rotorWorldView#rotorWorldView.rotor-view-pip{display:none!important}
@media(min-width:1000px) and (min-height:700px){
  html body.f8-home.f8-home:not(.f2-identity-studio):not(.rotor-access-panel-open):not(.club-center-open):not(.emblem-editor-open) #rotorWorldView#rotorWorldView#rotorWorldView#rotorWorldView.rotor-view-pip{display:block!important;position:fixed!important;top:auto!important;left:auto!important;right:24px!important;bottom:164px!important;transform:none!important;width:min(340px,26vw)!important;max-height:calc(100vh - 164px - 130px)!important}
}
@media(min-width:768px) and (max-width:999px) and (min-height:700px){
  html body.f8-home.f8-home:not(.f2-identity-studio):not(.rotor-access-panel-open):not(.club-center-open):not(.emblem-editor-open) #rotorWorldView#rotorWorldView#rotorWorldView#rotorWorldView.rotor-view-pip{display:block!important;position:fixed!important;top:auto!important;left:auto!important;right:20px!important;bottom:150px!important;transform:none!important;width:220px!important;max-height:calc(100vh - 150px - 130px)!important}
}
html body #rotorWorldView.rotor-view-pip:not(.expanded) .pip-world-actions{display:none!important}
html body #rotorWorldView.rotor-view-pip header .pip-beat{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:800 10px/1 Inter,system-ui,sans-serif;letter-spacing:.16em;color:#ffcf00;text-transform:uppercase;text-shadow:0 1px 2px #000c}
html body #rotorWorldView.rotor-view-pip header .pip-beat:empty{display:none}
html body #rotorWorldView.rotor-view-pip header{position:relative}
html body #rotorWorldView.rotor-view-pip[data-tour-beat] header::before{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:1px;background:linear-gradient(90deg,#ffcf00 0,#ffcf00 calc(var(--pip-prog,0)*100%),#ffffff22 calc(var(--pip-prog,0)*100%));pointer-events:none}
html body #rotorWorldView.rotor-view-pip header select{max-width:118px}
html body.f8-home #f11PipHome b{font-size:10px}
/* 30 · v13 · 761–899 wide: the rotor-screen hint chips must not widen the menu into the PLAY lane (lane = 327 px at right:24). */
@media(min-width:761px) and (max-width:899px){
  html body #mainMenu#mainMenu#mainMenu#mainMenu.cm-main{width:min(460px,calc(100vw - 400px))!important;max-width:calc(100vw - 400px)!important}
  html body #final02Lane#final02Lane#final02Lane#final02Lane #f11HomeBig{display:none!important} /* the rail carries TAKE THE ROTOR here; the lane stays 327 px */
  html body.f8-home #f11Hints{max-width:100%}
}
/* The host chip docks exactly over the page's music bubble: the bubble stays (it draws the song progress ring), the chip is the one control. */
html body.f13-hosted:not(.rotor36-music-open) #pfDeck#pfDeck#pfDeck#pfDeck#pfDeck[data-f2-bubble]{pointer-events:none!important}
/* 31 · v13 · Live match: the RACKET CAM bubble keeps ONE header row (it wrapped to four rows and climbed into the match PiP),
   and its toggle hides while the bubble is open (the bubble has its own close). Bubble = 8+32+6+136+8 = 190 px, the height the
   match PiP's width formula in final01-pips.css already assumes. */
html body.stadium-arena.playing #rotorRacketView#rotorRacketView#rotorRacketView.f1-bubble-pip header{display:flex!important;flex-wrap:nowrap!important;align-items:center;gap:6px!important;margin:0 0 6px!important;padding:0!important;height:32px!important;overflow:hidden}
html body.stadium-arena.playing #rotorRacketView#rotorRacketView#rotorRacketView.f1-bubble-pip header select{flex:1 1 40px!important;width:auto!important;min-width:0!important;max-width:none!important;height:32px!important;min-height:32px!important;padding:0 8px!important;font-size:9px!important;letter-spacing:1px!important}
html body.stadium-arena.playing #rotorRacketView#rotorRacketView#rotorRacketView.f1-bubble-pip header button{flex:0 0 32px!important;width:32px!important;height:32px!important;min-height:32px!important;padding:0!important}
html body.stadium-arena.playing #f11Right>.f1-bubble-toggle.f1-bubble-toggle[aria-expanded="true"],html body.stadium-arena.playing .f1-bubble-toggle.f1-bubble-toggle.f1-bubble-toggle[aria-expanded="true"]{display:none!important}
/* 32 · v13 · PAUSE: one black glass pane, every button a black glass bubble, centred, always inside the screen.
   While paused the match HUD, touch pad and tools tuck away, so nothing sits under or between the bubbles. */
html body #resumePanel#resumePanel#resumePanel{position:fixed!important;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;
  width:min(440px,calc(100vw - 32px))!important;max-width:calc(100vw - 32px)!important;max-height:calc(100dvh - 32px)!important;overflow:auto!important;
  box-sizing:border-box!important;padding:clamp(18px,3vh,30px) clamp(18px,3vw,28px)!important;display:flex!important;flex-direction:column!important;gap:clamp(8px,1.6vh,14px)!important;
  border-radius:26px!important;border:1px solid #ffffff3d!important;
  background:linear-gradient(165deg,#15181cf2 0%,#07090bf7 45%,#000000fa 100%)!important;
  -webkit-backdrop-filter:blur(14px)!important;backdrop-filter:blur(14px)!important;
  box-shadow:inset 0 1px 0 #ffffff59,inset 0 -1px 0 #ffffff0f,0 30px 70px #000d!important;z-index:700!important}
html body #resumePanel#resumePanel#resumePanel h2{margin:0 0 clamp(4px,1vh,10px)!important;text-align:center!important;font:800 clamp(26px,5vh,40px)/1 'Barlow Condensed',Inter,system-ui,sans-serif!important;letter-spacing:.12em!important;color:#f4f7fa!important;text-shadow:0 2px 10px #000!important}
html body #resumePanel#resumePanel#resumePanel :is(button,a.f3-studio-link){display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;width:100%!important;min-height:clamp(42px,6.4vh,52px)!important;margin:0!important;
  padding:0 20px!important;border-radius:999px!important;border:1px solid #ebf7ff66!important;cursor:pointer!important;text-decoration:none!important;
  background:linear-gradient(170deg,#ffffff24 0%,#ffffff08 46%,#00000088 100%)!important;box-shadow:inset 0 1px 0 #ffffffb3,inset 0 -1px 0 #0000008c,0 8px 18px #0009!important;
  color:#f2f6f9!important;font:800 clamp(11px,1.6vh,13px)/1 Inter,system-ui,sans-serif!important;letter-spacing:.18em!important;text-transform:uppercase!important}
html body #resumePanel#resumePanel#resumePanel :is(button,a.f3-studio-link):is(:hover,:focus-visible){border-color:#ffffffb3!important;filter:brightness(1.18)!important;outline:none!important}
html body #resumePanel#resumePanel#resumePanel #resume{background:linear-gradient(170deg,#e2ff9e,#b6ef3c 55%,#a6dc45)!important;color:#101706!important;border-color:#e8ffb8!important;box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #6e9a2a,0 8px 18px #0009!important;font-size:clamp(13px,1.9vh,15px)!important}
html body #resumePanel#resumePanel#resumePanel .f3-studio-link span{color:#b6ef3c}
/* paused: the HUD and touch pad tuck away so the menu is the only thing on the court */
html body:has(#resumePanel:not([hidden])) :is(#flightHud,details.stadium-match-tools,#touch,#stadiumPointStrip,.repair-skip,.match-frame-status,.f1-coach,.f1-beat,#rotorRacketView,#rotorMatchView){visibility:hidden!important;pointer-events:none!important}
/* 32b · v13 · hidden always wins: BACK TO COURT / RESUME must take the pause pane away. */
html body #resumePanel#resumePanel#resumePanel[hidden]{display:none!important;visibility:hidden!important;pointer-events:none!important}
html body #d22Result#d22Result[hidden]{display:none!important}
html body #opponentPull#opponentPull[hidden]{display:none!important}
/* 33 · v13 · Arena top rows under 1000 px wide: the scoreboard wraps under the dock, so the LIVE chip and the
   FIND AN OPPONENT / READY UP row cannot share that band. Pre-match: the cards carry the score, so the header score hides.
   Playing: the pre-match row hides (it is not a match control). The LIVE chip hides at these widths. */
@media(max-width:999px){
  html body.stadium-arena.rotor-match-frame .match-frame-status.match-frame-status{display:none!important}
  html body.stadium-arena.playing header.f02-head,html body.stadium-arena.playing .match-frame-ready,html body.stadium-arena.playing .match-frame-opponent{display:none!important}
  html body.stadium-arena:not(.playing) #scoreboard#scoreboard{display:none!important}
}

/* 34 · v14 · Match UI in one language (black glass panes, glass bubbles, glyph + word), simple like a console game, never busy. */
html body .f1-coach.f1-coach{left:50%!important;translate:-50% 0!important;width:min(600px,calc(100vw - 28px))!important;padding:14px 16px!important;border-radius:22px!important;border:1px solid #ffffff3d!important;
  background:linear-gradient(165deg,#15181cf2 0%,#07090bf7 45%,#000000fa 100%)!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 1px 0 #ffffff59,0 24px 60px #000c!important}
html body .f1-coach .f1-step{border-radius:16px!important;border:1px solid #ebf7ff40!important;background:linear-gradient(170deg,#ffffff14,#ffffff05 46%,#00000066)!important;box-shadow:inset 0 1px 0 #ffffff66!important}
html body .f1-coach .f1-step[data-live=true]{border-color:#b6ef3c!important;box-shadow:inset 0 1px 0 #ffffff99,0 0 0 1px #b6ef3c55!important}
html body .f1-coach .f1-step[data-done=true] i{background:linear-gradient(180deg,#e2ff9e,#b6ef3c 55%,#a6dc45)!important;color:#101706!important;border-color:#e8ffb8!important}
html body .f1-coach .f1-step b{font-size:18px!important;letter-spacing:.06em!important}
html body .f1-coach .f1-step span{font:600 10px/1.3 Inter,system-ui,sans-serif!important;letter-spacing:.08em!important;color:#c3ced8!important}
html body .f1-coach .f1-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;font:600 10.5px/1.3 Inter,system-ui,sans-serif;letter-spacing:.06em;color:#9aa6b2}
html body .f1-coach .f1-foot b{color:#ffcf00}
html body .f1-coach .f1-foot button{min-height:34px!important;padding:0 16px!important;border-radius:17px!important;border:1px solid #e8ffb8!important;background:linear-gradient(180deg,#e2ff9e,#b6ef3c 55%,#a6dc45)!important;color:#101706!important;font:800 11px/1 Inter,system-ui,sans-serif!important;letter-spacing:.14em!important}
html body .f1-beat{font-family:'Barlow Condensed',Inter,sans-serif!important;letter-spacing:.08em!important;text-shadow:0 2px 12px #000!important}
/* point recap: same pane, yellow result, tabular numbers */
html body #stadiumPointStrip#stadiumPointStrip{border-radius:18px!important;border:1px solid #ffffff3d!important;background:linear-gradient(165deg,#15181cf2 0%,#07090bf7 45%,#000000fa 100%)!important;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 #ffffff59,0 18px 44px #000c!important;color:#e9eef2!important;font-variant-numeric:tabular-nums}
html body #stadiumPointStrip#stadiumPointStrip :is(b,strong,.sr-point-result b){color:#ffcf00!important}
html body #stadiumPointStrip#stadiumPointStrip dt{color:#9aa6b2!important;letter-spacing:.16em!important;text-transform:uppercase!important;font-size:9px!important}
html body #stadiumPointStrip#stadiumPointStrip :is(button,a){border-radius:999px!important;border:1px solid #ebf7ff66!important;background:linear-gradient(170deg,#ffffff24,#ffffff08 46%,#00000088)!important;color:#f2f6f9!important;box-shadow:inset 0 1px 0 #ffffffb3,0 6px 14px #0009!important;font:800 10px/1 Inter,system-ui,sans-serif!important;letter-spacing:.14em!important}
/* flight HUD: one slim row of facts, pane language; the big telemetry labels shrink */
@media(pointer:fine){html body.stadium-arena.playing footer#flightHud#flightHud{height:auto!important;min-height:0!important;padding:8px 14px!important;border-radius:16px!important;border:1px solid #ffffff2e!important;background:linear-gradient(165deg,#15181cd9 0%,#07090be6 45%,#000000ee 100%)!important;box-shadow:inset 0 1px 0 #ffffff40,0 12px 30px #000a!important;display:flex!important;flex-wrap:wrap;align-items:center;gap:6px 18px;left:22px!important;right:auto!important;max-width:min(560px,calc(100vw - 44px))!important}
  html body.stadium-arena.playing footer#flightHud#flightHud .flightTelemetry{position:static!important;display:flex;align-items:baseline;gap:8px;min-width:0}
  html body.stadium-arena.playing footer#flightHud#flightHud small{font:700 9px/1 Inter,system-ui,sans-serif!important;letter-spacing:.16em!important;color:#9aa6b2!important}
  html body.stadium-arena.playing footer#flightHud#flightHud :is(span,strong){font:800 13px/1 'Barlow Condensed',Inter,sans-serif!important;letter-spacing:.04em!important;color:#f2f6f9!important}
  html body.stadium-arena.playing footer#flightHud#flightHud .boost{position:static!important;width:120px!important;height:4px!important;border-radius:2px!important}
  html body.stadium-arena.playing footer#flightHud#flightHud .session{position:static!important;max-width:none!important;display:flex;gap:12px;flex-wrap:wrap}
}

/* 35 · v15 · The TOUR PiP shows by default on every desktop / tablet size (Joey: "not showing the tour by default").
   ≥1000×700: 340 px (§29) · otherwise, from 761 px wide and 521 px tall: a 230 px bubble above the lane. Phones keep the rail's WATCH TOUR. */
@media(min-width:761px) and (min-height:521px) and (not ((min-width:1000px) and (min-height:700px))){
  html body.f8-home.f8-home:not(.f2-identity-studio):not(.rotor-access-panel-open):not(.club-center-open):not(.emblem-editor-open) #rotorWorldView#rotorWorldView#rotorWorldView#rotorWorldView.rotor-view-pip{display:block!important;position:fixed!important;top:auto!important;left:auto!important;right:24px!important;bottom:154px!important;transform:none!important;width:230px!important;max-height:calc(100vh - 154px - 90px)!important;padding:6px!important}
  html body.f8-home #rotorWorldView#rotorWorldView header select{max-width:96px}
  html body.f8-home #f11PipHome{height:28px;font-size:9px;padding:0 10px 0 5px;bottom:6px}
}
/* 36 · v15 · Primary actions never dim (Joey: "dim buttons"): PLAY DUEL, TRAINING, TAKE THE ROTOR, WATCH TOUR, the rail and the
   tour PiP stay at full strength on idle. The rail sits above the lane and the PiP so WATCH TOUR is never covered. */
html body.f8-idle.f8-idle.f8-idle:not(.playing) :is(#final02Lane,#final02Lane *,nav.cm-view-rail,nav.cm-view-rail *,#cmRacketControl,#f11HomeBig,#f11PipHome,.rotor-view-pip){opacity:1!important;transform:none!important;filter:none!important}
html body.f8-idle.f8-idle.f8-idle:not(.playing) #mainMenu#mainMenu#mainMenu .cm-primary{opacity:1!important}
html body.f8-idle.f8-idle.f8-idle:not(.playing) .rotor-access-dock{opacity:.6!important}
html body:not(.stadium-arena) nav.cm-view-rail.cm-view-rail.cm-view-rail{z-index:1600!important}
html body:not(.stadium-arena) #final02Lane#final02Lane#final02Lane{z-index:1500!important}
html body:not(.stadium-arena) #rotorWorldView#rotorWorldView.rotor-view-pip{z-index:1400!important}

/* 37 · v15 · GTA lines inside the TOUR PiP: lime kicker, white + yellow headline, slow materialise on every beat. */
html body #rotorWorldView .pip-gta{position:absolute;left:12px;top:10px;right:12px;z-index:4;pointer-events:none;display:grid;gap:3px;text-shadow:0 1px 2px #000e,0 0 18px #0009}
html body #rotorWorldView .pip-gta i{font:700 8px/1 Inter,system-ui,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#b6ef3c;font-style:normal}
html body #rotorWorldView .pip-gta b{font:800 clamp(13px,1.4vw,18px)/.95 'Barlow Condensed',Inter,sans-serif;letter-spacing:.03em;text-transform:uppercase;color:#fff;text-wrap:balance}
html body #rotorWorldView .pip-gta b em{font-style:normal;color:#ffcf00}
html body #rotorWorldView.expanded .pip-gta i{font-size:10px}
html body #rotorWorldView.expanded .pip-gta b{font-size:clamp(22px,2.4vw,34px)}
@media(prefers-reduced-motion:no-preference){html body #rotorWorldView .pip-gta.in{animation:f15gta 900ms cubic-bezier(.22,.61,.36,1) both}@keyframes f15gta{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}}

/* 38 · v17 · Rotor screen chrome reads at a glance: rail buttons in solid black glass (no ghosting over the 3D text), the PiP
   button never clips, the lane twin is WATCH TOUR here. */
html body.f8-home nav.cm-view-rail.cm-view-rail.cm-view-rail :is(button,summary,a){background:linear-gradient(170deg,#1a1e24f2,#07090bf7 55%,#000000fa)!important;border-color:#ffffff4d!important;color:#f2f6f9!important;opacity:1!important;box-shadow:inset 0 1px 0 #ffffff59,0 10px 24px #000b!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html body.f8-home nav.cm-view-rail.cm-view-rail.cm-view-rail #cmRacketControl{border-color:#e8ffb8!important;color:#101706!important;background:linear-gradient(180deg,#e2ff9e,#b6ef3c 55%,#a6dc45)!important;font-weight:800!important}
html body #f11PipHome{max-width:calc(100% - 16px)!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box}
html body #final02Lane#final02Lane#final02Lane #f11HomeBig[data-mode=tour]{background:linear-gradient(170deg,#1a1e24f2,#07090bf7 55%,#000000fa)!important;color:#f2f6f9!important;border-color:#ffffff66!important}
html body #final02Lane#final02Lane#final02Lane #f11HomeBig[data-mode=tour] .f2-pill-sub{color:#b6ef3c!important}

/* 39 · v17 · Every control on the rotor screen is solid and legible: menu primaries, TRAINING, dock routes, chip. PLAY DUEL stays yellow. */
html body.f8-home #mainMenu#mainMenu#mainMenu .cm-primary :is(a,button),html body.f8-home #final02Lane#final02Lane#final02Lane #rotorSceneTraining,html body.f8-home .rotor-access-dock.rotor-access-dock :is(.rotor-access-route,a,button,summary){background:linear-gradient(170deg,#1a1e24f2,#07090bf7 55%,#000000fa)!important;border-color:#ffffff4d!important;color:#f2f6f9!important;opacity:1!important;box-shadow:inset 0 1px 0 #ffffff59,0 10px 24px #000b!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;text-shadow:none!important}
html body.f8-home #mainMenu#mainMenu#mainMenu .cm-primary .cm-player-create{border-color:#e8ffb8!important;color:#b6ef3c!important}
html body.f8-home.f8-idle .rotor-access-dock{opacity:1!important}
html body.f8-home #f11Hints span{opacity:1!important}
/* 40 · v19 · The WATCH TOUR lane twin reads: white label, lime sub, on the black glass. (The pill's own rule painted the label dark.) */
html body #final02Lane#final02Lane#final02Lane #f11HomeBig[data-mode=tour] .f2-pill-label,html body #final02Lane#final02Lane#final02Lane #f11HomeBig[data-mode=tour]{color:#ffffff!important;text-shadow:0 1px 2px #000c!important}
html body #final02Lane#final02Lane#final02Lane #f11HomeBig[data-mode=tour] .f2-pill-sub{color:#b6ef3c!important;opacity:1!important}
html body #final02Lane#final02Lane#final02Lane #f11HomeBig[data-mode=tour]{border:1px solid #b6ef3caa!important;box-shadow:inset 0 1px 0 #ffffff66,0 0 0 1px #b6ef3c33,0 10px 24px #000b!important}
/* 41 · v20 · Rotor screen headline: THIS IS (white) / YOUR RETURN. (light bright green) — Joey 2026-10-15 18:06; restored 23:44 ('return this'). */
html body.f8-home #mainMenu#mainMenu#mainMenu h1 em,html body.f8-home #mainMenu#mainMenu#mainMenu .cm-main h1 em{color:#d4ff7a!important;text-shadow:0 0 18px #b6ef3c55,0 1px 2px #000c!important}


/* 42 · v23 · CONTROL RING around the held rotor: two concentric glass arcs that slowly turn, four callouts on the compass points,
   DRAG TO TURN on the upper arc. Black glass tags, white words, lime keys; a tag lights lime once you use it. Replaces the hint chips here. */
html body #f11Ring{position:fixed;left:var(--rx,50%);top:var(--ry,60%);width:0;height:0;z-index:1450;pointer-events:none}
html body #f11Ring .r-arc{position:absolute;left:calc(var(--r) * -1);top:calc(var(--r) * -1);width:calc(var(--r) * 2);height:calc(var(--r) * 2);border-radius:50%;border:1px solid #ffffff66;border-top-color:#b6ef3c;border-bottom-color:#b6ef3c99;box-shadow:0 0 24px #b6ef3c22,inset 0 0 24px #ffffff0d}
html body #f11Ring .r-arc2{left:calc(var(--r) * -.82);top:calc(var(--r) * -.82);width:calc(var(--r) * 1.64);height:calc(var(--r) * 1.64);border-color:#ffffff33;border-left-color:#ffffffaa;border-right-color:#ffffffaa}
@media(prefers-reduced-motion:no-preference){html body #f11Ring .r-arc{animation:f11spin 14s linear infinite}html body #f11Ring .r-arc2{animation:f11spin 22s linear infinite reverse}@keyframes f11spin{to{transform:rotate(360deg)}}}
html body #f11Ring .r-tag{position:absolute;display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:7px;align-items:center;padding:6px 11px 6px 6px;border-radius:14px;border:1px solid #ffffff3d;background:linear-gradient(165deg,#15181cf2 0%,#07090bf7 45%,#000000fa 100%);box-shadow:inset 0 1px 0 #ffffff59,0 10px 24px #000b;color:#f2f6f9;font:800 10.5px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;white-space:nowrap;transform:translate(-50%,-50%)}
html body #f11Ring .r-tag b{grid-row:1/3;display:grid;place-items:center;min-width:26px;height:26px;padding:0 6px;border-radius:8px;background:linear-gradient(180deg,#e2ff9e,#b6ef3c 55%,#a6dc45);color:#101706;font:900 11px/1 Inter,system-ui,sans-serif;letter-spacing:0;box-shadow:inset 0 1px 0 #fff,0 1px 3px #000a}
html body #f11Ring .r-tag em{display:none}
html body #f11Ring .r-tag small{display:block;margin-top:3px;font:600 8px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;color:#9aa6b2}
html body #f11Ring .r-tag.lit{border-color:#b6ef3c;box-shadow:inset 0 1px 0 #ffffff99,0 0 0 1px #b6ef3c55,0 10px 24px #000b}
html body #f11Ring .r-tag.lit small{color:#b6ef3c}
html body #f11Ring .r-n{left:0;top:calc(var(--r) * -1 - 26px)}
html body #f11Ring .r-s{left:0;top:calc(var(--r) * 1 + 26px)}
html body #f11Ring .r-w{left:calc(var(--r) * -1 - 70px);top:0}
html body #f11Ring .r-e{left:calc(var(--r) * 1 + 70px);top:0}
html body #f11Ring .r-turn{left:calc(var(--r) * .78);top:calc(var(--r) * -.78);transform:translate(-20%,-70%)}
html body.f8-home #f11Hints{display:none!important}
@media(max-width:760px),(max-height:520px){html body #f11Ring{display:none!important}html body.f8-home:not(.f2-identity-studio):not(.rotor-access-panel-open):not(.emblem-editor-open):not(.club-center-open) #f11Hints{display:flex!important}}
/* 43 · (removed in v27: Joey did not want the separate brand chip) */

/* 44 · v27 · The trophy landing is a PiP (Joey: users always see the main screen with the rotor). Top-right glass pane, under the dock,
   above the TOUR PiP's slot; its own WebGL stage keeps rendering inside; slabs / hint / credit / brand hidden (the main screen has the real buttons). */
html body.final02-landing-pip #cinematicEntry#cinematicEntry{position:fixed!important;inset:auto!important;right:24px!important;top:78px!important;left:auto!important;bottom:auto!important;width:min(340px,26vw)!important;height:auto!important;aspect-ratio:16/10;z-index:1300!important;border-radius:22px;overflow:hidden;border:1px solid #ebf7ff96;box-shadow:inset 0 1px 0 #ffffffb3,inset 0 -1px 0 #e9eef233,0 22px 48px #00000080;background:#000!important;pointer-events:none!important;transition:opacity 900ms cubic-bezier(.22,.61,.36,1)}
html body.final02-landing-pip #cinematicEntry#cinematicEntry :is(.cinematic-entry-actions,.f2-hint,.f2-credit,.cinematic-brand,.ce-stars){display:none!important}
html body.final02-landing-pip #cinematicEntry#cinematicEntry #final02Stage{position:absolute;inset:0}
html body.final02-landing-pip #cinematicEntry#cinematicEntry #final02Stage canvas{width:100%!important;height:100%!important;display:block}
html body.final02-landing-pip #cinematicEntry#cinematicEntry .cinematic-entry-bottom{position:absolute!important;left:12px!important;right:12px!important;bottom:10px!important;display:block!important;gap:0!important}
html body.final02-landing-pip #cinematicEntry#cinematicEntry .cinematic-copy p{font:800 clamp(14px,1.3vw,19px)/.95 'Barlow Condensed',Inter,sans-serif!important;letter-spacing:.03em!important;margin:0 0 4px!important;text-transform:uppercase;color:#fff;text-shadow:0 1px 2px #000e}
html body.final02-landing-pip #cinematicEntry#cinematicEntry .cinematic-copy p em{color:#ffcf00;font-style:normal}
html body.final02-landing-pip #cinematicEntry#cinematicEntry .cinematic-copy>span{font:700 8px/1 Inter,system-ui,sans-serif!important;letter-spacing:.18em!important;text-transform:uppercase;color:#b6ef3c!important}
html body.final02-landing-pip.final02-landing-leaving #cinematicEntry#cinematicEntry{opacity:0}
/* in PiP mode the rotor screen chrome is fully present underneath */
html body.final02-landing-pip.final02-landing #mainMenu#mainMenu#mainMenu,html body.final02-landing-pip.final02-landing #final02Lane#final02Lane#final02Lane,html body.final02-landing-pip.final02-landing nav.cm-view-rail.cm-view-rail.cm-view-rail{display:flex!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important}
html body.final02-landing-pip.final02-landing #mainMenu#mainMenu#mainMenu{display:block!important}
html body.final02-landing-pip.final02-landing #mainMenu#mainMenu#mainMenu .cm-primary{display:flex!important}

/* 46 · circuit-06: the #f11Sticks readout is retired — the permanent pads in circuit-sticks.css replace it. */
/* the whole rotor-screen chrome steps aside while the idents play (REPLAY OPENING) */
html body.three-hero-opening :is(#f11Sticks,#f11Ring,#rotorWorldView,#final02Lane,nav.cm-view-rail,#mainMenu){display:none!important}
/* 47 · v27 · The chrome stays subdued on the rotor screen (Joey: "UI stays dimmed, not the focus"); while attentive it shrinks a step. */
html body.f8-home:not(.playing) :is(#mainMenu,.rotor-access-dock,nav.cm-view-rail,#rotorWorldView,#f11Ring,#f11Sticks){opacity:.72!important;transition:opacity 500ms cubic-bezier(.22,.61,.36,1),transform 500ms cubic-bezier(.22,.61,.36,1)}
html body.f8-home:not(.playing) #final02Lane{opacity:.9!important;transition:opacity 500ms cubic-bezier(.22,.61,.36,1),transform 500ms cubic-bezier(.22,.61,.36,1)}
html body.f8-home.f8-attentive:not(.playing) #mainMenu#mainMenu#mainMenu{transform:scale(.9)!important;transform-origin:left bottom!important;opacity:.55!important}
html body.f8-home.f8-attentive:not(.playing) #final02Lane#final02Lane#final02Lane{transform:scale(.9)!important;transform-origin:right bottom!important;opacity:.75!important}
html body.f8-home.f8-attentive:not(.playing) nav.cm-view-rail.cm-view-rail{opacity:.5!important}
html body.f8-home.f8-attentive:not(.playing) .rotor-access-dock{opacity:.4!important}
html body.f8-home.f8-attentive:not(.playing) #rotorWorldView#rotorWorldView{transform:scale(.92)!important;transform-origin:right bottom!important;opacity:.6!important}
html body.f8-home.f8-attentive:not(.playing) #f11Ring .r-tag{opacity:.55}
html body.f8-home :is(#mainMenu,#final02Lane,nav.cm-view-rail,.rotor-access-dock,#rotorWorldView):is(:hover,:focus-within){opacity:1!important;transform:none!important}

/* 48 · v29 · NIGHT COURT venue badge: chrome lettering with a stacked extrusion (depth), lime hairline, yellow COURT. Rotor screen only. */
html body #f11Venue{display:none;position:fixed;left:50%;top:76px;transform:translateX(-50%);z-index:1380;pointer-events:none;text-align:center;filter:drop-shadow(0 18px 30px #000c)}
html body.f8-home:not(.three-hero-opening):not(.f2-identity-studio):not(.rotor-access-panel-open):not(.club-center-open):not(.emblem-editor-open) #f11Venue{display:grid;justify-items:center;gap:2px}
html body #f11Venue small{font:700 9px/1 Inter,system-ui,sans-serif;letter-spacing:.3em;color:#b6ef3c;text-shadow:0 1px 2px #000c}
html body #f11Venue b{display:flex;gap:.18em;font:800 clamp(34px,4.2vw,58px)/1 'Barlow Condensed',Impact,sans-serif;letter-spacing:.06em;text-transform:uppercase;transform:perspective(900px) rotateX(14deg);transform-origin:center bottom}
html body #f11Venue b span{background:linear-gradient(180deg,#ffffff 0%,#dfe7ee 38%,#9aa8b4 52%,#eef3f7 70%,#c3ced8 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 1px 0 #6c7680,0 2px 0 #5a636c,0 3px 0 #4a525a,0 4px 0 #3b434a,0 5px 0 #2d343a,0 6px 0 #20262b,0 9px 14px #000b}
html body #f11Venue b em{font-style:normal;background:linear-gradient(180deg,#fff2a0 0%,#ffcf00 45%,#e0b400 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 1px 0 #a88900,0 2px 0 #8d7300,0 3px 0 #745f00,0 4px 0 #5c4b00,0 5px 0 #463900,0 6px 0 #302700,0 9px 14px #000b}
html body #f11Venue i{display:block;width:72%;height:2px;margin-top:6px;border-radius:1px;background:linear-gradient(90deg,transparent,#b6ef3c 30%,#ffffff 50%,#b6ef3c 70%,transparent)}
@media(prefers-reduced-motion:no-preference){
  html body.f8-home #f11Venue{animation:f11venueIn 1100ms cubic-bezier(.22,.61,.36,1) both}
  @keyframes f11venueIn{from{transform:translateX(-50%) translateY(-10px)}to{transform:translateX(-50%)}}
  html body #f11Venue i{animation:f11venueLine 6s ease-in-out infinite}
  @keyframes f11venueLine{0%,100%{opacity:.55}50%{opacity:1}}
}
@media(max-width:1199px){html body #f11Venue{top:122px}html body #f11Venue b{font-size:clamp(28px,3.6vw,40px)}}
@media(max-width:999px),(max-height:699px){html body #f11Venue{top:118px}}
@media(max-width:760px),(max-height:520px){html body #f11Venue{display:none!important}}
html body.f8-home.f8-attentive:not(.playing) #f11Venue{opacity:.8}
/* 49 · v29 · Centred chrome (Joey: "top one is old, goes too far left; should be centred top and bottom"): from 1200 px wide the
   dock is a compact centred pill (no empty left stretch) and the rail is centred under the court. Narrower windows keep the v12 layout. */
@media(min-width:1200px){
  html body:not(.stadium-arena) .rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock{left:50%!important;right:auto!important;width:auto!important;max-width:min(1180px,calc(100vw - 420px))!important;translate:-50% 0!important;transform:none!important;justify-content:center!important}
  html body:not(.stadium-arena) nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail{left:50%!important;right:auto!important;translate:-50% 0!important;transform:none!important;width:max-content!important;max-width:calc(100vw - 48px)!important} /* translate, not transform: base rules translateX(-50%) with left:12px */
}
/* 49b · v29 · the NIGHT COURT badge sits under the centred dock (dock 14–104 px on wide screens); the dock never dims on the rotor screen */
@media(min-width:1200px){html body #f11Venue{top:116px}}
html body.f8-home:not(.playing) .rotor-access-dock.rotor-access-dock.rotor-access-dock{opacity:1!important}

/* 50 · v29 · HOTSPOTS: flat lime circles (no glass) with two expanding motion rings each, the word under the circle in white, the input under it in lime.
   They ride the rotor (--rx/--ry) at radius --r. Hidden with the rest of the chrome during idents and panels. */
html body #f11Hot{position:fixed;left:var(--rx,50%);top:var(--ry,60%);width:0;height:0;z-index:1455}
html body #f11Hot .h-spot{position:absolute;width:0;height:0;margin:0;padding:0;border:0;background:none;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent;pointer-events:auto;outline:none}
html body #f11Hot .h-spot i{position:absolute;left:-24px;top:-24px;width:48px;height:48px;border-radius:50%;pointer-events:none}
html body #f11Hot .h-spot i:nth-child(1){background:#b6ef3c;opacity:.94;transition:transform 160ms cubic-bezier(.22,.61,.36,1),background 160ms}
html body #f11Hot .h-spot i:nth-child(2),html body #f11Hot .h-spot i:nth-child(3){border:2px solid #b6ef3c;opacity:0}
html body #f11Hot .h-spot::after{content:"";position:absolute;left:-30px;top:-30px;width:60px;height:60px;border-radius:50%} /* 60 px touch target */
html body #f11Hot .h-spot b{position:absolute;left:-70px;width:140px;top:30px;text-align:center;color:#fff;font:800 10.5px/1 Inter,system-ui,sans-serif;letter-spacing:.16em;text-shadow:0 1px 3px #000,0 0 12px #000a;pointer-events:none}
html body #f11Hot .h-spot small{position:absolute;left:-70px;width:140px;top:44px;text-align:center;color:#b6ef3c;font:700 8px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-shadow:0 1px 2px #000;pointer-events:none}
html body #f11Hot .h-spot.on i:nth-child(1),html body #f11Hot .h-spot:active i:nth-child(1){transform:scale(1.22);background:#ffffff}
html body #f11Hot .h-spot:focus-visible i:nth-child(1){box-shadow:0 0 0 3px #000,0 0 0 5px #fff}
html body #f11Hot .h-spot.lit small{color:#fff}
html body #f11Hot .h-n{left:0;top:calc(var(--r) * -1)}
html body #f11Hot .h-s{left:0;top:var(--r)}
/* playrotor-angle-01 (Joey: 'the two UI elements of how to control the rotor — closer together and lower, like the previous two green things'):
   FLY LEFT / RIGHT hug the rotor's lower half at .72 r in and .35 r down instead of sitting out on its equator */
html body #f11Hot .h-w{left:calc(var(--r) * -.72);top:calc(var(--r) * .35)}
html body #f11Hot .h-e{left:calc(var(--r) * .72);top:calc(var(--r) * .35)}
html body #f11Hot .h-ne{left:calc(var(--r) * .74);top:calc(var(--r) * -.74)}
html body #f11Hot.phone .h-s{top:0} /* phones: SWING is the rotor itself */
html body #f11Hot.phone .h-spot b{top:28px;font-size:9px}
html body #f11Hot.phone .h-spot small{top:40px}
@media(prefers-reduced-motion:no-preference){
  html body #f11Hot .h-spot i:nth-child(2){animation:f11hot 2.2s cubic-bezier(.22,.61,.36,1) infinite}
  html body #f11Hot .h-spot i:nth-child(3){animation:f11hot 2.2s cubic-bezier(.22,.61,.36,1) infinite 1.1s}
  @keyframes f11hot{0%{transform:scale(.55);opacity:.95}100%{transform:scale(2.3);opacity:0}}
}
/* v30 (Joey: "the UI surrounding the rotor looked better before"): the §42 ring and chips are back; the rotor hotspots are off */
html body #f11Hot{display:none!important}
html body #f11Hints #f11PadHint{pointer-events:none}
html body.f11-pad #f11Hints #f11PadHint{border-color:#b6ef3c;box-shadow:0 0 0 1px #b6ef3c55}

/* 51 · v29 · PORTRAIT PHONES (Joey: "everyone opening on mobile gets the same sick view"): the camera re-frames (final-core), and the chrome stacks:
   a centred two-row lane (PLAY DUEL full width, WATCH TOUR + TRAINING under it), the rail as one swipeable row, the menu block compressed above them. */
@media(max-width:760px) and (orientation:portrait){
  html body.f8-home #final02Lane#final02Lane#final02Lane{left:12px!important;right:12px!important;bottom:60px!important;max-width:none!important;width:auto!important;display:grid!important;grid-template-columns:1fr 1fr;gap:8px;translate:none!important}
  html body.f8-home #final02Lane#final02Lane#final02Lane > *{margin:0!important;min-width:0!important;width:auto!important;justify-content:center}
  html body.f8-home #final02Lane#final02Lane#final02Lane > #rotorSceneEnterArena{grid-column:1/-1;order:-1}
  html body.f8-home nav.cm-view-rail.cm-view-rail.cm-view-rail{left:8px!important;right:8px!important;bottom:10px!important;width:auto!important;max-width:none!important;translate:none!important;overflow-x:auto;overflow-y:hidden;justify-content:flex-start!important;flex-wrap:nowrap!important;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  html body.f8-home nav.cm-view-rail::-webkit-scrollbar{display:none}
  html body.f8-home #mainMenu#mainMenu#mainMenu.cm-main{top:auto!important;bottom:178px!important;left:12px!important;right:12px!important;width:auto!important;max-width:none!important}
  html body.f8-home #mainMenu#mainMenu h1{font-size:30px!important;line-height:1!important;margin:4px 0 4px!important}
  html body.f8-home #mainMenu#mainMenu .cm-primary{margin-top:6px!important}
  html body.f8-home #f11Hints{margin:4px 0 6px!important}
  html body.f8-home #f11Venue{display:grid!important;top:74px}
  html body.f8-home #f11Venue b{font-size:24px}
  html body.f8-home #f11Venue small{font-size:7.5px}
}

/* 52 · v29 · GREEN ROOM / THE CLUB reach: the learning row is visible on the rotor screen (it was 0 px), compact chips */
html body.f8-home:not(.f2-identity-studio):not(.rotor-access-panel-open):not(.emblem-editor-open):not(.club-center-open) #mainMenu#mainMenu#mainMenu#mainMenu .cm-learning{display:flex!important;flex-wrap:wrap;gap:6px;margin-top:8px;opacity:1!important}
html body.f8-home #mainMenu .cm-learning a{display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:14px;border:1px solid #ffffff3d;background:linear-gradient(165deg,#15181cf2,#000000fa);color:#f2f6f9;font:800 9.5px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-decoration:none;box-shadow:inset 0 1px 0 #ffffff40,0 6px 16px #0009}
html body.f8-home #mainMenu .cm-learning a:is(:hover,:focus-visible){border-color:#b6ef3c;color:#b6ef3c}

/* 53 · v29 · while the trophy scene plays on screen, none of the rotor-screen chrome shows */
html body.final02-landing:not(.final02-landing-leaving) :is(#f11Sticks,#f11Hot,#f11Venue,#f11Hints,#mainMenu .cm-learning){display:none!important}

/* 46b · v29 · stick readouts only where they have room (they met the lane and the learning row below 1200 x 800) */
/* circuit-06: #f11Sticks small-screen rule removed with the readout itself */

/* 54 · v30 · ROUTE HOTSPOTS (Joey): the lime pulsing dots mark places in the world you can go: GO TO COURT, GREEN ROOM, ONLINE, THE CLUB, PLAYER CENTER.
   World-anchored (projected every 50 ms), tap / click / D-pad + A. Hidden with the rest of the chrome during idents, panels and the landing. */
html body #f11Routes{position:fixed;inset:0;width:0;height:0;z-index:1440;pointer-events:none}
html body #f11Routes .r-spot{position:absolute;left:var(--x);top:var(--y);width:0;height:0;margin:0;padding:0;border:0;background:none;cursor:pointer;pointer-events:auto;-webkit-tap-highlight-color:transparent;outline:none}
html body #f11Routes .r-spot i{position:absolute;left:-16px;top:-16px;width:32px;height:32px;border-radius:50%;pointer-events:none}
html body #f11Routes .r-spot i:nth-child(1){background:#b6ef3c;opacity:.92;transition:transform 160ms cubic-bezier(.22,.61,.36,1),background 160ms}
html body #f11Routes .r-spot i:nth-child(2),html body #f11Routes .r-spot i:nth-child(3){border:2px solid #b6ef3c;opacity:0}
html body #f11Routes .r-spot::after{content:"";position:absolute;left:-26px;top:-26px;width:52px;height:52px;border-radius:50%}
html body #f11Routes .r-spot b{position:absolute;left:-80px;width:160px;top:22px;text-align:center;color:#fff;font:800 10px/1 Inter,system-ui,sans-serif;letter-spacing:.16em;text-shadow:0 1px 3px #000,0 0 12px #000a;pointer-events:none;white-space:nowrap}
html body #f11Routes .r-spot small{position:absolute;left:-80px;width:160px;top:35px;text-align:center;color:#b6ef3c;font:700 7.5px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-shadow:0 1px 2px #000;pointer-events:none}
html body #f11Routes .r-spot:is(:hover,:focus-visible) i:nth-child(1){transform:scale(1.25);background:#fff}
html body #f11Routes .r-spot:focus-visible i:nth-child(1){box-shadow:0 0 0 3px #000,0 0 0 5px #fff}
html body #f11Routes .r-spot[hidden]{display:none}
@media(prefers-reduced-motion:no-preference){
  html body #f11Routes .r-spot i:nth-child(2){animation:f11hot 2.6s cubic-bezier(.22,.61,.36,1) infinite}
  html body #f11Routes .r-spot i:nth-child(3){animation:f11hot 2.6s cubic-bezier(.22,.61,.36,1) infinite 1.3s}
}
html body.final02-landing:not(.final02-landing-leaving) #f11Routes,html body.three-hero-opening #f11Routes{display:none!important}

/* 55 · v31 · (Joey, 19:35: "these both look bad") THE DOCK PILL HUGS ITS BUTTONS and sits centred (it was a fixed-width pill with the buttons
   pushed to the right, an empty left half); NIGHT COURT is a FLAT wordmark on the LEFT, under the music chip, white + yellow, no 3D letters. */
html body:not(.stadium-arena) .rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock{justify-content:center!important;flex-wrap:wrap}
@media(min-width:1200px){
  html body:not(.stadium-arena) .rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock{width:max-content!important;max-width:calc(100vw - 440px)!important;left:50%!important;right:auto!important;translate:-50% 0!important;transform:none!important}
}
html body #f11Venue#f11Venue{left:24px;right:auto;top:98px;transform:none;translate:none;text-align:left;filter:drop-shadow(0 6px 14px #000c)}
html body.f8-home:not(.three-hero-opening):not(.f2-identity-studio):not(.rotor-access-panel-open):not(.club-center-open):not(.emblem-editor-open) #f11Venue#f11Venue{justify-items:start;gap:3px}
html body #f11Venue#f11Venue small{font-size:8.5px;letter-spacing:.32em}
html body #f11Venue#f11Venue b{transform:none;font-size:clamp(26px,2.4vw,38px);letter-spacing:.07em;gap:.22em}
html body #f11Venue#f11Venue b span{background:none;-webkit-background-clip:initial;background-clip:initial;color:#ffffff;-webkit-text-fill-color:#ffffff;text-shadow:0 2px 6px #000c}
html body #f11Venue#f11Venue b em{background:none;-webkit-background-clip:initial;background-clip:initial;color:#ffcf00;-webkit-text-fill-color:#ffcf00;text-shadow:0 2px 6px #000c}
html body #f11Venue#f11Venue i{width:100%;margin-top:4px;background:linear-gradient(90deg,#b6ef3c,#ffffff 60%,transparent)}
@media(prefers-reduced-motion:no-preference){
  html body.f8-home #f11Venue#f11Venue{animation:f11venueFlat 900ms cubic-bezier(.22,.61,.36,1) both}
  @keyframes f11venueFlat{from{transform:translateY(-8px)}to{transform:none}}
}
@media(max-width:1199px){html body #f11Venue#f11Venue{top:116px}}
@media(max-width:760px) and (orientation:portrait){html body.f8-home #f11Venue#f11Venue{top:84px;left:12px}html body.f8-home #f11Venue#f11Venue b{font-size:22px}}

/* 54b · v31 · bigger route dots (44 px, 64 px hit area), label beside the dot so nothing stacks on the court */
html body #f11Routes .r-spot i{left:-22px;top:-22px;width:44px;height:44px}
html body #f11Routes .r-spot::after{left:-32px;top:-32px;width:64px;height:64px}
html body #f11Routes .r-spot b{left:30px;width:auto;top:-7px;text-align:left}
html body #f11Routes .r-spot small{left:30px;width:auto;top:8px;text-align:left;white-space:nowrap}
html body #f11Routes .r-spot[data-k="online"] b,html body #f11Routes .r-spot[data-k="online"] small{left:auto;right:30px;text-align:right}

/* 54c · v32 · quiet edge dots: 34 px, one slow ring, label inward; hidden under 1000×600 (the lane / menu own those sizes) */
html body #f11Routes .r-spot i{left:-17px;top:-17px;width:34px;height:34px}
html body #f11Routes .r-spot i:nth-child(1){opacity:.85}
html body #f11Routes .r-spot i:nth-child(3){display:none}
@media(prefers-reduced-motion:no-preference){html body #f11Routes .r-spot i:nth-child(2){animation-duration:4s}}
html body #f11Routes .r-spot::after{left:-28px;top:-28px;width:56px;height:56px}
html body #f11Routes .r-spot b{left:26px;top:-6px;font-size:9.5px}
html body #f11Routes .r-spot small{left:26px;top:8px;font-size:7px}
html body #f11Routes .r-spot[data-k="online"] b,html body #f11Routes .r-spot[data-k="club"] b,html body #f11Routes .r-spot[data-k="online"] small,html body #f11Routes .r-spot[data-k="club"] small{left:auto;right:26px;text-align:right}

/* 56 · v51 (Joey 01:40 "this row not needed; change location of PLAY DUEL and TRAINING; make that section 3D video UI OLED screens"): on the rotor
   screen ≥1000×700 the bottom row goes (menu primaries + CREATE PLAYER / PLAYER VS PLAYER, the rail strip, the WATCH TOUR twin); PLAY DUEL + TRAINING
   stack top-right under the music chip row; the bottom band belongs to the OLED option row (final10-world-ui.js slab 'oled'). The rail only shows
   while the VIEW SETTINGS hotspot has its sheet open (body.f9-settings). v61 (Joey 03:31 'without the bottom or top buttons, showing all screens'): from 700×450. */
@media (min-width:700px) and (min-height:450px){
  html body.f8-home:not(.playing) #mainMenu#mainMenu#mainMenu#mainMenu :is(.cm-primary,.cm-player-create,.cm-online,.cm-learning,.cm-angles-toggle,.cm-intro){display:none!important}
  html body.f8-home.f8-home.f8-home.f8-home:not(.playing):not(.f9-settings) nav.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail.cm-view-rail{display:none!important}
  html body.f8-home:not(.playing) nav.rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock{display:none!important} /* v61: no top button row at all */
  html body.f8-home:not(.playing) #final02Lane#final02Lane#final02Lane#final02Lane{position:fixed!important;left:auto!important;right:24px!important;top:104px!important;bottom:auto!important;transform:none!important;translate:none!important;flex-direction:column!important;align-items:flex-end!important;gap:10px!important;width:auto!important;min-width:0!important}
  html body.f8-home:not(.playing) #final02Lane#final02Lane#final02Lane#final02Lane #f11HomeBig#f11HomeBig#f11HomeBig{display:none!important}
  html body.f8-home.f10-oled:not(.playing) #final02Lane#final02Lane#final02Lane#final02Lane{display:none!important} /* PLAY DUEL + TRAINING are the first two OLED screens */
  html body.f8-home.f10-oled #rotorWorldView#rotorWorldView#rotorWorldView#rotorWorldView.rotor-view-pip{bottom:212px!important;max-height:calc(100vh - 212px - 120px)!important} /* v52: the tour PiP clears the OLED row */
  html body.f8-home.f10-oled #mainMenu#mainMenu#mainMenu#mainMenu{bottom:190px!important;top:auto!important} /* v52: headline above the OLED row */
  html body.f8-home.f10-oled :is(#f11Sticks#f11Sticks#f11Sticks#f11Sticks,#f11Hints#f11Hints#f11Hints#f11Hints,#cmRacketHint#cmRacketHint#cmRacketHint#cmRacketHint){display:none!important} /* v55b (Joey 02:33 'UI around rotor not showing'): the §42 ring + callouts stay (they anchor the 3D ring); only the stick readouts / hints step aside */ /* v55: ids so the §42 / §46 rules cannot win */
  html body.f8-home:not(.playing) nav.rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock.rotor-access-dock{opacity:0!important;visibility:hidden!important;pointer-events:none!important} /* v59: the six glass shapes are the main options */ /* v55 (Joey 02:28 'top-most elements ruin the spacing, make them 3D'): the DOM dock stays in the tree for its panels, the 3D dock pills (final10-world-ui 'dock' slab) are what you see and press */ /* v52 (Joey 02:22 'everything blocking each other'): the control callouts step aside while the OLED row is up; the first-time whisper + keyboard focus still teach the keys */
}
/* playrotor-angle-01 (Joey: "seamless idle vs player-moves-mouse UI on/off"): while the player is driving the rotor (body.f8-attentive, §47:
   pointer / keys / stick, 2.2 s after the last input) EVERY chrome panel steps back to a quarter and the court owns the frame; the moment
   they stop, it all comes back. The stick pads and the lime ring stay full — they are the controls. */
html body.f8-home.f8-attentive:not(.playing) :is(#v100Tour,#v100Intro,#v100Arena,#v100Stack,#v101Rail,#v101PlayerRail,#f11Venue,#v100Queue,#f11Right,#rotorOpponentGlass,.rotor-pilot-summary,#f9Hot){opacity:.25!important;transition:opacity .6s cubic-bezier(.22,.61,.36,1)!important}
html body.f8-home:not(.f8-attentive):not(.playing) :is(#v100Tour,#v100Intro,#v100Arena,#v100Stack,#v101Rail,#v101PlayerRail,#f11Venue,#v100Queue,#f11Right,#rotorOpponentGlass,.rotor-pilot-summary,#f9Hot){transition:opacity .9s cubic-bezier(.22,.61,.36,1)!important}
/* playrotor-angle-01 (Joey: "Focus mode currently does nothing"): v105-focus.js toggles body.focus-view and no stylesheet answered it.
   FOCUS = the court alone: every chrome panel and the lane step out; the stick pads, the lime ring on the rotor, PAUSE and the Focus
   button itself stay. Press Focus again to bring it all back. */
html body.focus-view:not(.playing) :is(#v100Tour,#v100Intro,#v100Arena,#v100Stack,#v101Rail,#v101PlayerRail,#f11Venue,#v100Queue,#f11Right,#rotorOpponentGlass,.rotor-pilot-summary,#f9Hot,#final02Lane,#mainMenu,nav.cm-view-rail,.rotor-access-dock,#f10World,#f11Ring,#rotorWorldView){opacity:0!important;pointer-events:none!important;transition:opacity .6s cubic-bezier(.22,.61,.36,1)!important}
html body.focus-view #v105Focus{border-color:#c7fc68!important;color:#c7fc68!important}
