/* =============================================================================
   RL BOOTCAMP 2026 · LECTURE DECK · DESIGN SYSTEM
   -----------------------------------------------------------------------------
   Hybrid of two languages already in use:
     · Cortex deck  — fixed 1280x720 stage, staged fragments, mono chrome,
                      dark "statement" masters, print-to-PDF path.
     · resume site  — "annotated manuscript": Newsreader display serif, IBM Plex
                      Sans/Mono, light paper surface, hairline rules, and the
                      rule that COLOUR CARRIES MEANING:
                        --ultra   structure / links / the argument
                        --verify  ONLY on an externally checkable number
                        --warn    a failure mode or a caveat
                        --danger  a negative result / refuted claim
   The deck leans light: content slides are paper, part dividers are ink.
   Every visual element here is load-bearing; nothing is decoration.
   ========================================================================== */

/* ---- fonts (self-hosted, offline-safe) ----------------------------------- */
@font-face{font-family:"Newsreader";src:url("fonts/newsreader-latin-normal.woff2") format("woff2");font-weight:200 700;font-style:normal;font-display:block;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Newsreader";src:url("fonts/newsreader-latin-ext-normal.woff2") format("woff2");font-weight:200 700;font-style:normal;font-display:block;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+2020,U+20A0-20AB,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Newsreader";src:url("fonts/newsreader-latin-italic.woff2") format("woff2");font-weight:200 700;font-style:italic;font-display:block;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans";src:url("fonts/ibm-plex-sans-latin.woff2") format("woff2");font-weight:100 700;font-style:normal;font-display:block;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"IBM Plex Sans";src:url("fonts/ibm-plex-sans-latin-ext.woff2") format("woff2");font-weight:100 700;font-style:normal;font-display:block;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+2020,U+20A0-20AB,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"IBM Plex Mono";src:url("fonts/ibm-plex-mono-400-latin.woff2") format("woff2");font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:"IBM Plex Mono";src:url("fonts/ibm-plex-mono-500-latin.woff2") format("woff2");font-weight:500;font-style:normal;font-display:block}
@font-face{font-family:"IBM Plex Mono";src:url("fonts/ibm-plex-mono-600-latin.woff2") format("woff2");font-weight:600;font-style:normal;font-display:block}

:root{
  --ink:#0e1116; --ink-2:#454c5a; --ink-3:#6b7280; --ink-4:#98a0ae;
  --surface:#fcfcfb; --surface-2:#f4f5f6; --surface-3:#eceef1; --rule:#e3e5e9; --rule-2:#cfd3da;
  --ultra:#1b3bd6; --ultra-2:#2f4fe0; --ultra-soft:#eaeeff; --ultra-line:#c3ccf7;
  --verify:#0e7490; --verify-soft:#e3f3f6; --verify-line:#a9d6e0;
  --warn:#a16207; --warn-soft:#fbf3e0; --warn-line:#e7d3a1;
  --danger:#b3261e; --danger-soft:#fbeceb; --danger-line:#eec4c1;
  --deep:#0e1116; --deep-2:#171b22; --deep-line:#2a303b; --deep-fg:#d7dbe2; --deep-dim:#8b93a2;
  --display:"Newsreader",ui-serif,Georgia,serif;
  --sans:"IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,monospace;
  --pad-x:90px; --pad-t:63px; --pad-b:39px;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;background:#dfe1e5;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow:hidden}
/* The stage is designed at 1920x1080 and scaled to fit, so the base font is
   1.5x the browser default. This keeps every rendered size >= 12px, which is
   the minimum-font-size floor browsers enforce; below it, real browsers
   silently inflate small text and break the layout. Math inherits this. */
body{font-size:24px}
img{max-width:100%}
b,strong{font-weight:600;color:var(--ink)}
em{font-style:italic}
sup{font-size:.62em;line-height:0}

/* ============ deck chrome ================================================= */
#deck{position:fixed;inset:0;background:#dfe1e5}
#stage{position:absolute;left:50%;top:50%;width:1920px;height:1080px;transform:translate(-50%,-50%);transform-origin:center;box-shadow:0 45px 135px -40px rgba(14,17,22,.55)}
#progress{position:fixed;left:0;top:0;height:3px;background:var(--ultra);width:0;z-index:60;transition:width .4s ease}
/* presenter chrome fades out while the pointer rests: on a projector the deck
   is the only thing that should be visible, but the controls must come back
   the instant the presenter reaches for them */
#hud{position:fixed;right:24px;bottom:18px;z-index:60;display:flex;gap:9px;align-items:center;font-family:var(--mono);font-size:16.5px;color:var(--ink-3);transition:opacity .45s ease}
body.idle #hud,body.idle #tag{opacity:0;pointer-events:none}
#hud button{font-family:var(--mono);font-size:16.5px;color:var(--ink-2);background:rgba(252,252,251,.94);border:1.5px solid var(--rule-2);border-radius:9px;padding:7.5px 13.5px;cursor:pointer;transition:.14s}
#hud button:hover{color:var(--ultra);border-color:var(--ultra-line);background:var(--ultra-soft)}
#hud .cnt{padding:0 9px;color:var(--ink-3);letter-spacing:.06em;font-variant-numeric:tabular-nums}
#tag{position:fixed;left:24px;bottom:21px;z-index:60;font-family:var(--mono);font-size:14.25px;letter-spacing:.16em;color:var(--ink-4);text-transform:uppercase;transition:opacity .45s ease}
#toast{position:fixed;left:50%;bottom:87px;transform:translateX(-50%) translateY(12px);background:var(--ink);color:#fff;font-family:var(--mono);font-size:17.25px;border-radius:10.5px;padding:13.5px 22.5px;z-index:80;opacity:0;pointer-events:none;transition:.25s;max-width:70ch;line-height:1.5}
#toast.on{opacity:1;transform:translateX(-50%)}

/* slide index overlay, grouped by part */
#index{position:fixed;inset:0;z-index:70;background:rgba(250,250,249,.97);backdrop-filter:blur(7.5px);display:none;overflow-y:auto;padding:60px 72px}
#index.on{display:block}
#index h2{font-family:var(--display);font-size:33px;margin-bottom:9px}
#index .hint{font-family:var(--mono);font-size:15.75px;color:var(--ink-3);margin-bottom:33px;letter-spacing:.04em}
#index .part-h{font-family:var(--mono);font-size:15px;letter-spacing:.18em;text-transform:uppercase;color:var(--ultra);margin:30px 0 13.5px;padding-bottom:7.5px;border-bottom:1.5px solid var(--rule)}
#index .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10.5px}
#index button{display:flex;gap:13.5px;align-items:baseline;text-align:left;background:#fff;border:1.5px solid var(--rule);border-radius:9px;padding:13.5px 16.5px;color:var(--ink-2);cursor:pointer;font-family:var(--sans);font-size:18.75px;line-height:1.35;transition:.14s}
#index button:hover{border-color:var(--ultra-line);background:var(--ultra-soft)}
#index button.cur{border-color:var(--ultra);background:var(--ultra-soft);color:var(--ink)}
#index button .n{font-family:var(--mono);font-size:15px;color:var(--ink-4);flex:0 0 auto;font-variant-numeric:tabular-nums}

/* presenter notes drawer */
#notes{position:fixed;left:0;right:0;bottom:0;max-height:42vh;overflow-y:auto;z-index:65;background:var(--ink);color:#e6e8ec;padding:27px 39px 33px;font-size:20.25px;line-height:1.6;display:none;box-shadow:0 -20px 75px -30px #000}
#notes.on{display:block}
#notes h4{font-family:var(--mono);font-size:14.25px;letter-spacing:.18em;text-transform:uppercase;color:#7dd3e0;margin-bottom:12px;font-weight:500}
#notes p{margin-bottom:12px;max-width:110ch}
#notes b{color:#fff}

/* ============ slide masters =============================================== */
.slide{position:absolute;inset:0;display:flex;flex-direction:column;padding:var(--pad-t) var(--pad-x) var(--pad-b);opacity:0;pointer-events:none;background:var(--surface);transition:opacity .42s ease,transform .42s ease;transform:translateY(15px);overflow:hidden}
.slide.active{opacity:1;pointer-events:auto;transform:none;z-index:2}
.slide.leaving{opacity:0;transform:translateY(-8px);z-index:1}

/* header block: eyebrow + title + optional standfirst */
.eyebrow{font-family:var(--mono);font-size:15px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);display:flex;align-items:center;gap:12px}
.eyebrow .mark{color:var(--ultra);font-size:13.5px}
.eyebrow .part{color:var(--ultra)}
h1{font-family:var(--display);font-weight:400;letter-spacing:-.022em;line-height:1.04;font-size:87px}
h2{font-family:var(--display);font-weight:400;letter-spacing:-.018em;line-height:1.1;font-size:49.5px;margin-top:13.5px;max-width:38ch}
h3{font-family:var(--display);font-weight:500;font-size:25.5px;letter-spacing:-.008em;line-height:1.25}
h4{font-family:var(--mono);font-size:14.25px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ultra)}
.standfirst{font-size:21.75px;line-height:1.55;color:var(--ink-2);max-width:96ch;margin-top:15px}
.standfirst b{color:var(--ink)}

/* body area: claims the space between header and footer, and centres its
   content in it, so a short body does not leave a hole above the footer.
   Columns stay top-aligned *within* the block (align-items:start) while the
   block itself is centred vertically — measured: this removes a 150px median
   dead band above the footer across the deck. */
.body{margin-top:27px;flex:1 1 auto;min-height:0;align-content:center}
.body:not(.cols){display:flex;flex-direction:column;justify-content:center;gap:18px}
.body.top{align-content:start;justify-content:flex-start}
.body.tight{margin-top:18px}

/* footer: talk id · source line · page number */
/* The rule belongs to the citation block, not to the full slide width: a
   full-bleed line collides with charts and boxes that legitimately reach the
   bottom of the frame on the right. */
.foot{flex:0 0 auto;margin-top:20px;display:flex;gap:24px;align-items:flex-start;justify-content:space-between;font-family:var(--mono);font-size:13px;color:var(--ink-4);letter-spacing:.04em}
.foot .src{max-width:96ch;min-width:38ch;line-height:1.45;color:var(--ink-3);text-align:left;border-top:1.5px solid var(--rule);padding-top:14px}
.foot .pg{padding-top:14px}
.foot .src b{font-weight:500;color:var(--ink-3)}
.foot .pg{flex:0 0 auto;font-variant-numeric:tabular-nums}
.slide.ink .foot .src{border-top-color:var(--deep-line)}

/* provenance chip in the eyebrow: used when a figure is a schematic rather
   than plotted data. One treatment, applied wherever the plotted points are
   not the source's own — the disclosure sits where the eye already is. */
.eyebrow .chip{font-family:var(--mono);font-size:12.75px;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--warn);background:var(--warn-soft);
  border:1.5px solid var(--warn-line);border-radius:5px;padding:2.5px 9px;margin-left:4px}
.slide.ink .eyebrow .chip{color:#e7d3a1;background:#2a2418;border-color:#5c4f2e}

/* citation detail: kept in the PDF, hidden on screen so the footer is one
   line. Provenance is not reduced, only its screen weight. */
.foot .src .det{display:none}

/* fragments */
.frag{opacity:0;transform:translateY(13.5px);transition:opacity .42s ease,transform .42s ease}
.slide.active .frag{opacity:1;transform:none;transition-delay:calc(.16s + var(--i,0)*.09s)}

/* ---- dark masters: part dividers & statements ---------------------------- */
.slide.ink{background:var(--deep);color:var(--deep-fg)}
.slide.ink::after{background:var(--deep-line)}
.slide.ink h1,.slide.ink h2,.slide.ink h3{color:#fff}
.slide.ink .eyebrow{color:var(--deep-dim)}
.slide.ink .eyebrow .part,.slide.ink .eyebrow .mark{color:#7dd3e0}
.slide.ink .standfirst{color:#b6bdc9}
.slide.ink .foot{color:#666f7e}
.slide.ink .foot .src{color:#7b8494}
.slide.ink b{color:#fff}

/* part divider layout */
.divider{height:100%;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:78px;align-items:center}
.divider .pnum{font-family:var(--mono);font-size:16.5px;letter-spacing:.24em;color:#7dd3e0;text-transform:uppercase}
.divider h1{font-size:78px;margin-top:24px;max-width:17ch}
.divider .lede{margin-top:27px;font-size:22.5px;line-height:1.6;color:#b6bdc9;max-width:52ch}
.divider .roadmap{list-style:none;display:flex;flex-direction:column;gap:13.5px;border-left:1.5px solid var(--deep-line);padding-left:33px}
.divider .roadmap li{display:flex;gap:18px;font-size:19.5px;color:#98a1b0;line-height:1.45}
.divider .roadmap li b{color:#fff;font-weight:500}
.divider .roadmap li .k{font-family:var(--mono);font-size:15px;color:#7dd3e0;flex:0 0 39px;padding-top:3px}

/* statement master (light or ink) */
.statement{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
.statement h2{font-size:60px;max-width:26ch}
.statement .sub{margin-top:30px;font-family:var(--mono);font-size:16.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.slide.ink .statement .sub{color:var(--deep-dim)}

/* ============ layout helpers ============================================== */
.cols{display:grid;gap:30px;align-items:start}
.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.c32{grid-template-columns:minmax(0,1.32fr) minmax(0,1fr)}
.c23{grid-template-columns:minmax(0,1fr) minmax(0,1.32fr)}
.c21{grid-template-columns:minmax(0,1.9fr) minmax(0,1fr)}
.c12{grid-template-columns:minmax(0,1fr) minmax(0,1.9fr)}
.stack{display:flex;flex-direction:column;gap:18px}
.stack.s8{gap:12px}
.stack.s16{gap:24px}
.grow{flex:1 1 auto;min-height:0}

/* ============ components ================================================== */
/* card: the default content container */
.card{border:1.5px solid var(--rule);border-radius:12px;background:#fff;padding:22.5px 25.5px}
.card.flat{background:var(--surface-2);border-color:var(--rule)}
.card.accent{border-color:var(--ultra-line);background:var(--ultra-soft)}
.card.verify{border-color:var(--verify-line);background:var(--verify-soft)}
.card.warn{border-color:var(--warn-line);background:var(--warn-soft)}
.card.danger{border-color:var(--danger-line);background:var(--danger-soft)}
.card .k{font-family:var(--mono);font-size:13.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ultra);margin-bottom:10.5px}
.card.verify .k{color:var(--verify)}.card.warn .k{color:var(--warn)}.card.danger .k{color:var(--danger)}
.card p{font-size:19.2px;line-height:1.52;color:var(--ink-2);margin-top:9px}
.card h3+p{margin-top:7.5px}
.slide.ink .card{background:var(--deep-2);border-color:var(--deep-line)}
.slide.ink .card p{color:#a7aebb}

/* bullets */
.pts{list-style:none;display:flex;flex-direction:column;gap:12px}
.pts li{display:flex;gap:13.5px;font-size:19.8px;line-height:1.5;color:var(--ink-2)}
.pts li b{color:var(--ink)}
.pts .tk{flex:0 0 auto;font-family:var(--mono);font-size:15.75px;color:var(--ultra);padding-top:3px}
.pts.dense li{font-size:18.6px;gap:10.5px}
.slide.ink .pts li{color:#a7aebb}

/* definition list: term | explanation */
.deflist{display:grid;grid-template-columns:auto 1fr;gap:10.5px 21px;font-size:18.9px;line-height:1.5;color:var(--ink-2);align-items:baseline}
.deflist dt{font-family:var(--mono);font-size:17.25px;color:var(--ink);white-space:nowrap}
.deflist dd{color:var(--ink-2)}

/* equation block, optionally numbered */
.eq{position:relative;border-left:3px solid var(--ultra-line);background:var(--surface-2);border-radius:0 9px 9px 0;padding:16.5px 69px 16.5px 24px;margin:0}
.eq.plain{background:transparent;border-left-color:var(--rule-2)}
.eq.tight{padding-top:12px;padding-bottom:12px}
.eq .num{position:absolute;right:21px;top:50%;transform:translateY(-50%);font-family:var(--mono);font-size:15.75px;color:var(--ink-4)}
.eq .note{display:block;margin-top:9px;font-size:17.25px;line-height:1.45;color:var(--ink-3)}
.eq .katex-display{margin:0}
.slide.ink .eq{background:#12161d;border-left-color:#2f6f80}
.slide.ink .eq .note{color:#8b93a2}
.katex{font-size:1.02em}
.katex-display>.katex{font-size:1.06em}
.slide.ink .katex{color:#e6e8ec}
/* where-clause under an equation */
.where{font-size:17.4px;line-height:1.5;color:var(--ink-3);margin-top:10.5px}
.where b{color:var(--ink-2);font-weight:500}

/* verified number: colour reserved for checkable figures */
.v{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--verify);font-weight:500}
.u{color:var(--ultra)}
.w{color:var(--warn)}
.d{color:var(--danger)}
.mono{font-family:var(--mono)}
.dim{color:var(--ink-3)}

/* citation marker + reference chip */
.c{font-family:var(--mono);font-size:14.25px;color:var(--ultra);vertical-align:super;line-height:0;white-space:nowrap;letter-spacing:.02em}
.refchip{display:inline-flex;align-items:center;gap:7.5px;font-family:var(--mono);font-size:14.25px;color:var(--ink-3);border:1.5px solid var(--rule);border-radius:6px;padding:3px 9px;background:#fff}
.refchip b{color:var(--ink-2);font-weight:500}

/* big statistic */
.stat{display:flex;flex-direction:column;gap:4.5px}
.stat .n{font-family:var(--display);font-size:60px;line-height:1;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.stat .n.v{font-family:var(--display);color:var(--verify);font-weight:400}
.stat .l{font-family:var(--mono);font-size:14.25px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);margin-top:7.5px}
.stat .s{font-size:17.4px;line-height:1.45;color:var(--ink-3)}

/* matrix / comparison table */
.matrix{border:1.5px solid var(--rule);border-radius:10.5px;overflow:hidden;background:#fff;font-size:18px}
.matrix .row{display:grid;border-bottom:1.5px solid var(--rule);align-items:stretch}
.matrix .row:last-child{border-bottom:0}
.matrix .row.head{background:var(--surface-2);font-family:var(--mono);font-size:13.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3)}
.matrix .row>div{padding:12px 16.5px;border-right:1.5px solid var(--rule);display:block;align-self:center;line-height:1.45;color:var(--ink-2);min-width:0;overflow-wrap:break-word}
.matrix .row>div:last-child{border-right:0}
.matrix .row.head>div{color:var(--ink-3);align-self:end}
.matrix .row>div.lead{color:var(--ink);font-weight:500}
.matrix .row.hl{background:var(--ultra-soft)}
.matrix .row.zebra{background:var(--surface)}
.matrix.dense{font-size:16.8px}
.matrix.dense .row>div{padding:9px 13.5px}
.matrix .yes{color:var(--verify);font-family:var(--mono)}
.matrix .no{color:var(--ink-4);font-family:var(--mono)}
.matrix .part{color:var(--warn);font-family:var(--mono)}

/* callout box */
.box{border:1.5px solid var(--rule);border-left-width:3px;border-left-color:var(--ultra);border-radius:0 10.5px 10.5px 0;background:#fff;padding:18px 22.5px}
.box.warn{border-left-color:var(--warn);background:var(--warn-soft);border-color:var(--warn-line);border-left-width:3px}
.box.danger{border-left-color:var(--danger);background:var(--danger-soft);border-color:var(--danger-line)}
.box.verify{border-left-color:var(--verify);background:var(--verify-soft);border-color:var(--verify-line)}
.box .t{font-family:var(--mono);font-size:13.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--ultra);margin-bottom:9px}
.box.warn .t{color:var(--warn)}.box.danger .t{color:var(--danger)}.box.verify .t{color:var(--verify)}
.box p{font-size:18.9px;line-height:1.5;color:var(--ink-2)}
.box p+p{margin-top:9px}

/* takeaway strip pinned above the footer */
.takeaway{margin-top:21px;display:flex;gap:16.5px;align-items:flex-start;border-top:1.5px solid var(--rule);padding-top:15px;font-size:18.9px;line-height:1.45;color:var(--ink-2)}
.takeaway .lab{font-family:var(--mono);font-size:13.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ultra);flex:0 0 auto;padding-top:3px}
.slide.ink .takeaway{border-top-color:var(--deep-line);color:#a7aebb}

/* airy: for slides whose body holds one object and a few fragments. Instead of
   padding the argument back in, scale the type and the gaps so the composition
   fills the frame. Applied per slide; the audit still gates the geometry. */
.slide.airy .stack{gap:22px}
.slide.airy .eq{padding:22px 69px 22px 28px;font-size:1.18em}
.slide.airy .eq.tight{padding-top:18px;padding-bottom:18px}
.slide.airy .eq .note{font-size:19.5px;line-height:1.5;margin-top:12px}
.slide.airy .pts{gap:18px}
.slide.airy .pts li{font-size:22.5px;line-height:1.5}
.slide.airy .pts.dense li{font-size:21px}
.slide.airy .pts .tk{font-size:17.5px}
.slide.airy .card{padding:24px 27px}
.slide.airy .card p{font-size:21.5px;line-height:1.55}
.slide.airy .card .k,.slide.airy .box .t{font-size:14.5px}
.slide.airy .box{padding:22px 27px}
.slide.airy .box p{font-size:21px;line-height:1.55}
.slide.airy .matrix .row>div{padding:15px 18px;font-size:19.5px}
.slide.airy .takeaway{font-size:21px;margin-top:30px;padding-top:21px}
.slide.airy .deflist{font-size:21px;gap:14px 24px}
.slide.airy .where{font-size:19.5px}

/* code / pseudocode */
.code{border:1.5px solid var(--rule);border-radius:10.5px;background:#fbfbfa;overflow:hidden}
.code .bar{padding:9px 16.5px;border-bottom:1.5px solid var(--rule);font-family:var(--mono);font-size:13.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);background:var(--surface-2)}
.code pre{padding:16.5px 21px;font-family:var(--mono);font-size:16.2px;line-height:1.62;color:var(--ink-2);white-space:pre;overflow:hidden}
.code .kw{color:var(--ultra);font-weight:500}
.code .fn{color:var(--ink);font-weight:500}
.code .num{color:var(--verify)}
.code .cm{color:var(--ink-4);font-style:italic}
.code .str{color:var(--warn)}
.algo{counter-reset:ln}
/* Lines are block spans inside a <pre>. The pre must NOT preserve the newlines
   between them or every line renders twice as tall; the spans themselves keep
   pre semantics so indentation survives. */
.code pre.algo{white-space:normal}
.algo .l{display:block;white-space:pre;position:relative;padding-left:39px}
.algo .l::before{counter-increment:ln;content:counter(ln);position:absolute;left:0;width:27px;text-align:right;color:var(--ink-4);font-size:14.25px}

/* pipeline / flow rail */
.rail{display:grid;gap:15px;align-items:stretch}
.rail .step{position:relative;border:1.5px solid var(--rule);border-radius:12px;background:#fff;padding:18px 19.5px}
.rail .step .ph{font-family:var(--mono);font-size:12.75px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.rail .step .nm{font-family:var(--display);font-size:24px;margin-top:7.5px;line-height:1.2}
.rail .step p{font-size:17.1px;line-height:1.45;color:var(--ink-3);margin-top:10.5px}
.rail .step .tag{display:inline-block;margin-top:12px;font-family:var(--mono);font-size:13.5px;color:var(--ultra);background:var(--ultra-soft);border:1.5px solid var(--ultra-line);border-radius:6px;padding:3px 9px}
.rail .step:not(:last-child)::after{content:"→";position:absolute;right:-12px;top:50%;transform:translateY(-50%);color:var(--ultra);font-size:19.5px;z-index:2}
.rail.r4{grid-template-columns:repeat(4,minmax(0,1fr))}
.rail.r3{grid-template-columns:repeat(3,minmax(0,1fr))}
.rail.r5{grid-template-columns:repeat(5,minmax(0,1fr))}

/* schematic svg wrapper */
.schema{width:100%}
.schema svg{display:block;width:100%;height:auto;overflow:visible}
.schema .nb{fill:#fff;stroke:var(--rule-2)}
.schema .nb.hot{stroke:var(--ultra);fill:var(--ultra-soft)}
.schema .nb.ver{stroke:var(--verify-line);fill:var(--verify-soft)}
.schema .nb.bad{stroke:var(--danger-line);fill:var(--danger-soft)}
.schema text{font-family:var(--mono)}
.schema .nl{font-size:11px;fill:var(--ink)}
.schema .ns{font-size:9px;fill:var(--ink-3)}
.schema .na{font-size:9px;fill:var(--ultra);letter-spacing:.1em}
.schema .edge{stroke:var(--rule-2);fill:none}
.schema .edge.hot{stroke:var(--ultra)}
.schema .edge.dash{stroke-dasharray:2.67 2.67}

/* charts: bar */
.chart{position:relative}
.chart .plot{position:relative;border-left:1.5px solid var(--rule-2);border-bottom:1.5px solid var(--rule-2)}
.chart .gl{position:absolute;left:0;right:0;border-top:1.5px dashed var(--rule);pointer-events:none}
.chart .gl span{position:absolute;left:-38px;top:-7px;font-family:var(--mono);font-size:13.5px;color:var(--ink-4);width:48px;text-align:right}
.bars{display:flex;align-items:flex-end;gap:var(--bar-gap,15px);height:100%;padding:0 12px;position:relative;z-index:1}
.bars .b{flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;gap:7.5px}
.bars .b i{display:block;width:100%;background:linear-gradient(180deg,var(--ultra) 0%,rgba(27,59,214,.42) 100%);border-radius:3px 3px 0 0;transform:scaleY(0);transform-origin:bottom;transition:transform .8s cubic-bezier(.2,.7,.2,1);height:var(--h,10%)}
.bars .b.v i{background:linear-gradient(180deg,var(--verify) 0%,rgba(14,116,144,.38) 100%)}
.bars .b.mut i{background:linear-gradient(180deg,var(--ink-4) 0%,rgba(152,160,174,.35) 100%)}
.bars .b.dg i{background:linear-gradient(180deg,var(--danger) 0%,rgba(179,38,30,.35) 100%)}
.slide.active .bars .b i{transform:scaleY(1);transition-delay:calc(.2s + var(--bi,0)*.05s)}
.bars .b .val{font-family:var(--mono);font-size:15px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.bars .lbl{position:absolute;left:0;right:0;top:calc(100% + 9px);display:flex;gap:var(--bar-gap,15px);padding:0 12px}
.bars .lbl span{flex:1 1 0;min-width:0;text-align:center;font-family:var(--mono);font-size:13.5px;color:var(--ink-3);line-height:1.3;word-break:break-word}

/* ---- terminal replay ------------------------------------------------------
   Real captured output, replayed line by line on slide entry. Vector text, so
   it stays crisp in the PDF where a screen recording would be a blurry raster
   frame; and unlike a video it cannot silently show a stale run. */
.term{border:1.5px solid #232a35;border-radius:10.5px;background:#0e1116;overflow:hidden}
.term .bar{display:flex;align-items:center;gap:10.5px;padding:10.5px 16.5px;border-bottom:1.5px solid #232a35;background:#12161d}
.term .bar i{width:12px;height:12px;border-radius:50%;display:block;background:#3a4250}
.term .bar i:nth-child(1){background:#d05a52}.term .bar i:nth-child(2){background:#c9a227}.term .bar i:nth-child(3){background:#2f9e6d}
.term .bar span{font-family:var(--mono);font-size:14.25px;color:#8b93a2;margin-left:7.5px}
.term .bar .rt{margin-left:auto;color:#5f6874;font-size:13.5px}
.term pre{padding:16.5px 19.5px;font-family:var(--mono);font-size:15.6px;line-height:1.62;color:#cdd3dc;white-space:pre;overflow:hidden}
.term pre .l{display:block;opacity:0}
.term pre.done .l,.term pre .l.on{opacity:1;transition:opacity .12s linear}
.term .p{color:#7dd3e0}      /* prompt */
.term .ok{color:#5fc99a}     /* verifier accepted */
.term .no{color:#e08b84}     /* verifier rejected */
.term .k{color:#9ab6ff}      /* keys / flags */
.term .n{color:#e0c07a}      /* numbers */
.term .c{color:#6b7280}      /* comments */

/* ---- paper excerpt / quotation -------------------------------------------- */
.quote{border-left:3px solid var(--ultra);padding:3px 0 3px 21px}
.quote p{font-family:var(--display);font-size:22.5px;line-height:1.45;color:var(--ink);font-style:italic}
.quote .who{font-family:var(--mono);font-size:14.25px;color:var(--ink-3);margin-top:10.5px;letter-spacing:.03em}

/* ---- KPI strip ------------------------------------------------------------ */
.kpis{display:grid;gap:15px}
.kpis.k3{grid-template-columns:repeat(3,minmax(0,1fr))}
.kpis.k4{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpis.k5{grid-template-columns:repeat(5,minmax(0,1fr))}
.kpi{border:1.5px solid var(--rule);border-radius:10.5px;background:#fff;padding:16.5px 18px}
.kpi .n{font-family:var(--display);font-size:39px;line-height:1.05;color:var(--ink);font-variant-numeric:tabular-nums}
.kpi .n.v{color:var(--verify)}
.kpi .l{font-family:var(--mono);font-size:13.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3);margin-top:9px;line-height:1.35}
.kpi .s{font-size:16.2px;color:var(--ink-3);line-height:1.4;margin-top:7.5px}

/* charts: svg line/scatter */
.lchart svg{display:block;width:100%;height:auto;overflow:visible}
.lchart .ax{stroke:var(--rule-2);stroke-width:1}
.lchart .grid{stroke:var(--rule);stroke-width:1;stroke-dasharray:2 2.67}
.lchart .tick{font-family:var(--mono);font-size:9px;fill:var(--ink-4)}
.lchart .alab{font-family:var(--mono);font-size:9.5px;fill:var(--ink-3);letter-spacing:.08em}
.lchart .ln{fill:none;stroke:var(--ultra);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.lchart .ln.v{stroke:var(--verify)}
.lchart .ln.dg{stroke:var(--danger)}
.lchart .ln.mut{stroke:var(--ink-4);stroke-dasharray:3.33 2.67;stroke-width:1.5}
.lchart .area{fill:rgba(27,59,214,.08);stroke:none}
.lchart .pt{fill:#fff;stroke:var(--ultra);stroke-width:1.6}
.lchart .pt.v{stroke:var(--verify)}
.lchart .pt.dg{stroke:var(--danger)}
.lchart .plab{font-family:var(--mono);font-size:9px;fill:var(--ink-2)}
.lchart .draw{stroke-dasharray:var(--len,1000);stroke-dashoffset:var(--len,1000);transition:stroke-dashoffset 1.15s ease .25s}
.slide.active .lchart .draw{stroke-dashoffset:0}
.lchart .fade{opacity:0;transition:opacity .5s ease .8s}
.slide.active .lchart .fade{opacity:1}

/* legend */
.legend{display:flex;flex-wrap:wrap;gap:18px;font-family:var(--mono);font-size:14.25px;color:var(--ink-3);align-items:center}
.legend span{display:inline-flex;align-items:center;gap:7.5px}
.legend i{width:15px;height:3px;background:var(--ultra);display:inline-block;border-radius:1.5px}
.legend i.v{background:var(--verify)}.legend i.mut{background:var(--ink-4)}.legend i.dg{background:var(--danger)}
.legend i.sq{width:12px;height:12px;border-radius:3px}

/* timeline */
.tline{position:relative;padding-top:21px}
.tline .axis{position:relative;height:1.5px;background:var(--rule-2)}
.tline .axis .fill{position:absolute;left:0;top:0;height:1.5px;background:var(--ultra);width:0;transition:width 1.3s ease .3s}
.slide.active .tline .axis .fill{width:100%}
.tline .nodes{display:grid;margin-top:-5px}
.tline .nd{position:relative;padding-top:24px}
.tline .nd::before{content:"";position:absolute;top:-3px;left:0;width:10.5px;height:10.5px;border-radius:50%;background:#fff;border:2.25px solid var(--ultra)}
.lchart .barr{transform-box:fill-box;transform-origin:bottom;transform:scaleY(0);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.slide.active .lchart .barr{transform:scaleY(1)}
.lchart .barh{transform-box:fill-box;transform-origin:left center;transform:scaleX(0);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.slide.active .lchart .barh{transform:scaleX(1)}
.chnote{font-family:var(--mono);font-size:13.5px;color:var(--ink-3);margin-top:9px;line-height:1.5}
.ch{width:100%}
.tline .nd.hot::before{background:var(--ultra)}
.tline .nd .d{font-family:var(--mono);font-size:14.25px;color:var(--ultra);letter-spacing:.06em}
.tline .nd .t{font-size:18px;color:var(--ink);font-weight:500;margin-top:4.5px;line-height:1.3}
.tline .nd .x{font-size:16.2px;color:var(--ink-3);margin-top:4.5px;line-height:1.4;max-width:22ch}

/* two-column "claim vs evidence" */
.duel{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1.5px solid var(--rule);border-radius:10.5px;overflow:hidden}
.duel>div{padding:19.5px 22.5px}
.duel>div:first-child{background:var(--verify-soft);border-right:1.5px solid var(--rule)}
.duel>div:last-child{background:var(--danger-soft)}
.duel h4{margin-bottom:10.5px}
.duel>div:first-child h4{color:var(--verify)}
.duel>div:last-child h4{color:var(--danger)}
.duel p{font-size:18.3px;line-height:1.5;color:var(--ink-2)}
.duel .pts li{font-size:18px}

/* figure with caption */
figure{margin:0}
figure img{display:block;width:100%;border:1.5px solid var(--rule);border-radius:9px;background:#fff}
figure figcaption{font-family:var(--mono);font-size:14.25px;line-height:1.45;color:var(--ink-3);margin-top:9px}

/* ---- media: looping capture with a print-safe poster ---------------------
   Screen shows the clip; print shows the poster frame, so the exported PDF
   never contains a black rectangle where a video used to be. Every clip is
   attributed in .cap — a recorded system is evidence and evidence needs a
   provenance line. */
.media{position:relative;max-width:100%;border:1.5px solid var(--rule);border-radius:10.5px;overflow:hidden;background:var(--surface-2);line-height:0}
.media video,.media img.poster,.media img.still{display:block;width:100%;height:100%;object-fit:cover;background:var(--surface-2)}
.media img.poster{display:none}
.media.contain video,.media.contain img{object-fit:contain}
.media .cap{position:absolute;left:0;right:0;bottom:0;padding:33px 16.5px 12px;background:linear-gradient(transparent,rgba(14,17,22,.78));font-family:var(--mono);font-size:13.5px;line-height:1.5;color:#eef1f5;letter-spacing:.02em}
.media .cap b{color:#fff;font-weight:500}
.media .badge{position:absolute;top:12px;left:12px;z-index:2;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;background:rgba(252,252,251,.94);border:1.5px solid var(--rule-2);border-radius:6px;padding:4.5px 9px;color:var(--ink-2)}
.media .badge.live::before{content:"";display:inline-block;width:7.5px;height:7.5px;border-radius:50%;background:var(--verify);margin-right:7.5px;vertical-align:middle;animation:mpulse 2.4s ease-out infinite}
@keyframes mpulse{0%,100%{opacity:1}50%{opacity:.25}}
.media .shade{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1.5px rgba(14,17,22,.05)}
.mediarow{display:grid;gap:15px}
.mediarow.m2{grid-template-columns:repeat(2,minmax(0,1fr))}
.mediarow.m3{grid-template-columns:repeat(3,minmax(0,1fr))}

/* title slide */
#s-title{padding:0;background:var(--surface)}
#s-title .field{position:absolute;inset:0}
#s-title canvas{display:block;width:100%;height:100%}
#s-title .wash{position:absolute;inset:0;background:radial-gradient(42% 46% at 24% 30%,rgba(27,59,214,.10),transparent 68%),radial-gradient(36% 42% at 80% 22%,rgba(14,116,144,.10),transparent 66%),linear-gradient(180deg,rgba(252,252,251,.2),rgba(252,252,251,.86) 78%)}
#s-title .inner{position:relative;height:100%;display:flex;flex-direction:column;justify-content:center;padding:0 var(--pad-x)}
#s-title .venue{font-family:var(--mono);font-size:15.75px;letter-spacing:.2em;text-transform:uppercase;color:var(--ultra)}
#s-title h1{margin-top:30px;font-size:82.5px;max-width:24ch}
#s-title .sub{margin-top:27px;font-size:24px;line-height:1.55;color:var(--ink-2);max-width:62ch}
#s-title .who{margin-top:51px;display:flex;gap:39px;align-items:flex-end;border-top:1.5px solid var(--rule);padding-top:24px;max-width:76ch}
#s-title .who .nm{font-family:var(--display);font-size:28.5px}
#s-title .who .af{font-family:var(--mono);font-size:15.75px;color:var(--ink-3);line-height:1.5;margin-top:6px}
#s-title .who .rt{margin-left:auto;text-align:right;font-family:var(--mono);font-size:15px;color:var(--ink-3);line-height:1.6}

/* agenda */
.agenda{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.agenda .it{border:1.5px solid var(--rule);border-radius:10.5px;background:#fff;padding:16.5px 19.5px;display:flex;flex-direction:column;gap:7.5px}
.agenda .it .n{font-family:var(--mono);font-size:14.25px;color:var(--ultra);letter-spacing:.14em}
.agenda .it .t{font-family:var(--display);font-size:23.25px;line-height:1.2}
.agenda .it .m{font-family:var(--mono);font-size:14.25px;color:var(--ink-3)}
.agenda .it p{font-size:17.1px;line-height:1.45;color:var(--ink-3)}
.agenda .it.now{border-color:var(--ultra);background:var(--ultra-soft)}

/* reference list slide */
.refs{columns:2;column-gap:39px;font-size:15.9px;line-height:1.5;color:var(--ink-2)}
.refs .r{break-inside:avoid;margin-bottom:9px;padding-left:57px;position:relative}
.refs .r .k{position:absolute;left:0;top:0;font-family:var(--mono);font-size:14.25px;color:var(--ultra);width:51px}
.refs .r i{font-style:italic;color:var(--ink-3)}
.refs.c3{columns:3;font-size:14.85px}

/* utility */
.hr{height:1.5px;background:var(--rule);margin:18px 0}
.nowrap{white-space:nowrap}
.center{text-align:center}
.right{text-align:right}
.fill{width:100%}
.hidden{display:none}

/* ============ print: one 1280x720 page per slide ========================== */
@media print{
  @page{size:1920px 1080px;margin:0}
  /* Print must be a still frame: a transition still in flight when the page is
     rasterized would print a half-faded box. */
  *,*::before,*::after{-webkit-print-color-adjust:exact;print-color-adjust:exact;transition:none!important;animation:none!important}
  html,body{overflow:visible;background:#fff;height:auto}
  #deck{position:static}
  #stage{position:static;transform:none!important;width:1920px;height:auto;box-shadow:none}
  .slide{position:relative;inset:auto;width:1920px;height:1080px;opacity:1!important;transform:none!important;pointer-events:auto;page-break-after:always;break-after:page;overflow:hidden}
  .frag{opacity:1!important;transform:none!important}
  .bars .b i{transform:scaleY(1)!important;transition:none!important}
  .lchart .draw{stroke-dashoffset:0!important;transition:none!important}
  /* SVG bars are drawn with a scale transform that starts at 0 and is released
     by .slide.active; in print only one slide can be active, so settle them
     unconditionally or every bar chart after the first prints empty. */
  .lchart .barr,.lchart .barh{transform:none!important;transition:none!important}
  .lchart .fade{opacity:1!important}
  .tline .axis .fill{width:100%!important}
  .term pre .l{opacity:1!important}
  /* the screen footer is one line; the PDF carries the full citation, so the
     provenance policy holds in the artifact that gets read after the talk */
  .foot .src .det{display:inline!important}
  /* The full citation is two to four lines at screen size, and every line it
     adds is taken from .body (flex:1) — a body that is full on screen then
     spills, and Chrome's print fragmentation drops the whole page body. Give
     the footer more width and a smaller face so the citation costs about one
     line; tools/print-settle.mjs checks the remainder. */
  .foot .src{max-width:none;font-size:12px;line-height:1.4}
  /* a printed page cannot loop: swap every clip for its poster frame */
  .media video{display:none!important}
  .media img.poster{display:block!important}
  .media .badge.live::before{animation:none!important}
  #hud,#progress,#tag,#index,#toast,#notes{display:none!important}
}
