/* Company31 visual language, matched to company31.com in October 2026.
   Local font/logo copies keep this PHP package self-contained. */
@font-face{font-family:'Company31 Sans';font-style:normal;font-weight:200 800;font-display:swap;src:url('fonts/company31-sans.woff2') format('woff2')}
@font-face{font-family:'Company31 Mono';font-style:normal;font-weight:300 700;font-display:swap;src:url('fonts/company31-mono.woff2') format('woff2')}
@font-face{font-family:Newsreader;font-style:normal;font-weight:400;font-display:swap;src:url('fonts/newsreader-latin.woff2') format('woff2')}
:root{--ground:#FAFBFF;--text:#0A1633;--muted:rgba(10,22,51,.72);--faint:rgba(10,22,51,.64);--accent:#1C4FD8;--accent-strong:#12339E;--fill:#EAF1FD;--line:rgba(18,51,158,.20);--hairline:rgba(18,51,158,.12);--grid:rgba(18,51,158,.045);--grid5:rgba(18,51,158,.09);--tool:rgba(18,51,158,.17);--gold:#B08514;--btn-text:#FAFBFF;--logo-fix:none;--dialog-bg:#FAFBFF;--bg:var(--ground);--ink:var(--text);--green:var(--accent);--sans:'Company31 Sans',Arial,sans-serif;--mono:'Company31 Mono',monospace;--serif:Newsreader,Georgia,'Times New Roman',serif;color-scheme:light}
:root[data-theme='dark']{--ground:#0A1633;--text:#E9F0FC;--muted:rgba(233,240,252,.75);--faint:rgba(233,240,252,.66);--accent:#3B8AF7;--accent-strong:#A9CCFB;--fill:rgba(59,138,247,.09);--line:rgba(59,138,247,.32);--hairline:rgba(59,138,247,.16);--grid:rgba(59,138,247,.05);--grid5:rgba(59,138,247,.10);--tool:rgba(59,138,247,.21);--gold:#E9B95C;--btn-text:#0A1633;--logo-fix:invert(.88) hue-rotate(190deg) saturate(1.35) brightness(1.1);--dialog-bg:#0E1D3C;color-scheme:dark}
body{min-width:320px;background-color:var(--ground);background-image:linear-gradient(to right,var(--grid5) 1px,transparent 1px),linear-gradient(to bottom,var(--grid5) 1px,transparent 1px),linear-gradient(to right,var(--grid) 1px,transparent 1px),linear-gradient(to bottom,var(--grid) 1px,transparent 1px);background-size:130px 130px,130px 130px,26px 26px,26px 26px;color:var(--text);font-family:var(--serif);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body:before{content:'';position:fixed;inset:12px;z-index:40;border:1px solid var(--line);pointer-events:none}
body:after{content:'';position:fixed;left:25px;top:13px;bottom:13px;width:13px;border-right:1px solid var(--tool);background:repeating-linear-gradient(to bottom,var(--tool) 0 1px,transparent 1px 26px);pointer-events:none;z-index:-1}
h1,h2,h3,button,input,select{font-family:var(--sans)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline-color:var(--accent);outline-offset:5px}
.masthead{max-width:1180px;padding:0 40px;height:80px;border-bottom-color:var(--hairline)}
.brand{display:flex;align-items:center;gap:11px;color:var(--text);letter-spacing:normal;text-decoration:none}
.brand img,.footer-emblem img{display:block;filter:var(--logo-fix);border-radius:50%}
.brand>span{font-family:var(--sans);font-size:18px;letter-spacing:-.3px;font-weight:600}
.brand-nav{display:flex;align-items:center;gap:27px}
.brand-nav>a,.brand-nav .text-button{font:11px var(--mono);text-transform:uppercase;letter-spacing:1.5px;text-decoration:none;color:var(--accent)}
.brand-nav .text-button span{margin-left:4px}
.theme-toggle{border:1px solid var(--accent);color:var(--accent);background:transparent;border-radius:50%;width:37px;height:37px;font-size:20px;line-height:1;display:grid;place-items:center;box-shadow:0 0 0 3px var(--fill)}
.theme-toggle:hover{background:var(--fill)}
main{max-width:1180px;padding:0 40px}
.intro{padding:57px 0 37px;gap:36px;align-items:center}
.eyebrow{color:var(--accent);font:10px/1.6 var(--mono);letter-spacing:1.6px}
.intro h1{font-family:var(--sans);font-size:clamp(42px,4.8vw,66px);line-height:1.05;font-weight:600;letter-spacing:-.03em;margin-top:20px}
.intro h1 em{font-style:normal;color:var(--accent)}
.hero-caption{font:10px/1.6 var(--mono);letter-spacing:1.3px;color:var(--faint);margin-top:22px}
.intro-copy{width:300px;flex-shrink:0;padding-top:8px}
.intro-copy>p.eyebrow{font:10px var(--mono);color:var(--faint);margin-bottom:16px}
.intro-copy>p:nth-child(2){font:22px/1.45 var(--serif)}
.intro-copy>.muted{font:16px/1.6 var(--serif);margin-top:13px}
.workbench-bar{border-top-color:var(--line);border-bottom-color:var(--line)}
.tabs button{color:var(--muted);font-family:var(--mono)}
.tabs button span{font-family:var(--sans);font-size:13px}
.tabs .selected{color:var(--accent);border-color:var(--accent)}
.text-button{color:var(--accent);font-family:var(--mono)}
.flight-layout{min-height:700px;grid-template-columns:1.3fr 1fr}
.instrument-area{padding:27px 32px 24px 0;background:radial-gradient(ellipse at 50% 45%,var(--fill),transparent 70%)}
.instrument-heading{color:var(--faint);font-size:9px;letter-spacing:1px;margin-bottom:29px}
.instrument-heading>span:first-child:before,.note-heading>.eyebrow:before,.timeline-heading>span:first-child:before{content:'•';color:var(--accent);margin-right:7px}
/* The historical instrument retains its own engraved labels and colours. */
.dsky{--sans:Arial,Helvetica,sans-serif;--mono:'Courier New',monospace;max-width:503px;flex-shrink:0;color:#252e2b;color-scheme:light}
.dsky button{font-family:Arial,Helvetica,sans-serif}
.dsky .key:focus-visible{outline-color:#e0eda6}
.instrument-caption{color:var(--muted);font-family:var(--mono);font-size:10px}
.status-dot{background:var(--accent);box-shadow:0 0 0 3px var(--fill)}
.register-guide{border-color:var(--line)}
.register-guide>.eyebrow,.register-guide>.eyebrow span{color:var(--faint)}
#register-legend div{font:12px/1.5 var(--sans);color:var(--muted)}
#register-legend b{font-family:var(--mono);color:var(--accent);font-size:10px}
.mission-notebook{border-color:var(--line);padding:27px 0 24px 30px}
.notebook-top{color:var(--faint);font-size:10px}
.mission-time{margin-top:27px;margin-bottom:26px;border-color:var(--line)}
.mission-time>span:first-child{color:var(--faint);font-size:9px}
.mission-time strong{font-family:var(--mono);font-weight:400;font-size:32px;letter-spacing:-1.2px}
.phase{border-color:var(--line);color:var(--accent);font-size:9px;background:var(--fill)}
.event-body>.eyebrow{color:var(--accent);font-size:9px;letter-spacing:1px}
.event-body h2{font-family:var(--sans);font-weight:600;letter-spacing:-.025em;font-size:30px;line-height:1.14;margin-top:15px}
.event-body>p:not(.eyebrow){font-family:var(--serif);font-size:17px;line-height:1.6}
.command-block{background:var(--fill);border-color:var(--line);padding:16px;margin:21px 0 17px;border-radius:2px}
.command-heading{color:var(--faint);font-size:9px}
.command-keys kbd{border-color:var(--line);background:var(--ground);color:var(--text);font:11px var(--mono)}
.command-keys kbd.current{border-color:var(--accent);box-shadow:0 0 0 2px var(--fill)}
.command-keys kbd.done{background:var(--accent);border-color:var(--accent);color:var(--btn-text)}
.command-keys>span{color:var(--accent)!important}
#command-note{font:13px/1.65 var(--sans);color:var(--muted)}
.event-body>.event-detail{color:var(--muted);font-size:15px!important;line-height:1.6}
.source-link{color:var(--accent);font-family:var(--mono);font-size:9px;line-height:1.8}
#feedback{color:var(--muted);font:12px/1.6 var(--sans);min-height:39px}
.notebook-bottom{padding-top:22px}
.transport{height:43px;gap:8px}
.primary-button{background:var(--accent);color:var(--btn-text);border-color:var(--accent);font-family:var(--sans);font-weight:600;font-size:13px;border-radius:999px}
.primary-button:hover{background:var(--accent-strong);border-color:var(--accent-strong)}
.square-button{height:43px;width:37px;border-color:var(--line);border-radius:3px;color:var(--accent);background:transparent}
.square-button:hover{background:var(--fill)}
.speed select{height:43px;color:var(--muted);border-color:var(--line);background:var(--ground);font-family:var(--mono)}
.timeline-section{border-color:var(--line);padding-top:29px;padding-bottom:27px}
.timeline-heading,.phase-labels{color:var(--faint);font-family:var(--mono);font-size:9px;letter-spacing:1px}
.timeline-line{background:var(--line)}
.event-dot{background:var(--tool);border-color:var(--ground);box-shadow:0 0 0 1px var(--line)}
.event-dot.active{background:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.event-dot.alarm-dot{background:var(--gold)}
.event-dot.alarm-dot.active{box-shadow:0 0 0 2px var(--gold)}
.event-dot:hover{box-shadow:0 0 0 3px var(--line)}
.field-notes{padding:42px 0 45px;gap:70px;grid-template-columns:.9fr 1.1fr}
.note-heading>.eyebrow{color:var(--faint);font-size:10px}
.note-heading h2{font-family:var(--sans);font-weight:600;letter-spacing:-.025em;font-size:31px;line-height:1.13}
.field-notes>div:last-child{font-family:var(--serif);font-size:17px;line-height:1.65}
.field-notes .muted{font-size:15px;line-height:1.65}
.inline-link{color:var(--accent);font-family:inherit}
footer{display:block;max-width:1180px;padding:27px 40px 34px;border-color:var(--hairline)}
.titleblock{display:grid;grid-template-columns:auto 1fr 1fr 1fr;border:1px solid var(--line);border-radius:2px}
.titleblock>div,.footer-emblem{padding:15px 19px;border-right:1px solid var(--line)}
.titleblock>div:last-child{border-right:0}
.footer-emblem{display:flex;align-items:center;justify-content:center}
.titleblock span{display:block;font:9px var(--mono);letter-spacing:1.3px;color:var(--faint);margin-bottom:6px}
.titleblock p{font:14px/1.5 var(--serif)}
.footer-line{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:20px}
.footer-line>a,.footer-line>span,.footer-line .text-button{font:9px var(--mono);letter-spacing:1px;text-transform:uppercase;text-decoration:none;color:var(--accent)}
.footer-line>span{color:var(--faint)}
dialog{background:var(--dialog-bg);color:var(--text);border-color:var(--line);border-radius:3px;box-shadow:0 25px 100px #0005;line-height:1.7}
dialog::backdrop{background:#050d20d9;backdrop-filter:blur(6px)}
dialog h2{font-family:var(--sans);font-weight:600;letter-spacing:-.025em}
dialog h3{font-family:var(--sans);font-weight:600}
dialog p{font-family:var(--serif);font-size:17px}
.dialog-header .eyebrow{color:var(--accent)}
.close-dialog{color:var(--accent)}
dialog .small{font-size:14px!important}
#command-reference button{color:var(--text);font-family:var(--sans);font-size:13px;border-color:var(--line)}
#command-reference code{font-family:var(--mono);color:var(--accent);font-size:12px}
#command-reference button:hover{background:var(--fill)}
.source-item{font-family:var(--sans);font-size:15px;color:var(--accent);border-color:var(--line)}
.source-item span{font-family:var(--serif);color:var(--muted);font-size:15px}
.archive-controls input,.archive-controls select{background:var(--ground);color:var(--text);border-color:var(--line);font-family:var(--sans);font-size:13px}
.archive-item{border-color:var(--line)}
.archive-item pre{background:var(--fill);color:var(--text);border-color:var(--accent);font-family:var(--mono);font-size:12px}
.archive-item p{font:16px/1.6 var(--serif)}
.archive-item a,.archive-item .tag{font-family:var(--mono);color:var(--accent)}
.secondary-button{color:var(--accent);border-color:var(--accent);border-radius:999px;font-family:var(--sans)}
.skip{color:var(--text);background:var(--ground);font-family:var(--sans)}
@media(max-width:1050px){.intro h1{font-size:51px}.intro-copy{width:245px}.intro-copy>p:nth-child(2){font-size:20px}.masthead,main,footer{padding-left:38px;padding-right:38px}.instrument-area{padding-right:24px}.mission-notebook{padding-left:24px}.mission-time strong{font-size:28px}.event-body h2{font-size:27px}.dsky{padding-left:18px;padding-right:18px}.instrument-heading{font-size:8px}.titleblock>div,.footer-emblem{padding:12px}.titleblock p{font-size:13px}}
@media(max-width:900px) and (min-width:701px){.intro h1{font-size:46px}.intro-copy{width:220px}.intro-copy>p:nth-child(2){font-size:18px}.intro-copy>.muted{font-size:15px}.event-body h2{font-size:25px}.event-body>p:not(.eyebrow){font-size:16px}.event-body>.event-detail{font-size:14px!important}.dsky{padding-left:13px;padding-right:13px}.instrument-heading>span:first-child:before{display:none}.phase{float:none;margin-top:10px}.tabs{gap:15px}.tabs button span{font-size:12px}.register-guide>.eyebrow span{font-size:7px}}
@media(max-width:700px){body:before{inset:7px}body:after{display:none}.masthead{height:72px;padding:0 24px}.brand>span{font-size:16px}.brand img{width:29px;height:29px}.brand-nav{gap:15px}.brand-nav>a{display:none}.brand-nav .text-button{font-size:9px;letter-spacing:.8px}.theme-toggle{width:32px;height:32px;font-size:18px}main{padding:0 24px}.intro{padding:32px 0 27px;display:block}.intro>.eyebrow,.intro>div>.eyebrow{font-size:8px;letter-spacing:1px}.intro h1{font-size:clamp(39px,8vw,52px);margin-top:17px}.hero-caption{font-size:8px;margin-top:17px}.intro-copy{width:auto;max-width:380px;margin-top:25px;padding:0}.intro-copy>p.eyebrow{display:none}.intro-copy>p:nth-child(2){font-size:20px;line-height:1.4;margin-top:0}.intro-copy>p:nth-child(2) br{display:none}.intro-copy>.muted{font-size:16px;margin-top:9px}.tabs{gap:12px}.tabs button span{font-size:11px}.workbench-bar>.text-button{font-size:9px}.instrument-area{padding:25px 0 20px}.instrument-heading{font-size:8px}.dsky{padding:30px 22px 18px;max-width:460px}.mission-notebook{padding:25px 0}.mission-time strong{font-size:33px}.phase{float:right;margin-top:22px}.event-body h2{font-size:30px}.event-body>p:not(.eyebrow){font-size:18px}.event-body>.event-detail{font-size:16px!important}.source-link{font-size:9px}.register-guide>.eyebrow{font-size:8px}.register-guide>.eyebrow span{font-size:7px}.timeline-heading{font-size:8px}.field-notes{display:block;padding:31px 0}.field-notes>div:last-child{margin-top:22px}.note-heading h2{font-size:30px}.field-notes .muted{font-size:15px}footer{padding:24px}.titleblock{grid-template-columns:63px 1fr}.titleblock>div{border-right:0}.titleblock>div:nth-child(3){grid-column:1/-1;border-top:1px solid var(--line)}.titleblock>div:nth-child(4){grid-column:1/-1;border-top:1px solid var(--line)}.footer-emblem img{width:34px;height:34px}.footer-line{flex-wrap:wrap;gap:15px}.footer-line>span{display:none}.footer-line>a,.footer-line .text-button{font-size:8px!important;letter-spacing:.6px}.timeline-heading>span:last-child{max-width:150px}.phase-labels{font-size:8px}}
@media(max-width:385px){.masthead,main,footer{padding-left:18px;padding-right:18px}.brand-nav{gap:10px}.brand-nav .text-button{font-size:8px}.brand-nav .text-button span{display:none}.brand{gap:7px}.brand>span{font-size:15px}.tabs{gap:9px}.tabs button span{font-size:10px}.tabs button{font-size:8px}.workbench-bar>.text-button{font-size:8px}.dsky{padding:28px 14px 17px}.instrument-heading{font-size:7px}.instrument-caption{font-size:9px}.intro h1{font-size:39px}.hero-caption{font-size:7px}.phase{font-size:8px}.mission-time strong{font-size:30px}}
.command-explanation{margin-top:16px;padding-top:13px;border-top:1px solid var(--line)}
.command-explanation>.eyebrow{font:9px/1.6 var(--mono);letter-spacing:1px;color:var(--accent)}
.command-explanation #command-note{margin-top:7px}
.programmer-riddle{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;padding:35px 0;border-bottom:1px solid var(--line);scroll-margin-top:24px}
.programmer-riddle .eyebrow{font-size:9px;color:var(--gold);letter-spacing:1px}
.programmer-riddle h2{font:600 29px/1.15 var(--sans);letter-spacing:-.025em;margin-top:15px}
.riddle-credit{font:13px/1.6 var(--serif);color:var(--muted);margin-top:12px}
.riddle-verse{font:20px/1.65 var(--serif);border-left:2px solid var(--gold);padding-left:22px}
.riddle-actions{display:flex;gap:24px;align-items:flex-start;margin-top:20px}
.riddle-actions .secondary-button{white-space:nowrap;font-size:12px;padding:9px 17px}
.riddle-actions details{flex:1;padding-top:8px}
.riddle-actions summary{font:10px/1.6 var(--mono);color:var(--accent);cursor:pointer}
.riddle-actions details p{font:14px/1.6 var(--serif);color:var(--muted);margin-top:10px}
@media(max-width:900px){.programmer-riddle{gap:35px}.riddle-verse{font-size:18px;padding-left:17px}.riddle-actions{gap:15px}}
@media(max-width:700px){.programmer-riddle{grid-template-columns:1fr;gap:24px;padding:30px 0}.programmer-riddle h2 br{display:none}.programmer-riddle h2{font-size:27px}.riddle-verse{font-size:18px}.riddle-actions{flex-wrap:wrap}.riddle-actions details{min-width:130px}}