/* LastStop briefing — shared look. One committed night-glass world (Atlas's own), paper white in print.
   Layout: long scroll of chapters; text column + visual column, stacking at phone width. */
:root{
  --ink:#050a17; --ink-2:#0a1326; --panel:#0d1830; --line:#1b2b4d; --line-2:#26406f;
  --fg:#eaf0fd; --muted:#9aabcc; --dim:#5f739b;
  --glow:#3d9bff; --glow-hi:#a7d4ff; --glow-deep:#1456c7;
  --gold:#ecc67e; --gold-dim:#a8874b; --good:#7fe3b4; --bad:#ff917f;
  --f-display:"DM Serif Display", Georgia, "Times New Roman", serif;
  --f-body:"Source Sans 3", "Segoe UI", system-ui, sans-serif;
  --f-mono:"IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --measure:62ch;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--fg);font:400 1.18rem/1.6 var(--f-body);margin:0;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--glow-hi)}
:focus-visible{outline:2px solid var(--glow-hi);outline-offset:3px;border-radius:6px}
.wrap{max-width:1180px;margin:0 auto;padding-inline:clamp(16px,4vw,40px)}
h1,h2,h3{font-family:var(--f-display);font-weight:400;line-height:1.08;text-wrap:balance;margin:0}
h1{font-size:clamp(2.6rem,6.4vw,5.2rem);letter-spacing:-.01em}
h2{font-size:clamp(2.1rem,4.6vw,3.6rem)}
h3{font-size:clamp(1.4rem,2.4vw,1.8rem)}
p{margin:0;max-width:var(--measure)}
.lede{font-size:clamp(1.2rem,1.8vw,1.42rem);color:var(--muted)}
.label{font:500 .78rem/1.3 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--glow-hi)}
.label.gold{color:var(--gold)}
.num{font-family:var(--f-display);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.gold{color:var(--gold)} .good{color:var(--good)} .muted{color:var(--muted)}
.stack{display:flex;flex-direction:column;gap:1.1rem}

/* top bar */
.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:color-mix(in srgb,var(--ink) 82%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.7rem}
.brand{display:flex;align-items:center;gap:.6rem;font:500 .82rem var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--fg);text-decoration:none}
.brand img{width:26px;height:26px}
.brand small{color:var(--dim);letter-spacing:.08em;text-transform:none;font-size:.8rem}
.btn{appearance:none;border:1px solid var(--line-2);background:var(--panel);color:var(--fg);font:700 1rem var(--f-body);padding:.7rem 1.15rem;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;transition:border-color .2s,background .2s,box-shadow .2s}
.btn:hover{border-color:var(--glow);box-shadow:0 0 0 4px color-mix(in srgb,var(--glow) 18%,transparent)}
.btn.primary{background:linear-gradient(180deg,#2f86f5,#1456c7);border-color:#5aa9ff;box-shadow:0 0 26px color-mix(in srgb,var(--glow) 45%,transparent)}
.btn .tri{width:0;height:0;border-left:10px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent}
.btn[aria-pressed="true"]{border-color:var(--gold);color:var(--gold);background:color-mix(in srgb,var(--gold) 10%,var(--panel))}

/* chapters */
.chapter{position:relative;padding-block:clamp(4.5rem,10vw,8rem);border-top:1px solid var(--line)}
.ch-head{display:grid;grid-template-columns:auto 1fr;gap:clamp(1rem,3vw,2rem);align-items:center;margin-bottom:clamp(2rem,5vw,3.5rem)}
.ch-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}
.ch-grid>*{min-width:0}
@media (max-width:860px){.ch-grid{grid-template-columns:1fr}.ch-head{grid-template-columns:1fr}}

/* Atlas station: bubble + play + caption */
.atlas-station{display:flex;align-items:center;gap:1rem}
.atlas-btn{all:unset;cursor:pointer;display:block;border-radius:50%;position:relative}
.atlas-btn:focus-visible{outline:2px solid var(--glow-hi);outline-offset:6px}
.atlas-btn .abub3{pointer-events:none}
.atlas-cta{display:flex;flex-direction:column;gap:.35rem}
.atlas-cta .play{font:700 1rem var(--f-body);color:var(--fg);display:inline-flex;align-items:center;gap:.5rem}
.atlas-cta .play .tri{width:0;height:0;border-left:9px solid var(--glow-hi);border-top:6px solid transparent;border-bottom:6px solid transparent}
.atlas-cta .hint{font:500 .74rem var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.is-speaking .atlas-cta .play .tri{border:0;width:10px;height:12px;border-left:3px solid var(--glow-hi);border-right:3px solid var(--glow-hi)}

/* caption bar (Atlas Live) */
.caption{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translate(-50%,140%);z-index:60;width:min(760px,calc(100vw - 32px));
  background:color-mix(in srgb,#07112a 88%,transparent);backdrop-filter:blur(14px);border:1px solid #2f5fae;border-radius:18px;padding:1rem 1.25rem 1.1rem;
  box-shadow:0 0 0 1px rgba(80,150,255,.15),0 0 40px rgba(61,155,255,.25),0 20px 50px rgba(0,0,0,.5);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.caption.on{transform:translate(-50%,0)}
.caption .live{padding-left:1.9rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.4rem}
.caption .live span{font:600 .72rem var(--f-mono);letter-spacing:.2em;color:var(--glow-hi);display:flex;align-items:center;gap:.45rem}
.caption .live span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--glow-hi);box-shadow:0 0 10px var(--glow)}
.caption .x{all:unset;cursor:pointer;font:500 .75rem var(--f-mono);letter-spacing:.12em;color:var(--muted);padding:.2rem .4rem;border-radius:6px}
.caption .x:hover{color:var(--fg)}
.caption .text{font:500 clamp(1.15rem,2.2vw,1.45rem)/1.42 var(--f-body);color:#4f6590}
.caption .text b{font-weight:500;color:#fff;transition:color .15s}
.caption .mini{position:absolute;left:-22px;top:-22px;width:58px;height:58px}

/* narration script (printed, and readable inline) */
.script{border:1px solid var(--line);border-radius:14px;padding:1rem 1.2rem;background:var(--ink-2);font-size:1rem;color:var(--muted)}
.script summary{cursor:pointer;font:600 .76rem var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--glow-hi)}
.script p{margin-top:.7rem;max-width:none}

/* stat tiles */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.stats>div{background:var(--ink-2);padding:1.1rem 1.2rem;display:flex;flex-direction:column;gap:.25rem;min-width:0}
.stats .num{font-size:clamp(1.7rem,3vw,2.4rem);color:var(--fg)}
.stats .k{font:500 .72rem var(--f-mono);letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

.panel{background:linear-gradient(180deg,var(--panel),var(--ink-2));border:1px solid var(--line);border-radius:20px;padding:clamp(1.1rem,2.6vw,1.8rem)}
.chart{width:100%;height:auto;display:block;overflow:visible}
.note{font-size:.88rem;color:var(--dim);max-width:none}
.foot{border-top:1px solid var(--line);padding-block:3rem 6rem;color:var(--dim);font-size:.9rem}
.foot p{max-width:80ch}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ---------- print: paper-white, everything at rest, narration as text ---------- */
@media print{
  :root{--ink:#fff;--ink-2:#f6f8fc;--panel:#fff;--line:#cfd7e6;--line-2:#b9c4da;--fg:#0b1426;--muted:#3e4d6b;--dim:#5d6b86;--glow:#1456c7;--glow-hi:#1456c7;--gold:#8a6420;--good:#0f7a4a;color-scheme:light}
  body{background:#fff;color:#0b1426;font-size:11.5pt}
  .bar,.caption,.no-print,canvas,.atlas-btn,.atlas-cta .hint,.controls{display:none!important}
  .chapter{padding-block:1.2rem;break-before:page;border:0}
  .chapter.first{break-before:page}
  .hero .actions{display:none!important}
  *{opacity:1!important;transform:none!important;filter:none!important;box-shadow:none!important;text-shadow:none!important}
  .script{display:block!important;background:#f3f6fb}
  .script>*{display:block!important}
  details.script[open] summary~*, details.script summary~*{display:block!important}
  .panel{background:#fff}
  a{color:#0b1426;text-decoration:none}
  .atlas-cta,.atlas-station{display:none!important}
  .ch-head{grid-template-columns:1fr!important;margin-bottom:.8rem}
  .ch-grid,.cols{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:1.2rem!important}
  .panel,.fix,.cards>div,.tbl,.kpis,.skin,.door,.script,.journey li,.paths>div,.timeline li,.stats,.flow{break-inside:avoid}
  h1{font-size:30pt} h2{font-size:22pt} h3{font-size:14pt}
  .lede{font-size:12.5pt} p{font-size:11pt}
  .people{max-width:300px}
  .hero{padding-block:1rem}
  .door li.lock{filter:none!important}
  .chapters-nav{display:none!important}
}
