:root { color-scheme:dark; --ink:#f5f7fb; --muted:#b8c8dc; --bg:#071426; --panel:#102237; --lime:#a3e635; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.7; color:var(--ink); background:var(--bg); }
a { color:var(--lime); text-underline-offset:.2em; }
a:focus-visible { outline:3px solid var(--lime); outline-offset:5px; }
.skip { position:absolute; top:-80px; left:16px; padding:10px 16px; background:var(--panel); z-index:3; }
.skip:focus { top:12px; }
header,main,footer { max-width:1120px; margin:auto; padding-left:28px; padding-right:28px; }
header { display:flex; justify-content:space-between; align-items:center; gap:24px; padding-top:24px; padding-bottom:24px; border-bottom:1px solid #294258; }
.brand { font-weight:750; color:var(--ink); text-decoration:none; }
nav { display:flex; flex-wrap:wrap; gap:22px; }
main { padding-bottom:60px; }
section { padding:40px 0; border-bottom:1px solid #294258; scroll-margin-top:24px; }
.intro { padding-top:68px; }
.eyebrow { color:var(--lime); font-size:.86rem; letter-spacing:.04em; }
h1 { font-size:clamp(2.3rem,5.4vw,4.6rem); line-height:1.1; max-width:900px; margin:22px 0; }
h2 { line-height:1.25; font-size:clamp(1.55rem,3vw,2.2rem); margin:0 0 22px; }
h3 { line-height:1.35; margin-top:0; }
p { max-width:930px; }
.lede { font-size:1.24rem; color:var(--muted); max-width:850px; }
.boundary,.note { color:var(--muted); font-size:.92rem; }
.boundary { border-left:3px solid var(--lime); padding-left:18px; margin-top:26px; }
.sheet-grid,.resource-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin:28px 0; }
figure { margin:0; min-width:0; }
figure img { width:100%; height:auto; display:block; border:1px solid #81bdd0; background:white; }
figcaption { padding-top:14px; color:var(--muted); }
figcaption strong { color:var(--ink); }
.table-wrap { overflow-x:auto; }
table { border-collapse:collapse; width:100%; margin:24px 0; font-size:1rem; }
caption { text-align:left; color:var(--muted); padding-bottom:12px; }
th,td { text-align:left; padding:17px; border:1px solid #35516b; }
thead { background:var(--panel); }
tbody tr:first-child td:last-child { color:var(--lime); font-weight:700; }
.steps { padding-left:27px; }
.steps li { margin-bottom:20px; padding-left:8px; }
.scale-video { display:block; width:100%; height:auto; aspect-ratio:16/9; background:#000; border:1px solid #35516b; border-radius:8px; }
.video-transcript { margin-top:24px; padding:20px; background:var(--panel); border:1px solid #35516b; border-radius:8px; }
.video-transcript summary { cursor:pointer; color:var(--lime); font-weight:700; }
.video-transcript summary:focus-visible { outline:3px solid var(--lime); outline-offset:5px; }
.resource { padding:26px; border:1px solid #35516b; background:var(--panel); border-radius:10px; }
.resource p { color:var(--muted); }
.button { display:inline-block; background:var(--lime); color:var(--bg); text-decoration:none; font-weight:700; padding:13px 18px; border-radius:6px; }
.button.secondary { background:transparent; color:var(--ink); border:1px solid #81bdd0; }
footer { padding-top:24px; padding-bottom:48px; color:var(--muted); font-size:.9rem; }
@media (max-width:700px) { header { align-items:flex-start; flex-direction:column; gap:14px; } header,main,footer { padding-left:20px; padding-right:20px; } .intro { padding-top:36px; } section { padding:30px 0; } .sheet-grid,.resource-grid { grid-template-columns:1fr; } th,td { padding:12px 10px; font-size:.9rem; } .resource { padding:22px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }