*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

:root {
  --bg: #050606;
  --bg2: #0a0c0a;
  --line: #1b201d;
  --line-hi: #2a322d;
  --text: #d8ded9;
  --text2: #98a29b;
  --muted: #7f8b81;
  --amber: #ffb000;
  --amber-dim: #7a5710;
  --red: #d0342c;
  --green: #30d158;
  --display: 'Inter', system-ui, sans-serif;
  --body-f: 'Inter', system-ui, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, monospace;
  --gutter: clamp(20px, 5vw, 88px);
  --max: 1280px;
}

html { scroll-behavior: smooth; scroll-padding-top: 70px; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--body-f);
  font-size: 16px;
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* CRT scanlines + vignette overlay */
body::before {
  content: '';
  position: fixed; inset: 0;
  transform: translateZ(0);
  pointer-events: none; z-index: 50;
  background: repeating-linear-gradient(
    0deg,
    rgba(0,0,0,.16) 0px, rgba(0,0,0,.16) 1px,
    transparent 1px, transparent 3px
  );
  opacity: .5;
}
body::after {
  content: '';
  position: fixed; inset: 0;
  transform: translateZ(0);
  pointer-events: none; z-index: 51;
  background: radial-gradient(ellipse at 50% 50%, transparent 62%, rgba(0,0,0,.38) 100%);
}

a { color: inherit; }
:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; }

/* ── Light mode (Eclipse: warm paper, ink, ochre gold) ── */
html[data-theme="light"] {
  --bg: #f2eee3;
  --bg2: #e9e2d1;
  --line: rgba(23, 19, 16, 0.22);
  --line-hi: rgba(23, 19, 16, 0.45);
  --text: #171310;
  --text2: #5f574a;
  --muted: #8a8071;
  --amber: #9a7312;
  --amber-dim: rgba(154, 115, 18, 0.35);
  --red: #b3261e;
  --green: #2f7d32;
}
html[data-theme="light"] body::after { display: none; }
/* Warm paper grain replaces the CRT scanlines in light mode */
html[data-theme="light"] body::before {
  display: block;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity: .06;
}
html[data-theme="light"] .streaks {
  background-image:
    linear-gradient(90deg, transparent 0%, rgba(23,19,16,.45) 50%, transparent 100%),
    linear-gradient(90deg, transparent 0%, rgba(154,115,18,.5) 50%, transparent 100%),
    linear-gradient(90deg, transparent 0%, rgba(23,19,16,.35) 50%, transparent 100%),
    linear-gradient(90deg, transparent 0%, rgba(23,19,16,.25) 50%, transparent 100%);
}
html[data-theme="light"] .darkstar::after {
  background: radial-gradient(circle, rgba(154,115,18,.16) 0%, rgba(154,115,18,.06) 45%, transparent 70%);
}
html[data-theme="light"] .sb-halo {
  background: radial-gradient(circle, transparent 32%, rgba(154,115,18,.12) 55%, transparent 74%);
}
/* BUG FIX: base .vign hardcodes a dark top fade — invisible on dark, a dark smear on paper */
html[data-theme="light"] .vign {
  background: radial-gradient(ellipse at 50% 45%, transparent 0%, rgba(242,238,227,.6) 68%, var(--bg) 100%),
    linear-gradient(to bottom, rgba(242,238,227,.9) 0%, transparent 22%, transparent 60%, var(--bg) 100%);
}
html[data-theme="light"] .darkstar {
  background: radial-gradient(circle at 32% 28%, #3a332a 0%, #171310 55%, #0d0b09 100%);
  box-shadow: inset -20px -26px 64px rgba(0,0,0,.5), 0 0 48px rgba(154,115,18,.25), 0 0 150px rgba(154,115,18,.12);
}
html[data-theme="light"] .space-band .sb-star {
  background: radial-gradient(circle at 34% 22%, #3a332a 0%, #171310 55%, #0d0b09 100%);
  box-shadow: inset -22px -28px 70px rgba(0,0,0,.5), 0 0 60px rgba(154,115,18,.2);
}
html[data-theme="light"] .nav.is-stuck { background: rgba(242,238,227,.9); }
/* Eclipse-sized crescent: ~200px visible, clear of the centered title (checked 1024–1440px) */
html[data-theme="light"] .darkstar { top: max(72px, 9vh); right: max(-10vw, -160px); width: clamp(280px, 38vmin, 480px); }
html[data-theme="light"] .nav-links.open { background: rgba(242,238,227,.97); }
html[data-theme="light"] .srow { border-bottom-color: rgba(23,19,16,.08); }
html[data-theme="light"] .lst input[type="checkbox"]:checked::after { border-color: #f2eee3; }
html[data-theme="light"] .ps span,
html[data-theme="light"] .td:hover,
html[data-theme="light"] .btn-primary,
html[data-theme="light"] .toast { color: #f2eee3; }
html[data-theme="light"] .btn-primary:hover { background: #6f550f; border-color: #6f550f; color: #f2eee3; }
/* Eclipse fidelity: small mono labels run in soft ink, not faint muted */
html[data-theme="light"] .nav-links a,
html[data-theme="light"] .ro-k,
html[data-theme="light"] .blk-label,
html[data-theme="light"] .blk-btn,
html[data-theme="light"] .theme-btn,
html[data-theme="light"] .cmp-t,
html[data-theme="light"] .foot-h,
html[data-theme="light"] .scr-ref,
html[data-theme="light"] .sb-tag { color: var(--text2); }
html[data-theme="light"] .nav-links a:hover { color: var(--amber); }
img { display: block; max-width: 100%; }
h1, h2, h3 { font-family: var(--display); font-weight: 600; margin: 0; }
::selection { background: var(--amber); color: var(--bg); }

/* ── Nav ── */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 40;
  display: flex; align-items: center; gap: 24px;
  padding: 16px var(--gutter);
  border-bottom: 1px solid transparent;
}
.nav.is-stuck {
  background: rgba(5,6,6,.9);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-bottom-color: var(--line);
  padding-top: 11px; padding-bottom: 11px;
}
.nav-mark { display: flex; align-items: center; text-decoration: none; color: var(--amber); }
.nav-logo { display: block; }
.nav-links { display: flex; gap: 4px; margin-left: auto; }
.nav-links a {
  font-family: var(--mono); font-size: 11.5px; letter-spacing: .06em;
  text-transform: uppercase; text-decoration: none; color: var(--muted);
  padding: 8px 12px; transition: color .15s;
}
.nav-links a:hover, .nav-links a.on { color: var(--amber); }
.nav-menu { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
.nav-menu span { width: 18px; height: 1.5px; background: var(--text); border-radius: 1px; }
.theme-btn { font-family: var(--mono); font-size: 11px; letter-spacing: .1em; background: transparent; border: 1px solid var(--line-hi); color: var(--muted); padding: 8px 12px; cursor: pointer; transition: border-color .15s, color .15s; }
.theme-btn:hover { border-color: var(--amber); color: var(--amber); }

/* ── Hero ── */
.hero {
  position: relative; min-height: 100svh; display: grid;
  grid-template-rows: 1fr auto; padding: 0 var(--gutter); overflow: hidden;
}
.space { position: absolute; inset: 0; z-index: 0; }

.darkstar {
  position: absolute; top: 9%; right: 6%;
  width: clamp(240px, 36vmin, 460px); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 32% 28%, #26221a 0%, #14120d 32%, #070808 60%, #040505 100%);
  box-shadow: inset -20px -26px 64px rgba(0,0,0,.92), inset 12px 16px 48px rgba(255,176,0,.09), 0 0 48px rgba(255,176,0,.10), 0 0 150px rgba(255,176,0,.05);
  animation: drift 36s ease-in-out infinite;
}
@keyframes drift {
  0% { transform: translate3d(0,-10px,0) rotate(0deg) scale(1); }
  50% { transform: translate3d(-8px,9px,0) rotate(180deg) scale(1.06); }
  100% { transform: translate3d(0,-10px,0) rotate(360deg) scale(1); }
}

/* Soft breathing halo around the hero star (opacity-only: cheap, subtle) */
.darkstar::after {
  content: ''; position: absolute; inset: -70px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,176,0,.14) 0%, rgba(255,176,0,.05) 45%, transparent 70%);
  pointer-events: none;
  animation: breathe 6s ease-in-out infinite alternate;
}
@keyframes breathe { from { opacity: .5; } to { opacity: 1; } }

.streaks {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(90deg, transparent 0%, rgba(216,222,217,.8) 50%, transparent 100%),
    linear-gradient(90deg, transparent 0%, rgba(255,176,0,.55) 50%, transparent 100%),
    linear-gradient(90deg, transparent 0%, rgba(216,222,217,.6) 50%, transparent 100%),
    linear-gradient(90deg, transparent 0%, rgba(216,222,217,.45) 50%, transparent 100%);
  background-size: 340px 1px, 260px 1px, 420px 2px, 300px 1px;
  background-position: 0 18%, 40% 37%, 70% 58%, 20% 79%;
  background-repeat: repeat-x;
  animation: streaks 2.4s cubic-bezier(.16,.84,.32,1) both;
  pointer-events: none;
}
@keyframes streaks { 0% { transform: translateX(0); opacity: 1; } 70% { opacity: .5; } 100% { transform: translateX(-60vw); opacity: 0; } }

.vign {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 45%, transparent 0%, rgba(5,6,6,.6) 68%, var(--bg) 100%),
    linear-gradient(to bottom, rgba(5,6,6,.85) 0%, transparent 22%, transparent 60%, var(--bg) 100%);
}

.hero-inner { position: relative; z-index: 2; align-self: center; max-width: var(--max); width: 100%; margin: 0 auto; padding: 150px 0 48px; text-align: center; }

.hero-tag { font-family: var(--mono); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--amber); margin-bottom: 24px; }
.hero h1 { font-size: clamp(30px, 6vw, 84px); line-height: 1.02; letter-spacing: -.015em; text-transform: uppercase; font-weight: 700; margin: 0 0 32px; text-wrap: balance; }
.hero h1, .scr-head h2 { overflow-wrap: break-word; }
.scr, .hero { scroll-margin-top: 70px; }
.hero h1 em { font-style: normal; color: var(--amber); }
.hero-sub { max-width: none; white-space: nowrap; font-size: clamp(13px, 1.6vw, 19px); color: var(--text2); margin: 0 auto 40px; font-weight: 300; }
@media (max-width: 760px) { .hero-sub { white-space: normal; max-width: 34ch; } }

.hero-cta { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin-bottom: 48px; }

.btn {
  font-family: var(--mono); font-size: 12px; letter-spacing: .08em;
  text-transform: uppercase; text-decoration: none;
  padding: 14px 26px; border: 1px solid var(--line-hi);
  color: var(--text); transition: border-color .15s, color .15s, background .15s;
}
.btn:hover { border-color: var(--amber); color: var(--amber); }
.btn-primary { background: var(--amber); border-color: var(--amber); color: #050606; }
.btn-primary:hover { background: #ffc63d; border-color: #ffc63d; color: #050606; }

.hero-readout { position: relative; z-index: 2; max-width: var(--max); width: 100%; margin: 0 auto; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ro { padding: 18px 10px; border-right: 1px solid var(--line); display: flex; flex-direction: column; align-items: center; text-align: center; gap: 5px; }
.ro:last-child { border-right: 0; }
.ro-k { font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.ro-v { font-family: var(--display); font-size: clamp(17px, 1.4vw, 20px); letter-spacing: .015em; color: var(--text); }
@media (max-width: 900px) { .hero-readout { grid-template-columns: repeat(2, 1fr); } .ro { border-bottom: 1px solid var(--line); padding: 14px 10px; } .ro:nth-child(2n) { border-right: 0; } }

/* ── Screens ── */
main { position: relative; z-index: 2; }

.scr {
  position: relative; max-width: var(--max); margin: clamp(48px, 7vw, 88px) auto;
  padding: clamp(28px, 4vw, 52px) var(--gutter) clamp(48px, 6vw, 80px);
  border: 1px solid var(--line);
}
/* Hidden pre-reveal only when JS is confirmed present (see script.js: documentElement.classList 'js') */
html.js .scr { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
html.js .scr[data-in] { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { html.js .scr { opacity: 1; transform: none; transition: none; } }

.scr::before, .scr::after {
  content: ''; position: absolute; width: 14px; height: 14px;
  border: 1px solid var(--amber-dim); pointer-events: none;
}
.scr::before { top: -1px; left: -1px; border-right: 0; border-bottom: 0; }
.scr::after { bottom: -1px; right: -1px; border-left: 0; border-top: 0; }

.scr-tint { background: var(--bg2); }
.scr-tag { display: flex; align-items: center; gap: 12px; margin: 0 0 22px; font-family: var(--mono); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; }
.scr-idx { color: var(--amber); }
.scr-glyph { width: 13px; height: 13px; border-radius: 50%; flex: none;
  background: radial-gradient(circle at 32% 28%, #201c14 0%, #0b0b09 55%, #060707 100%);
  box-shadow: inset 2px 2px 3px rgba(255,176,0,.65), 0 0 8px rgba(255,176,0,.25); }
.scr-ref { margin: 14px 0 0; font-family: var(--mono); font-size: 11px; letter-spacing: .1em; color: var(--muted); }
.scr-head { margin-bottom: 40px; max-width: 72ch; }
.scr-head h2 { font-size: clamp(28px, 3.6vw, 46px); line-height: 1.04; letter-spacing: -.01em; text-transform: uppercase; }
.scr-stand { margin: 16px 0 0; font-size: clamp(16px, 1.4vw, 18px); color: var(--text2); max-width: 58ch; }

/* ── Space Bands ── */
.space-band { position: relative; height: clamp(240px, 38vh, 420px); overflow: hidden; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.space-band .sb-star {
  position: absolute; bottom: -62%; left: 50%;
  width: clamp(420px, 58vmin, 760px); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 34% 22%, #26221a 0%, #14120d 30%, #070808 58%, #040505 100%);
  box-shadow: inset -22px -28px 70px rgba(0,0,0,.94), inset 14px 18px 52px rgba(255,176,0,.07), 0 0 60px rgba(255,176,0,.09), 0 0 180px rgba(255,176,0,.04);
  animation: drift-band 60s ease-in-out infinite;
}
/* Centering translateX baked in — a plain transform animation would override it and jump the disc */
@keyframes drift-band {
  0% { transform: translateX(-50%) translate3d(0,-8px,0) rotate(0deg) scale(1); }
  50% { transform: translateX(-50%) translate3d(-6px,7px,0) rotate(180deg) scale(1.05); }
  100% { transform: translateX(-50%) translate3d(0,-8px,0) rotate(360deg) scale(1); }
}
.space-band .sb-star::after {
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  background: radial-gradient(circle at 32% 18%, rgba(255,198,61,.34) 0%, rgba(255,176,0,.11) 15%, transparent 38%); filter: blur(1px);
}
.space-band .sb-vign { position: absolute; inset: 0; background: linear-gradient(to bottom, var(--bg) 0%, transparent 26%, transparent 72%, var(--bg) 100%); }
.sb-halo {
  position: absolute; bottom: -62%; left: 50%; transform: translateX(-50%);
  width: clamp(420px, 58vmin, 760px); aspect-ratio: 1; border-radius: 50%;
  scale: 1.35; pointer-events: none;
  background: radial-gradient(circle, transparent 32%, rgba(255,176,0,.09) 55%, transparent 74%);
  animation: breathe 7s ease-in-out infinite alternate;
}
.sb-tag { position: absolute; z-index: 2; bottom: 18px; left: 50%; transform: translateX(-50%); font-family: var(--mono); font-size: 10.5px; letter-spacing: .18em; color: var(--muted); white-space: nowrap; }
.sb-tag b { color: var(--amber-dim); font-weight: 400; margin-right: 10px; }

/* ── Grid ── */
.grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; align-items: start; }

/* ── Blocks ── */
.blk { background: transparent; border: 1px solid var(--line); padding: 1.5rem; }
.blk-check { border-left: 2px solid var(--amber); grid-column: span 2; }
.blk-check .lst { columns: 2; column-gap: 2.5rem; }
.lst li { break-inside: avoid; }
.blk-wide { grid-column: span 2; }
.blk-hdr { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem; }
.blk-label { font-family: var(--mono); font-size: 0.7rem; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.blk-btn { font-family: var(--mono); font-size: 0.65rem; padding: 0.3rem 0.6rem; background: transparent; border: 1px solid var(--line-hi); color: var(--muted); cursor: pointer; font-weight: 500; transition: all 0.2s; }
.blk-btn:hover { border-color: var(--amber); color: var(--amber); }
.blk-body { overflow-wrap: break-word; word-break: break-word; }

/* ── Checklists ── */
.lst { list-style: none; margin: 0; padding: 0; }
.lst li { display: flex; align-items: center; gap: 0.75rem; padding: 0.5rem 0; border-bottom: 1px solid var(--line); line-height: 1.45; }
.lst li:last-child { border-bottom: none; }
.lst li.checked { opacity: 0.4; }
.lst li.checked label { text-decoration: line-through; }
.lst input[type="checkbox"] { appearance: none; -webkit-appearance: none; flex: none; width: 15px; height: 15px; margin: 0; border: 1.5px solid var(--line-hi); border-radius: 2px; background: transparent; cursor: pointer; transition: border-color .15s, background .15s; }
.lst input[type="checkbox"]:hover { border-color: var(--amber); }
.lst input[type="checkbox"]:checked { background: var(--amber); border-color: var(--amber); }
.lst input[type="checkbox"]:checked::after { content: ''; display: block; width: 5px; height: 9px; margin: 1px 0 0 4px; border: solid #050606; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.lst input[type="checkbox"]:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; }
.lst label { font-size: 0.8rem; color: var(--text2); cursor: pointer; font-weight: 400; line-height: 1.4; }
.lst label strong { color: var(--text); font-weight: 600; }

/* ── Spec Rows ── */
.srow { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 0.5rem 0; border-bottom: 1px solid rgba(255,255,255,0.04); }
.srow:last-child { border-bottom: none; }
.srow span { font-size: 0.8rem; color: var(--text2); }
.srow b { font-family: var(--mono); font-size: 0.8rem; font-weight: 500; }
.srow b.n { text-align: right; white-space: nowrap; }
.srow b.warn { color: var(--amber); }
.srow b.fail { color: var(--red); }
.srow b.pass { color: var(--green); }

/* Hover underline-grow, per Darkstar focus-item */
.srow, .spc { position: relative; }
.srow::after, .spc::after { content: ''; position: absolute; left: 0; bottom: -1px; width: 0; height: 1px; background: var(--amber); transition: width .4s ease; }
.srow:hover::after, .spc:hover::after { width: 100%; }

/* ── Spec Grid ── */
.spc { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 16px; padding: 0.5rem 0; border-bottom: 1px solid var(--line); }
.spc:last-child { border-bottom: none; }
.spk { font-size: 0.8rem; color: var(--text2); }
.spv { font-family: var(--mono); font-size: 0.8rem; font-weight: 500; display: flex; align-items: center; gap: 8px; }
.spg { font-family: var(--mono); font-size: 0.7rem; font-weight: 600; }
.spg.ok { color: var(--green); }
.spg.no { color: var(--red); }

/* ── Tags ── */
.tag { font-family: var(--mono); font-size: 0.55rem; font-weight: 600; padding: 0.15rem 0.4rem; letter-spacing: .05em; }
.tag.bad { background: rgba(208,52,44,0.15); color: var(--red); }
.tag.ok { background: rgba(48,209,88,0.15); color: var(--green); }

/* ── Alerts ── */
.alt { padding: 0.75rem 1rem; font-size: 0.75rem; line-height: 1.5; margin-top: 0.75rem; overflow-wrap: break-word; }
.alt.w { background: rgba(255,176,0,0.06); border-left: 2px solid rgba(255,176,0,0.3); color: var(--text2); }
.alt.c { background: rgba(208,52,44,0.06); border-left: 2px solid rgba(208,52,44,0.3); color: var(--text2); }
.alt.t { background: rgba(48,209,88,0.06); border-left: 2px solid rgba(48,209,88,0.3); color: var(--text2); }

/* ── Compare ── */
.cmp { display: flex; gap: 1rem; align-items: stretch; margin-bottom: 0.5rem; }
.cmp-c { flex: 1; padding: 0.75rem; border: 1px solid var(--line); }
.cmp-t { font-family: var(--mono); font-size: 0.6rem; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 0.5rem; }
.cmp-l { list-style: none; }
.cmp-l li { font-size: 0.72rem; color: var(--text2); padding: 0.1rem 0; line-height: 1.4; }
.cmp-l li .hl { color: var(--amber); font-weight: 600; }
.cmp-a { display: flex; align-items: center; color: var(--muted); font-size: 0.9rem; font-weight: 300; }

/* ── Notes ── */
.sn { font-size: 0.75rem; color: var(--text2); margin-top: 0.5rem; line-height: 1.5; font-weight: 300; }

/* ── Path ── */
.path { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.25rem; }
.ps { display: flex; flex-direction: column; align-items: center; gap: 0.3rem; font-size: 0.68rem; color: var(--text2); font-weight: 500; }
.ps span { width: 24px; height: 24px; border-radius: 0; background: var(--amber); color: #050606; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.65rem; font-family: var(--mono); }
.pa { color: var(--muted); font-size: 0.8rem; }

/* ── Timeline ── */
.tlf { display: flex; align-items: flex-start; justify-content: center; margin-top: 2.5rem; gap: 0; }
.tn { display: flex; flex-direction: column; align-items: center; min-width: 180px; }
.td { width: 38px; height: 38px; border-radius: 0; background: transparent; border: 2px solid var(--line); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 0.95rem; color: var(--text); font-family: var(--mono); transition: all 0.3s; }
.td:hover { background: var(--amber); border-color: var(--amber); color: #050606; transform: scale(1.05); }
.tc { text-align: center; margin-top: 1rem; }
.tc h3 { font-size: 1rem; font-weight: 700; margin-bottom: 0.4rem; }
.tc p { font-size: 0.72rem; color: var(--text2); margin-bottom: 0.5rem; line-height: 1.4; }
.tg { font-family: var(--mono); font-size: 0.55rem; color: var(--amber); background: rgba(255,176,0,0.1); padding: 0.15rem 0.4rem; display: inline-block; letter-spacing: 0.05em; }
.tln { width: 40px; height: 2px; background: linear-gradient(90deg, var(--line), transparent); margin-top: 17px; align-self: flex-start; }

/* ── Warnings ── */
.wg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); margin-top: 2.5rem; }
.wc { background: var(--bg); padding: 1.25rem; text-align: left; border-left: 2px solid transparent; }
.wc:hover { border-left-color: var(--amber); background: var(--bg2); }
.wi { font-size: 1.2rem; margin-bottom: 0.35rem; }
.wc h3 { font-size: 0.8rem; font-weight: 700; margin-bottom: 0.3rem; }
.wc p { font-size: 0.72rem; color: var(--text2); line-height: 1.5; font-weight: 300; }

/* ── Footer ── */
.foot { position: relative; z-index: 2; max-width: var(--max); margin: 0 auto; padding: 72px var(--gutter) 40px; }
.foot-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 40px; margin-bottom: 56px; }
.foot-logo { display: block; margin: 0 0 18px; color: var(--amber); }
.foot-legal { margin: 0; font-size: 13px; color: var(--muted); line-height: 1.8; max-width: 40ch; }
.foot-h { font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin: 0 0 14px; }
.foot-grid a { display: block; font-size: 14px; color: var(--text2); text-decoration: none; margin-bottom: 8px; }
.foot-grid a:hover { color: var(--amber); }
.telem { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 18px; font-family: var(--mono); font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.telem b { color: var(--amber-dim); font-weight: 400; margin-right: 8px; }
.telem .sep { width: 3px; height: 3px; background: var(--line-hi); display: block; }
.signoff { margin: 18px 0 0; font-family: var(--mono); font-size: 10.5px; letter-spacing: .1em; color: var(--muted); }

/* ── Toast ── */
.toast { position: fixed; bottom: 2rem; right: 2rem; z-index: 9999; padding: 0.8rem 1.2rem; background: var(--amber); color: #050606; font-weight: 700; font-size: 0.75rem; backdrop-filter: blur(10px); transform: translateY(150%); opacity: 0; transition: all 0.4s cubic-bezier(0.68,-0.55,0.27,1.55); font-family: var(--mono); box-shadow: 0 10px 40px rgba(0,0,0,0.5); }
.toast.show { transform: translateY(0); opacity: 1; }

@media (prefers-reduced-motion: reduce) { .darkstar { animation: none; } .darkstar::after { animation: none; opacity: .5; } .sb-star { animation: none; transform: translateX(-50%); } .sb-halo { animation: none; opacity: .5; } .streaks { display: none; } html.js .scr { opacity: 1; transform: none; transition: none; } html { scroll-behavior: auto; } .toast { transition: none; } }

/* ── Liveliness ── */
#starfield { position: absolute; inset: 0; pointer-events: none; }
.scrollbar { position: fixed; top: 0; left: 0; height: 2px; width: 0; background: var(--amber); z-index: 60; }
.prog { height: 3px; background: var(--line); margin: 2px 0 12px; }
.prog i { display: block; height: 100%; width: 0; background: var(--amber); transition: width .4s ease; }
.tn { cursor: pointer; }
.tn:focus-visible { outline: 2px solid var(--amber); outline-offset: 6px; }
/* ── Print: paper, no chrome ── */
@media print {
  body::before, body::after, .space, .space-band, .toast, .nav, .hero-cta, .theme-btn, .nav-menu { display: none !important; }
  body { background: #fff; color: #000; font-size: 12px; }
  .hero { min-height: auto; padding: 24px 0; }
  .hero h1, .scr-head h2, .tc h3, .wc h3 { color: #000; }
  .hero-sub, .scr-stand, .sn, .lst label, .srow span, .spk, .tc p, .wc p, .cmp-l li, .alt { color: #333; }
  html.js .scr { opacity: 1; transform: none; }
  .scr, .blk, .wg { border-color: #999; break-inside: avoid; }
  .lst li.checked { opacity: 1; }
}

/* ── Responsive ── */
@media (max-width: 768px) {
  .grid { grid-template-columns: 1fr; }
  .blk-wide { grid-column: span 1; }
  .blk-check .lst { columns: 1; }
  .wg { grid-template-columns: 1fr; }
  .tlf { flex-direction: column; align-items: center; }
  .tln { width: 2px; height: 25px; margin-top: 0; margin-left: 17px; }
  .nav-links { display: none; position: absolute; top: 50px; left: 0; right: 0; background: rgba(5,6,6,.95); padding: 1rem; flex-direction: column; backdrop-filter: blur(20px); }
  .nav-links.open { display: flex; }
  .nav-links a { padding: 0.5rem 1rem; }
  .nav-menu { display: flex; }
  .path { flex-wrap: wrap; }
  .pa { display: none; }
  .hero-readout { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
  .hero h1 { font-size: clamp(26px, 8vw, 32px); }
  .scr-head h2 { font-size: 1.4rem; }
  .cmp { flex-direction: column; }
  .cmp-a { justify-content: center; transform: rotate(90deg); }
  .foot-grid { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 680px) {
  .grid { grid-template-columns: 1fr; }
}