@font-face{font-family:Aldrich;src:url('terminal/fonts/aldrich.ttf') format('truetype');font-display:swap}@font-face{font-family:'Zen Dots';src:url('terminal/fonts/zen-dots.ttf') format('truetype');font-display:swap}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#08090f;color:#d7ad90;font-family:Aldrich,sans-serif}button,a{color:inherit;font:inherit}button{cursor:pointer;background:#111017dc;border:1px solid #765944;padding:10px 14px;font-size:11px}button:hover{background:#38282a}button:focus-visible,a:focus-visible{outline:2px solid #d7ad90;outline-offset:4px}[hidden]{display:none!important}#experience{width:100vw;height:100dvh;display:flex;align-items:center;justify-content:center;overflow:hidden}#stage{position:relative;width:min(100vw,calc(100dvh * 1.791667));aspect-ratio:2752/1536;flex:none;transform-origin:50% 54%;transition:transform .65s ease;visibility:hidden}.scene-ready #stage{visibility:visible}#cockpit{display:block;width:100%;height:100%;object-fit:contain}#terminal{position:absolute;left:0;top:0;width:1000px;height:640px;transform-origin:0 0;border:0;background:transparent;opacity:0;transition:opacity .12s;pointer-events:none}.terminal-ready #terminal{opacity:1;pointer-events:auto}#intro{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#08090f;z-index:2}.intro-finished #intro{display:none}#outside-controls{position:fixed;z-index:5;left:3%;right:3%;bottom:20px;display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:10px;letter-spacing:1px}#outside-controls>div{display:flex;gap:8px}.identity{text-decoration:none;font:15px 'Zen Dots',sans-serif}.identity span{font:10px Aldrich,sans-serif;color:#948074;margin-left:8px}#experience-status{color:#a98a73;font-size:9px}#loader{position:fixed;inset:0;z-index:6;background:#08090f;display:grid;place-items:center}.load-inner{width:min(520px,80vw)}.load-inner>span{font-size:10px;letter-spacing:2px;color:#8d786b}.load-inner h1{font:26px/1.6 'Zen Dots',sans-serif;margin:20px 0}.load-inner p{font-size:12px;color:#ad9381;min-height:20px}.load-track{height:2px;background:#38282a;margin:27px 0;overflow:hidden}.load-track i{display:block;width:35%;height:100%;background:#d7ad90;animation:loading 1.4s ease-in-out infinite}#loader #enter{margin-top:8px}.focused #stage{transform:scale(1.8)}#transition{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;background:#100e17}#transition span{position:absolute;left:32%;top:49%;font-size:12px;letter-spacing:3px}.glitch-transition #transition{animation:handoff .34s steps(1,end) both}.glitch-transition #stage{filter:drop-shadow(2px 0 #b65d5d99) drop-shadow(-2px 0 #606a9a66)}.no-script{position:fixed;inset:0;background:#111017;display:grid;place-content:center;z-index:10;padding:30px;line-height:2}.no-script a{display:block}@keyframes loading{0%{transform:translateX(-110%)}100%{transform:translateX(390%)}}@keyframes handoff{0%{opacity:.15;clip-path:inset(25% 0 60%);transform:translateX(-7px)}25%{opacity:.85;clip-path:inset(8% 0 75%);transform:translateX(6px)}50%{opacity:.45;clip-path:inset(48% 0 35%);transform:translateX(-4px)}75%{opacity:.9;clip-path:inset(0);transform:none}100%{opacity:0;clip-path:inset(0)}}
@media(max-width:760px){#stage{width:100vw;height:100dvh;aspect-ratio:auto}#cockpit{object-fit:cover}.focused #stage{transform:none}#terminal{transform:none!important;left:4%;top:10%;width:92%;height:78%;border-radius:10px}.focused #terminal{left:0;top:0;width:100%;height:100%;border-radius:0}#outside-controls{left:12px;right:12px;bottom:12px;gap:8px}.identity{font-size:10px}.identity span,#experience-status{display:none}#outside-controls button{font-size:9px;padding:9px}.focused #outside-controls{justify-content:flex-end;pointer-events:none}.focused #outside-controls .identity,.focused #replay{display:none}.focused #zoom{pointer-events:auto;opacity:.8}#transition span{left:10%;font-size:10px}.load-inner h1{font-size:21px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.glitch-transition #stage{filter:none}.load-track i{width:100%}}

/* Blend the mounted interface into the physical glass, without blurring content. */
#terminal{--glass-edge-x:18px;--glass-edge-y:15px;mask-image:linear-gradient(to right,transparent 0,#000 var(--glass-edge-x),#000 calc(100% - var(--glass-edge-x)),transparent 100%),linear-gradient(to bottom,transparent 0,#000 var(--glass-edge-y),#000 calc(100% - var(--glass-edge-y)),transparent 100%);mask-composite:intersect;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 var(--glass-edge-x),#000 calc(100% - var(--glass-edge-x)),transparent 100%),linear-gradient(to bottom,transparent 0,#000 var(--glass-edge-y),#000 calc(100% - var(--glass-edge-y)),transparent 100%);-webkit-mask-composite:source-in}
.terminal-ready #terminal{opacity:.9}
@media(max-width:760px){#terminal{--glass-edge-x:6px;--glass-edge-y:6px}}
/* Match the inset glass corners rather than the outer bezel. */
@media(min-width:761px){#terminal{border-radius:22px 24px 26px 25px}}

/* Original projection restored. Whole-plane rotation/scale, clipped independently to glass. */
#glass-clip{position:absolute;inset:0;clip-path:polygon(28.75% 37.2%,29.4% 35.65%,68.6% 29.8%,69.3% 30.7%,71.6% 70.3%,71.05% 72.45%,32.1% 77.8%,31.25% 76.4%);pointer-events:none}
#terminal-positioner{position:absolute;inset:0;transform:rotate(-0.2deg) scale(1.035);transform-origin:50% 54%;pointer-events:none}
#terminal{border-radius:0}
@media(max-width:760px){#glass-clip{clip-path:none}#terminal-positioner{transform:none}}

/* Four-sided glass aperture; the fixed bezel conceals every overflowing edge. */
@media(min-width:761px){#glass-clip{clip-path:polygon(29% 37.25%,29.55% 35.8%,68.5% 29.95%,69.15% 30.9%,71.35% 70.2%,70.85% 72.1%,32.25% 77.35%,31.55% 76.05%)}}
/* Feather the fixed glass aperture itself, including its slanted side edges. */
@media(min-width:761px){#glass-clip{mask-image:url("assets/glass-edge-mask.png");-webkit-mask-image:url("assets/glass-edge-mask.png");mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-mode:alpha}}
/* Expanded aperture to the last inner bezel seam. Mask and clip share one contour. */
@media(min-width:761px){#glass-clip{clip-path:polygon(28% 36.75%,28.55% 34.3%,69.5% 28.45%,70.15% 30.4%,72.35% 70.7%,71.85% 73.6%,31.25% 78.85%,30.55% 76.55%)}}

/* After the handoff, crop the original baked-in letterbox bars with a whole-scene push-in. */
#stage{transform-origin:50% 50%;transition:transform 1.9s cubic-bezier(.22,.68,.18,1)}
.scene-immersive #stage{transform:scale(var(--scene-cover,1.16))}
.scene-immersive.focused #stage{transform:scale(var(--scene-close,1.8))}
/* Compact floating controls, without a footer strip or reserved screen space. */
#outside-controls{left:auto;right:20px;bottom:20px;width:auto;background:transparent;opacity:.4;transition:opacity .2s;pointer-events:none}
#outside-controls:hover,#outside-controls:focus-within{opacity:1}
#outside-controls>div{pointer-events:auto;gap:7px;padding:5px;background:#100e1770;border:1px solid #d7ad9020;border-radius:6px;backdrop-filter:blur(5px)}
#outside-controls button{font-size:10px;padding:8px 11px;background:#111017a8;border-color:#76594470}
#outside-controls .identity{position:fixed;top:18px;left:22px;pointer-events:auto;font-size:11px;opacity:.8}
#experience-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:760px){.scene-immersive #stage,.scene-immersive.focused #stage{transform:none}#outside-controls{right:10px;bottom:10px;left:auto;opacity:.75}#outside-controls .identity{top:15px;left:15px;font-size:9px}#outside-controls button{font-size:9px;padding:8px}.focused #outside-controls{opacity:.6}}
@media(prefers-reduced-motion:reduce){#stage,#outside-controls{transition:none}}


/* Lightweight indicators: tiny painted elements, opacity animation only. */
#cockpit-life{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0;transition:opacity 1.2s}
.scene-immersive #cockpit-life{opacity:1}
.indicator-light{position:absolute;display:block;border-radius:3px;transform:translate(-50%,-50%) rotate(var(--lamp-angle));opacity:.12;animation:indicator-pulse var(--lamp-duration) ease-in-out var(--lamp-delay) infinite}
.indicator-light:nth-child(3n){animation-name:indicator-double}
@keyframes indicator-pulse{0%,100%{opacity:.04}43%{opacity:.55}72%{opacity:.17}}
@keyframes indicator-double{0%,100%{opacity:.04}24%{opacity:.4}44%{opacity:.08}64%{opacity:.33}83%{opacity:.1}}
body.scene-paused .indicator-light{animation-play-state:paused}
#outside-controls>div{backdrop-filter:none}
@media(max-width:760px){#cockpit-life{inset:auto;left:50%;top:50%;width:auto;height:100%;min-width:100%;aspect-ratio:2048/1143;transform:translate(-50%,-50%)}}
@media(prefers-reduced-motion:reduce){.indicator-light{animation:none;opacity:.12}#cockpit-life{transition:none}}

/* Static alpha aperture only: avoid nested alpha masks on a live perspective iframe. */
#terminal{mask-image:none;-webkit-mask-image:none}
.glitch-transition #stage{filter:none}
.indicator-light{animation:none!important;contain:paint;transition:none;opacity:.1}
#cockpit-life{transition:none}

@media(pointer:fine){html,body,button,a{cursor:url("assets/oops-hand.svg") 12 2,pointer}}

@media(max-width:760px),(pointer:coarse){#cockpit-life{display:none!important}}
@media(max-width:760px){body.keyboard-open #terminal{top:8px;height:calc(var(--usable-height,100dvh) - 16px);left:2%;width:96%;border-radius:8px}body.keyboard-open #outside-controls{display:none}}
/* Dedicated portrait source and rigid camera move; orientation changes never reload the iframe. */
body.mobile-scene #stage{width:min(100vw,calc(100dvh * .5625));height:auto;aspect-ratio:9/16;transform:none;transform-origin:50% 50%;transition:transform 1.7s cubic-bezier(.2,.7,.2,1)}
body.mobile-scene #cockpit{object-fit:contain}
body.mobile-scene.scene-immersive #stage{transform:scale(var(--mobile-scale,1.7)) rotate(var(--mobile-angle,.12rad)) translate(var(--mobile-shift-x,0px),var(--mobile-shift-y,0px))}
body.mobile-scene #glass-clip{clip-path:polygon(22% 44.5%,22.7% 43.9%,75.7% 40.3%,76.5% 40.9%,80% 62.7%,79.2% 63.4%,26.7% 66.4%,26% 65.8%);mask:none;-webkit-mask:none}
body.mobile-scene #terminal-positioner{transform:none}
body.mobile-scene #terminal{left:0;top:0;width:480px;height:360px;transform:var(--terminal-projection)!important;border-radius:0}
body.mobile-scene #cockpit-life{display:none!important}
body.mobile-scene.focused #stage,body.direct-terminal #stage{position:fixed;inset:0;width:100vw;height:100dvh;aspect-ratio:auto;transform:none!important}
body.mobile-scene.focused #cockpit{object-fit:cover}
body.mobile-scene.focused #glass-clip,body.direct-terminal #glass-clip{clip-path:none;mask:none;-webkit-mask:none}
body.mobile-scene.focused #terminal-positioner,body.direct-terminal #terminal-positioner{transform:none}
body.mobile-scene.focused #terminal,body.direct-terminal #terminal{left:0;top:0;width:100%;height:100%;transform:none!important;opacity:1}
body.mobile-scene.keyboard-open #stage{position:fixed;inset:0;width:100vw;height:var(--usable-height,100dvh);transform:none!important}
body.mobile-scene.keyboard-open #glass-clip{clip-path:none;mask:none;-webkit-mask:none}
body.mobile-scene.keyboard-open #terminal{left:0;top:0;width:100%;height:100%;transform:none!important}
body.mobile-scene.keyboard-open #outside-controls{display:none}
#low-bandwidth{margin-top:12px;font-size:11px}
@media(prefers-reduced-motion:reduce){body.mobile-scene #stage{transition:none}}

body.mobile-scene.focused #outside-controls .identity,body.direct-terminal #outside-controls .identity{display:none}


/* Interference bridges the moving mobile intro and static cockpit without a frozen lead-in. */
#experience>#transition{position:absolute;inset:0;z-index:4}
.mobile-handoff.glitch-transition #transition{animation:mobile-handoff .72s steps(1,end) both;background:#100e17}
@keyframes mobile-handoff{
0%{opacity:.12;clip-path:inset(72% 0 15%);transform:translateX(-3px)}
12%{opacity:.45;clip-path:inset(18% 0 50%);transform:translateX(5px)}
23%{opacity:.8;clip-path:inset(0);transform:none}
30%,63%{opacity:1;clip-path:inset(0);transform:none}
70%{opacity:.8;clip-path:inset(0);transform:none}
82%{opacity:.45;clip-path:inset(42% 0 34%);transform:translateX(-4px)}
92%{opacity:.15;clip-path:inset(7% 0 81%);transform:translateX(3px)}
100%{opacity:0;clip-path:inset(0);transform:none}}
/* Loader uses the same drawn alphabet as the terminal, without full-screen filters. */
#loader .ark-word{display:inline-block;white-space:nowrap;letter-spacing:0}
#loader .ark-sign{display:inline-block;width:.66em;height:1.1em;vertical-align:-.18em;margin-right:.06em;overflow:visible}
#loader h1{font-size:26px;line-height:1.8}
.load-inner{position:relative}
.loading-glitch{animation:loader-jitter .18s steps(1,end)}
.loading-glitch::after{content:'';position:absolute;pointer-events:none;left:0;right:0;top:var(--loading-tear,45%);height:8px;border-top:1px solid #d7ad9090;border-bottom:1px solid #85739880;background:#111017aa;transform:translateX(5px)}
@keyframes loader-jitter{0%,100%{transform:none;opacity:1}20%{transform:translateX(-3px);opacity:.7}40%{transform:translateX(4px);opacity:1}65%{transform:translateX(-1px);opacity:.85}80%{transform:translateX(2px);opacity:1}}
@media(max-width:760px){#loader h1{font-size:21px}}
@media(prefers-reduced-motion:reduce){.loading-glitch{animation:none}.loading-glitch::after{display:none}}
/* Landscape phones use the desktop camera and aperture, even below 761px wide. */
body:not(.mobile-scene) #stage{width:min(100vw,calc(100dvh * 1.791667));height:auto;aspect-ratio:2752/1536}
body:not(.mobile-scene).scene-immersive #stage{transform:scale(var(--scene-cover,1.16))}
body:not(.mobile-scene).scene-immersive.focused #stage{transform:scale(var(--scene-close,1.8))}
body:not(.mobile-scene) #cockpit{object-fit:contain}
body:not(.mobile-scene) #terminal{left:0;top:0;width:1000px;height:640px;border-radius:0;transform:var(--desktop-projection)!important}
body:not(.mobile-scene) #terminal-positioner{transform:rotate(-.2deg) scale(1.035)}
body:not(.mobile-scene) #glass-clip{clip-path:polygon(28% 36.75%,28.55% 34.3%,69.5% 28.45%,70.15% 30.4%,72.35% 70.7%,71.85% 73.6%,31.25% 78.85%,30.55% 76.55%);mask:url('assets/glass-edge-mask.png') 0 0/100% 100% no-repeat;-webkit-mask:url('assets/glass-edge-mask.png') 0 0/100% 100% no-repeat}
#loader{width:100vw;height:100dvh}
#analytics-choice{position:fixed;z-index:7;left:50%;bottom:76px;transform:translateX(-50%);width:min(490px,calc(100vw - 28px));max-height:65dvh;overflow:auto;background:#111017f5;border:1px solid #765944;padding:18px;color:#c0ada1;font:12px/1.7 Aldrich,sans-serif}
#analytics-choice>p{margin:0 0 8px;color:#d7ad90;font-size:10px;letter-spacing:1px}.analytics-actions{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin-top:15px}.analytics-actions button{flex:1}.analytics-actions a{font-size:10px}#analytics-settings{font-size:9px}
@media(max-width:760px){#analytics-choice{bottom:66px;padding:14px;font-size:11px}.analytics-actions button{padding:9px}#outside-controls>div{gap:4px}}