.hangar-body {
    margin:0;
    background:#071015;
    color:#ecf4ee;
    font-family:system-ui,sans-serif;
}
.hangar-console {
    --hc-mint:#a8ffdf;
    --hc-text:#f1f8ee;
    --hc-line:#91b3b342;
    --hc-dim:#aac1bf;
    --hc-gutter:clamp(16px,3.7vw,66px);
    --hc-mono:ui-monospace,Consolas,monospace;
    background:radial-gradient(ellipse at 17% 19%,#13272b,transparent 47%),#091418;
    min-height:100svh;
}
.hc-mast,.hc-board,.hc-archive {max-width:2020px;margin-inline:auto}
.hc-mast {
    display:flex;align-items:center;gap:clamp(12px,3vw,42px);padding:15px var(--hc-gutter);
    border-bottom:1px solid var(--hc-line);min-height:58px;
}
.hc-mast a {text-decoration:none;color:var(--hc-text)}
.hc-brand {font:800 clamp(16px,1.6vw,23px)/1 system-ui,sans-serif;letter-spacing:-.075em;white-space:nowrap}
.hc-brand span,.hc-intro h1 span,.hc-primary b {color:var(--hc-mint)}
.hc-dept,.hc-mast [data-return],.hc-overline,.hc-sizes>span,.hc-frame,.hc-status,.hc-keys button,.hc-primary,.hc-archive summary {
    font:600 11px/1.4 var(--hc-mono);letter-spacing:.055em;
}
.hc-dept {display:inline-flex;align-items:center;gap:9px;color:var(--hc-dim)}
.hc-dept i {width:7px;height:7px;background:var(--hc-mint);box-shadow:0 0 11px #a8ffdf77}
.hc-mast [data-return] {margin-left:auto;color:#dcebe5}
.hc-mast [data-return] span {color:var(--hc-mint);margin-right:6px}
.hc-mast [data-return]:hover,.hc-archive summary:hover {color:var(--hc-mint)}
.hc-board {padding:clamp(16px,2.4vh,30px) var(--hc-gutter) 0}
.hc-intro {display:flex;justify-content:space-between;align-items:flex-end;gap:15px;padding-bottom:clamp(12px,2vw,24px)}
.hc-overline {display:block;color:var(--hc-dim);margin:0;text-transform:uppercase}
.hc-intro h1 {font:580 clamp(36px,4.8vw,84px)/1.02 Hangar,'Arial Narrow',sans-serif;letter-spacing:-.045em;margin:5px 0 0;color:var(--hc-text)}
.hc-sizes {display:flex;align-items:center;border:1px solid var(--hc-line);padding:4px}
.hc-sizes>span {color:var(--hc-dim);padding-inline:8px 16px}
.hc-sizes abbr {text-decoration:none;color:#758c89}
.hc-sizes button {
    border:0;background:none;color:#cddad4;min-width:44px;min-height:40px;
    font:600 16px/1 var(--hc-mono);cursor:pointer;
}
.hc-sizes button:hover {background:#203b38;color:var(--hc-mint)}
.hc-sizes button[aria-pressed=true] {background:var(--hc-mint);color:#10251e}
.hc-aperture {
    position:relative;isolation:isolate;overflow:hidden;border:1px solid var(--hc-line);
    background:#101e22;
}
.hc-aperture .viewer {
    position:relative;inset:auto;width:100%;height:clamp(345px,52svh,760px);min-height:0;overflow:hidden;border:0;
    background:radial-gradient(ellipse at 46% 31%,#26404a 0%,#13272d 44%,#09181d 82%);
}
.hc-aperture .viewer canvas,.hc-aperture .viewer .poster {position:absolute;inset:0;height:100%;width:100%;display:block}
.hc-aperture .viewer .poster {
    opacity:1;background:linear-gradient(0deg,#07131890,transparent 26%,transparent 84%,#07131880),url(hangar.webp) center 61%/cover no-repeat;
    transition:opacity .3s ease;
}
.hc-aperture .viewer canvas {opacity:0;touch-action:pan-y;cursor:grab;transition:opacity .3s ease}
.hc-aperture .viewer canvas:active {cursor:grabbing}
.hc-aperture .viewer[data-state=ready] canvas {opacity:1}
.hc-aperture .viewer[data-state=ready] .poster {opacity:0;pointer-events:none}
.hc-bracket {width:17px;height:17px;border:0 solid var(--hc-mint);position:absolute;pointer-events:none;z-index:2}
.hc-nw {top:9px;left:9px;border-left-width:2px;border-top-width:2px}
.hc-ne {top:9px;right:9px;border-right-width:2px;border-top-width:2px}
.hc-sw {bottom:9px;left:9px;border-left-width:2px;border-bottom-width:2px}
.hc-se {bottom:9px;right:9px;border-right-width:2px;border-bottom-width:2px}
.hc-frame {position:absolute;z-index:2;left:22px;top:20px;pointer-events:none;font-size:9px;color:#e0ede9;background:#08181dc4;padding:4px 7px}
.hc-scale {position:absolute;bottom:14px;left:35%;width:30%;height:5px;background:repeating-linear-gradient(to right,#b9e3db85 0 1px,transparent 1px 11px);pointer-events:none}
.hc-under {display:flex;align-items:flex-start;justify-content:space-between;gap:15px;padding:10px 0 14px;border-bottom:1px solid var(--hc-line)}
.hc-under p {margin:0;line-height:1.4}
.hc-under #hc-guide {font-size:13px;color:var(--hc-dim)}
.hc-status {color:var(--hc-mint);text-align:right;min-width:12ch}
.hc-status:before {content:'';display:inline-block;width:5px;height:5px;margin-right:7px;background:currentColor}
.hc-deck {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(165px,.75fr) minmax(220px,.8fr);gap:clamp(12px,2vw,34px);align-items:center;padding:16px 0}
.hc-controls h2,.hc-checks h2 {font:600 10px/1.4 var(--hc-mono);letter-spacing:.12em;margin:0 0 9px}
.hc-keys {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border:1px solid var(--hc-line)}
.hc-keys button {
    color:var(--hc-text);background:linear-gradient(#172629,#101d20);border:0;border-right:1px solid var(--hc-line);position:relative;
    min-height:64px;padding:8px 3px;display:grid;place-content:center;justify-items:center;gap:4px;cursor:pointer;
}
.hc-keys button:last-child {border-right:0}
.hc-keys button:hover,.hc-keys button:focus-visible {background:#233a3b}
.hc-keys button svg {width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.hc-keys button span {font:600 clamp(9px,.9vw,13px)/1.3 system-ui,sans-serif;letter-spacing:0}
.hc-control-state {font:500 11px/1.15 system-ui,sans-serif;color:#aac0bb;letter-spacing:0;min-height:1.15em}
.hc-control-state i {font-style:normal}
.hc-control-state i:last-child,.hc-keys button[aria-pressed=true] .hc-control-state i:first-child {display:none}
.hc-keys button[aria-pressed=true] .hc-control-state i:last-child {display:inline;color:var(--hc-mint)}
.hc-keys button:disabled .hc-control-state {visibility:hidden}
.hc-keys button[aria-pressed=true] {color:var(--hc-mint);background:linear-gradient(#24413d,#18342f)}
.hc-keys button[aria-pressed=true]:before {content:'';position:absolute;top:0;left:12%;right:12%;height:2px;background:var(--hc-mint)}
.hc-keys button:disabled {opacity:.48;cursor:default}
.hc-checks {padding-left:clamp(12px,1.4vw,28px);border-left:1px solid var(--hc-line)}
.hc-checks ul {list-style:none;margin:0;padding:0}
.hc-checks li {font-size:12px;line-height:1.6;color:#c0d1c8}
.hc-checks li:before {content:'○';margin-right:8px;color:#7c9b97;font:12px var(--hc-mono)}
.hc-checks li[data-done=true]:before {content:'✓';color:var(--hc-mint)}
.hc-next small {display:block;font:11px/1.4 system-ui,sans-serif;color:var(--hc-dim);margin-top:5px;max-width:38ch}
.hc-special {display:none}.hangar-console[data-length="45"] .hc-special {display:inline}
.hc-primary {display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;min-height:44px;background:var(--hc-mint);color:#10231b;text-decoration:none}
.hc-primary:hover {background:#ccffec}.hc-primary b{color:inherit}
.hc-archive {padding:0 var(--hc-gutter) 16px}
.hc-archive summary {display:flex;align-items:center;justify-content:space-between;padding:13px 0;cursor:pointer;color:#afc6c4;border-top:1px solid var(--hc-line);list-style:none}
.hc-archive summary::-webkit-details-marker {display:none}
.hc-archive[open] summary span:last-child {transform:rotate(45deg)}
.hc-archive>div {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hc-archive figure {margin:0;border:1px solid var(--hc-line);background:#0b1a20}
.hc-archive img {display:block;width:100%;height:clamp(120px,17vw,245px);object-fit:contain;background:#071318}
.hc-archive figcaption {padding:8px 10px;font-size:12px;color:var(--hc-dim)}
.hc-static {color:#c4d7cf;font-size:13px}.hc-static a {display:inline-block;padding:8px 12px}
.hangar-console :is(a,button,canvas,summary):focus-visible {outline:2px solid var(--hc-mint);outline-offset:3px}
@media(max-width:900px){
    .hc-deck {grid-template-columns:minmax(0,1fr) minmax(185px,.55fr);gap:16px}
    .hc-checks {order:2;border:0;padding:0;grid-column:1/-1}
    .hc-checks ul {display:flex;gap:8px 18px;flex-wrap:wrap}
    .hc-checks h2 {margin-bottom:4px}
}
@media(max-width:600px){
    .hc-mast {min-height:46px;padding:11px var(--hc-gutter)}.hc-dept {display:none}
    .hc-mast [data-return] {font-size:10px}
    .hc-intro {align-items:flex-start;flex-direction:column;gap:12px}
    .hc-intro h1 {font-size:clamp(32px,9.3vw,51px)}
    .hc-sizes {align-self:stretch;padding:2px}.hc-sizes>span {margin-right:auto;padding-inline:10px}
    .hc-sizes button {min-height:38px;min-width:48px}
    .hc-aperture .viewer {height:clamp(265px,37svh,400px)}
    .hc-frame {font-size:8px;left:14px;top:13px}
    .hc-under {flex-direction:column;gap:5px;padding:8px 0 10px}
    .hc-under #hc-guide {font-size:12px}.hc-status{text-align:left;font-size:10px}
    .hc-deck {grid-template-columns:minmax(0,1fr);gap:12px;padding:12px 0}
    .hc-controls h2,.hc-checks h2 {margin-bottom:5px}
    .hc-keys button {min-height:65px;gap:3px}.hc-keys button span {font-size:11px}
    .hc-control-state {font-size:10px}
    .hc-next,.hc-checks {grid-column:1}
    .hc-checks ul {gap:4px 10px}.hc-checks li {font-size:11px}
    .hc-checks li:before {margin-right:3px}
    .hc-next small {max-width:none}
    .hc-archive>div {grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
    .hangar-console *,.hangar-console *:before,.hangar-console *:after {animation:none!important;transition:none!important}
}

/* The display toggle occupies the same header position in either mode. */
.hc-cinema {
    display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:6px 12px;
    border:1px solid var(--hc-line);background:#14272a;color:var(--hc-text);cursor:pointer;
    font:600 12px/1.2 var(--hc-mono);white-space:nowrap;
}
.hc-cinema svg {width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}
.hc-cinema:hover,.hc-cinema[aria-pressed=true] {border-color:var(--hc-mint);color:var(--hc-mint)}
.hc-cinema span:last-child,.hc-cinema[aria-pressed=true] span:first-of-type {display:none}
.hc-cinema[aria-pressed=true] span:last-child {display:inline}
body:has(.hangar-console[data-cinema=on]) {overflow:hidden}
.hangar-console[data-cinema=on] {
    position:fixed;inset:0;z-index:1000;min-height:0;width:100%;height:100vh;height:100dvh;
    display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto minmax(0,1fr) auto;
    overflow:hidden;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}
.hangar-console[data-cinema=on] .hc-board {display:contents}
.hangar-console[data-cinema=on] .hc-mast {
    grid-area:1 / 1;min-height:46px;width:100%;max-width:none;margin:0;
    padding:4px clamp(10px,2vw,32px);gap:clamp(8px,2vw,24px);border-bottom:0;
}
.hangar-console[data-cinema=on] .hc-mast [data-return],
.hangar-console[data-cinema=on] .hc-intro>div:first-child,.hangar-console[data-cinema=on] .hc-archive {display:none}
.hangar-console[data-cinema=on] .hc-cinema {margin-left:auto}
.hangar-console[data-cinema=on] .hc-intro {grid-area:1 / 2;display:grid;align-content:center;justify-content:end;padding:3px clamp(10px,2vw,32px) 3px 0}
.hangar-console[data-cinema=on] .hc-sizes {padding:0;border:0}
.hangar-console[data-cinema=on] .hc-sizes button {min-width:42px;min-height:38px}
.hangar-console[data-cinema=on] .hc-aperture {grid-area:2 / 1 / 3 / -1;min-width:0;min-height:0;border-width:1px 0}
.hangar-console[data-cinema=on] .viewer {width:100%;height:100%;min-height:0;max-height:none}
.hangar-console[data-cinema=on] .hc-under {
    position:absolute;overflow:hidden;width:1px;height:1px;clip-path:inset(50%);padding:0;border:0;
}
.hangar-console[data-cinema=on] .hc-deck {
    grid-area:3 / 1 / 4 / -1;grid-template-columns:minmax(310px,1fr) minmax(150px,.45fr) minmax(180px,.65fr);
    gap:clamp(8px,2vw,32px);padding:7px clamp(10px,2vw,32px);background:#0a181d;
}
.hangar-console[data-cinema=on] .hc-controls h2,.hangar-console[data-cinema=on] .hc-checks h2,
.hangar-console[data-cinema=on] .hc-next small {display:none}
.hangar-console[data-cinema=on] .hc-keys button {min-height:56px;padding:4px 2px;gap:2px}
.hangar-console[data-cinema=on] .hc-checks {grid-column:auto;order:initial}
.hangar-console[data-cinema=on] .hc-checks ul {display:block}
@media(max-width:900px){
    .hangar-console[data-cinema=on] .hc-deck {grid-template-columns:minmax(0,1fr) minmax(145px,28%)}
    .hangar-console[data-cinema=on] .hc-checks {display:none}
    .hangar-console[data-cinema=on] .hc-next {grid-column:auto}
}
@media(max-width:600px){
    .hc-mast {gap:9px}.hc-cinema {padding:5px 7px;font-size:10px;gap:4px}
    .hangar-console[data-cinema=on] .hc-sizes>span {padding:0 5px 0 0;font-size:9px}
    .hangar-console[data-cinema=on] .hc-sizes button {min-width:35px;font-size:14px}
    .hangar-console[data-cinema=on] .hc-deck {grid-template-columns:minmax(0,1fr);gap:5px;padding:6px 8px}
    .hangar-console[data-cinema=on] .hc-keys button {min-height:54px}
    .hangar-console[data-cinema=on] .hc-primary {min-height:40px;padding:7px 12px}
}
@media(max-height:420px) and (orientation:landscape){
    .hangar-console[data-cinema=on] .hc-mast {min-height:38px}
    .hangar-console[data-cinema=on] .hc-deck {padding-block:3px}
    .hangar-console[data-cinema=on] .hc-keys button {min-height:47px;gap:0}
    .hangar-console[data-cinema=on] .hc-keys button svg {width:13px;height:13px}
}
@media(max-width:370px){
    .hc-mast {gap:6px;padding-inline:9px}
    .hc-brand {font-size:13px}
    .hangar-console[data-cinema=on] .hc-brand {font-size:12px}
    .hangar-console[data-cinema=on] .hc-sizes abbr {display:none}
}

/* A handheld inspection console has a separate thumb rail. The renderer still
   measures the actual viewer, not a taller rectangle obscured by orbit tools. */
@media(max-width:650px),(orientation:landscape) and (max-height:540px) and (max-width:1000px){
    .hangar-console {--hc-gutter:clamp(10px,3.5vw,22px);--hc-rail:46px}
    .hc-mast {display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;min-height:54px;gap:7px;
        padding: max(5px,env(safe-area-inset-top)) max(var(--hc-gutter),env(safe-area-inset-right)) 5px max(var(--hc-gutter),env(safe-area-inset-left))}
    .hc-mast .hc-dept {display:none}
    .hc-mast [data-return],.hangar-console[data-cinema=on] .hc-mast [data-return] {
        display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin:0;color:#ddede3;font-size:10px;letter-spacing:0;
    }
    .hc-mast [data-return] span {margin-right:4px}
    .hc-mast .hc-cinema {margin:0;min-height:44px;font-size:10px;letter-spacing:0;padding:5px 8px;gap:5px}
    .hc-board {padding-left:max(var(--hc-gutter),env(safe-area-inset-left));padding-right:max(var(--hc-gutter),env(safe-area-inset-right))}
    .hc-aperture:has(.viewer[data-orbit]) {padding-bottom:var(--hc-rail)}
    .hc-aperture .viewer {overflow:visible}
    .hc-aperture .viewer .poster {background:linear-gradient(0deg,#06181b40,transparent 32%),url(hangar.webp) center / contain no-repeat,radial-gradient(ellipse at 50% 45%,#263d42,#0d1d23)}
    .hc-aperture .viewer .orbit-tools {
        position:absolute;top:100%;bottom:auto;left:0;right:0;z-index:2;height:var(--hc-rail);
        display:flex;align-items:stretch;justify-content:stretch;gap:2px;
        padding:0 2px;border:0;border-top:1px solid #73949061;background:#102329;
    }
    .hc-aperture .viewer .orbit-tools[hidden]{display:none}
    .hc-aperture .viewer .orbit-tools>span {display:none}
    .hc-aperture .viewer .orbit-tools button {
        flex:1 1 0;min-width:0;min-height:44px;margin:0;padding:3px 2px;font-size:11px;
    }
    .hc-aperture .viewer .orbit-tools :is([data-roof],[data-turn="0"]) {flex-grow:1.25}
    .hc-aperture:has(.viewer[data-orbit]) :is(.hc-sw,.hc-se) {bottom:calc(var(--hc-rail) + 7px)}
    .hc-scale {display:none}
    .hc-frame {font-size:8px;left:13px;top:11px}
    .hc-controls .hc-keys {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3px;padding:3px;background:#0f2127;border-color:#5e7a7277}
    .hc-controls .hc-keys button {
        grid-column:span 2;min-height:47px;min-width:0;border:1px solid #66847d71;border-radius:2px;
        display:grid;grid-template-columns:auto minmax(0,auto);grid-template-rows:auto auto;align-content:center;justify-content:center;
        gap:1px 5px;padding:4px 2px;text-align:left;justify-items:start;
    }
    .hc-controls .hc-keys button:nth-child(-n+2){grid-column:span 3}
    .hc-controls .hc-keys button svg {grid-column:1;grid-row:1 / span 2;align-self:center;width:16px;height:16px}
    .hc-controls .hc-keys button span {grid-column:2;grid-row:1;font-size:clamp(10px,2.65vw,12px);line-height:1.15;letter-spacing:0}
    .hc-controls .hc-keys button .hc-control-state {grid-column:2;grid-row:2;line-height:1.1;font-size:10px;letter-spacing:0}
    .hc-controls h2,.hc-checks h2 {letter-spacing:.085em}
    .hc-primary {min-height:46px}
    .hc-next small {margin-top:5px}
    .hangar-console[data-state=fallback] :is(.hc-controls,.hc-checks,#hc-guide) {display:none}
    .hangar-console[data-state=fallback] .hc-next {grid-column:1/-1}
    .hc-archive {padding-inline:max(var(--hc-gutter),env(safe-area-inset-left)) max(var(--hc-gutter),env(safe-area-inset-right));
        padding-bottom:max(15px,env(safe-area-inset-bottom))}
    .hc-archive summary {min-height:46px}
    .hangar-console[data-cinema=on] .hc-aperture .viewer {width:100%;height:100%}
}
@media(max-width:650px){
    .hc-board {padding-top:12px}
    .hc-intro {display:grid;grid-template-columns:1fr;gap:8px;padding-bottom:8px}
    .hc-intro h1 {font-size:clamp(30px,7.3vw,43px);margin:2px 0 0}
    .hc-intro .hc-overline {font-size:9px}
    .hc-intro .hc-sizes {display:grid;grid-template-columns:minmax(0,1fr) repeat(3,minmax(44px,.55fr));align-items:stretch;padding:2px}
    .hc-intro .hc-sizes>span {align-self:center;font-size:10px;padding:0 5px}
    .hc-intro .hc-sizes button {min-height:44px;min-width:44px;font-size:15px}
    .hc-aperture .viewer {height:clamp(213px,36svh,368px)}
    .hc-under {display:grid;gap:4px;padding:7px 0}
    .hc-under #hc-guide {font-size:11px}.hc-under .hc-status {min-width:0;font-size:10px;text-align:left}
    .hc-deck {display:grid;grid-template-columns:1fr;gap:10px;padding:9px 0 14px}
    .hc-next,.hc-checks {grid-column:1}
    .hc-checks {padding:8px 0 0;border-top:1px solid var(--hc-line);order:3}
    .hc-checks li {font-size:11px}.hc-controls h2 {margin-bottom:5px}
    .hangar-console[data-cinema=on] {
        grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto;
    }
    .hangar-console[data-cinema=on] .hc-mast {grid-area:1/1;gap:6px;min-height:50px;padding:3px var(--hc-gutter);border-bottom:1px solid var(--hc-line)}
    .hangar-console[data-cinema=on] .hc-mast .hc-cinema {margin:0}
    .hangar-console[data-cinema=on] .hc-intro {grid-area:2/1;display:block;padding:3px var(--hc-gutter)}
    .hangar-console[data-cinema=on] .hc-sizes {width:100%;border:0;padding:0}
    .hangar-console[data-cinema=on] .hc-sizes>span {margin:0}
    .hangar-console[data-cinema=on] .hc-sizes button {min-height:44px;min-width:44px}
    .hangar-console[data-cinema=on] .hc-aperture {grid-area:3/1;border-inline:0}
    .hangar-console[data-cinema=on] .hc-deck {grid-area:4/1;grid-template-columns:1fr;padding:4px var(--hc-gutter) 5px;gap:4px}
    .hangar-console[data-cinema=on] .hc-keys button {min-height:44px;padding:3px 2px}
    .hangar-console[data-cinema=on] .hc-primary {min-height:44px}
}
@media(orientation:landscape) and (max-height:540px) and (max-width:1000px){
    .hangar-console {--hc-gutter:clamp(10px,2.3vw,21px);--hc-rail:44px;--hc-side:clamp(169px,26.5vw,264px)}
    .hc-board {display:grid;grid-template-columns:minmax(0,1fr) var(--hc-side);grid-template-areas:"heading sizes" "stage panel" "guide guide";align-items:start;gap:7px 11px;padding-top:7px}
    .hc-intro {display:contents}
    .hc-intro>div:first-child {grid-area:heading;align-self:center}
    .hc-intro h1 {margin:0;font-size:clamp(25px,3.8vw,37px)}
    .hc-intro .hc-overline {font-size:8px}
    .hc-intro .hc-sizes {grid-area:sizes;align-self:center;width:100%;display:grid;grid-template-columns:1fr repeat(3,minmax(44px,1fr));margin:0;padding:1px}
    .hc-sizes>span {padding:0 3px;align-self:center;font-size:9px;letter-spacing:0}.hc-sizes abbr{display:none}
    .hc-sizes button {font-size:14px;min-width:44px;min-height:44px}
    .hc-aperture {grid-area:stage;align-self:stretch;display:grid}
    .hc-aperture .viewer {height:clamp(160px,calc(100svh - 162px),315px);align-self:stretch}
    .hc-under {grid-area:guide;display:flex;gap:10px;padding:3px 0 8px;border:0}
    .hc-deck {grid-area:panel;display:flex;flex-direction:column;align-items:stretch;align-self:start;gap:8px;padding:0}
    .hc-controls .hc-keys {grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
    .hc-controls .hc-keys button,.hc-controls .hc-keys button:nth-child(-n+2){grid-column:span 1;min-height:43px}
    .hc-controls .hc-keys button:last-child {grid-column:1/-1}
    .hc-controls .hc-keys button span {font-size:11px}
    .hc-checks {order:3;border:0;padding:0}
    .hc-checks h2 {display:none}.hc-checks ul{display:flex;gap:2px 8px;flex-wrap:wrap}.hc-checks li{font-size:10px}
    .hc-next small {font-size:10px}
    .hangar-console[data-cinema=on]{grid-template-columns:minmax(0,1fr) var(--hc-side);grid-template-rows:auto minmax(0,1fr)}
    .hangar-console[data-cinema=on] .hc-mast {grid-area:1/1;min-height:48px;gap:5px;padding:2px var(--hc-gutter);border-bottom:1px solid var(--hc-line)}
    .hangar-console[data-cinema=on] .hc-intro {grid-area:1/2;display:grid;padding:0 4px 0 2px;align-content:center}
    .hangar-console[data-cinema=on] .hc-sizes {min-width:0;width:100%;margin:0}
    .hangar-console[data-cinema=on] .hc-sizes button {min-height:44px;min-width:44px}
    .hangar-console[data-cinema=on] .hc-aperture {grid-area:2/1;border:0;border-right:1px solid var(--hc-line)}
    .hangar-console[data-cinema=on] .hc-deck {
        grid-area:2/2;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;
        min-height:0;gap:8px;padding:6px;overflow:auto;overscroll-behavior:contain;
    }
    .hangar-console[data-cinema=on] .hc-keys button {min-height:44px;padding:2px;gap:1px 4px}
    .hangar-console[data-cinema=on] .hc-keys button svg {width:16px;height:16px}
    .hangar-console[data-cinema=on] .hc-primary {min-height:44px}
    .hangar-console[data-cinema=on][data-state=fallback] .hc-deck {justify-content:end}
}
@media(max-width:650px){
    /* The live status gives the current touch action; the fuller device guide
       remains attached to the canvas for assistive technology. */
    .hc-under #hc-guide {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
}
@media(max-width:360px){
    .hc-mast .hc-cinema {font-size:9px;padding-inline:4px;gap:3px}
    .hc-mast .hc-cinema svg {width:14px;height:14px}
}
@media(orientation:landscape) and (max-height:540px) and (max-width:1000px){
    .hangar-console[data-cinema=on] .hc-deck {align-self:stretch}
}

/* Inspection bay: an optical window in a workshop wall, with a separate operator console. */
.hangar-console {
    --hc-amber:#f1ce8c;--hc-mint:#b3efdc;
    background-color:#111d20;
    background-image:linear-gradient(180deg,#07131748,#09171bc9 33em,#101c1fe8 60em),
        linear-gradient(105deg,#0816198c,#08161942 52%,#0b191ede),url(workshop-wall.webp);
    background-size:100% 100%,100% 100%,auto clamp(390px,43vw,800px);
    background-position:center,center,center top;
    background-repeat:no-repeat;
}
.hc-mast {background:linear-gradient(180deg,#101e21de,#132126bb);box-shadow:0 1px #061012}
.hc-board[data-bay-studio] {max-width:1740px}
.hc-intro .hc-heading .hc-overline {display:flex;align-items:center;gap:10px;color:#f3d39b;font-size:10px;letter-spacing:.13em}
.hc-heading .hc-overline i {width:25px;height:4px;background:repeating-linear-gradient(120deg,#f4cf87 0 4px,transparent 4px 7px)}
.hc-heading h1 {font-size:clamp(40px,5.25vw,84px);font-weight:650;letter-spacing:-.036em;text-shadow:0 2px 16px #061218a8}
.hc-heading h1 em {color:#d7ded2;font-style:normal;font-weight:450}
.hc-sizes {border-color:#688079;background:#101d20d9;border-radius:4px;box-shadow:inset 0 1px #8eaaa330,0 3px 9px #02090a45}
.hc-aperture {background:#122025;border-color:#6e827c;box-shadow:0 2px #090f12,0 4px #54635d,0 6px 15px #060c0caa}
.hc-stagecap,.hc-panelhead,.hc-tickethead {display:flex;align-items:center;justify-content:space-between;gap:8px}
.hc-stagecap {
    min-height:35px;color:#d9dfcf;padding:7px 15px 7px 24px;
    background:linear-gradient(180deg,#435354 0%,#293a3c 48%,#233234 51%,#293638);
    border-bottom:1px solid #070e11;font:600 11px/1.3 var(--hc-mono);
}
.hc-stagecap>span {position:relative;letter-spacing:.045em}
.hc-stagecap>span::before {content:'';position:absolute;left:-12px;top:.38em;width:5px;height:5px;border-radius:50%;background:#f4cc7c;box-shadow:0 0 6px #d5ab68}
.hc-stagecap b {color:#e8ecdf;font-size:12px;letter-spacing:.025em}
.hc-stagecap output {color:#ffdfa2;font:inherit}
.hangar-console:not([data-cinema=on]) :is(.hc-nw,.hc-ne) {top:43px}
.hangar-console:not([data-cinema=on]) .hc-frame {top:48px}
.hc-panelhead {display:block;margin:0 0 12px}
.hc-panelhead small,.hc-tickethead small,.hc-archive summary small {display:block;font:650 9px/1.35 var(--hc-mono);letter-spacing:.12em}
.hc-panelhead small {color:#b9d2ca}
.hc-panelhead h2,.hc-tickethead h2 {font:580 clamp(25px,2.3vw,37px)/1.04 Hangar,sans-serif;letter-spacing:-.02em;margin:3px 0 0}
.hc-controls {
    position:relative;padding:clamp(12px,1.15vw,20px);border:1px solid #677e79;border-radius:5px;
    background:radial-gradient(ellipse at top right,#5d6d662b,transparent 70%),linear-gradient(148deg,#31403d,#202e30 64%,#19262a);
    box-shadow:inset 0 1px #a3b3a369,inset 0 -4px #111c1d,0 5px 12px #040c0d77;
}
.hc-controls::after {content:'';position:absolute;top:10px;right:11px;width:7px;height:7px;border:1px solid #111f20;border-radius:50%;background:linear-gradient(135deg,#768582 40%,#293735 42% 55%,#63716b 58%);pointer-events:none}
.hc-controls .hc-keys {border:0;background:#142225;gap:5px;border-radius:3px;padding:4px;box-shadow:inset 0 1px 4px #020a0bba}
.hc-controls .hc-keys button {border-radius:3px}
.hc-controls .hc-keys button span {font-size:clamp(12px,.94vw,15px);line-height:1.21}
.hc-controls .hc-keys button .hc-control-state {font-size:11px}
.hc-controls .hc-keys button[aria-pressed=true]::before {left:7px;right:auto;width:5px;height:5px;top:6px;background:#d6ffdb;border-radius:50%;box-shadow:0 0 8px #a5e9ce}
.hc-checks {
    position:relative;padding:15px 17px 13px;border:1px solid #b5b6a3;border-radius:2px;color:#1d302e;
    background:#cfcdb8 url(journal-stock.webp) center/cover;background-blend-mode:luminosity;
    box-shadow:1px 3px 0 #79877c,2px 5px 0 #263432,3px 7px 10px #0409095e;
}
.hc-checks::after {content:'';position:absolute;right:15px;top:-4px;width:31px;height:7px;border-radius:2px;background:linear-gradient(#9caa9c,#485a52 45%,#b6baac 76%,#777f72);box-shadow:0 2px 4px #2038314d}
.hc-tickethead {align-items:end;padding-bottom:9px;border-bottom:1px solid #76897d80}
.hc-tickethead small {color:#40584d}.hc-tickethead h2 {color:#223c34}
.hc-tickethead output {color:#2c4b41;border:1px solid #72867a;padding:3px 7px;font:650 13px/1.15 var(--hc-mono);white-space:nowrap}
.hc-checks ul {margin-top:5px}.hc-checks li {font:500 13px/1.4 system-ui;color:#263d33;padding:5px 0;border-bottom:1px solid #71867855}
.hc-checks li:last-child {border:0}
.hc-checks li::before {display:inline-grid;place-items:center;vertical-align:middle;content:'';width:14px;height:14px;margin-right:7px;border:1px solid #526d60;color:#193f30;line-height:1}
.hc-checks li[data-done=true]::before {content:'✓';color:#164332;background:#8baf99}
.hc-next .hc-primary {width:100%;min-height:49px;font:650 clamp(13px,1vw,15px)/1.25 system-ui;letter-spacing:0}
.hc-next .hc-primary b {font:600 21px/1 var(--hc-mono)}
.hc-archive {margin-block:14px 0}
.hc-archive summary {padding:10px 15px;color:#e0e9dd;background:linear-gradient(110deg,#243536ee,#17272ad9);border:1px solid #61746f88}
.hc-archive summary span {font:560 21px/1.1 Hangar,sans-serif}
.hc-archive summary small {color:#afc5ba;margin-bottom:3px;font-size:8px}
.hc-archive summary i {font:400 20px/1 var(--hc-mono);font-style:normal}
.hc-archive[open] summary i {transform:rotate(45deg)}
.hc-archive[open] summary span:first-child {transform:none}
.hc-archive>div {padding:13px;border:1px solid #71857b63;border-top:0;background:#142225}
.hangar-console[data-cinema=on] :is(.hc-stagecap,.hc-panelhead,.hc-tickethead) {display:none}
.hangar-console[data-cinema=on] :is(.hc-controls,.hc-checks) {padding:0;border:0;box-shadow:none;background:none}
.hangar-console[data-cinema=on] :is(.hc-controls,.hc-checks)::after {display:none}
.hangar-console[data-cinema=on] .hc-checks li {color:#ceded2;border:0;padding:1px 0}
.hangar-console[data-cinema=on] .hc-checks li::before {border-color:#899e94;color:#c7f4db}
@media(min-width:1050px) {
    .hangar-console:not([data-cinema=on]) .hc-board {
        display:grid;grid-template-columns:minmax(0,1fr) clamp(280px,24vw,374px);
        grid-template-areas:"head head" "frame desk" "under desk";gap:0 clamp(15px,1.65vw,28px);
    }
    .hangar-console:not([data-cinema=on]) .hc-intro {grid-area:head;padding-bottom:18px}
    .hangar-console:not([data-cinema=on]) .hc-aperture {grid-area:frame;align-self:start}
    .hangar-console:not([data-cinema=on]) .hc-aperture .viewer {height:clamp(400px,54svh,740px)}
    .hangar-console:not([data-cinema=on]) .hc-under {grid-area:under;align-self:start;padding:9px 0}
    .hangar-console:not([data-cinema=on]) .hc-under .hc-status {max-width:53%;font-size:10px}
    .hangar-console:not([data-cinema=on]) .hc-deck {grid-area:desk;display:flex;flex-direction:column;align-items:stretch;justify-content:start;gap:14px;padding:0}
    .hangar-console:not([data-cinema=on]) .hc-keys {display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
    .hangar-console:not([data-cinema=on]) .hc-keys button {
        display:grid;grid-template-columns:20px minmax(0,1fr);grid-template-rows:auto auto;
        align-content:center;justify-items:start;gap:1px 6px;padding:8px 7px;min-height:53px;text-align:left;
    }
    .hangar-console:not([data-cinema=on]) .hc-keys svg {grid-row:1/3;grid-column:1;align-self:center;width:18px}
    .hangar-console:not([data-cinema=on]) .hc-keys :is(span,small) {grid-column:2}
    .hangar-console:not([data-cinema=on]) .hc-keys button:last-child {grid-column:1/-1;display:flex;justify-content:flex-start;gap:8px;min-height:40px}
    .hangar-console:not([data-cinema=on]) .hc-keys button:last-child small {margin-left:auto}
}
@media(max-width:1049px) {
    .hc-panelhead {margin-bottom:7px}.hc-panelhead small,.hc-tickethead small {font-size:8px}
    .hc-panelhead h2,.hc-tickethead h2 {font-size:24px}
    .hc-controls,.hc-checks {padding:10px}
    .hc-stagecap {min-height:30px;font-size:10px}.hc-stagecap b {font-size:11px}
    .hangar-console:not([data-cinema=on]) .hc-frame {top:40px}
    .hangar-console:not([data-cinema=on]) :is(.hc-nw,.hc-ne) {top:37px}
}
@media(max-width:650px) and (orientation:portrait) {
    .hangar-console:not([data-cinema=on]) .hc-intro {gap:8px}
    .hc-intro .hc-heading .hc-overline {font-size:8px}
    .hc-intro .hc-heading h1 {font-size:clamp(32px,8.3vw,47px);margin-top:5px}
    .hc-controls .hc-keys button span {font-size:clamp(11px,2.95vw,15px)}
    .hc-panelhead {display:flex;align-items:baseline;gap:8px}
    .hc-panelhead small {order:2;margin-left:auto;font-size:7px}
    .hc-checks ul {display:grid}
    .hc-next small {font-size:11px;max-width:100%}
}
@media(orientation:landscape) and (max-height:540px) and (max-width:1000px) {
    .hc-panelhead small,.hc-tickethead small {display:none}
    .hc-panelhead h2,.hc-tickethead h2 {font-size:19px}
    .hc-controls,.hc-checks {padding:6px}
    .hc-controls .hc-keys button span {font-size:11px}
    .hc-controls .hc-keys {padding:2px}
    .hc-checks {margin-top:3px}
    .hc-checks ul {display:grid}
}
.hc-photo-link {display:none}
.hangar-console[data-state=fallback] :is(.hc-controls,.hc-checks) {display:none}
.hangar-console[data-state=fallback]:not([data-cinema=on]) .hc-photo-link {
    display:inline-flex;align-items:center;min-height:44px;color:var(--hc-mint);font:600 13px/1.3 system-ui;
}
@media(min-width:1050px) {
    .hangar-console[data-state=fallback]:not([data-cinema=on]) .hc-deck {
        padding:16px;border:1px solid #566c64;background:#142428e6;align-self:start;
    }
}
@media(forced-colors:active) {
    .hc-tickethead output,.hc-checks li::before {border-color:CanvasText}
    .hc-checks li[data-done=true]::before {color:HighlightText;background:Highlight}
}