:root {
  --void: #030507;
  --ink: #e8e7df;
  --muted: #8b9694;
  --acid: #b9e84d;
  --blood: #d94c40;
  --ice: #91ced1;
  --line: rgba(208, 224, 215, 0.18);
  --panel: rgba(9, 15, 16, 0.86);
  --scene-progress: 0;
}

* { box-sizing: border-box; }
html { width: 100%; overflow-x: hidden; scroll-behavior: smooth; background: var(--void); }
body {
  width: 100%; margin: 0; color: var(--ink); background: var(--void); font-family: "DM Mono", monospace;
  overflow-x: hidden; cursor: crosshair; line-height: 1.55;
}
body.booting { overflow: hidden; }
button, a { font: inherit; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
::selection { color: #071006; background: var(--acid); }

#space { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; }
.noise, .scanlines { position: fixed; inset: 0; pointer-events: none; z-index: 90; }
.noise { opacity: .17; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; }
.scanlines { opacity: .16; background: repeating-linear-gradient(0deg, transparent 0 3px, rgba(133, 198, 191, .11) 4px); }

.boot-screen {
  position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 2rem;
  background: radial-gradient(circle at 50% 45%, #182021 0, #070a0c 42%, #010203 78%);
  transition: opacity .8s ease, visibility .8s;
}
.boot-screen.dismissed { opacity: 0; visibility: hidden; }
.boot-terminal { width: min(720px, 100%); text-align: center; }
.terminal-line, .boot-code, .control-note { font-size: .68rem; letter-spacing: .18em; color: var(--muted); }
.terminal-line::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: .7rem; border-radius: 50%; background: var(--blood); box-shadow: 0 0 12px var(--blood); animation: blink 1.4s infinite; }
.boot-icon { position: relative; width: 86px; height: 86px; margin: 2.2rem auto 1.6rem; border: 1px solid rgba(185, 232, 77, .35); border-radius: 50%; animation: spin 14s linear infinite; }
.boot-icon::before, .boot-icon::after { content: ""; position: absolute; inset: 9px; border: 1px dashed rgba(185, 232, 77, .3); border-radius: inherit; }
.boot-icon::after { inset: 29px; background: var(--acid); border: 0; box-shadow: 0 0 30px rgba(185,232,77,.45); }
.boot-icon span { position: absolute; left: 50%; top: -6px; width: 1px; height: 98px; background: linear-gradient(transparent, var(--acid), transparent); }
.boot-code { color: var(--acid); }
.boot-terminal h1, .scene h2 { font-family: "Chakra Petch", sans-serif; text-transform: uppercase; letter-spacing: -.045em; line-height: .83; }
.boot-terminal h1 { margin: .8rem 0 1.4rem; font-size: clamp(3rem, 9vw, 6.8rem); }
.boot-terminal h1 em, .scene h2 em { color: transparent; font-style: normal; -webkit-text-stroke: 1px rgba(232, 231, 223, .7); -webkit-text-fill-color: transparent; opacity: .82; }
.boot-terminal h1 em { -webkit-text-stroke-color: var(--acid); }
.boot-copy { max-width: 590px; margin: auto; color: #a5afad; font-size: .86rem; }
.launch-button { display: flex; align-items: center; justify-content: space-between; gap: 3rem; width: min(420px, 100%); margin: 2rem auto 1rem; padding: 1rem 1.1rem; border: 1px solid var(--acid); background: rgba(185,232,77,.08); text-transform: uppercase; letter-spacing: .1em; cursor: pointer; transition: .25s; }
.launch-button:hover { color: #071006; background: var(--acid); box-shadow: 0 0 40px rgba(185,232,77,.2); }
.launch-button kbd { padding: .15rem .42rem; border: 1px solid currentColor; font-size: .62rem; }

.hud { position: fixed; z-index: 70; top: 0; left: 0; right: 0; height: 78px; display: flex; align-items: center; justify-content: space-between; padding: 0 3vw; border-bottom: 1px solid var(--line); background: linear-gradient(#05080ade, #05080a8c); backdrop-filter: blur(10px); }
.hud-brand { display: flex; align-items: center; gap: .75rem; font-family: "Chakra Petch", sans-serif; }
.hud-brand .brand-mark { display: grid; place-items: center; width: 38px; height: 38px; color: var(--acid); border: 1px solid var(--acid); font-weight: 700; }
.hud-brand strong, .hud-brand small { display: block; line-height: 1.1; }
.hud-brand small { margin-top: .22rem; color: var(--muted); font: 500 .53rem "DM Mono"; letter-spacing: .14em; }
.hud nav { display: flex; gap: .4rem; }
.hud nav a { position: relative; display: grid; place-items: center; width: 35px; height: 35px; color: var(--muted); font-size: .67rem; border: 1px solid transparent; }
.hud nav a::after { content: ""; position: absolute; bottom: 2px; width: 0; height: 1px; background: var(--acid); transition: .3s; }
.hud nav a:hover, .hud nav a.active { color: var(--acid); border-color: rgba(185,232,77,.25); }
.hud nav a.active::after { width: 17px; }
.sound-toggle { display: flex; gap: .6rem; align-items: center; padding: .5rem; border: 0; background: transparent; cursor: pointer; color: var(--muted); font-size: .58rem; letter-spacing: .1em; }
.sound-bars { display: flex; align-items: center; gap: 2px; height: 13px; }
.sound-bars i { display: block; width: 2px; height: 25%; background: currentColor; }
.sound-toggle[aria-pressed="true"] { color: var(--acid); }
.sound-toggle[aria-pressed="true"] .sound-bars i { animation: bars .8s ease-in-out infinite alternate; }
.sound-toggle[aria-pressed="true"] .sound-bars i:nth-child(2) { animation-delay: -.4s; }
.sound-toggle[aria-pressed="true"] .sound-bars i:nth-child(3) { animation-delay: -.2s; }

.mission-progress { position: fixed; z-index: 65; right: 2.2vw; top: 50%; display: grid; justify-items: center; gap: .7rem; transform: translateY(-50%); color: #6c7775; font-size: .58rem; }
.progress-track { position: relative; width: 1px; height: 130px; background: var(--line); }
.progress-track i { position: absolute; top: 0; left: 0; width: 1px; height: 0%; background: var(--acid); box-shadow: 0 0 7px var(--acid); }
.progress-number { color: var(--acid); }

main { position: relative; z-index: 2; }
.scene { position: relative; min-height: 100svh; display: flex; align-items: center; overflow: hidden; border-bottom: 1px solid var(--line); isolation: isolate; }
.scene::before { content: ""; position: absolute; inset: 0; z-index: -3; background: radial-gradient(circle at 50% 60%, rgba(35,51,51,.18), transparent 60%); }
.scene-content { position: relative; z-index: 5; width: min(1180px, calc(100% - 11vw)); margin: auto; padding: 8rem 3vw 6rem; }
.log-label { display: flex; align-items: center; gap: .7rem; margin: 0 0 1.4rem; color: #687472; font-size: .63rem; letter-spacing: .15em; }
.log-label::before { content: ""; width: 34px; height: 1px; background: currentColor; }
.log-label span { color: var(--acid); }
.scene h2 { margin: 0; font-size: clamp(3.6rem, 9vw, 8.6rem); }
.section-heading > p:last-child { max-width: 430px; color: var(--muted); font-size: .8rem; }

.scene-home { background: linear-gradient(90deg, #030608 0 56%, transparent), radial-gradient(circle at 76% 50%, #31100e 0, #09090a 38%, #030507 66%); }
.hero-content { padding-left: 8vw; }
.hero-content h2 { font-size: clamp(4.2rem, 10.5vw, 10.5rem); }
.hero-content h2 em { -webkit-text-stroke-color: var(--blood); }
.role { margin: 1.5rem 0 .6rem; color: var(--acid); font: 600 clamp(.85rem, 1.5vw, 1.05rem) "Chakra Petch"; text-transform: uppercase; letter-spacing: .13em; }
.hero-copy { max-width: 480px; color: #9aa5a3; }
.hero-actions { display: flex; align-items: center; gap: 1.6rem; margin-top: 2rem; }
.signal-button { display: inline-flex; align-items: center; gap: 2.8rem; padding: .85rem 1rem; color: #071006; background: var(--acid); font-size: .68rem; text-transform: uppercase; letter-spacing: .09em; }
.signal-button span { font-size: 1rem; }
.text-action { color: #a6afad; font-size: .69rem; text-transform: uppercase; border-bottom: 1px solid #566; }
.coordinate { position: absolute; right: 4vw; bottom: 4vh; color: #6f7776; font-size: .55rem; letter-spacing: .12em; text-align: right; }
.planet { position: absolute; right: -4vw; top: 17%; width: min(42vw, 560px); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 32% 27%, #8c302a 0, #471713 28%, #160b0b 65%, #030405 72%); box-shadow: -20px 0 80px rgba(217,76,64,.17); }
.planet::before { content: ""; position: absolute; inset: 14%; border-radius: 50%; border: 1px solid rgba(244,108,89,.12); transform: rotate(-20deg); }
.planet span { position: absolute; width: 18%; height: 10%; left: 30%; top: 60%; border-radius: 50%; background: #200a09; filter: blur(2px); }
.orbit-lines { position: absolute; right: -12vw; top: 13%; width: 65vw; aspect-ratio: 1; border: 1px solid rgba(217,76,64,.12); border-radius: 50%; transform: rotate(-18deg); }
.orbit-lines i { position: absolute; inset: 10%; border: inherit; border-radius: inherit; }
.orbit-lines i:nth-child(2) { inset: 24%; }.orbit-lines i:nth-child(3) { inset: 38%; }

.scene-about { background: radial-gradient(circle at 17% 45%, #172123 0, #060a0c 37%, #020405 70%); }
.split-content { display: grid; grid-template-columns: .85fr 1fr; align-items: center; gap: clamp(2rem, 7vw, 8rem); }
.split-content h2 em { -webkit-text-stroke-color: var(--ice); }
.data-panel { position: relative; padding: clamp(1.5rem, 3vw, 3rem); border: 1px solid var(--line); background: linear-gradient(135deg, rgba(16,25,26,.94), rgba(6,10,12,.72)); box-shadow: 0 30px 80px rgba(0,0,0,.4); }
.data-panel::before, .data-panel::after { content: ""; position: absolute; width: 18px; height: 18px; border-color: var(--acid); }
.data-panel::before { top: -1px; left: -1px; border-top: 1px solid; border-left: 1px solid; }.data-panel::after { bottom: -1px; right: -1px; border-bottom: 1px solid; border-right: 1px solid; }
.data-panel > p:not(.panel-status) { color: #a2adab; font-size: .84rem; }
.panel-status { color: var(--acid); font-size: .58rem; letter-spacing: .12em; }.panel-status i { display: inline-block; width: 6px; height: 6px; margin-right: .5rem; border-radius: 50%; background: var(--acid); box-shadow: 0 0 8px var(--acid); }
.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 2rem; background: var(--line); }
.stat-grid div { padding: 1rem .7rem; background: #080d0e; }.stat-grid strong, .stat-grid span { display: block; }.stat-grid strong { color: var(--ice); font: 600 1.8rem "Chakra Petch"; }.stat-grid span { margin-top: .25rem; color: #778280; font-size: .54rem; }
.station-ring { position: absolute; left: -22vw; top: 12%; width: 60vw; aspect-ratio: 1; border-radius: 50%; border: 5vw solid #0b1113; box-shadow: inset 0 0 0 1px #263234, 0 0 0 1px #263234; opacity: .8; }
.station-ring i { position: absolute; inset: -3vw; border: 1px dashed #304143; border-radius: inherit; animation: spin 50s linear infinite; }
.floating-debris { position: absolute; width: 50px; height: 9px; background: #253033; box-shadow: 0 0 15px #000; animation: drift 8s ease-in-out infinite alternate; }.debris-a { left: 38%; top: 23%; transform: rotate(24deg); }.debris-b { left: 18%; bottom: 19%; width: 27px; animation-delay: -4s; }

.scene-experience { background: radial-gradient(circle at 90% 40%, rgba(73,24,19,.25), transparent 34%), #030507; }
.experience-content { display: grid; grid-template-columns: .6fr 1.4fr; gap: 6vw; align-items: center; }
.experience-content h2 em { -webkit-text-stroke-color: var(--blood); }
.log-console { display: grid; grid-template-columns: .8fr 1.2fr; min-height: 430px; border: 1px solid var(--line); background: rgba(5,10,11,.88); }
.log-tabs { border-right: 1px solid var(--line); }
.log-tabs button { display: block; width: 100%; min-height: 25%; padding: 1rem 1.2rem; text-align: left; border: 0; border-bottom: 1px solid var(--line); background: transparent; cursor: pointer; transition: .25s; }
.log-tabs button:last-child { border-bottom: 0; }.log-tabs button:hover { background: rgba(185,232,77,.05); }
.log-tabs button[aria-selected="true"] { color: var(--acid); background: linear-gradient(90deg, rgba(185,232,77,.12), transparent); box-shadow: inset 2px 0 var(--acid); }
.log-tabs span, .log-tabs strong { display: block; }.log-tabs span { color: #61706e; font-size: .54rem; }.log-tabs strong { margin-top: .35rem; font: 600 .75rem "Chakra Petch"; letter-spacing: .05em; }
.log-detail { padding: clamp(1.5rem, 3vw, 2.7rem); }
.log-index { color: var(--blood); font-size: .59rem; letter-spacing: .12em; }.log-detail h3 { margin: 1rem 0 .2rem; font: 600 clamp(1.6rem, 3vw, 2.5rem) "Chakra Petch"; text-transform: uppercase; line-height: 1; }.log-detail > p:nth-child(3) { color: var(--muted); font-size: .68rem; }.log-detail ul { margin-top: 2rem; padding-left: 1rem; color: #a7b0ae; font-size: .76rem; }.log-detail li + li { margin-top: .8rem; }.log-detail li::marker { color: var(--acid); }
.alien-window { position: absolute; right: -7vw; top: 9%; width: 30vw; height: 44vh; border-radius: 50%; background: radial-gradient(ellipse, rgba(100,24,18,.3), transparent 67%); filter: blur(.2px); opacity: .65; }
.alien-eye { position: absolute; right: 30%; top: 24%; width: 28%; height: 43%; border-radius: 90% 10% 90% 10%; transform: rotate(32deg); background: radial-gradient(circle at 50% 50%, #050404 0 17%, #e1d692 19%, #6e261c 43%, transparent 65%); filter: blur(2px); animation: watching 5s ease-in-out infinite; }

.scene-skills { background: radial-gradient(circle at 15% 50%, #171128 0, #07060e 27%, #020305 62%); }
.skills-content { display: grid; grid-template-columns: .7fr 1.3fr; gap: 6vw; align-items: center; }
.skills-content h2 em { -webkit-text-stroke-color: #a78bd1; }
.systems-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.systems-grid article { position: relative; min-height: 150px; padding: 1.15rem; overflow: hidden; border: 1px solid var(--line); background: rgba(10,9,18,.78); }
.systems-grid article:last-child { grid-column: 1 / -1; min-height: 120px; }.system-id { color: #796d88; font-size: .52rem; }.systems-grid h3 { margin: .9rem 0 .35rem; font: 600 1.15rem "Chakra Petch"; }.systems-grid p { margin: 0 0 1.2rem; color: #8e9399; font-size: .65rem; }.systems-grid i { position: absolute; left: 0; bottom: 0; width: var(--level); height: 2px; background: linear-gradient(90deg, #715b9b, #bd9dea); box-shadow: 0 0 10px #946fc5; }
.black-hole { position: absolute; left: -20vw; top: 19%; width: 55vw; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, #000 0 25%, #150b20 27%, #684d8a 29%, transparent 38%); filter: blur(1px); animation: pulse 5s ease-in-out infinite alternate; }.black-hole::after { content: ""; position: absolute; inset: 19%; border: 3px solid #9e6eba; border-radius: 50%; transform: rotateX(72deg) rotateZ(-20deg); box-shadow: 0 0 35px #6c3c8e, inset 0 0 30px #6c3c8e; }

.scene-achievements { background: radial-gradient(circle at 80% 50%, #1d1b0d 0, #080906 32%, #030504 65%); }
.achievement-content { display: grid; grid-template-columns: .62fr 1.38fr; gap: 6vw; align-items: center; }.achievement-content h2 em { -webkit-text-stroke-color: #d6ba46; }
.artifact-list { border-top: 1px solid var(--line); }
.artifact-list article { display: grid; grid-template-columns: 40px 1fr auto; gap: 1rem; align-items: center; padding: 1.2rem .4rem; border-bottom: 1px solid var(--line); transition: .25s; }.artifact-list article:hover { padding-left: 1rem; background: rgba(214,186,70,.06); }.artifact-list b { color: #6d6851; font-size: .6rem; }.artifact-list p { margin: 0 0 .25rem; color: #aaa26a; font-size: .55rem; letter-spacing: .08em; }.artifact-list h3 { margin: 0; font: 500 clamp(.82rem, 1.3vw, 1rem) "Chakra Petch"; }.artifact-list > article > span { color: #7b7869; font-size: .56rem; }
.monolith { position: absolute; right: -1vw; top: 14%; width: 24vw; height: 72vh; background: linear-gradient(105deg, #070806, #222318 55%, #080906); clip-path: polygon(20% 0, 86% 5%, 100% 90%, 0 100%); box-shadow: -25px 0 80px rgba(220,190,66,.1); opacity: .7; }.monolith span { position: absolute; top: 42%; left: 35%; width: 30%; height: 1px; background: #d4b83d; box-shadow: 0 0 22px #d4b83d; }

.scene-contact { min-height: 108svh; text-align: center; background: radial-gradient(circle at 50% 50%, #122022 0, #05090a 38%, #020304 70%); }.contact-content { display: flex; flex-direction: column; align-items: center; }.contact-content h2 em { -webkit-text-stroke-color: var(--ice); }.contact-content > p:not(.log-label,.end-note) { max-width: 600px; color: #919c9a; }.email-link { display: flex; gap: 2rem; align-items: center; margin: 2rem 0; padding: 1rem 1.2rem; color: var(--acid); border: 1px solid rgba(185,232,77,.55); font-size: clamp(.7rem, 1.5vw, 1rem); }.contact-links { display: flex; gap: 2rem; color: #a5aeac; font-size: .66rem; text-transform: uppercase; }.contact-links a { border-bottom: 1px solid #4a5654; }.end-note { margin-top: 5rem !important; color: #53605e !important; font-size: .53rem; letter-spacing: .14em; }
.signal-rings { position: absolute; left: 50%; top: 50%; width: 12vw; aspect-ratio: 1; transform: translate(-50%,-50%); border: 1px solid rgba(145,206,209,.2); border-radius: 50%; }.signal-rings i { position: absolute; inset: -60%; border: inherit; border-radius: inherit; animation: signal 4s infinite; }.signal-rings i:nth-child(2) { inset: -130%; animation-delay: -1s; }.signal-rings i:nth-child(3) { inset: -200%; animation-delay: -2s; }.signal-rings i:nth-child(4) { inset: -270%; animation-delay: -3s; }

.astronaut { --astro-x: 7vw; position: fixed; z-index: 30; left: var(--astro-x); bottom: 5vh; width: 52px; height: 100px; filter: drop-shadow(0 8px 8px #000); transition: left .08s linear, opacity .3s; transform-origin: bottom; }
.astro-head { position: absolute; left: 9px; top: 3px; width: 36px; height: 32px; border-radius: 48% 48% 40% 40%; background: #b9bdb6; border: 3px solid #e0e1da; z-index: 4; }.visor { position: absolute; inset: 5px 4px 6px; border-radius: 50% 50% 42% 42%; background: linear-gradient(135deg, #617f7d, #121a1d 60%); border: 1px solid #273838; overflow: hidden; }.visor i { position: absolute; left: 3px; top: 3px; width: 60%; height: 1px; background: #badbd5; transform: rotate(-18deg); }
.astro-body { position: absolute; z-index: 3; left: 7px; top: 31px; width: 39px; height: 43px; background: linear-gradient(90deg, #878c87, #d0d1ca 50%, #777b77); clip-path: polygon(10% 0, 90% 0, 100% 85%, 80% 100%, 20% 100%, 0 85%); }.astro-body b { position: absolute; right: 7px; top: 15px; color: #252d2c; font: 600 7px "DM Mono"; }.chest-light { position: absolute; left: 8px; top: 11px; width: 5px; height: 3px; background: var(--acid); box-shadow: 0 0 6px var(--acid); }
.astro-pack { position: absolute; left: 1px; top: 34px; width: 15px; height: 36px; background: #555b58; border: 2px solid #9b9e98; }
.astro-arm { position: absolute; z-index: 2; top: 36px; width: 10px; height: 37px; border-radius: 8px; background: #a5a9a4; transform-origin: top; }.arm-left { left: 2px; transform: rotate(12deg); }.arm-right { right: 1px; transform: rotate(-28deg); }.astro-leg { position: absolute; top: 68px; width: 13px; height: 31px; background: #a4a8a2; transform-origin: top; }.leg-left { left: 11px; transform: rotate(7deg); }.leg-right { right: 10px; transform: rotate(-7deg); }.astro-leg::after { content: ""; position: absolute; bottom: -2px; width: 17px; height: 7px; background: #737975; }.leg-left::after { right: 0; }.flashlight { position: absolute; z-index: 1; right: -5px; top: 57px; width: 11px; height: 5px; background: #49504e; transform: rotate(-24deg); }.flashlight::after { content: ""; position: absolute; left: 8px; top: 1px; width: 28vw; height: 100px; transform: translateY(-50%); transform-origin: left; clip-path: polygon(0 48%,100% 0,100% 100%,0 52%); background: linear-gradient(90deg, rgba(207,231,210,.15), transparent); }
.astronaut.walking .arm-left { animation: walk-arm .45s infinite alternate; }.astronaut.walking .arm-right { animation: walk-arm .45s -.45s infinite alternate; }.astronaut.walking .leg-left { animation: walk-leg .45s infinite alternate; }.astronaut.walking .leg-right { animation: walk-leg .45s -.45s infinite alternate; }.astronaut.walking { animation: bob .45s infinite alternate; }

.chapter-toast { position: fixed; z-index: 80; left: 50%; bottom: 4vh; display: flex; align-items: center; gap: 1rem; padding: .65rem 1rem; border: 1px solid var(--line); background: rgba(4,8,9,.88); backdrop-filter: blur(8px); transform: translate(-50%, 30px); opacity: 0; transition: .35s; pointer-events: none; }.chapter-toast.visible { opacity: 1; transform: translate(-50%,0); }.chapter-toast span { color: var(--acid); font-size: .53rem; }.chapter-toast strong { font: 600 .68rem "Chakra Petch"; letter-spacing: .08em; }

@keyframes blink { 50% { opacity: .2; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes bars { to { height: 100%; } }
@keyframes drift { to { transform: translate(45px, 24px) rotate(70deg); } }
@keyframes watching { 50% { transform: rotate(28deg) scale(.92); opacity: .65; } }
@keyframes pulse { to { transform: scale(1.08); filter: blur(3px); } }
@keyframes signal { from { opacity: .6; } to { opacity: 0; transform: scale(1.25); } }
@keyframes walk-arm { to { transform: rotate(25deg); } }
@keyframes walk-leg { to { transform: rotate(18deg); } }
@keyframes bob { to { transform: translateY(-2px); } }

@media (max-width: 900px) {
  .scene-content { width: calc(100% - 2rem); padding: 7rem 1rem 6rem; }
  .split-content, .experience-content, .skills-content, .achievement-content { grid-template-columns: 1fr; gap: 2rem; }
  .scene h2 { font-size: clamp(3.4rem, 14vw, 6.5rem); }
  .hero-content { padding-left: 1rem; }
  .planet { right: -20vw; top: 27%; width: 65vw; opacity: .55; }
  .data-panel { margin-left: 8vw; }
  .log-console { min-height: 390px; }
  .black-hole { left: -20vw; top: 9%; width: 80vw; opacity: .45; }
  .monolith { width: 42vw; opacity: .35; }
  .artifact-list { margin-left: 8vw; }
  .astronaut { bottom: 2vh; transform: scale(.82); }
}

@media (max-width: 620px) {
  .hud { height: 65px; padding: 0 1rem; }.hud nav { display: none; }.hud-brand small, .sound-label { display: none; }
  .mission-progress { right: .7rem; }.progress-track { height: 90px; }
  .scene { min-height: 115svh; }.scene-home { min-height: 100svh; }
  .scene-content { width: 100%; padding: 6rem 2rem 6rem; }
  .hero-content h2 { max-width: 100%; font-size: clamp(2.4rem, 11.8vw, 3.2rem); letter-spacing: -.065em; white-space: nowrap; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 1rem; }
  .planet { top: 12%; right: -24vw; width: 80vw; }
  .coordinate { display: none; }
  .stat-grid { grid-template-columns: 1fr; }.stat-grid div { display: flex; align-items: center; gap: 1rem; }
  .log-console { display: block; }.log-tabs { display: flex; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); }.log-tabs button { flex: 0 0 150px; min-height: 80px; border-right: 1px solid var(--line); border-bottom: 0; }.log-detail { min-height: 330px; }
  .systems-grid { grid-template-columns: 1fr; }.systems-grid article:last-child { grid-column: auto; }
  .artifact-list { margin-left: 0; }.artifact-list article { grid-template-columns: 25px 1fr; }.artifact-list > article > span { display: none; }
  .email-link { gap: .6rem; word-break: break-all; }.contact-links { flex-wrap: wrap; justify-content: center; }
  .astronaut { left: var(--astro-x); opacity: .86; }.flashlight::after { width: 60vw; }
  .boot-screen { padding: 1rem; }.boot-icon { margin-top: 1.5rem; }.boot-terminal h1 { font-size: 15vw; }.boot-copy { font-size: .75rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .astronaut { display: none; }
}
