/* Shared portfolio identity. Load after each page's content styles. */
:root { color-scheme:dark; --bg:#080f16; --surface:#101e29; --surface-2:#142832; --border:#30414d; --border-strong:#587481; --text:#edf2f4; --muted:#a8b7c2; --accent:#a3d8e3; --accent-2:#b0cfda; --radius:0px; --sans:"Segoe UI",-apple-system,BlinkMacSystemFont,Arial,sans-serif; --mono:"Cascadia Mono","SFMono-Regular",Consolas,monospace; }
* { box-sizing:border-box; }
html { scroll-padding-top:124px; }
body { margin:0; color:var(--text); background:var(--bg); font-family:var(--sans); -webkit-font-smoothing:antialiased; }
[hidden] { display:none!important; }
.site-masthead { position:sticky; top:0; z-index:30; background:#080f16; border-bottom:1px solid #ffffff16; }
.site-nav { width:min(1240px,calc(100% - 96px)); min-height:86px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:32px; }
.site-brand { display:inline-flex; align-items:baseline; gap:0; flex-shrink:0; color:#edf2f4; text-decoration:none!important; font:700 28px/1 var(--sans); letter-spacing:-.07em; }
.site-brand>span { color:var(--accent); }
.site-brand small { margin-left:19px; padding-left:19px; border-left:1px solid #ffffff35; color:#a8bac8; font:9px/1.3 var(--mono); letter-spacing:.1em; }
.site-links { display:flex; align-items:center; gap:23px; }
.site-links a { display:inline-flex; align-items:center; min-height:44px; color:#c7d2d9; text-decoration:none; white-space:nowrap; font:12px/1.4 var(--sans); }
.site-links a:hover,.site-links a[aria-current="page"] { color:var(--accent); }
.site-links a[aria-current="page"] { box-shadow:inset 0 -1px var(--accent); }
.site-end { width:min(1240px,calc(100% - 96px)); margin:auto; padding-block:34px; border-top:1px solid var(--border); display:flex; align-items:start; justify-content:space-between; gap:28px; }
.site-end>div { display:flex; align-items:start; gap:22px; }
.site-end p { margin:0; font:12px/1.8 var(--sans); color:var(--muted); }
.site-end p span { font-size:10px; }
.site-end nav { display:flex; flex-wrap:wrap; justify-content:end; gap:8px 24px; }
.site-end nav a { display:inline-flex; align-items:center; min-height:44px; color:#c7d2d9; font:12px/1.4 var(--sans); text-decoration:none; }
.image-credit { text-align:center; margin:0 20px 24px; font:10px/1.5 var(--sans); color:var(--muted); }
.breadcrumbs { display:flex; flex-wrap:wrap; align-items:center; gap:12px; color:var(--muted); font:11px/1.5 var(--mono); padding-block:26px; }
.breadcrumbs a { display:inline-flex; min-height:36px; align-items:center; color:var(--accent); text-decoration:none; }
.game-crumbs { max-width:1240px; width:calc(100% - 96px); margin:auto; }
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:2px solid #a3d8e3!important; outline-offset:5px; }
.skip-link { position:fixed; z-index:100; left:20px; top:16px; padding:10px 20px; color:#080f16; background:#a3d8e3; transform:translateY(-200%); text-decoration:none; }
.skip-link:focus { transform:none; }
.thruster-visual { position:relative; display:block; height:305px; overflow:hidden; background:#101c28; border-bottom:1px solid var(--border); }
.thruster-visual img { display:block; width:100%; height:100%; object-fit:cover; }
.thruster-visual .development-label { position:absolute; bottom:20px; left:28px; color:#a8c8d5; }
.thruster-project { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; }
.thruster-project .thruster-visual { height:100%; min-height:380px; border:0; }
.mission-page { --max:1240px; --sans:"Segoe UI",-apple-system,BlinkMacSystemFont,Arial,sans-serif; --mono:"Cascadia Mono","SFMono-Regular",Consolas,monospace; }
.mission-page h1,.mission-page h2,.mission-page h3 { font-weight:500; letter-spacing:-.045em; }
.mission-page .landing { padding:20px 0 64px; max-width:1240px; width:calc(100% - 96px); gap:48px; }
.mission-page .hero-copy h1 { font-size:clamp(44px,5.1vw,70px); font-weight:500; }
.mission-page .hero-copy h1 span { color:#9cc2d0; background:none; -webkit-text-fill-color:currentColor; }
.mission-page .hero-copy .eyebrow { color:#9fbfcd; font-size:10px; }
.mission-page .lead { font-size:22px; color:#dce6eb; font-weight:400; }
.mission-page .spacecraft-stage { background:radial-gradient(ellipse at 50% 40%,#1b3442 0%,#101e29 66%); border-radius:0; }
.mission-page .button { border-radius:0; font-size:13px; gap:20px; }
.mission-page .button.primary { color:#0a1720; background:#d0e6e9; }
.mission-page .brief-strip>div { background:transparent; border:0; border-top:1px solid var(--border); border-radius:0; padding:20px 0; }
.mission-page .eyebrow,.mission-page .record-id { color:#a3c6d5; }
.mission-page .about-section,.mission-page .review-shell { max-width:1240px; width:calc(100% - 96px); padding-inline:0; }
.mission-page #review-title { font-size:clamp(28px,3.4vw,42px); scroll-margin-top:140px; }
.mission-page .budget-panel { top:112px; }
.mission-page .choices,.mission-page .inspection-grid { grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr)); }
.mission-page .choice-top { flex-wrap:wrap; }
.mission-page .record-specs div { flex-wrap:wrap; }
.mission-page .record-specs dd { overflow-wrap:anywhere; }
.mission-page .component-choice,.mission-page .stepper button,.mission-page .check-row,.mission-page .verification-option,.mission-page .inspection-card,.mission-page .model-notes { border-radius:0; }
.mission-page .meter-fill { background:#a3c6d5; }
.mission-page .score-ring { background:radial-gradient(circle,#1b3442,transparent 70%); }
.lab-wrap { width:min(1240px,calc(100% - 96px)); margin:auto; padding-bottom:72px; }
.lab-intro { display:grid; grid-template-columns:1.1fr 1fr; gap:60px; align-items:end; padding:14px 0 38px; }
.lab-intro h1 { font:500 clamp(46px,5.1vw,70px)/1.02 var(--sans); letter-spacing:-.055em; margin:22px 0; color:#edf2f4; }
.lab-intro h1 span { color:#9cc2d0; }
.lab-intro>div>p:not(.eyebrow) { font:22px/1.5 var(--sans); margin:0; color:#dce6eb; }
.lab-intro .eyebrow,.lab-notes .eyebrow,.next-project .eyebrow { font:10px/1.5 var(--mono); letter-spacing:.09em; color:#9fbfcd; margin:0; }
.lab-intro-note>p { font:15px/1.8 var(--sans)!important; color:var(--muted)!important; max-width:440px; }
.lab-intro-note>a { display:inline-block; font:12px/1.6 var(--sans); color:var(--accent); margin:16px 0 22px; }
.lab-intro-note .badge { width:fit-content; font-size:11px; }
.thruster-page { --panel:#101e29; --panel-2:#142832; --border: #30414d; --border-hi:#587481; --cyan:#83d6e8; --blue:#91b9d0; --purple:#b7a6d7; --amber:#edbd80; --grey:#b0c1ce; background:#080f16; }
.thruster-page .app { align-items:start; grid-template-columns:minmax(0,1fr) 340px; gap:20px; }
.thruster-page .panel,.thruster-page .stage { border-radius:0; background:#101e29; box-shadow:none; }
.thruster-page .out { border-radius:0; }
.thruster-page .btn { border-radius:0; min-width:44px; min-height:44px; }
.thruster-page .row { flex-wrap:wrap; gap:5px; }
.thruster-page .name { font-size:12px; }
.thruster-page .ctl { margin-bottom:12px; }
.thruster-page input[type=range] { min-height:32px; cursor:pointer; }
.thruster-page input[type=range] { background:transparent; border-radius:0; height:32px; }
.thruster-page input[type=range]::-webkit-slider-runnable-track { height:4px; border-radius:0; background:linear-gradient(90deg,var(--c) var(--p),#ffffff20 var(--p)); }
.thruster-page input[type=range]::-webkit-slider-thumb { margin-top:-5px; }
.thruster-page input[type=range]::-moz-range-track { height:4px; background:#ffffff20; }
.thruster-page input[type=range]::-moz-range-progress { height:4px; background:var(--c); }
.thruster-page .panel { font-family:var(--mono); }
.thruster-page .badge { display:flex; }
.thruster-page .lab-intro-note { padding-bottom:10px; }
.mission-page .hero-lead { color:#dce6eb; font-weight:400; }
.thruster-page::before { background:none; }
.thruster-page .lim,.thruster-page .note { font-size:11px; }
.thruster-page .note a { color:var(--accent); }
.thruster-page .out .k { font-size:9px; min-height:24px; }
.thruster-page .mini { font-size:11px; }
.lab-instructions { margin:0 0 18px; max-width:900px; font:13px/1.7 var(--sans); color:#b2c2cd; }
.lab-instructions span { color:var(--muted); }
.sim-footnote { font:10px/1.7 var(--mono); color:var(--muted); margin:16px 0; }
.lab-notes { margin-top:66px; border-top:1px solid var(--border); padding-top:52px; display:grid; grid-template-columns:1fr 1fr; gap:60px; scroll-margin-top:120px; }
.lab-notes h2,.next-project h2 { font:500 clamp(28px,3vw,40px)/1.12 var(--sans); letter-spacing:-.045em; margin:18px 0 24px; }
.lab-notes p,.next-project>p:not(.eyebrow) { color:var(--muted); font:14px/1.8 var(--sans); margin:0 0 16px; }
.lab-notes a { color:var(--accent); }
.lab-note-stack details { border-top:1px solid var(--border); padding:0 0 6px; }
.lab-note-stack summary { padding:16px 0; min-height:48px; font:15px/1.5 var(--sans); color:#dce6eb; cursor:pointer; }
.lab-note-stack p { font-size:13px; }
.next-project { margin-top:64px; padding:32px; border:1px solid var(--border); background:#101e29; }
.thruster-page .button,.error-page .button { display:inline-flex; align-items:center; min-height:47px; padding:11px 19px; font:600 13px/1.5 var(--sans); text-decoration:none; color:#0a1720; background:#d0e6e9; }
.error-page { padding-block:90px; min-height:65vh; }
.error-page h1 { font:500 clamp(40px,5vw,65px)/1.1 var(--sans); letter-spacing:-.045em; }
.error-page p { margin:24px 0; color:var(--muted); }
@media(max-width:1100px) { .site-nav,.site-end,.lab-wrap { width:calc(100% - 64px); } .site-brand small { display:none; } .site-links { gap:18px; } .game-crumbs,.mission-page .landing,.mission-page .review-shell,.mission-page .about-section { width:calc(100% - 64px); } }
@media(max-width:1040px) { .thruster-page .app { grid-template-columns:1fr; } .thruster-page .panel { display:grid; grid-template-columns:1fr 1fr; gap:16px 26px; } .thruster-page .panel>h2,.thruster-page .panel>.note,.thruster-page .panel>.outs,.thruster-page .panel>.minis { grid-column:1/-1; } .thruster-page .ctl { margin:0; } }
@media(max-width:800px) { .site-nav { display:block; padding-top:20px; } .site-brand small { display:inline; } .site-links { overflow-x:auto; gap:22px; padding-block:10px 8px; scrollbar-width:thin; } .site-links a { font-size:11px; flex-shrink:0; } .site-end { display:block; } .site-end nav { justify-content:start; margin-top:20px; } .lab-intro { gap:26px; } .lab-notes { grid-template-columns:1fr; gap:25px; } .thruster-project { grid-template-columns:1fr; } .thruster-project .thruster-visual { min-height:0; height:300px; } .mission-page .landing { gap:34px; } }
@media(max-width:640px) { .site-nav,.site-end,.lab-wrap,.game-crumbs,.mission-page .landing,.mission-page .review-shell,.mission-page .about-section { width:calc(100% - 40px); } .site-nav { padding-top:18px; } .site-brand { font-size:25px; } .site-brand small { font-size:8px; margin-left:17px; padding-left:17px; } .site-links { gap:20px; } .breadcrumbs { padding-block:16px; font-size:10px; } .lab-intro { grid-template-columns:1fr; gap:24px; padding:8px 0 24px; } .lab-intro h1 { font-size:clamp(40px,11vw,56px); } .lab-intro>div>p:not(.eyebrow) { font-size:20px; } .lab-intro-note>a { margin:12px 0 18px; } .lab-intro-note .badge { margin-bottom:0; } .thruster-page .panel { display:flex; gap:18px; padding:18px; } .thruster-page .stage { aspect-ratio:auto; padding-bottom:70px; } .thruster-page canvas { aspect-ratio:16/9; height:auto; } .thruster-page .corner { font-size:8px; letter-spacing:0; } .thruster-page .corner.tl { top:10px; left:10px; max-width:60%; } .thruster-page .corner.tr { top:10px; right:10px; max-width:35%; text-align:right; } .thruster-page .corner.bl { bottom:14px; left:10px; max-width:calc(100% - 115px); font-size:8px; } .thruster-page .legend { margin-right:8px; display:inline-block; } .thruster-page .controls { right:10px; bottom:12px; gap:6px; } .lab-notes { margin-top:42px; padding-top:34px; } .next-project { padding:24px; margin-top:34px; } .thruster-visual { height:270px; } .mission-page .landing { padding-top:12px; padding-bottom:36px; } .mission-page .hero-copy h1 { font-size:48px; } .mission-page .lead { font-size:20px; } .mission-page .about-section { padding-block:44px; gap:24px; } .mission-page .review-shell { padding-top:24px; } .mission-page .review-heading { align-items:start; } .mission-page .stepper button { padding:10px; font-size:12px; } .mission-page .spacecraft-stage { min-height:300px; } .mission-page .work-grid { gap:18px; } .mission-page .component-section,.mission-page .inspection-card { padding:16px; } .site-end>div { gap:16px; } .site-end p { font-size:11px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto!important; } *,*::before,*::after { animation:none!important; transition:none!important; } }
@media(max-width:640px) { html { scroll-padding-top:172px; } .site-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 10px; overflow:visible; padding-block:8px 8px; } .site-links a { min-height:44px; font-size:11px; white-space:normal; } .mission-page #review-title { scroll-margin-top:176px; } }
@media print { .site-masthead,.site-end,.breadcrumbs { display:none!important; } .lab-wrap { width:100%; } .thruster-page .app,.lab-notes { display:block; } }
.thruster-page .model-dashboard { grid-column:1/-1; display:grid; grid-template-columns:1fr; padding:24px; }
.thruster-page .model-dashboard .outs { grid-template-columns:repeat(4,minmax(0,1fr)); }
.thruster-page .model-dashboard .minis { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px 24px; }
.thruster-page .model-dashboard>.note { grid-column:1/-1; }
.thruster-page .model-dashboard .out .k { min-height:0; }
@media(max-width:1040px) { .thruster-page .model-dashboard { display:grid; grid-template-columns:1fr; } .thruster-page .model-dashboard .outs,.thruster-page .model-dashboard .minis { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:640px) { .thruster-page .model-dashboard { padding:18px; } .thruster-page .model-dashboard .out .k { min-height:24px; } .thruster-page .model-dashboard .minis { gap:12px; } .thruster-page .model-dashboard .mini { flex-wrap:wrap; gap:3px 8px; } }
