/* ============================================================
   THE INSTRUMENT PANEL — Poorvi Verma, flight record
   World: ground-control console holding paper strip-chart
   recorders. Console ink frames paper reading surfaces;
   amber is data and action only. See DESIGN.md.
   ============================================================ */

:root{
  --console:#101b1e;
  --console-2:#16262b;
  --console-3:#0b1417;
  --edge:rgba(237,166,58,.16);
  --edge-soft:rgba(242,237,226,.10);
  --paper:#f2ede2;
  --paper-2:#e9e2d2;
  --ink:#1d2a2e;
  --ink-soft:rgba(29,42,46,.66);
  --tick:rgba(29,42,46,.14);
  --amber:#eda63a;
  --amber-deep:#c97f14;
  --trace:#7fb069;
  --redline:#d4442e;
  --lamp-green:#8fd06c;
  --dim:#9fb3ae;      /* secondary text on console, tinted from paper+trace */
  --dim-2:#7d938d;
  --mono:"Martian Mono",ui-monospace,monospace;
  --disp:"Archivo",system-ui,sans-serif;
  --serif:"Source Serif 4",Georgia,serif;
  --w:1160px;
  --ease:cubic-bezier(.16,1,.3,1);
  --dur:.7s;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
[id]{scroll-margin-top:78px} /* deep-link anchors clear the sticky masthead */
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  background:var(--console);
  color:var(--dim);
  font-family:var(--disp);
  font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--amber);outline-offset:2px;border-radius:0}
.paper :focus-visible{outline-color:var(--ink)}
::selection{background:var(--amber);color:var(--console)}

.wrap{max-width:var(--w);margin:0 auto;padding:0 32px}
@media(max-width:720px){.wrap{padding:0 18px}}

/* ---------- console masthead ---------- */
.masthead{
  border-bottom:1px solid var(--edge);
  background:linear-gradient(180deg,var(--console-3),var(--console));
  position:sticky;top:0;z-index:50;
}
.masthead .wrap{
  display:flex;align-items:center;gap:22px;
  min-height:58px;
}
.station{
  font-family:var(--mono);font-size:11px;letter-spacing:.08em;
  color:var(--amber);text-decoration:none;white-space:nowrap;
  display:flex;align-items:center;gap:10px;
}
.station .lamp{width:7px;height:7px;border-radius:50%;background:var(--lamp-green);
  box-shadow:0 1px 4px rgba(143,208,108,.5);flex:none}
.mastnav{display:flex;gap:2px;margin-left:auto;flex-wrap:nowrap;white-space:nowrap}
.mastnav a{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;
  color:var(--dim);text-decoration:none;
  padding:8px 9px;border:1px solid transparent;
}
.mastnav a:hover,.mastnav a[aria-current="page"]{color:var(--amber);border-color:var(--edge)}
.mastnav a.act{color:var(--console);background:var(--amber);font-weight:700}
.mastnav a.act:hover{background:#f7bb59;color:var(--console)}
/* staged collapse: records drop first, CASE FILES/RESUME/EMAIL never wrap */
@media(max-width:1120px){
  .mastnav a.rec:not(.rsm){display:none}
}

/* ---------- generic console section ---------- */
.console-sec{padding:64px 0}
.panel-label{
  font-family:var(--mono);font-size:11px;letter-spacing:.14em;
  color:var(--amber);
  display:flex;align-items:center;gap:14px;
  margin-bottom:26px;
}
.panel-label::after{content:"";height:1px;background:var(--edge);flex:1}
.panel-label .idx{color:var(--dim-2)}

/* ---------- hero ---------- */
.hero{padding:72px 0 0;position:relative;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px;align-items:end}
@media(max-width:960px){.hero-grid{grid-template-columns:1fr;gap:36px}}
.hero h1{
  font-size:clamp(2.5rem,5.4vw,4.35rem);
  line-height:1.02;letter-spacing:-0.022em;font-weight:800;
  color:var(--paper);
  font-stretch:92%;
  text-wrap:balance;
}
.hero h1 em{font-style:normal;color:var(--amber)}
.hero .intro{margin-top:26px;max-width:54ch;font-size:1.06rem;color:var(--dim)}
.hero .intro strong{color:var(--paper);font-weight:600}
.hero-side{padding-bottom:8px}
.idplate{
  border:1px solid var(--edge);background:var(--console-2);
  padding:22px 24px;
}
.idplate .row{display:flex;justify-content:space-between;gap:16px;padding:7px 0;
  border-bottom:1px dashed var(--edge-soft);font-family:var(--mono);font-size:11px;letter-spacing:.04em}
.idplate .row:last-child{border-bottom:0}
.idplate .k{color:var(--dim-2)}
.idplate .v{color:var(--paper);text-align:right}
.idplate .v.amber{color:var(--amber)}
.cta-row{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.btn{
  font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-decoration:none;
  padding:14px 22px;border:1px solid var(--amber);
  color:var(--amber);transition:background .18s ease-out,color .18s ease-out;
}
.btn.solid{background:var(--amber);color:var(--console);font-weight:700}
.btn.solid:hover{background:#f7bb59}
.btn.ghost:hover{background:rgba(237,166,58,.12)}

/* hero strip chart */
.hero-chart{
  margin-top:64px;border-top:1px solid var(--edge);
  background:
    repeating-linear-gradient(90deg,transparent 0 119px,var(--edge-soft) 119px 120px),
    repeating-linear-gradient(0deg,transparent 0 39px,var(--edge-soft) 39px 40px),
    var(--console-3);
  position:relative;
}
.hero-chart svg{display:block;width:100%;height:auto}
.chart-caption{
  font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--dim-2);
  padding:10px 32px 14px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
}
.chart-caption b{color:var(--amber);font-weight:400}

/* ---------- gauges ---------- */
.gauge-row{
  display:grid;grid-template-columns:repeat(4,1fr);
  border:1px solid var(--edge);background:var(--console-2);
}
.gauge{
  padding:26px 22px 22px;border-right:1px solid var(--edge-soft);
  position:relative;
}
.gauge:last-child{border-right:0}
.gauge .dial{display:block;width:100%;max-width:170px;margin:0 auto}
.gauge .val{
  font-family:var(--mono);font-size:1.5rem;color:var(--paper);
  text-align:center;margin-top:4px;letter-spacing:-.02em;
}
.gauge .val small{font-size:.8rem;color:var(--amber)}
.gauge .cap{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;color:var(--dim-2);
  text-align:center;margin-top:10px;line-height:1.7;text-transform:uppercase;
}
.gauge .cap b{color:var(--dim);font-weight:400}
@media(max-width:920px){
  .gauge-row{grid-template-columns:1fr 1fr}
  .gauge:nth-child(2){border-right:0}
  .gauge:nth-child(1),.gauge:nth-child(2){border-bottom:1px solid var(--edge-soft)}
}
@media(max-width:480px){
  .gauge-row{grid-template-columns:1fr}
  .gauge{border-right:0;border-bottom:1px solid var(--edge-soft)}
  .gauge:last-child{border-bottom:0}
}

/* ---------- case records (paper strips) ---------- */
.records{display:flex;flex-direction:column;gap:34px}
.record{
  background:var(--paper);color:var(--ink);
  display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  text-decoration:none;
  position:relative;
  box-shadow:0 14px 34px -18px rgba(0,0,0,.55);
  transition:transform .22s cubic-bezier(.2,.8,.25,1);
}
.record:hover{transform:translateY(-3px);box-shadow:0 20px 44px -16px rgba(0,0,0,.7)}
.record:nth-child(even){grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.record:nth-child(even) .rec-body{order:2}
.record:nth-child(even) .rec-chart{order:1;border-right:0;border-left:1px solid var(--tick)}
@media(max-width:880px){
  .record,.record:nth-child(even){grid-template-columns:1fr}
  .record:nth-child(even) .rec-body{order:1}
  .record:nth-child(even) .rec-chart{order:2;border-left:0}
  .rec-chart{border-right:0!important;border-top:1px solid var(--tick)}
}
/* sprocket edge: strip chart paper feed holes */
.record::before,.record::after{
  content:"";position:absolute;top:0;bottom:0;width:14px;
  background-image:radial-gradient(circle at 7px 10px,var(--console) 2.6px,transparent 3.4px);
  background-size:14px 26px;background-repeat:repeat-y;
  opacity:.75;
}
.record::before{left:0}
.record::after{right:0}
.rec-body{padding:34px 40px 30px 44px}
.rec-head{
  display:flex;align-items:baseline;gap:14px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--ink-soft);
  margin-bottom:14px;
}
.rec-head .no{
  color:var(--paper);background:var(--ink);padding:3px 8px;letter-spacing:.06em;white-space:nowrap;flex:none;
}
.rec-head .who{flex:1 1 auto;min-width:0}
.rec-head .period{margin-left:auto;text-align:right;white-space:nowrap;flex:none}
.record h3{
  font-size:clamp(1.35rem,2.4vw,1.8rem);line-height:1.14;letter-spacing:-.014em;
  font-weight:750;color:var(--ink);text-wrap:balance;
}
.record .sub{font-family:var(--serif);font-size:1.02rem;color:var(--ink-soft);margin-top:12px;max-width:56ch}
.rec-stats{
  display:flex;gap:26px;margin-top:22px;flex-wrap:wrap;
  font-family:var(--mono);
}
.rec-stats .s b{display:block;font-size:1.22rem;color:var(--ink);font-weight:500;letter-spacing:-.02em}
.rec-stats .s b .red{color:var(--redline)}
.rec-stats .s span{font-size:9px;letter-spacing:.1em;color:var(--ink-soft);text-transform:uppercase}
.rec-open{
  margin-top:24px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;
  color:var(--amber-deep);display:inline-flex;gap:8px;align-items:center;
}
.record:hover .rec-open{text-decoration:underline;text-underline-offset:3px}
.rec-chart{
  border-right:1px solid var(--tick);
  padding:26px 34px;display:flex;flex-direction:column;justify-content:center;gap:8px;
  background:
    repeating-linear-gradient(0deg,transparent 0 23px,var(--tick) 23px 24px),
    var(--paper);
}
.rec-chart svg{width:100%;height:auto}
.rec-chart .fig{
  font-family:var(--mono);font-size:9px;letter-spacing:.08em;color:var(--ink-soft);
}

/* ---------- builder panel (CatCulate on console) ---------- */
.builder{
  border:1px solid var(--edge);background:var(--console-2);
  display:grid;grid-template-columns:minmax(0,3fr) minmax(0,7fr);
}
@media(max-width:820px){.builder{grid-template-columns:1fr}}
.builder-vis{
  border-right:1px solid var(--edge-soft);
  display:flex;align-items:center;justify-content:center;
  padding:40px;position:relative;
  background:
    radial-gradient(circle at 50% 42%,rgba(237,166,58,.14),transparent 62%),
    var(--console-3);
}
.builder-vis img{width:150px;filter:drop-shadow(0 14px 22px rgba(0,0,0,.5))}
.builder-vis .tag{
  position:absolute;bottom:14px;left:0;right:0;text-align:center;
  font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:var(--dim-2);
}
@media(max-width:820px){.builder-vis{border-right:0;border-bottom:1px solid var(--edge-soft)}}
.builder-body{padding:38px 42px}
.builder-body h3{color:var(--paper);font-size:1.7rem;letter-spacing:-.015em;font-weight:750;line-height:1.15}
.builder-body h3 em{font-style:normal;color:var(--amber)}
.builder-body p{margin-top:16px;max-width:62ch}
.builder-body p strong{color:var(--paper);font-weight:600}
.spec-strip{
  display:flex;gap:0;margin-top:26px;border:1px solid var(--edge-soft);flex-wrap:wrap;
}
.spec-strip .sp{
  flex:1;min-width:130px;padding:14px 16px;border-right:1px solid var(--edge-soft);
  font-family:var(--mono);
}
.spec-strip .sp:last-child{border-right:0}
.spec-strip b{display:block;color:var(--amber);font-size:1.05rem;font-weight:500}
.spec-strip span{font-size:8.5px;letter-spacing:.1em;color:var(--dim-2);text-transform:uppercase;line-height:1.6;display:block;margin-top:4px}
@media(max-width:560px){.spec-strip .sp{border-right:0;border-bottom:1px solid var(--edge-soft)}.spec-strip .sp:last-child{border-bottom:0}}

/* ---------- method ---------- */
.method{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--edge)}
@media(max-width:820px){.method{grid-template-columns:1fr}}
.method .m{padding:30px 30px 34px;border-right:1px solid var(--edge-soft)}
.method .m:last-child{border-right:0}
@media(max-width:820px){.method .m{border-right:0;border-bottom:1px solid var(--edge-soft)}.method .m:last-child{border-bottom:0}}
.method .m .rule{
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--amber);
  margin-bottom:14px;
}
.method .m h4{color:var(--paper);font-size:1.12rem;letter-spacing:-.01em;font-weight:700;line-height:1.3}
.method .m p{font-size:.92rem;margin-top:10px;color:var(--dim)}

/* ---------- contact close ---------- */
.close-sec{padding:100px 0 90px;border-top:1px solid var(--edge);
  background:linear-gradient(180deg,var(--console),var(--console-3))}
.close-sec h2{
  color:var(--paper);font-size:clamp(2rem,4.4vw,3.3rem);letter-spacing:-.02em;
  font-weight:800;line-height:1.05;max-width:20ch;text-wrap:balance;
}
.close-sec h2 em{font-style:normal;color:var(--amber)}
.close-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:center}
@media(max-width:880px){.close-grid{grid-template-columns:1fr}}
.close-meta{font-family:var(--mono);font-size:11px;letter-spacing:.05em;line-height:2.2;color:var(--dim)}
.close-meta .lamp{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--lamp-green);margin-right:8px}
.close-meta a{color:var(--amber);text-decoration:none}
.close-meta a:hover{text-decoration:underline;text-underline-offset:3px}

footer{border-top:1px solid var(--edge-soft);padding:22px 0 30px}
footer .wrap{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;color:var(--dim-2)}
footer a{color:var(--dim);text-decoration:none}
footer a:hover{color:var(--amber)}

/* ============================================================
   CASE PAGES — paper record
   ============================================================ */
.case-head{padding:64px 0 0}
.case-head .crumbs{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;color:var(--dim-2);
  display:flex;gap:10px;align-items:center;margin-bottom:30px;
}
.case-head .crumbs a{color:var(--dim);text-decoration:none}
.case-head .crumbs a:hover{color:var(--amber)}
.case-head h1{
  color:var(--paper);font-size:clamp(2rem,4.6vw,3.4rem);
  letter-spacing:-.02em;font-weight:800;line-height:1.05;max-width:24ch;text-wrap:balance;
}
.case-head h1 em{font-style:normal;color:var(--amber)}
.case-head .dek{margin-top:20px;max-width:62ch;font-size:1.08rem;color:var(--dim)}
.case-plate{
  margin-top:36px;display:flex;gap:0;border:1px solid var(--edge);
  background:var(--console-2);flex-wrap:wrap;
}
.case-plate .cell{
  flex:1;min-width:150px;padding:16px 20px;border-right:1px solid var(--edge-soft);
  font-family:var(--mono);
}
.case-plate .cell:last-child{border-right:0}
.case-plate .k{font-size:8.5px;letter-spacing:.12em;color:var(--dim-2);text-transform:uppercase}
.case-plate .v{font-size:12px;color:var(--paper);margin-top:6px;letter-spacing:.02em;line-height:1.6}
.case-plate .v.amber{color:var(--amber)}
@media(max-width:640px){.case-plate .cell{min-width:46%;border-bottom:1px solid var(--edge-soft)}}

/* paper body */
.paper{
  background:var(--paper);color:var(--ink);
  margin-top:56px;
  position:relative;
  box-shadow:0 18px 40px -20px rgba(0,0,0,.6);
}
.paper::before,.paper::after{
  content:"";position:absolute;top:0;bottom:0;width:14px;
  background-image:radial-gradient(circle at 7px 10px,var(--console) 2.6px,transparent 3.4px);
  background-size:14px 26px;background-repeat:repeat-y;opacity:.75;
}
.paper::before{left:0}
.paper::after{right:0}
.paper-inner{max-width:840px;margin:0 auto;padding:72px 56px 80px}
@media(max-width:720px){.paper-inner{padding:52px 34px 60px}}

.paper h2{
  font-family:var(--disp);font-weight:780;font-size:1.6rem;letter-spacing:-.015em;
  line-height:1.18;color:var(--ink);
  margin:64px 0 8px;
  display:flex;gap:14px;align-items:baseline;
}
.paper h2:first-child{margin-top:0}
.paper h2 .tick{
  font-family:var(--mono);font-weight:400;font-size:.72rem;color:var(--amber-deep);
  letter-spacing:.08em;flex:none;
}
.paper h3{
  font-family:var(--mono);font-size:11px;font-weight:400;letter-spacing:.14em;
  text-transform:uppercase;color:var(--amber-deep);
  margin:40px 0 6px;
}
.paper p{
  font-family:var(--serif);font-size:1.075rem;line-height:1.74;
  color:var(--ink);max-width:68ch;
  margin-top:16px;
}
.paper p.lead{font-size:1.22rem;line-height:1.62;color:var(--ink)}
.paper strong{font-weight:650}
.paper ul{margin:16px 0 0 2px;max-width:66ch;list-style:none}
.paper ul li{
  font-family:var(--serif);font-size:1.05rem;line-height:1.68;
  padding:7px 0 7px 26px;position:relative;
}
.paper ul li::before{
  content:"";position:absolute;left:2px;top:1.05em;width:12px;height:1px;background:var(--amber-deep);
}
.paper a{color:var(--amber-deep);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}

/* readout table */
.readout{
  margin:30px 0 8px;border:1px solid var(--ink);max-width:66ch;
}
.readout .rt-head{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;color:var(--paper);
  background:var(--ink);padding:8px 14px;text-transform:uppercase;
}
.readout .rt-row{
  display:flex;justify-content:space-between;gap:18px;align-items:baseline;
  padding:11px 14px;border-bottom:1px dashed var(--tick);
  font-family:var(--mono);font-size:12.5px;
}
.readout .rt-row:last-child{border-bottom:0}
.readout .rt-row .m{color:var(--ink-soft);font-size:11px;letter-spacing:.04em}
.readout .rt-row .r{color:var(--ink);font-size:14px;letter-spacing:-.01em;text-align:right;white-space:nowrap}
@media(max-width:640px){
  .readout .rt-row{flex-direction:column;align-items:flex-start;gap:3px}
  .readout .rt-row .r{white-space:normal;text-align:left}
}
.readout .rt-row .r.up{color:#3e7a34}
.readout .rt-row .r.red{color:var(--redline)}

/* figure on paper */
.fig-block{
  margin:34px 0 10px;padding:22px 22px 16px;
  border:1px solid var(--tick);
  background:
    repeating-linear-gradient(0deg,transparent 0 23px,var(--tick) 23px 24px),
    var(--paper-2);
}
.fig-block{overflow-x:auto}
.fig-block svg{width:100%;height:auto;min-width:540px} /* labels stay readable; narrow screens pan the chart */
.fig-block .fig{
  font-family:var(--mono);font-size:9px;letter-spacing:.08em;color:var(--ink-soft);
  margin:10px -22px -16px;line-height:1.7;
  background:var(--paper-2);padding:10px 22px 14px;
  border-top:1px solid var(--tick);
  position:relative;
}
.fig-block .fig b{color:var(--ink);font-weight:500}

/* margin stamp */
.stamp{
  margin:44px 0 8px;padding:24px 26px;
  border:1.5px solid var(--amber-deep);
  max-width:62ch;position:relative;
  transform:rotate(-.35deg);
}
.stamp .st-label{
  position:absolute;top:-9px;left:18px;background:var(--paper);
  padding:0 10px;font-family:var(--mono);font-size:9px;letter-spacing:.16em;
  color:var(--amber-deep);text-transform:uppercase;
}
.stamp p{font-family:var(--serif);font-style:italic;font-size:1.1rem;margin:0;color:var(--ink)}

/* next record */
.next-rec{padding:64px 0 84px}
.next-rec a{
  display:flex;justify-content:space-between;align-items:center;gap:20px;
  border:1px solid var(--edge);background:var(--console-2);
  padding:26px 32px;text-decoration:none;
  transition:border-color .18s ease-out;
}
.next-rec a{transition:border-color .18s ease-out,transform .22s var(--ease)}
.next-rec a:hover{border-color:var(--amber);transform:translateY(-2px)}
.next-rec .nk{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;color:var(--dim-2);text-transform:uppercase}
.next-rec .nt{color:var(--paper);font-size:1.25rem;font-weight:700;letter-spacing:-.01em;margin-top:6px}
.next-rec .arrow{font-family:var(--mono);color:var(--amber);font-size:1.3rem;flex:none}

/* console mounting hardware: screw heads on mounted modules */
.idplate,.gauge-row,.builder,.method,.case-plate,.station-row{position:relative}
.idplate::after,.gauge-row::after,.builder::after,.method::after,.case-plate::after,.station-row::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    radial-gradient(circle 2.5px at 7px 7px,          #3a4d50 45%, rgba(237,166,58,.35) 48%, transparent 62%),
    radial-gradient(circle 2.5px at calc(100% - 7px) 7px, #3a4d50 45%, rgba(237,166,58,.35) 48%, transparent 62%),
    radial-gradient(circle 2.5px at 7px calc(100% - 7px), #3a4d50 45%, rgba(237,166,58,.35) 48%, transparent 62%),
    radial-gradient(circle 2.5px at calc(100% - 7px) calc(100% - 7px), #3a4d50 45%, rgba(237,166,58,.35) 48%, transparent 62%);
}
.kicker{
  display:inline-block;
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  color:var(--amber);border:1px solid var(--edge);
  padding:7px 12px;margin-bottom:22px;
  background:var(--console-2);
}

.station-row{
  display:grid;grid-template-columns:repeat(5,1fr);
  border:1px solid var(--edge);background:var(--console-2);
}
/* the route rail: one flight line through all stations */
.station-row::before{
  content:"";position:absolute;left:3%;right:3%;top:74px;height:1px;
  background:repeating-linear-gradient(90deg,var(--amber-deep) 0 7px,transparent 7px 13px);
  opacity:.55;pointer-events:none;z-index:0;
}
.stplate{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  gap:0;padding:20px 14px 14px;text-align:center;text-decoration:none;
  border-right:1px solid var(--edge-soft);
  position:relative;z-index:1;
  transition:background .18s ease-out;
}
/* fixed zones so all five plates align: logo band, label band, metric, action pinned */
.stplate .stlogo{margin-bottom:24px}
.stplate .stlabel{min-height:54px;display:flex;flex-direction:column;justify-content:flex-start}
.stplate .stmetric{margin-top:6px}
.stplate .stgo{margin-top:auto;padding-top:14px}
.stplate:last-child{border-right:0}
/* station tick where the plate meets the rail */
.stplate .leg{
  position:absolute;top:70px;left:50%;transform:translateX(-50%);
  width:9px;height:9px;border-radius:50%;
  background:var(--console-2);border:2px solid var(--amber-deep);
}
a.stplate:hover,a.stplate:focus-visible{background:rgba(237,166,58,.07)}
a.stplate:hover .leg,a.stplate:focus-visible .leg{background:var(--amber);border-color:var(--amber)}
.stplate .stlogo{
  height:24px;width:auto;flex:none;box-sizing:content-box;
  background:var(--paper);padding:7px 12px;border-radius:2px;
  box-shadow:0 2px 6px -2px rgba(0,0,0,.5);
  transition:transform .18s ease-out;
}
.stplate .stlogo.lockup{display:inline-flex;align-items:center;gap:8px;height:24px;width:auto}
.stplate .stlogo.lockup img{width:22px;height:22px;border-radius:5px;flex:none}
.stplate .stlogo.lockup b{font-weight:800;font-size:15px;letter-spacing:-.01em;line-height:1}
.stplate .lk-air b{font-family:"Baloo 2",var(--disp);color:#0F6E9E;font-size:16px}
.stplate .lk-cat b{font-family:"Bricolage Grotesque",var(--disp);color:#C2571B}
a.stplate:hover .stlogo{transform:translateY(-2px)}
.stplate .stlabel{
  font-family:var(--mono);font-size:9px;letter-spacing:.12em;line-height:1.9;
  color:var(--dim);text-transform:uppercase;
}
.stplate .styr{color:var(--dim-2);letter-spacing:.1em}
.stplate .stmetric{
  font-family:var(--mono);font-size:10px;letter-spacing:.06em;
  color:var(--amber);
}
.stplate .stgo{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;
  color:var(--dim-2);
  opacity:.75;transition:opacity .18s ease-out,color .18s ease-out;
}
a.stplate:hover .stgo,a.stplate:focus-visible .stgo{opacity:1;color:var(--amber)}
.stgo-off{visibility:hidden}
@media(max-width:960px){
  .station-row{
    display:flex;overflow-x:auto;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
  }
  .station-row::before{left:24px;right:24px}
  .stplate{flex:0 0 78%;max-width:300px;scroll-snap-align:start}
}
@media(min-width:561px) and (max-width:960px){
  .stplate{flex-basis:44%}
}

/* case-plate secondary group mark */
.case-plate .cell .stlogo{
  height:18px;width:auto;margin-top:9px;box-sizing:content-box;
  background:var(--paper);padding:5px 9px;border-radius:2px;
  filter:grayscale(1) opacity(.88);
}

/* ---------- operating surfaces (PANEL A2 keyword chips) ---------- */
.chip-row{display:flex;flex-wrap:wrap;gap:10px}
.chip{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;
  color:var(--dim);text-decoration:none;
  border:1px solid var(--edge-soft);background:var(--console-2);
  padding:11px 16px;
  transition:border-color .18s ease-out,color .18s ease-out;
}
.chip:hover,.chip:focus-visible{border-color:var(--amber);color:var(--amber)}

/* ---------- record capability tags (paper strips) ---------- */
.rec-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.rec-tags span{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;
  color:var(--ink-soft);border:1px solid var(--tick);
  padding:4px 9px;text-transform:uppercase;white-space:nowrap;
}

/* ---------- print affordance on case pages ---------- */
.print-case{
  display:inline-block;margin-top:16px;
  font-family:var(--mono);font-size:10px;letter-spacing:.1em;
  color:var(--dim-2);text-decoration:none;
  border-bottom:1px solid var(--edge-soft);padding-bottom:2px;
}
.print-case:hover,.print-case:focus-visible{color:var(--amber);border-bottom-color:var(--amber)}

/* close headline rotor: odometer roll through metric words (motion-gated) */
.rotor{display:inline-flex;overflow:hidden;vertical-align:bottom}
.rotor-col{display:flex;flex-direction:column;align-items:flex-start}
.rotor-col>span{display:block;line-height:1.05;white-space:nowrap}
@media (prefers-reduced-motion:no-preference){
  body.motion .rotor{transition:width .45s var(--ease)}
  body.motion .rotor-col{transition:transform .55s var(--ease)}
}

/* reveal motion */
@media (prefers-reduced-motion:no-preference){
  .rv{opacity:0;transform:translateY(14px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
  .rv.on{opacity:1;transform:none}
  .trace-anim path.tr,.trace-anim polyline.tr{stroke-dasharray:var(--len,1200);stroke-dashoffset:var(--len,1200);transition:stroke-dashoffset 1.6s cubic-bezier(.3,.9,.3,1) .15s}
  .trace-anim.on path.tr,.trace-anim.on polyline.tr{stroke-dashoffset:0}
  /* damped instrument ballistics: slight overshoot is the needle's physics, not decoration */
  .needle{transition:transform 1.4s cubic-bezier(.3,1.32,.35,1) .2s}
  .gauge:nth-child(2) .needle{transition-delay:.34s}
  .gauge:nth-child(3) .needle{transition-delay:.48s}
  .gauge:nth-child(4) .needle{transition-delay:.62s}
  /* caption and in-chart labels arrive after the trace draws (JS adds body.motion) */
  body.motion .hero-chart .chart-caption{opacity:0;transition:opacity .8s var(--ease) 1.2s}
  body.motion .hero-chart.on .chart-caption{opacity:1}
}

/* ============================================================
   PRINT — the paper record prints as paper (M9/C11)
   ============================================================ */
@media print{
  body{background:#fff;color:#1d2a2e}
  .masthead,.mastnav,.next-rec,footer,.print-case,.cta-row,
  .hero-chart,.station-row,.chip-row,.gauge-row,.builder,.method,
  .close-sec,.crumbs{display:none!important}
  .case-head{padding:0}
  .case-head h1{color:#1d2a2e}
  .case-head h1 em{color:#8a5a0e}
  .case-head .dek{color:#3c4a4e}
  .case-plate{background:none;border:1px solid #bbb}
  .case-plate::after{display:none}
  .case-plate .cell{border-color:#ddd}
  .case-plate .k{color:#666}
  .case-plate .v{color:#1d2a2e}
  .case-plate .v.amber{color:#8a5a0e}
  .paper{margin-top:24px;box-shadow:none}
  .paper::before,.paper::after{display:none} /* no sprocket holes on paper output */
  .paper-inner{padding:24px 0 12px;max-width:none}
  .trace-anim path.tr,.trace-anim polyline.tr{stroke-dasharray:none!important;stroke-dashoffset:0!important}
  .fig-block,.readout,.stamp{break-inside:avoid}
  .paper a{color:#1d2a2e}
  .stamp{transform:none}
}