:root { --ink:#171816; --paper:#f1efe7; --acid:#e4f131; --red:#f04436; --orange:#ffb84d; --muted:#706f68; --line:rgba(23,24,22,.16); --sans:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif; --mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.45; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
.site-header { height:76px; display:flex; align-items:center; justify-content:space-between; padding:0 4.5vw; border-bottom:1px solid var(--line); position:relative; z-index:3; }
.wordmark { font-weight:900; font-size:1.3rem; letter-spacing:-.07em; }
.wordmark span { color:var(--red); }
.site-header nav { display:flex; gap:2rem; font-size:.87rem; font-weight:650; }
.site-header nav a, .header-link { transition:color .2s ease; }
.site-header nav a:hover, .header-link:hover { color:var(--red); }
.header-link { font-size:.87rem; font-weight:700; }
.header-actions { display:flex; align-items:center; gap:1.25rem; }
.language-switch { display:flex; align-items:center; gap:.25rem; font-family:var(--mono); font-size:.67rem; font-weight:800; }
.language-switch a,.language-switch span { min-width:30px; padding:.25rem .35rem; border:1px solid var(--line); text-align:center; }
.language-switch a:hover { border-color:var(--red); color:var(--red); }
.language-switch span { background:var(--ink); border-color:var(--ink); color:var(--paper); }
.hero { min-height:calc(100vh - 76px); padding:8vw 4.5vw 5vw; display:grid; grid-template-columns:minmax(0,1.06fr) minmax(370px,.94fr); gap:3vw; align-items:center; overflow:hidden; }
.eyebrow,.section-label,.card-index { font-family:var(--mono); text-transform:uppercase; letter-spacing:.04em; font-size:.72rem; font-weight:700; }
.eyebrow { display:flex; align-items:center; gap:.65rem; color:#52524c; margin:0 0 1.35rem; }
.eyebrow span { width:10px; height:10px; border-radius:50%; background:var(--red); box-shadow:0 0 0 5px rgba(240,68,54,.13); }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(3.5rem,7.2vw,7.6rem); line-height:.91; letter-spacing:-.085em; max-width:790px; margin-bottom:1.65rem; }
h1 em { color:var(--red); font-style:normal; }
.lede { max-width:560px; font-size:1.16rem; line-height:1.52; color:#3f403c; }
.hero-actions { display:flex; gap:1.35rem; align-items:center; margin-top:2rem; }
.button { display:inline-flex; gap:1.35rem; align-items:center; padding:.9rem 1.05rem; border-radius:2px; font-weight:760; font-size:.9rem; transition:transform .2s ease, background .2s ease; }
.button:hover { transform:translateY(-2px); }
.button b,.text-link b,.card-link b,.journal-card b { font-size:1.15em; }
.button-red { background:var(--red); color:#fff; }
.button-ink { color:var(--paper); background:var(--ink); margin-top:1rem; }
.text-link { display:inline-flex; gap:.5rem; align-items:center; font-weight:750; border-bottom:1px solid currentColor; padding-bottom:.12rem; }
.fine-print { color:#77766f; font-size:.72rem; margin-top:2rem; }
.hero-art { position:relative; min-height:520px; align-self:stretch; display:flex; align-items:center; justify-content:center; }
.render-frame { width:min(100%,650px); position:relative; z-index:1; transform:rotate(-2deg); mix-blend-mode:multiply; }
.render-frame img { width:100%; filter:drop-shadow(0 26px 22px rgba(20,21,16,.22)); }
.editor-frame { width:min(100%,720px); position:relative; z-index:1; border:1px solid var(--ink); background:#071626; box-shadow:14px 16px 0 var(--red); }
.editor-frame img { width:100%; }
.signal { position:absolute; border:1px solid #cfcfbe; border-radius:50%; z-index:0; }
.signal-a { width:75%; aspect-ratio:1; top:5%; right:2%; }
.signal-b { width:57%; aspect-ratio:1; top:16%; right:11%; }
.signal-c { width:39%; aspect-ratio:1; top:27%; right:20%; border-color:var(--red); }
.render-caption { position:absolute; right:0; bottom:5%; z-index:2; margin:0; font-family:var(--mono); font-size:.68rem; line-height:1.5; padding:.8rem .9rem; background:var(--acid); transform:rotate(3deg); }
.render-caption span { font-size:.58rem; }
.ticker { display:grid; grid-template-columns:repeat(4,1fr); background:var(--ink); color:var(--paper); border-top:1px solid #373833; }
.ticker div { min-height:145px; padding:1.55rem 2.1vw; border-right:1px solid #373833; display:flex; flex-direction:column; justify-content:end; }
.ticker strong { font-size:clamp(1.6rem,2.5vw,2.65rem); letter-spacing:-.07em; line-height:1; color:var(--acid); margin-bottom:.52rem; }
.ticker span { font-size:.77rem; line-height:1.35; max-width:190px; color:#c0c0b6; }
.intro { padding:11vw 10vw; display:grid; grid-template-columns:.45fr 1.2fr .7fr; gap:3vw; align-items:start; }
.section-label { color:var(--red); margin:0; }
.intro h2,.build-path h2,.architecture h2,.team h2 { font-size:clamp(2.2rem,4.3vw,5rem); letter-spacing:-.07em; line-height:.97; margin-bottom:1.5rem; }
.intro p:not(.section-label) { font-size:1.05rem; color:#44443f; max-width:580px; }
.pull-quote { border-left:2px solid var(--red); padding:.4rem 0 .4rem 1.2rem; font-size:1.1rem; font-weight:700; line-height:1.27; }
.audience { background:var(--ink); color:var(--paper); padding:6vw 4.5vw 7vw; }
.audience .section-label { color:var(--orange); }
.audience h2 { font-size:clamp(2.2rem,4.4vw,4rem); letter-spacing:-.075em; line-height:.98; max-width:900px; margin:1.1rem 0 3.4rem; }
.audience-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2.6rem; border-top:1px solid rgba(241,239,231,.2); padding-top:2.1rem; }
.audience-grid .card-index { color:var(--acid); margin-bottom:.85rem; }
.audience-grid p:not(.card-index) { margin:0; font-size:.96rem; line-height:1.55; color:#cbcac1; }
.audience-note { margin:3.2rem 0 0; max-width:640px; font-family:var(--mono); font-size:.71rem; line-height:1.65; color:#8b8a81; }
.evidence { background:#dad8cf; padding:5.5vw 4.5vw 7vw; }
.section-topline { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:2.1rem; }
.section-topline > p:last-child { font-family:var(--mono); font-size:.72rem; color:#6a6962; }
.evidence-grid { display:grid; grid-template-columns:1.18fr .78fr .78fr 1.15fr; grid-auto-rows:minmax(205px,auto); gap:12px; }
.evidence-grid article { padding:1.6rem; min-width:0; }
.evidence-main { background:var(--red); color:#fff; grid-row:span 2; display:flex; flex-direction:column; }
.evidence-main .card-index { color:#ffd0c9; }
.evidence-main h3 { font-size:clamp(2.2rem,3.3vw,3.5rem); line-height:.94; letter-spacing:-.07em; max-width:310px; margin:1.6rem 0 1rem; }
.evidence-main p:not(.card-index) { font-size:.93rem; line-height:1.5; max-width:350px; }
.evidence-grid-simple { grid-template-columns:1fr 1.3fr; grid-auto-rows:minmax(360px,560px); }
.evidence-grid-simple .evidence-main { grid-row:span 1; }
.evidence-grid-simple .evidence-main h3 { max-width:430px; }
.evidence-grid-simple .evidence-main p:not(.card-index) { max-width:480px; }
.evidence-grid-simple .schematic-card { grid-column:span 1; }
.evidence-grid-simple .schematic-wrap { height:auto; flex:1; min-height:280px; }
.card-link { margin-top:auto; align-self:start; font-size:.85rem; padding-bottom:.2rem; border-bottom:1px solid currentColor; font-weight:750; }
.metric-card { display:flex; flex-direction:column; }
.metric-card.warm { background:var(--orange); }
.metric-card.dark { background:var(--ink); color:var(--paper); }
.metric-card strong { font-size:clamp(2.3rem,3.6vw,3.9rem); letter-spacing:-.08em; line-height:.9; margin:auto 0 .8rem; }
.metric-card p:last-child { font-size:.78rem; line-height:1.35; margin-bottom:0; max-width:175px; }
.schematic-card { background:var(--paper); grid-column:span 2; overflow:hidden; display:flex; flex-direction:column; }
.schematic-wrap { height:170px; margin:-.3rem -1rem 1rem; overflow:hidden; background:#fff; border-bottom:1px solid var(--line); }
.schematic-wrap img { width:100%; min-height:100%; object-fit:cover; object-position:center 14%; filter:contrast(1.05); }
.schematic-wrap.layout-crop { background:#ca3434; }
.schematic-wrap.layout-crop img { object-position:center 52%; }
.schematic-wrap.editor-crop { height:220px; background:#071626; }
.schematic-wrap.editor-crop img { object-position:center 48%; }
.schematic-card p { font-family:var(--mono); font-size:.72rem; margin:0; line-height:1.35; }
.schematic-card p span { color:var(--red); font-weight:800; }
.build-path { padding:10vw 10vw; display:grid; grid-template-columns:.9fr 1.1fr; gap:7vw; }
.path-list { list-style:none; padding:0; margin:0; border-top:1px solid var(--line); }
.path-list li { display:grid; grid-template-columns:45px 1fr auto; gap:1.2rem; border-bottom:1px solid var(--line); padding:1.25rem 0 1.45rem; }
.path-list li > span { color:var(--red); font-family:var(--mono); font-weight:700; font-size:.76rem; padding-top:.24rem; }
.path-list h3 { margin:.1rem 0 .35rem; font-size:1.14rem; letter-spacing:-.03em; }
.path-list p { color:#606059; font-size:.86rem; margin:0; line-height:1.43; }
.path-list b { font-family:var(--mono); color:#5d5c55; font-size:.68rem; padding-top:.25rem; }
.architecture { background:var(--acid); padding:6vw 4.5vw; }
.architecture > .section-label { color:var(--ink); }
.architecture-grid { display:grid; grid-template-columns:1.03fr .97fr; gap:6vw; margin-top:2.1rem; align-items:center; }
.architecture-copy h2 { max-width:610px; }
.architecture-copy p { max-width:560px; color:#37382e; }
.rail-diagram { min-height:360px; display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:1rem; border:1px solid rgba(23,24,22,.45); background:rgba(255,255,255,.18); position:relative; }
.rail { padding:1rem; font-family:var(--mono); font-size:.83rem; border:1px solid var(--ink); display:flex; flex-direction:column; justify-content:flex-end; min-height:105px; position:relative; }
.rail small { display:block; font-size:.63rem; margin-top:.35rem; }
.battery { background:var(--red); color:#fff; grid-column:span 2; min-height:85px; }
.core { background:var(--paper); }
.afe { background:var(--ink); color:var(--paper); }
.sensor { background:var(--paper); }
.note { background:none; border:none; min-height:auto; padding:.2rem 0; font-size:.66rem; align-self:end; }
.journal { padding:7vw 4.5vw 9vw; }
.journal-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.journal-card { min-height:350px; display:flex; flex-direction:column; padding:1.5rem; transition:transform .2s ease; }
.journal-card:hover { transform:translateY(-5px); }
.journal-card p { font-family:var(--mono); font-size:.67rem; text-transform:uppercase; margin:0; }
.journal-card h3 { font-size:clamp(1.65rem,2.5vw,2.65rem); line-height:.95; letter-spacing:-.065em; margin:auto 0 1.6rem; max-width:310px; }
.journal-card span { align-self:flex-start; font-weight:750; font-size:.83rem; border-bottom:1px solid currentColor; padding-bottom:.17rem; }
.red-card { background:var(--red); color:#fff; }
.paper-card { background:#d9d7cc; }
.ink-card { background:var(--ink); color:var(--paper); }
.team { border-top:1px solid var(--line); padding:6.5vw 10vw 8vw; }
.team h2 { margin-top:1.2rem; }
.team-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin:3vw 0; }
.team-grid p { margin:0; font-size:.86rem; color:#64645d; }
.team-grid strong { color:var(--ink); font-size:1rem; line-height:1.25; }
.team-note { max-width:510px; color:#55554f; font-size:.85rem; }
.footer { display:grid; grid-template-columns:1fr 1fr auto; gap:2rem; padding:2rem 4.5vw; background:var(--ink); color:var(--paper); font-size:.78rem; }
.footer p { margin:0; color:#b1b1a8; }
.footer a:hover { color:var(--acid); }

/* Journal index and articles */
.page-hero { padding:9vw 10vw 7vw; border-bottom:1px solid var(--line); }
.page-hero .eyebrow { margin-bottom:1.4rem; }
.page-hero h1 { max-width:850px; font-size:clamp(3.2rem,7vw,7.3rem); }
.page-hero .lede { max-width:640px; }
.notes-list { padding:4vw 10vw 10vw; }
.note-row { display:grid; grid-template-columns:170px minmax(0,1fr) 100px; gap:2rem; padding:2.6rem 0; border-top:1px solid var(--line); align-items:start; }
.note-row:last-child { border-bottom:1px solid var(--line); }
.note-row time { font-family:var(--mono); font-size:.72rem; color:var(--red); }
.note-row h2 { font-size:clamp(2rem,4vw,4.4rem); letter-spacing:-.075em; line-height:.95; margin:0 0 .65rem; }
.note-row p { max-width:600px; color:#5d5c55; margin:0; }
.note-row a { font-family:var(--mono); font-size:.75rem; font-weight:800; padding-top:.5rem; }
.note-row a:hover { color:var(--red); }
.article-header { padding:7vw 10vw 4vw; }
.sponsor-body { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(300px,.85fr); gap:5vw; padding:5vw 10vw 10vw; align-items:start; }
.sponsor-copy h2 { font-size:clamp(1.7rem,3vw,2.7rem); letter-spacing:-.06em; line-height:1; margin:0 0 1rem; }
.sponsor-copy h2 + p { margin-bottom:1.1rem; }
.sponsor-copy h2:not(:first-child) { margin-top:2.8rem; }
.sponsor-copy p { max-width:620px; color:#4e4e47; line-height:1.6; }
.inline-link { border-bottom:1px solid var(--red); color:var(--red); font-weight:650; }
.sponsor-contact { background:var(--ink); color:var(--paper); padding:2rem 1.8rem; position:sticky; top:2rem; }
.sponsor-contact .card-index { color:var(--acid); margin:0 0 1rem; }
.sponsor-contact p { font-size:.95rem; line-height:1.55; color:#cbcac1; }
.sponsor-contact .button { margin:.6rem 0 0; word-break:break-all; }
.sponsor-note { margin:1.6rem 0 0; font-family:var(--mono); font-size:.68rem; line-height:1.6; color:#8b8a81; }
.article-header .kicker { font-family:var(--mono); color:var(--red); text-transform:uppercase; font-size:.72rem; font-weight:800; margin-bottom:1.5rem; }
.article-header h1 { font-size:clamp(3rem,6.7vw,7rem); max-width:1050px; }
.article-header .dek { max-width:670px; font-size:1.15rem; color:#4e4e47; }
.article-meta { font-family:var(--mono); font-size:.68rem; color:#67665f; margin-top:2rem; }
.article-image { margin:0 4.5vw; min-height:300px; overflow:hidden; background:#d6d4ca; position:relative; }
.article-image img { width:100%; max-height:700px; object-fit:cover; object-position:center; }
.article-image.schematic { background:#fff; padding:1.5rem; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.article-image.schematic img { max-height:550px; object-fit:contain; }
.article-image.layout-detail { background:#ca3434; display:flex; flex-direction:column; align-items:center; }
.article-image.layout-detail img { width:auto; max-height:720px; object-fit:contain; }
.article-image.editor-detail { background:#071626; display:flex; flex-direction:column; align-items:center; }
.article-image.editor-detail img { width:100%; max-height:none; object-fit:contain; }
.article-image figcaption { align-self:stretch; padding:.7rem 1rem; background:var(--ink); color:#d1d1c7; font-family:var(--mono); font-size:.66rem; line-height:1.4; }
.article { max-width:760px; margin:0 auto; padding:6vw 1.5rem 9vw; font-size:1.05rem; }
.article h2 { font-size:clamp(1.75rem,3.2vw,3rem); letter-spacing:-.065em; line-height:1; margin:3rem 0 1rem; }
.article p { margin-bottom:1.25rem; }
.article strong { color:var(--red); }
.article table { width:100%; border-collapse:collapse; font-size:.87rem; margin:2rem 0; }
.article th,.article td { border-bottom:1px solid var(--line); padding:.72rem .45rem; text-align:left; vertical-align:top; }
.article th { font-family:var(--mono); font-size:.68rem; text-transform:uppercase; color:#5f5f57; }
.article .callout { margin:2.2rem -3rem; padding:1.6rem 1.8rem; background:var(--acid); font-size:1.17rem; line-height:1.35; font-weight:750; }
.article .technical-note { margin:2rem 0; padding:1.4rem 1.5rem; border-left:3px solid var(--red); background:#e4e1d7; font-size:.94rem; }
.article-figure { margin:2.4rem -7vw; background:#fff; }
.article-figure.layout-detail { background:#ca3434; }
.article-figure.editor-detail { background:#071626; }
.article-figure img { width:100%; max-height:720px; object-fit:contain; }
.schematic-wrap.photo-crop { background:#3b3f45; }
/* The wrap only sets min-height, so a portrait photo overflows and gets clipped
   from the top instead of cropping. An explicit height puts object-fit back in
   charge, which is what object-position needs to work at all. */
.schematic-wrap.photo-crop img { height:100%; object-fit:cover; object-position:center 42%; filter:none; }
.inline-render { margin:2rem 0 0; max-width:400px; }
.inline-render img { width:100%; }
.inline-render figcaption { font-family:var(--mono); font-size:.68rem; color:#4a4f16; padding-top:.35rem; }
.article-image.render { background:var(--paper); display:flex; flex-direction:column; align-items:center; }
.article-image.render img { width:auto; max-width:min(100%,760px); max-height:600px; object-fit:contain; padding:2vw 0 0; }
.article-figure.photo { background:var(--ink); }
.article-figure.photo img { max-height:620px; object-fit:cover; }
.article-figure figcaption { padding:.7rem 1rem; background:var(--ink); color:#d1d1c7; font-family:var(--mono); font-size:.66rem; line-height:1.4; }
.article .sources { font-family:var(--mono); font-size:.72rem; color:#5f5e56; padding-top:2rem; margin-top:3rem; border-top:1px solid var(--line); }
.article .sources a { text-decoration:underline; }

@media (max-width:850px) { .site-header { padding:0 5vw; } .site-header nav { display:none; } .hero { grid-template-columns:1fr; padding:14vw 6vw 5vw; } .hero-art { min-height:350px; } .render-frame { width:95%; } .ticker { grid-template-columns:1fr 1fr; } .ticker div:nth-child(2) { border-right:none; } .intro,.build-path,.architecture-grid { grid-template-columns:1fr; } .intro { padding:15vw 8vw; gap:1.5rem; } .pull-quote { max-width:440px; } .evidence { padding:10vw 5vw; } .evidence-grid { grid-template-columns:1fr 1fr; } .evidence-main { grid-row:span 1; grid-column:span 2; min-height:300px; } .schematic-card { grid-column:span 2; } .evidence-grid-simple { grid-template-columns:1fr; } .evidence-grid-simple .evidence-main,.evidence-grid-simple .schematic-card { grid-column:span 1; } .build-path { padding:14vw 8vw; gap:2rem; } .architecture { padding:12vw 6vw; } .journal { padding:13vw 5vw; } .journal-grid { grid-template-columns:1fr; } .journal-card { min-height:250px; } .team { padding:12vw 8vw; } .team-grid { grid-template-columns:1fr 1fr; row-gap:1.5rem; } .footer { grid-template-columns:1fr; gap:.6rem; padding:2rem 6vw; } .page-hero,.article-header { padding:14vw 8vw 9vw; } .notes-list { padding:8vw 8vw 14vw; } .note-row { grid-template-columns:1fr; gap:.7rem; } .note-row a { padding:0; } .article-image { margin:0; } .article { padding:11vw 1.5rem; } .article .callout { margin:2rem 0; } .article-figure { margin:2rem 0; } }
@media (max-width:470px) { .site-header { height:65px; } .header-link { display:none; } .header-actions { gap:.5rem; } .hero { min-height:auto; } h1 { font-size:3.45rem; } .hero-actions { align-items:flex-start; flex-direction:column; gap:1.1rem; } .hero-art { min-height:270px; } .render-caption { right:4%; bottom:0; } .ticker { grid-template-columns:1fr; } .ticker div { min-height:110px; border-right:none; border-bottom:1px solid #373833; } .evidence-grid { grid-template-columns:1fr; } .evidence-main,.schematic-card { grid-column:span 1; } .metric-card { min-height:210px; } .section-topline { align-items:flex-start; flex-direction:column; gap:.6rem; } .path-list li { grid-template-columns:32px 1fr; } .path-list li b { grid-column:2; padding:0; } .rail-diagram { grid-template-columns:1fr; } .battery { grid-column:span 1; } .team-grid { grid-template-columns:1fr; } }

@media (max-width:850px) { .audience { padding:14vw 8vw; } .audience-grid { grid-template-columns:1fr; gap:2.1rem; } }

@media (max-width:850px) { .sponsor-body { grid-template-columns:1fr; gap:2.5rem; padding:8vw 8vw 14vw; } .sponsor-contact { position:static; } }