.cockpit-footer{bottom:max(16px,env(safe-area-inset-bottom));z-index:3;pointer-events:none}
.cockpit{position:relative;width:min(680px,calc(100vw - 16px));aspect-ratio:680/184;filter:drop-shadow(0 12px 12px #000a);pointer-events:auto}
.cockpit-shell{position:absolute;width:100%;height:100%;inset:0}
.instrument{position:absolute;left:9%;top:43%;width:24%;text-align:center;line-height:1;pointer-events:none}
#drive-readout{display:block;font:bold clamp(23px,5.9vw,43px) 'Courier New',monospace;letter-spacing:1px;color:#ff9ac7;text-shadow:0 0 3px #ff579c,0 0 12px #ff378755;font-variant-numeric:tabular-nums}
.instrument>span{display:block;color:#b97697;font:clamp(8px,1.8vw,10px) Arial;letter-spacing:2px;margin-top:4px}
.gears button{position:absolute;display:flex;align-items:center;justify-content:center;padding:0;min-height:0;width:6.8%;height:25%;border-radius:50%;border:1px solid #69475d;background:radial-gradient(ellipse at 40% 18%,#51414f,#251d2a 50%,#0c0c14 78%);box-shadow:inset 0 2px 2px #dcaccc35,0 3px 0 #080810,0 5px 7px #000a;color:#ca8fac;font:bold clamp(12px,2.8vw,19px) 'Courier New',monospace;backdrop-filter:none;transition:box-shadow .2s,color .2s,transform .15s}
.gears [data-speed="1"]{left:42%;top:28%}.gears [data-speed="2"]{left:42%;top:60%}.gears [data-speed="3"]{left:54%;top:28%}.gears [data-speed="4"]{left:54%;top:60%}.gears [data-speed="5"]{left:66%;top:28%}
.gears button[aria-pressed=true]{transform:translateY(2px);color:#ffd0e2;border-color:#ec91bf;box-shadow:inset 0 1px 5px #0008,0 1px 0 #0d0810,0 0 11px #ec519459;text-shadow:0 0 6px #fc69b0;background:radial-gradient(ellipse at 40% 20%,#68445e,#261524 70%)}
.gears #perfect{left:80%;top:34%;width:13.5%;height:20%;border-radius:5px;font:clamp(7px,1.7vw,11px) Arial;letter-spacing:1px;background:linear-gradient(#53324a,#291b2b 45%,#1e141f);color:#efadd3}
.gears #finish{left:83.5%;top:61%;width:6.8%;height:24%;border-radius:50%;background:radial-gradient(ellipse at 40% 20%,#8c435c,#3a192b 60%,#200f1e);border-color:#8f5368;box-shadow:inset 0 1px 2px #efadb850,0 2px 0 #160b13,0 4px 7px #0009}
.gears #finish svg{width:45%;height:65%;fill:none;stroke:#f1adc5;stroke-width:1.6;stroke-linejoin:round}
.gears button:disabled{opacity:.36;cursor:default}.gears button:focus-visible{outline:2px solid #ffc2df;outline-offset:4px}.gears button:hover:not(:disabled){color:#ffe4f0;border-color:#e498bb}
.finishing .cockpit-footer{opacity:1;pointer-events:none}.finishing .cockpit{pointer-events:none}.finishing #drive-readout{color:#ffafbb}
.cockpit{--sync-glow:0}.instrument{text-shadow:0 0 22px rgb(255 113 188 / var(--sync-glow))}
.cockpit-shell{visibility:hidden}.cockpit-render{position:absolute;width:100%;height:100%;inset:0;pointer-events:none}.gears button,.gears #perfect,.gears #finish,.gears button[aria-pressed=true],.gears button:hover:not(:disabled){background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none}.gears button[aria-pressed=true]{transform:translateY(2px);text-shadow:0 0 6px #ff88bd}.instrument{top:44%}
.cockpit{--led:#ff76b0}.gears button,.gears #perfect,.gears button[aria-pressed=true],.gears button:hover:not(:disabled){color:#e5e5e0;font-family:Arial,sans-serif;text-shadow:none}.gears #finish svg{stroke:#e5e5e0}.instrument{top:46%}.instrument>span{color:#aaa;font:9px Arial;text-shadow:none;letter-spacing:1px}#drive-readout{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.led-digits{display:block;width:78%;height:auto;max-height:47px;margin:auto;overflow:visible;filter:drop-shadow(0 0 2px var(--led))}.led-digits .lit{fill:var(--led)}.led-digits .unlit{fill:var(--led);opacity:.06}
.gears button[data-speed]{width:8.5%;height:26%;top:31%;border-radius:2px;font:18px Arial}
.gears [data-speed="1"]{left:41.75%}.gears [data-speed="2"]{left:52.25%;top:31%}.gears [data-speed="3"]{left:62.75%}.gears [data-speed="4"]{left:73.25%;top:31%}.gears [data-speed="5"]{left:83.75%}
.gears #perfect{left:47%;top:66%;width:29.5%;height:19%;font:10px Arial;letter-spacing:1.3px}.gears #finish{left:83.75%;top:64%;width:8.5%;height:23%;border-radius:2px}.gears #finish svg{width:40%;height:65%}
.led-digits{filter:none}.led-digits .lit{filter:url(#led-bloom);fill:var(--led)}.instrument:before{content:'';position:absolute;inset:-18px -8px -2px;background:radial-gradient(ellipse,var(--led),transparent 70%);opacity:.11;pointer-events:none}.instrument>span{position:relative}.led-digits{position:relative}
@media(max-width:650px){.gears button[data-speed]{font-size:13px}.gears #perfect{font-size:8px}}
/* Blender player panel: invisible accessible hit areas follow authored caps. */
.cockpit{width:min(800px,calc(100vw - 16px));aspect-ratio:1600/620}
.cockpit .gears button,.cockpit .gears #perfect,.cockpit .gears #finish,.player-controls button{position:absolute!important;transform:translate(-50%,-50%)!important;margin:0!important;padding:0!important;min-height:0!important;border:0!important;border-radius:3px;background:transparent!important;box-shadow:none!important;color:transparent!important;font-size:0!important;cursor:pointer;z-index:2}
.cockpit .gears button svg{visibility:hidden}.cockpit button:focus-visible{outline:1px solid var(--led)!important;outline-offset:2px}.cockpit button:disabled{cursor:default}.instrument{transform:translate(-50%,-50%);margin:0;display:flex;align-items:center;justify-content:center}.instrument>span,.instrument:before{display:none}.instrument .led-digits{width:100%;max-height:none;height:100%}.player-clock{position:absolute;transform:translate(-50%,-50%);font:clamp(6px,1.2vw,10px) Arial;color:var(--led);opacity:.72;text-align:center;pointer-events:none;text-shadow:0 0 3px var(--led)}.player-progress{position:absolute;transform:translate(-50%,-50%);background:var(--led);opacity:.65;pointer-events:none}.track-menu{position:absolute;bottom:29%;left:16%;padding:9px;background:#121615;border:1px solid #49514b;border-radius:3px;z-index:5}.track-menu[hidden]{display:none}.track-menu button{background:none;border:0;color:#c5d3c8;font:11px Arial;padding:5px}.cockpit-render{pointer-events:none}

.cockpit{width:min(680px,calc(100vw - 16px));aspect-ratio:7.35/2.1}
.player-controls button{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}