@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');
:root{--black:#000;--white:#fcfcfc;--orange:#f87818;--yellow:#fce0a8;--blue:#3cbcfc;--muted:#bcbcbc;--navy:#0000bc;font-family:'Press Start 2P',monospace;color:var(--white);background:#080808;color-scheme:dark}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--blue);outline-offset:8px}[hidden]{display:none!important}
#title-screen{min-height:100svh;display:grid;align-content:center;justify-items:center;padding:32px 8px}.screen{position:relative;width:768px;height:720px;background:#000;overflow:hidden}canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}.title-content{position:relative;text-align:center;padding-top:84px}.eyebrow{font-size:12px;line-height:2;color:var(--blue);letter-spacing:2px}h1{margin:36px 0 24px;color:var(--orange);font-size:72px;line-height:1.2;letter-spacing:-4px;text-shadow:0 6px #a81000,6px 6px #a81000,6px 12px #501000}h1 span{display:block}h1 span:first-child{font-size:108px;letter-spacing:8px;margin-left:8px}.subtitle{font-size:12px;color:var(--yellow);margin-top:36px}nav{display:grid;justify-content:center;gap:24px;margin-top:54px}button{position:relative;color:var(--muted);border:0;padding:4px 0;background:none;cursor:pointer;font-size:18px;text-align:left}button:hover,button:focus{color:var(--white)}button:hover:before,button:focus:before{content:'▶';position:absolute;left:-36px;color:var(--orange)}.hint{font-size:9px;color:var(--muted);margin-top:36px}.edition{font-size:9px;color:var(--blue);margin-top:48px}.outside{font-size:9px;color:var(--muted);line-height:2;margin:24px 0 0}
#journal{max-width:960px;margin:auto;padding:32px}header{display:flex;justify-content:space-between;gap:24px;border-bottom:4px solid var(--navy);padding:16px 0 28px;font-size:10px;line-height:2}a{color:var(--blue);text-decoration:none}.journal-content{padding:64px 32px}h2{font-size:32px;line-height:1.6;color:var(--orange);margin:24px 0}h2:focus{outline:none}.lead,.columns p,aside p{font-family:monospace;font-size:19px;line-height:1.7;color:var(--muted)}.lead{max-width:660px}.status{border-block:2px solid var(--navy);padding:24px 0;margin:40px 0;font-size:10px;line-height:2}.light{display:inline-block;width:8px;height:8px;background:var(--orange);margin-right:12px}.columns{display:grid;grid-template-columns:1fr 1fr;gap:48px}h3{color:var(--blue);font-size:12px;line-height:2}aside{border:4px solid var(--navy);padding:24px;margin:40px 0}footer{font-size:9px;line-height:2;color:var(--muted)}footer span{color:var(--orange)}
@media(max-width:799px),(max-height:850px){.screen{width:512px;height:480px}.title-content{padding-top:48px}.eyebrow{font-size:8px}h1{font-size:48px;margin:24px 0 16px;text-shadow:0 4px #a81000,4px 4px #a81000,4px 8px #501000}h1 span:first-child{font-size:72px;letter-spacing:4px}.subtitle{font-size:8px;margin-top:24px}nav{gap:16px;margin-top:36px}button{font-size:12px}.hint{font-size:6px;margin-top:24px}.edition{font-size:6px;margin-top:32px}}
@media(max-width:543px){#title-screen{padding:24px 0}.screen{width:256px;height:240px}.title-content{padding-top:20px}.eyebrow{font-size:4px;letter-spacing:1px}h1{font-size:24px;letter-spacing:-2px;margin:12px 0 8px;text-shadow:0 2px #a81000,2px 2px #a81000,2px 4px #501000}h1 span:first-child{font-size:36px;letter-spacing:2px;margin-left:4px}.subtitle{font-size:4px;margin-top:12px}nav{gap:4px;margin-top:12px}button{font-size:8px;padding:6px 16px;min-width:88px}button:hover:before,button:focus:before{left:0}.hint{font-size:4px;margin-top:8px}.edition{font-size:4px;margin-top:14px}.outside{font-size:5px}#journal{padding:16px}header{font-size:7px}.journal-content{padding:32px 0}.journal-content .eyebrow{font-size:8px}h2{font-size:20px}.columns{grid-template-columns:1fr;gap:16px}.status{font-size:8px}aside{padding:16px}}
/* Shipboard record */
.mission-panel{border:4px solid var(--navy);padding:24px;margin-top:32px}.panel-label{font-size:9px;color:var(--blue);line-height:2}.mission-panel>p:not(.panel-label){font:20px/1.6 monospace}.mission-panel dl,.report{margin:24px 0 0;font-size:9px;line-height:2}.mission-panel dl div,.report div{display:flex;justify-content:space-between;gap:16px;padding:8px 0}.mission-panel dt,.report dt{color:var(--muted)}dd{margin:0}.pending{color:var(--orange)}.terminal-nav{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:24px;font-size:9px;line-height:2;border-bottom:4px solid var(--navy);padding:0 0 32px;margin:32px 0 48px}.record-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.record-heading>span{font:10px/2 monospace;color:var(--muted)}#log-001,#archive,#receive,#about{scroll-margin-top:24px}#log-001 h2{font-size:28px;color:var(--yellow);margin:16px 0 24px}.record-purpose{font:16px/1.7 monospace;color:var(--muted);border-left:4px solid var(--navy);padding-left:16px;margin-bottom:40px}.prose{max-width:640px;font:20px/1.85 Georgia,serif;color:var(--white)}.prose p{margin:0 0 24px}.report{max-width:640px;border-block:2px solid var(--navy);padding:16px 0;margin-top:40px}.end-record{font-size:8px;line-height:2;color:var(--blue);margin:24px 0 64px}.terminal-section{margin:40px 0}.archive-entry{display:flex;justify-content:space-between;gap:24px;font-size:10px;line-height:2;border-block:2px solid var(--navy);padding:24px 0}.system-note{font:14px/1.6 monospace!important;color:var(--muted)}#about p{font:18px/1.7 monospace;color:var(--muted)}#about{border-bottom:4px solid var(--navy);padding-bottom:32px}footer{padding-top:16px}
@media(max-width:543px){.mission-panel{padding:16px}.mission-panel dl,.report{font-size:7px}.terminal-nav{gap:16px;font-size:8px}.record-heading .eyebrow{letter-spacing:0}.record-heading>span{font-size:9px}#log-001 h2{font-size:22px}.prose{font-size:19px;line-height:1.8}.archive-entry{font-size:8px;gap:16px}.record-purpose{font-size:14px}}
.newsletter-link{display:inline-block;font-size:10px;line-height:2.2;border:2px solid var(--blue);padding:16px;margin:0 0 24px}#log-001 .end-record{margin-bottom:24px}@media(max-width:543px){.newsletter-link{font-size:8px;padding:12px}}
/* The briefing room uses original canvas art at whole-number scales. */
.room-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.room-heading>span{font:10px/2 monospace;color:var(--muted)}.bridge-scene{margin:24px 0 0;background:#000;padding:24px 0 0;border:4px solid var(--navy)}#bridge-art{display:block;width:512px;height:352px;image-rendering:pixelated;margin:auto}.bridge-scene figcaption{font:10px/2 monospace;color:var(--blue);padding:16px 24px;border-top:4px solid var(--navy);margin-top:24px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}.bridge-scene figcaption span{color:var(--orange)}.briefing-copy{border-inline:4px solid var(--navy);border-bottom:4px solid var(--navy);padding:32px}.briefing-copy h2{font-size:22px;line-height:1.7;color:var(--yellow)}#about .panel-label{font:10px/2 'Press Start 2P',monospace;color:var(--blue)}#about .briefing-copy>p:not(.panel-label){max-width:600px;font:20px/1.8 Georgia,serif;color:var(--white)}.briefing-copy .newsletter-link{margin:16px 0 0}.outside-log{margin:24px 0 0;padding:24px 0}.outside-log summary{font-size:9px;line-height:2.2;color:var(--blue);cursor:pointer}.outside-log summary:focus-visible{outline:2px solid var(--blue);outline-offset:8px}.outside-log>div{padding-top:16px}@media(max-width:719px){#bridge-art{width:256px;height:176px}.briefing-copy{padding:20px}.briefing-copy h2{font-size:16px}.bridge-scene figcaption{padding:12px;font-size:9px}}@media(min-width:1100px){.bridge-scene{margin-inline:-4px} }
#bridge-art{position:static;inset:auto}
/* A journey from the bridge to the surface. */
#boarding{margin-top:0}.journal-content{padding-top:32px}.briefing-copy>p:not(.panel-label){max-width:600px;font:20px/1.8 Georgia,serif;color:var(--white)}.briefing-copy .panel-label{font:10px/2 'Press Start 2P',monospace;color:var(--blue)}.landscape-scene{margin:0 0 40px;border:4px solid #6844fc;background:#000}.scene-label{font-size:9px;line-height:2;color:#a4e4fc;padding:16px 20px}#landscape{position:static;inset:auto;display:block;width:512px;height:288px;margin:auto;image-rendering:pixelated}.landscape-scene figcaption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:16px 20px;font:10px/2 monospace;color:#b8b8f8}.landscape-scene figcaption span{color:var(--yellow)}#archive{border-block:2px solid var(--navy);padding:24px 0}@media(max-width:719px){#landscape{width:256px;height:144px}.scene-label{font-size:8px}.landscape-scene figcaption{padding:12px}.briefing-copy>p:not(.panel-label){font-size:18px}}
/* Persistent ship console. */
#journal{max-width:1280px;padding:24px;height:100svh}.console-shell{height:100%;display:flex;flex-direction:column;border:4px solid #0078f8;background:#000044;padding:8px;box-shadow:8px 8px 0 #000088}.console-header{padding:12px 16px;border:0;background:#000088;flex-shrink:0;font-size:9px}.online{color:#58f898}.console-body{display:grid;grid-template-columns:216px minmax(0,1fr);gap:12px;flex:1;min-height:0;margin-top:12px}.console-controls{display:flex;flex-direction:column;justify-content:flex-start;gap:16px;margin:0;padding:16px 8px;background:#000088}.console-controls .panel-label{margin:0;font-size:8px}.console-controls [role=tablist]{display:flex;flex-direction:column;gap:8px}.console-controls button{display:flex;gap:12px;align-items:center;min-height:56px;font-size:8px;line-height:1.8;padding:12px 8px;border:2px solid transparent;color:#a4e4fc;width:100%}.console-controls button[aria-selected=true]{background:#000;color:#fce0a8;border-color:#3cbcfc}.console-controls button:before{content:none!important}.console-controls button:focus-visible{outline-offset:1px}.console-diagnostics{margin-top:auto;text-align:left;font:9px/1.8 monospace;color:#3cbcfc}.console-diagnostics strong{font-weight:normal;color:#fce0a8}.console-diagnostics p{border-top:2px solid #0000bc;padding-top:12px}.console-monitor{min-width:0;min-height:0;display:flex;flex-direction:column;border:4px solid #0078f8;background:#000}.monitor-bar{display:flex;justify-content:space-between;gap:16px;background:#000088;padding:12px 16px;font-size:8px;line-height:1.8;color:#a4e4fc}.monitor-content{overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#0078f8 #000044;flex:1;padding:24px;min-height:0}.monitor-content [role=tabpanel]:focus-visible{outline:2px solid #3cbcfc;outline-offset:4px}.console-footer{display:flex;justify-content:space-between;gap:16px;padding:12px 8px 4px;font:10px/1.6 monospace;color:#3cbcfc}.console-footer span:first-child{color:#58f898}.console-monitor .terminal-section{margin:0}.console-monitor .bridge-scene{margin:16px 0 0;border-width:2px;padding-top:0}.console-monitor .bridge-scene figcaption{border-width:2px;margin-top:0}.console-monitor .briefing-copy{border-width:2px;padding:24px}.console-monitor .room-heading h3{font-size:10px}.console-monitor .briefing-copy h2{font-size:18px}.console-monitor #receive{margin:0 0 32px;padding:24px}.console-monitor #about{border:0;padding:0}.console-monitor .outside-log{margin:0;padding:0}.console-monitor #archive{padding:24px 0}.records-icon{font:56px/1 monospace;color:#0078f8;letter-spacing:12px;padding:32px 0}.console-monitor .landscape-scene{border-width:2px}.console-monitor .landscape-scene .scene-label{font-size:8px}.console-monitor .newsletter-link{font-size:9px}.console-monitor #bridge-art{width:512px;height:352px}.console-monitor #landscape{width:512px;height:288px}
@media(max-width:1000px){.console-monitor #bridge-art{width:256px;height:176px}.console-monitor #landscape{width:256px;height:144px}.console-body{grid-template-columns:184px minmax(0,1fr)}.console-controls button{font-size:7px}.monitor-content{padding:16px}}
@media(max-width:640px){#journal{padding:8px}.console-shell{padding:4px;box-shadow:none}.console-header{padding:8px;font-size:6px;gap:8px}.console-header .online{display:none}.console-body{display:flex;flex-direction:column;gap:8px;margin-top:8px}.console-monitor{flex:1;order:0}.console-controls{order:1;padding:4px;gap:0;flex-shrink:0}.console-controls .panel-label,.console-diagnostics{display:none}.console-controls [role=tablist]{display:grid;grid-template-columns:1fr 1fr;gap:4px}.console-controls button{min-height:44px;padding:8px;font-size:7px;gap:8px}.monitor-content{padding:8px}.monitor-bar{font-size:7px;padding:8px}.console-footer{font-size:8px;padding:8px 4px 4px}.console-footer span:last-child{display:none}.console-monitor .briefing-copy{padding:16px}.console-monitor .briefing-copy h2{font-size:14px}.console-monitor #receive{padding:16px}.console-monitor #receive h3{font-size:10px}.room-heading>span{font-size:8px}.console-monitor .bridge-scene figcaption{font-size:8px;padding:8px}.console-monitor .newsletter-link{font-size:8px}}
@media(prefers-reduced-motion:no-preference){[role=tabpanel]:not([hidden]){animation:screen-in 120ms steps(2,end)}@keyframes screen-in{from{opacity:.4}to{opacity:1}}}
#training-game{position:static;inset:auto;display:block;width:512px;height:448px;image-rendering:pixelated;margin:20px auto;border:0;max-width:none}#training-game:focus-visible{outline:2px solid #58f898;outline-offset:4px}.game-actions,.touch-controls{display:flex;justify-content:center;gap:12px;margin:16px 0}.game-actions button,.touch-controls button{border:2px solid #3cbcfc;padding:12px;font-size:9px;line-height:1.8;min-height:44px;color:#fce0a8}.game-actions button:before,.touch-controls button:before{content:none!important}.game-actions button:disabled{opacity:.4;cursor:default}.touch-controls button{touch-action:none;user-select:none;min-width:64px}.touch-controls button:active{background:#000088}#panel-training>.panel-label{font:10px/1.8 monospace}#panel-training h3{font-size:12px}@media(max-width:1000px){#training-game{width:256px;height:224px}}@media(max-width:640px){.console-controls [role=tablist] button:last-child{grid-column:1/-1;min-height:36px}.console-controls button{min-height:36px}.game-actions button{font-size:7px}}
@media(max-height:899px){#training-game{width:256px;height:224px;margin:12px auto}.game-actions,.touch-controls{margin:8px 0}#panel-training>.system-note{margin:8px 0}}
/* Let the mobile title interface use the available width; retain native pixels in the starfield. */
@media(max-width:543px){
 #title-screen{padding:20px 12px}
 #title-screen .screen{width:100%;max-width:400px;height:480px}
 #space{width:512px;height:480px;left:50%;transform:translateX(-50%)}
 #title-screen .title-content{padding:52px 8px 0}
 #title-screen .eyebrow{font-size:7px;letter-spacing:1px;line-height:2}
 #title-screen h1{font-size:36px;letter-spacing:-2px;margin:24px 0 20px;text-shadow:0 4px #a81000,4px 4px #a81000,4px 8px #501000}
 #title-screen h1 span:first-child{font-size:64px;letter-spacing:4px;margin-left:4px}
 #title-screen .subtitle{font-size:7px;line-height:2;margin-top:24px}
 #title-screen nav{margin-top:28px;gap:8px}
 #title-screen button{font-size:14px;min-height:44px;min-width:144px;padding:12px 24px}
 #title-screen .hint{font-size:6px;line-height:2;margin-top:20px}
 #title-screen .edition{font-size:7px;line-height:2;margin-top:24px}
 #title-screen .outside{font-size:6px;text-align:center;margin-top:16px}
}
@media(max-width:359px){#title-screen h1{font-size:32px}#title-screen h1 span:first-child{font-size:56px}#title-screen .subtitle{font-size:6px}}
