/* R10 · a working command display recessed into a slender titanium console.
   Native buttons and rotary selectors, with no animation loop or image hotspots. */
body.has-cockpit-controls{--cockpit-control-height:142px;--cockpit-control-clearance:calc(var(--cockpit-control-height) + 10px + env(safe-area-inset-bottom,0px));--cockpit-key-light:#c7eee7;--cockpit-key-face:#142730;--cockpit-key-recess:#071a22;--cockpit-metal-light:#d7e1df;--cockpit-metal-shadow:#536773;--cockpit-screen-radius:13px;--cockpit-dial-angle:-40deg}
body.has-cockpit-controls[data-space-theme=lunar]{--cockpit-key-light:#f0e4bf;--cockpit-key-face:#242f33;--cockpit-key-recess:#111e23;--cockpit-metal-light:#e8e8d8;--cockpit-metal-shadow:#64767b;--cockpit-screen-radius:20px;--cockpit-dial-angle:0deg}
body.has-cockpit-controls[data-space-theme=starship]{--cockpit-key-light:#c6dfff;--cockpit-key-face:#172a3d;--cockpit-key-recess:#071723;--cockpit-metal-light:#d5e1e9;--cockpit-metal-shadow:#526a80;--cockpit-screen-radius:7px;--cockpit-dial-angle:40deg}
.has-cockpit-controls .main-nav{display:none}
body.has-cockpit-controls[data-view=space] .voyage-footer>button[data-action=add-station],body.has-cockpit-controls[data-view=space] .voyage-footer>button[data-action=import]{display:none}
body.has-cockpit-controls[data-view=space] .voyage-footer{padding-right:0}
#cockpitControls{position:fixed;z-index:42;left:0;right:0;bottom:0;isolation:isolate;display:grid;grid-template-columns:minmax(76px,1fr) minmax(0,900px) minmax(90px,1fr);align-items:center;gap:clamp(18px,3vw,50px);height:calc(var(--cockpit-control-height) + env(safe-area-inset-bottom,0px));padding:13px clamp(25px,4vw,75px) calc(13px + env(safe-area-inset-bottom,0px));border-top:1px solid #dce7e180;border-radius:42% 42% 0 0 / 12px 12px 0 0;background:linear-gradient(180deg,#d0dddb 0,#718691 2px,#293e4b 4px,#768a94 7px,#c6d0d2 10px,#a7b6bd 14px,#708692 74%,#3b525e);box-shadow:0 -2px 0 #030b12b3,0 -8px 22px #00000021}
#cockpitControls::before{content:'';position:absolute;z-index:-1;pointer-events:none;inset:13px 0 0;background:linear-gradient(100deg,#13293680,#b8c8cd24 14%,#334e5a33 28%,transparent 50%,#324b5944 74%,#d4dfdb28 87%,#192d3b80);border-top:1px solid #e8f0ea57;border-radius:50% 50% 0 0 / 8px 8px 0 0}
#cockpitControls::after{content:'';position:absolute;pointer-events:none;bottom:0;left:0;right:0;height:5px;border-top:1px solid #b4cbd34d;background:linear-gradient(#475e6b,#1b3040)}
#cockpitControls .cockpit-display{position:relative;display:grid;grid-template-rows:30px minmax(0,1fr);gap:7px;align-self:stretch;min-width:0;padding:8px 16px 11px;border:1px solid #020b13;border-top-color:#020a10;border-bottom-color:#b3c7d4a6;border-radius:var(--cockpit-screen-radius);background:linear-gradient(107deg,#06131c 0%,#0b1b25 42%,#081620 74%,#07131c);box-shadow:0 -2px 0 #d8e4e5a3,0 0 0 3px #263d49,0 0 0 4px #aebfc5b0,0 5px 0 #182b37,inset 0 3px 8px #0009;overflow:hidden}
#cockpitControls .cockpit-display::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(116deg,transparent 0%,#d6e9f605 38%,#e0f3ff0c 38.2%,transparent 55%);border-top:1px solid #a9d0e233}
#cockpitControls .cockpit-display-top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:0;border-bottom:1px solid #a8c6d222;padding-bottom:5px}
#cockpitControls .cockpit-nav{display:flex;gap:7px;min-width:0}
#cockpitControls .cockpit-readout{display:flex;align-items:center;justify-content:flex-end;gap:7px;min-width:0;overflow:hidden;white-space:nowrap;color:#a6bac3;font:8px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1.5px;text-overflow:ellipsis}
#cockpitControls .cockpit-readout::before{content:'';display:block;flex:none;width:3px;height:3px;border-radius:50%;background:var(--cockpit-key-light);box-shadow:0 0 5px #a6e3dd66}
#cockpitControls[data-operation=scanning] .cockpit-readout,#cockpitControls[data-operation=refining] .cockpit-readout{color:#eedbaa}
#cockpitControls .cockpit-actions{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;align-items:stretch;min-width:0}
#cockpitControls .cockpit-port{display:flex;justify-content:center;align-items:center;min-width:0}
#cockpitControls .cockpit-utilities{display:flex;align-items:center;justify-content:center;gap:clamp(12px,2vw,30px);min-width:0}
.has-cockpit-controls #cockpitControls .cockpit-key{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:44px;padding:7px 12px;border:1px solid #adc5cf44;border-top-color:#bdd5de61;border-bottom-color:#020e18;border-radius:5px;background:linear-gradient(177deg,#29414d,#102430 9%,#0b1c28 92%);box-shadow:inset 0 1px #e7f3e916,inset 0 -1px #3a526044,0 2px 0 #020a11;color:#d5e3e6;text-align:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:border-color 80ms ease,color 80ms ease,box-shadow 80ms ease,transform 80ms ease}
#cockpitControls .cockpit-key-code{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:8px/1.1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1.7px;color:#93b3c0}
#cockpitControls .cockpit-key-label{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 14px/1.3 var(--font,system-ui,sans-serif);letter-spacing:.3px;color:inherit}
#cockpitControls .cockpit-key-indicator{position:absolute;left:11px;top:11px;width:3px;height:3px;border-radius:50%;background:#69838f66;box-shadow:inset 0 1px 1px #0008;pointer-events:none}
.has-cockpit-controls #cockpitControls .cockpit-nav .cockpit-key{flex-direction:row;min-height:25px;gap:6px;padding:4px 10px;border:0;border-radius:3px;background:none;box-shadow:none;color:#849da9}
#cockpitControls .cockpit-nav .cockpit-key-label{font-size:11px;letter-spacing:.25px}
#cockpitControls .cockpit-nav .cockpit-key-code{font-size:7px;letter-spacing:1px;color:inherit}
#cockpitControls .cockpit-nav .cockpit-key-indicator{display:none}
.has-cockpit-controls #cockpitControls .cockpit-nav .cockpit-key[aria-current=page]{background:#aecfda12;color:#ecf0e7;box-shadow:inset 0 -1px var(--cockpit-key-light)}
.has-cockpit-controls #cockpitControls .cockpit-key:hover:not(:disabled){color:#f5f7ee;border-color:#b9dce19c;background:linear-gradient(177deg,#395665,#1a3541 10%,#102833 95%)}
.has-cockpit-controls #cockpitControls .cockpit-nav .cockpit-key:hover:not(:disabled){background:#abc6d318}
.has-cockpit-controls #cockpitControls .cockpit-key[aria-pressed=true],.has-cockpit-controls #cockpitControls .cockpit-key[aria-expanded=true]{color:var(--cockpit-key-light);border-top-color:#06131b;background:linear-gradient(#071722,#102733);box-shadow:inset 0 2px 5px #0008,inset 0 -1px #b9d3d94d,0 1px #8eafb24d}
#cockpitControls .cockpit-key[aria-pressed=true] .cockpit-key-indicator,#cockpitControls .cockpit-key[aria-expanded=true] .cockpit-key-indicator{background:var(--cockpit-key-light);box-shadow:0 0 5px #c6ebdf70}
.has-cockpit-controls #cockpitControls .cockpit-key:active:not(:disabled),.has-cockpit-controls #cockpitControls .cockpit-key.is-pressed{transform:translateY(1px);box-shadow:inset 0 2px 5px #0008,0 1px #9bb6bd44;color:#f4f7ef}
.has-cockpit-controls #cockpitControls .cockpit-key[aria-busy=true],.has-cockpit-controls #cockpitControls .cockpit-key[data-running=true]{border-color:#ddc28599;background:linear-gradient(#384338,#17292f);color:#f2dfad;box-shadow:inset 0 2px 4px #0007,0 1px #8b9b8644}
#cockpitControls .cockpit-key[aria-busy=true] .cockpit-key-indicator,#cockpitControls .cockpit-key[data-running=true] .cockpit-key-indicator{width:4px;height:4px;background:#ecd18f;box-shadow:0 0 7px #efce8266}
.has-cockpit-controls #cockpitControls .cockpit-key:disabled{color:#6e838d;border-color:#68828c33;background:#11232e;box-shadow:inset 0 1px 2px #0005;cursor:not-allowed}
.has-cockpit-controls #cockpitControls .cockpit-key:disabled .cockpit-key-indicator{background:#63798533;box-shadow:none}
.has-cockpit-controls #cockpitControls .cockpit-key:focus-visible{outline:2px solid #eff4dc;outline-offset:4px}
/* Machined rotary encoders: the ring is the actual button, not a bitmap hit area. */
.has-cockpit-controls #cockpitControls .cockpit-rotary{position:relative;flex:none;width:78px;height:78px;min-height:78px;padding:10px 8px 8px;gap:4px;border:1px solid #f2f6ed8c;border-bottom-color:#263e4b;border-radius:50%;background:radial-gradient(ellipse at 35% 26%,#a3b6bc 0,#6d838d 15%,#304753 48%,#192d39 63%,#0c202c 66%,#c5d3d6 68%,#f1f4ed 71%,#718b97 75%,#1d3847 81%,#b9c9ce 87%,#405b69 92%);box-shadow:0 5px 0 #162934,0 6px 0 #a2b6bd99,0 9px 10px #020c1677,inset 0 2px 2px #eef6ec7d;color:#ebf0e9;isolation:isolate}
.has-cockpit-controls #cockpitControls .cockpit-rotary:hover:not(:disabled){background:radial-gradient(ellipse at 35% 26%,#b7c9ca,#7e959d 15%,#375562 48%,#1d3948 63%,#0a2431 66%,#d5e0de 68%,#f3f6ed 71%,#87a6ad 75%,#2a4857 81%,#c6d7d8 87%,#526c79 92%);border-color:#f1f7f0}
#cockpitControls .cockpit-rotary .cockpit-key-code{font-size:7px;letter-spacing:.9px;color:#c7dbdf;text-shadow:0 1px #091722}
#cockpitControls .cockpit-rotary .cockpit-key-label{font-size:10px;max-width:60px;color:#f0f2e9;text-shadow:0 1px #071620}
#cockpitControls .cockpit-rotary .cockpit-key-indicator{left:50%;top:8px;transform:translateX(-50%);width:3px;height:6px;border-radius:2px;background:var(--cockpit-key-light);box-shadow:0 0 5px #c5e7dc4d}
#cockpitControls .cockpit-rotary-ring{position:absolute;inset:-9px;border:1px solid #e6eeed5c;border-left-color:#152d3b99;border-bottom-color:#10263399;border-radius:50%;pointer-events:none;transform:rotate(var(--dial-angle,var(--cockpit-dial-angle)));transition:transform 100ms ease}
#cockpitControls .cockpit-rotary-ring::before{content:'';position:absolute;left:calc(50% - 2px);top:-2px;width:4px;height:5px;border-radius:1px;background:var(--cockpit-key-light);box-shadow:0 0 7px #bad7d65c}
#cockpitControls #spaceSettingsButton{inset:auto;z-index:auto;width:66px;height:66px;min-height:66px;margin:0;font-family:inherit;line-height:normal}
#cockpitControls #spaceSettingsButton .cockpit-rotary-ring{transform:rotate(-25deg)}
#cockpitControls #spaceSettingsButton[aria-expanded=true] .cockpit-rotary-ring{transform:rotate(25deg)}
.has-cockpit-controls #cockpitControls .cockpit-rotary[aria-expanded=true]{background:radial-gradient(ellipse at 35% 26%,#a0bcbf,#557f88 20%,#244654 55%,#102b39 65%,#d5e8e7 69%,#9ab9bd 75%,#1a3543 81%,#a7c3c9 88%,#345464 93%);box-shadow:0 3px #132c3b,0 4px #bbd5d68c,0 7px 8px #02111a77,inset 0 1px #edfff07d}
.has-cockpit-controls #cockpitControls .cockpit-focus-key{width:64px;min-height:43px;height:43px;padding:6px 7px;border-color:#cedad966;border-bottom-color:#193544;background:linear-gradient(#617883,#304b5a 10%,#193747);box-shadow:inset 0 1px #eef3ec29,0 3px #172d3b,0 4px 3px #0005;border-radius:6px}
#cockpitControls .cockpit-focus-key .cockpit-key-code{font-size:7px}
#cockpitControls .cockpit-focus-key .cockpit-key-label{font-size:11px}
#cockpitControls .cockpit-focus-key .cockpit-key-indicator{left:6px;top:7px;width:2px;height:2px}
body.has-cockpit-controls[data-space-theme=lunar] #cockpitControls{border-radius:48% 48% 0 0 / 16px 16px 0 0;background:linear-gradient(180deg,#ebe9dc,#75888d 3px,#33484e 5px,#c1ccc7 10px,#adbebc 15px,#7f9399 74%,#455e69)}
body.has-cockpit-controls[data-space-theme=lunar] #cockpitControls .cockpit-display{background:linear-gradient(107deg,#0c171d,#17252a 45%,#0a171e)}
body.has-cockpit-controls[data-space-theme=starship] #cockpitControls{border-radius:12px 12px 0 0;background:linear-gradient(180deg,#d9e6ed,#708a9f 2px,#223d54 5px,#a7bac7 9px,#8da6b7 14px,#526d84 76%,#283f55)}
body.has-cockpit-controls[data-space-theme=starship] #cockpitControls .cockpit-display{background:linear-gradient(107deg,#05111e,#0e2035 45%,#071521);box-shadow:0 -2px #cfe4f4a3,0 0 0 3px #233c50,0 0 0 4px #afc4d1a8,0 5px #162a3b,inset 0 3px 8px #0009}
/* Studio makes the same instrument shallower so the document stays primary. */
body.has-cockpit-controls[data-view=studio]{--cockpit-control-height:112px}
body.has-cockpit-controls[data-view=studio] #cockpitControls{padding-top:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom,0px))}
body.has-cockpit-controls[data-view=studio] #cockpitControls .cockpit-display{grid-template-rows:25px minmax(0,1fr);padding:5px 13px 8px;gap:5px}
body.has-cockpit-controls[data-view=studio] #cockpitControls .cockpit-actions .cockpit-key{min-height:44px;padding:5px 10px;gap:3px}
body.has-cockpit-controls[data-view=studio] #cockpitControls .cockpit-rotary{width:64px;height:64px;min-height:64px}
body.has-cockpit-controls[data-view=space] .voyage,body.has-cockpit-controls[data-view=journey] .flight-log{padding-bottom:calc(var(--cockpit-control-clearance) + 14px)}
body.has-cockpit-controls #spaceSettingsPanel.scene-dock{bottom:calc(var(--cockpit-control-clearance) + 6px);z-index:44;max-height:calc(100dvh - var(--cockpit-control-clearance) - 24px);overflow-y:auto}
body.has-cockpit-controls #toast{bottom:calc(var(--cockpit-control-clearance) + 12px)}
body.has-cockpit-controls .edition,body.has-cockpit-controls .space-photo-credit{bottom:calc(var(--cockpit-control-height) + 5px + env(safe-area-inset-bottom,0px));pointer-events:none}
body.has-cockpit-controls .edition a,body.has-cockpit-controls .space-photo-credit a{pointer-events:auto}
@media(min-width:761px){body.has-cockpit-controls[data-view=studio],body.has-cockpit-controls[data-view=studio].focus-mode{padding-bottom:var(--cockpit-control-clearance)}}
@media(min-width:761px) and (max-width:1100px){#cockpitControls{grid-template-columns:90px minmax(0,1fr) 102px;padding-inline:24px;gap:19px}#cockpitControls .cockpit-display{padding-inline:10px}#cockpitControls .cockpit-utilities{gap:10px;flex-direction:column}#cockpitControls #spaceSettingsButton{width:56px;height:56px;min-height:56px}#cockpitControls .cockpit-rotary-ring{inset:-5px}.has-cockpit-controls #cockpitControls .cockpit-focus-key{width:68px;min-height:31px;height:31px;flex-direction:row;gap:4px}#cockpitControls .cockpit-focus-key .cockpit-key-code{display:none}#cockpitControls .cockpit-readout{font-size:7px;letter-spacing:1px}#cockpitControls .cockpit-nav{gap:2px}.has-cockpit-controls #cockpitControls .cockpit-nav .cockpit-key{padding-inline:7px}#cockpitControls .cockpit-nav .cockpit-key-code{display:none}body.has-cockpit-controls[data-view=studio] #cockpitControls .cockpit-utilities{flex-direction:row;gap:10px}body.has-cockpit-controls[data-view=studio] #cockpitControls .cockpit-utilities .cockpit-rotary{width:46px;height:46px;min-height:46px}body.has-cockpit-controls[data-view=studio] #cockpitControls .cockpit-focus-key{width:42px;height:43px;min-height:43px}}
@media(max-width:760px){
 body.has-cockpit-controls,body.has-cockpit-controls[data-view=studio]{--cockpit-control-height:132px}
 #cockpitControls,body.has-cockpit-controls[data-view=studio] #cockpitControls{grid-template-columns:45px minmax(0,1fr) 45px;gap:10px;padding:11px 10px calc(10px + env(safe-area-inset-bottom,0px));border-radius:16px 16px 0 0}
 #cockpitControls .cockpit-display,body.has-cockpit-controls[data-view=studio] #cockpitControls .cockpit-display{grid-template-rows:44px minmax(0,1fr);padding:2px 6px 7px;gap:5px;border-radius:8px}
 #cockpitControls .cockpit-display-top{padding:0;gap:0;display:block}
 #cockpitControls .cockpit-readout{display:none}
 #cockpitControls .cockpit-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;height:44px}
 .has-cockpit-controls #cockpitControls .cockpit-nav .cockpit-key{min-height:44px;padding:3px 2px;gap:2px}
 #cockpitControls .cockpit-nav .cockpit-key-code{display:none}
 #cockpitControls .cockpit-nav .cockpit-key-label{font-size:10px}
 #cockpitControls .cockpit-actions{gap:5px}
 .has-cockpit-controls #cockpitControls .cockpit-actions .cockpit-key,body.has-cockpit-controls[data-view=studio] #cockpitControls .cockpit-actions .cockpit-key{min-height:44px;padding:4px 3px;gap:5px}
 #cockpitControls .cockpit-actions .cockpit-key-label{font-size:11px;letter-spacing:0}
 #cockpitControls .cockpit-actions .cockpit-key-code{font-size:6px;letter-spacing:.4px}
 #cockpitControls .cockpit-actions .cockpit-key-indicator{left:5px;top:6px;width:2px;height:2px}
 #cockpitControls .cockpit-utilities{flex-direction:column;gap:12px}
 .has-cockpit-controls #cockpitControls .cockpit-rotary,.has-cockpit-controls #cockpitControls #spaceSettingsButton,body.has-cockpit-controls[data-view=studio] #cockpitControls .cockpit-rotary{width:44px;height:44px;min-height:44px;padding:7px 4px;gap:2px}
 #cockpitControls .cockpit-rotary .cockpit-key-code{font-size:5px;letter-spacing:0}
 #cockpitControls .cockpit-rotary .cockpit-key-label{font-size:8px;letter-spacing:0}
 #cockpitControls .cockpit-rotary .cockpit-key-indicator{top:4px;height:3px;width:2px}
 #cockpitControls .cockpit-rotary-ring{inset:-3px}
 #cockpitControls .cockpit-rotary-ring::before{width:2px;height:3px;left:calc(50% - 1px);top:-1px}
 .has-cockpit-controls #cockpitControls .cockpit-focus-key{width:44px;height:44px;min-height:44px;padding:6px 3px;gap:4px}
 #cockpitControls .cockpit-focus-key .cockpit-key-label{font-size:9px;letter-spacing:0}
 #cockpitControls .cockpit-focus-key .cockpit-key-code{font-size:6px;letter-spacing:0}
 #cockpitControls .cockpit-focus-key .cockpit-key-indicator{left:4px;top:4px}
 body.has-cockpit-controls[data-view=studio] .stage,body.has-cockpit-controls[data-view=studio].focus-mode .stage{padding-bottom:calc(var(--cockpit-control-clearance) + 12px)}
 body.has-cockpit-controls[data-view=studio].focus-mode .paper-scroll{height:calc(100dvh - var(--cockpit-control-clearance) - 100px);min-height:260px}
 body.has-cockpit-controls .edition,body.has-cockpit-controls .space-photo-credit{display:none}
 body.has-cockpit-controls #spaceSettingsPanel.scene-dock{right:12px;width:calc(100vw - 24px);max-width:440px}
}
@media(prefers-reduced-motion:reduce){.has-cockpit-controls #cockpitControls .cockpit-key,#cockpitControls .cockpit-rotary-ring{transition:none}.has-cockpit-controls #cockpitControls .cockpit-key:active:not(:disabled),.has-cockpit-controls #cockpitControls .cockpit-key.is-pressed{transform:none}}
@media print{#cockpitControls{display:none!important}body.has-cockpit-controls{--cockpit-control-height:0px;--cockpit-control-clearance:0px;padding-bottom:0!important}}
/* Reserve the photographic aperture from the first frame: downloading a shell
   never moves a button. Loaded images change the material, not the geometry.
   Opaque native glass occludes scrolling page content above the decorative shell. */
@media(min-width:761px){
 body.has-cockpit-controls[data-space-theme]{--cockpit-control-height:22dvh}
 /* Home/log text (stacking context 6) passes behind the physical casting.
    Header (30), live controls (42), preferences (44) and modal dialogs stay above it. */
 body:is([data-view=space],[data-view=journey])[data-cockpit-shell]:not([data-cockpit-shell=""]) .cockpit-shell[data-loaded=true]{z-index:7;pointer-events:none}
 body:is([data-view=space],[data-view=journey])[data-cockpit-shell]:not([data-cockpit-shell=""]) :is(.space-photo-credit,.edition){z-index:8;left:8%;bottom:calc(var(--cockpit-control-height) + 20px)}
 body[data-cockpit-shell]:not([data-cockpit-shell=""]) .cockpit-shell{top:-5.5dvh;bottom:auto;height:105.5dvh}
 body.has-cockpit-controls[data-space-theme] #cockpitControls{left:22%;right:22%;bottom:8.2dvh;height:11.8dvh;display:block;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
 body.has-cockpit-controls[data-space-theme] #cockpitControls::before,body.has-cockpit-controls[data-space-theme] #cockpitControls::after{display:none}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-display{height:100%;grid-template-rows:25px minmax(0,1fr);gap:5px;padding:2px 12px 5px;background:linear-gradient(107deg,#06131c,var(--cockpit-key-recess,#0c202c) 45%,#07131c);border:0;border-radius:0;box-shadow:none;overflow:visible}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-display::after{display:none}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-port{position:fixed;left:14.7%;bottom:calc(10.5dvh - 39px);transform:translateX(-50%)}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-utilities{display:contents}
 body.has-cockpit-controls[data-space-theme] #cockpitControls #spaceSettingsButton{position:fixed;left:85%;right:auto;top:auto;bottom:calc(10.5dvh - 33px);width:66px;height:66px;min-height:66px;transform:translateX(-50%)}
 body.has-cockpit-controls[data-space-theme] #cockpitControls #spaceSettingsButton:active:not(:disabled){transform:translate(-50%,1px)}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-focus-key{position:fixed;right:3.6%;bottom:calc(10.5dvh - 21px);width:64px;height:43px;min-height:43px;flex-direction:column}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-focus-key .cockpit-key-code{display:block}
 body.has-cockpit-controls[data-space-theme][data-view=studio]{--cockpit-control-height:138px}
 body[data-cockpit-shell]:not([data-cockpit-shell=""])[data-view=studio] .cockpit-shell{top:auto;bottom:-25px;height:680px;clip-path:inset(76% 0 0)}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls{height:75px;bottom:29px;padding:0}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls .cockpit-display{grid-template-rows:23px minmax(0,1fr);gap:3px;padding:1px 12px 3px}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls .cockpit-actions .cockpit-key{min-height:44px;padding:4px 10px;gap:3px}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls .cockpit-actions .cockpit-key-label{font-size:12px}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls .cockpit-port{bottom:11px}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls #spaceSettingsButton{bottom:11px;width:64px;height:64px;min-height:64px}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls .cockpit-focus-key{bottom:22px}
}
@media(min-width:761px) and (max-height:700px){
 body.has-cockpit-controls[data-space-theme]{--cockpit-control-height:138px}
 body[data-cockpit-shell]:not([data-cockpit-shell=""]) .cockpit-shell{top:auto;bottom:-25px;height:680px;clip-path:inset(76% 0 0)}
 body.has-cockpit-controls[data-space-theme] #cockpitControls{height:75px;bottom:29px}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-display{grid-template-rows:23px minmax(0,1fr);gap:3px;padding:1px 12px 3px}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-actions .cockpit-key{min-height:44px;padding:4px 10px;gap:3px}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-port{bottom:4px}
 body.has-cockpit-controls[data-space-theme] #cockpitControls #spaceSettingsButton{bottom:10px}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-focus-key{bottom:22px}
}

@media(min-width:761px){body.has-cockpit-controls[data-space-theme]:not([data-cockpit-shell=earth]):not([data-cockpit-shell=lunar]):not([data-cockpit-shell=starship]) #cockpitControls .cockpit-display{background:linear-gradient(107deg,#06131c,#0c202c,#07131c);border:1px solid #b1c9d055;border-top-color:#e0ebe779;border-radius:9px;box-shadow:0 0 0 3px #263e4dbf,inset 0 2px 5px #0008}}

/* R14: the three destinations are the primary command keys. The working
   commands sit beneath them, on the same sloped glass and within its aperture. */
#cockpitControls .cockpit-display-top{display:block;border-bottom:0;padding:0;min-height:0}
#cockpitControls .cockpit-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;height:100%;width:100%}
#cockpitControls .cockpit-readout{display:none}
body.has-cockpit-controls #cockpitControls .cockpit-nav .cockpit-key{height:100%;min-height:44px;flex-direction:column;gap:5px;padding:7px 10px;border:1px solid #a6c5d04d;border-top-color:#d4e3e685;border-bottom-color:#030e18;border-radius:5px;background:linear-gradient(178deg,#4c6570 0,#243e4b 5%,#132c38 87%,#0c202c);box-shadow:inset 0 1px #e8f6ef40,inset 0 -1px #405b675c,0 3px 0 #030d15,0 4px 4px #0008;color:#d6e3e8;text-shadow:0 1px 1px #0008}
#cockpitControls .cockpit-nav .cockpit-key-code{display:block;font-size:9px;line-height:1.1;letter-spacing:1.8px;color:#9cbcc8}
#cockpitControls .cockpit-nav .cockpit-key-label{font-size:16px;line-height:1.2;letter-spacing:.6px;font-weight:550}
#cockpitControls .cockpit-nav .cockpit-key-indicator{display:block;left:11px;top:11px;width:3px;height:3px}
body.has-cockpit-controls #cockpitControls .cockpit-nav .cockpit-key:hover:not(:disabled){border-color:#d0e5e6b3;background:linear-gradient(178deg,#718891,#365361 6%,#1a3543 95%);color:#f3f5ef}
body.has-cockpit-controls #cockpitControls .cockpit-nav .cockpit-key[aria-current=page]{background:linear-gradient(178deg,#10232f,#193542 13%,#112b39);border-color:var(--cockpit-key-light);border-top-color:#2a4b5b;box-shadow:inset 0 3px 6px #0009,inset 0 -2px var(--cockpit-key-light),0 1px 0 #b2cbd355;color:#f4f4e8}
#cockpitControls .cockpit-nav .cockpit-key[aria-current=page] .cockpit-key-code{color:var(--cockpit-key-light)}
#cockpitControls .cockpit-nav .cockpit-key[aria-current=page] .cockpit-key-indicator{background:var(--cockpit-key-light);box-shadow:0 0 6px #b8deec66}
body.has-cockpit-controls #cockpitControls .cockpit-nav .cockpit-key:active:not(:disabled){transform:translateY(2px);box-shadow:inset 0 3px 6px #000a,0 1px #acc7d355}
body.has-cockpit-controls #cockpitControls .cockpit-actions .cockpit-key{flex-direction:row;gap:9px;min-height:28px;padding:5px 12px;border-color:#89aab83d;border-top-color:#bdd1d44d;border-radius:4px;background:linear-gradient(#142b37,#0a1d29);box-shadow:inset 0 1px #cce7ec0d,0 1px #020e18}
#cockpitControls .cockpit-actions .cockpit-key-code{font-size:7px;letter-spacing:1px}
#cockpitControls .cockpit-actions .cockpit-key-label{font-size:12px;letter-spacing:.3px}
#cockpitControls .cockpit-actions .cockpit-key-indicator{left:8px;top:50%;transform:translateY(-50%);width:2px;height:2px}
body.has-cockpit-controls #cockpitControls .cockpit-actions .cockpit-key[aria-busy=true]{color:#f4deb0;border-color:#d9bd7f99;background:linear-gradient(#394334,#1d3035)}
#cockpitControls #spaceSettingsButton .cockpit-key-label{font-size:10px;letter-spacing:0}
@media(min-width:761px){
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-display{grid-template-rows:minmax(44px,1fr) 30px;gap:6px;padding:3px 8px 5px;transform-origin:50% 100%;transform:perspective(760px) rotateX(26deg) scaleY(1.19);border-radius:7px;background:linear-gradient(111deg,#06131d,var(--cockpit-key-recess,#0b202b) 46%,#07131b);box-shadow:inset 0 3px 6px #000b,inset 0 -1px var(--cabin-edge-soft,#b6d7e026)}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-display::after{display:block;border:0;border-radius:inherit;z-index:2;background:linear-gradient(112deg,transparent 9%,#e9f8ff04 30%,#dbeeff0d 30.2%,transparent 58%);pointer-events:none}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls .cockpit-display{grid-template-rows:44px minmax(24px,1fr);gap:3px;padding:1px 8px 3px}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls .cockpit-nav .cockpit-key{min-height:44px;padding:4px 8px;gap:4px}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls .cockpit-nav .cockpit-key-label{font-size:14px}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls .cockpit-nav .cockpit-key-code{font-size:8px}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls .cockpit-actions .cockpit-key{min-height:24px;padding:2px 8px;gap:8px}
 body.has-cockpit-controls[data-space-theme][data-view=studio] #cockpitControls .cockpit-actions .cockpit-key-label{font-size:11px}
}
@media(min-width:761px) and (max-height:700px){
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-display{grid-template-rows:44px minmax(24px,1fr);gap:3px;padding:1px 8px 3px}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-nav .cockpit-key{min-height:44px;padding:4px 8px;gap:4px}
 #cockpitControls .cockpit-nav .cockpit-key-label{font-size:14px}
 #cockpitControls .cockpit-nav .cockpit-key-code{font-size:8px}
 body.has-cockpit-controls[data-space-theme] #cockpitControls .cockpit-actions .cockpit-key{min-height:24px;padding:2px 8px;gap:8px}
 #cockpitControls .cockpit-actions .cockpit-key-label{font-size:11px}
}
@media(min-width:761px) and (max-width:1100px){#cockpitControls .cockpit-nav{gap:7px}#cockpitControls .cockpit-nav .cockpit-key-label{font-size:13px;letter-spacing:0}#cockpitControls .cockpit-actions{gap:7px}#cockpitControls .cockpit-actions .cockpit-key-code{font-size:6px;letter-spacing:.5px}}
@media(max-width:760px){
 #cockpitControls .cockpit-display,body.has-cockpit-controls[data-view=studio] #cockpitControls .cockpit-display{grid-template-rows:49px minmax(44px,1fr);gap:5px;padding:3px 5px 7px}
 #cockpitControls .cockpit-nav{gap:4px;height:49px}
 body.has-cockpit-controls #cockpitControls .cockpit-nav .cockpit-key{min-height:49px;height:49px;gap:4px;padding:5px 2px}
 #cockpitControls .cockpit-nav .cockpit-key-code{display:block;font-size:6px;letter-spacing:.6px}
 #cockpitControls .cockpit-nav .cockpit-key-label{font-size:12px;letter-spacing:0}
 #cockpitControls .cockpit-nav .cockpit-key-indicator{left:4px;top:5px;width:2px;height:2px}
 body.has-cockpit-controls #cockpitControls .cockpit-actions .cockpit-key,body.has-cockpit-controls[data-view=studio] #cockpitControls .cockpit-actions .cockpit-key{flex-direction:column;min-height:44px;padding:4px 2px;gap:4px}
 #cockpitControls .cockpit-actions .cockpit-key-code{font-size:6px;letter-spacing:.3px}
 #cockpitControls .cockpit-actions .cockpit-key-label{font-size:10px;letter-spacing:0}
 #cockpitControls .cockpit-actions .cockpit-key-indicator{top:6px;left:4px;transform:none}
 #cockpitControls #spaceSettingsButton .cockpit-key-label{font-size:8px}
}