/* ============================================================================
   present.css — classroom presentation mode. 16:9 deck, keyboard driven.
   Keeps the bold full-bleed colour of the original Keynote decks.
   ========================================================================== */
.pres{--slide-w:1600;--slide-h:900;
  position:fixed;inset:0;background:#000;overflow:hidden;
  font-family:var(--font-display);cursor:default}
.pres.is-idle{cursor:none}

.deck{position:absolute;top:50%;left:50%;width:calc(var(--slide-w) * 1px);height:calc(var(--slide-h) * 1px);
  transform:translate(-50%,-50%) scale(var(--k,1));transform-origin:center center}

.slide{position:absolute;inset:0;display:grid;place-items:center;
  padding:96px 132px;text-align:center;color:#fff;
  background:linear-gradient(170deg,var(--sa,#00A2FF),var(--sb,var(--sa,#00A2FF)));
  opacity:0;pointer-events:none;transition:opacity var(--dur-base) var(--ease)}
.slide.is-on{opacity:1;pointer-events:auto}
.slide.on-light{color:#0B0D10}
.slide__in{display:grid;gap:40px;justify-items:center;width:100%;max-width:1240px}
.slide--left{text-align:left}
.slide--left .slide__in{justify-items:start}

.s-eyebrow{font-size:24px;font-weight:var(--fw-bold);letter-spacing:.14em;text-transform:uppercase;opacity:.72}
.s-title{font-size:96px;font-weight:var(--fw-black);line-height:1.02;letter-spacing:-.025em;max-width:24ch}
.s-title--xl{font-size:150px;line-height:.96}
.s-h{font-size:64px;font-weight:var(--fw-bold);line-height:1.1;letter-spacing:-.02em;max-width:26ch}
.s-body{font-size:38px;line-height:1.42;max-width:32ch;font-weight:var(--fw-regular)}
.s-body--sm{font-size:30px;max-width:44ch}
.s-note{font-size:24px;opacity:.78;max-width:60ch;line-height:1.4}
.s-quote{font-size:52px;font-weight:var(--fw-medium);line-height:1.24;max-width:28ch;letter-spacing:-.015em}
.s-cite{font-size:26px;opacity:.75}

.s-list{display:grid;gap:22px;text-align:left;font-size:34px;line-height:1.3}
.s-list li{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:start}
.s-list .k{font-weight:var(--fw-bold);opacity:.6;min-width:1.4em}
.s-list--tight{gap:14px;font-size:30px}

.s-cols{display:grid;gap:28px;width:100%;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));text-align:left}
.s-col{display:grid;gap:14px;align-content:start}
.s-col__h{font-size:28px;font-weight:var(--fw-bold);padding:16px 20px;border-radius:10px;
  background:rgba(255,255,255,.18);text-align:center}
.s-col__c{font-size:24px;line-height:1.3;padding:14px 18px;border-radius:8px;background:rgba(0,0,0,.2)}
.on-light .s-col__h{background:rgba(0,0,0,.14)}
.on-light .s-col__c{background:rgba(255,255,255,.55)}

.s-stack{display:grid;gap:12px;width:100%;max-width:1000px}
.s-stack__row{display:grid;grid-template-columns:1fr 280px;gap:32px;align-items:center}
.s-stack__bar{height:52px;border-radius:6px;background:#00A2FF;width:var(--w,100%);margin-left:auto;margin-right:auto;
  transition:opacity var(--dur-base),transform var(--dur-base) var(--ease-out)}
.s-stack__l{font-size:30px;font-weight:var(--fw-semi);text-align:left}
.s-stack__row[data-dim="1"]{opacity:.28}

.s-table{width:100%;border-collapse:collapse;font-size:24px}
.s-table th,.s-table td{padding:14px 18px;text-align:left;border-bottom:1px solid rgba(255,255,255,.22);line-height:1.28}
.s-table thead th{font-size:20px;text-transform:uppercase;letter-spacing:.08em;opacity:.8}
.on-light .s-table th,.on-light .s-table td{border-color:rgba(0,0,0,.18)}

.s-fig{display:grid;gap:22px;justify-items:center;width:100%}
.s-fig img{max-height:620px;width:auto;border-radius:12px;box-shadow:0 24px 60px rgba(0,0,0,.4)}
.s-fig figcaption{font-size:22px;opacity:.8;max-width:60ch;text-align:center}
.slide--image{padding:0}
.slide--image img{width:100%;height:100%;object-fit:cover}
.slide--image .slide__in{position:absolute;inset:auto 0 0 0;padding:64px 96px;
  background:linear-gradient(transparent,rgba(0,0,0,.72));justify-items:start;text-align:left}

/* reveal steps inside a slide */
.st{opacity:0;transform:translateY(10px);transition:opacity var(--dur-base) var(--ease),transform var(--dur-base) var(--ease-out)}
.st.is-in{opacity:1;transform:none}
.st.is-out{opacity:.22;transform:none}

/* ------------------------------------------------------------------ chrome */
.pres__bar{position:fixed;inset:auto 0 0 0;display:flex;align-items:center;gap:var(--sp-4);
  padding:var(--sp-3) var(--sp-5);background:linear-gradient(transparent,rgba(0,0,0,.6));
  color:#fff;font-family:var(--font-sans);font-size:var(--fs-200);
  opacity:0;transition:opacity var(--dur-base);z-index:10}
.pres:hover .pres__bar,.pres__bar:focus-within,.pres.show-ui .pres__bar{opacity:1}
.pres__bar .btn{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.22);color:#fff}
.pres__bar .btn:hover{background:rgba(255,255,255,.26);color:#fff}
.pres__pos{font-variant-numeric:tabular-nums;opacity:.85;min-width:6ch}
.pres__title{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:.85}
.pres__prog{position:fixed;top:0;left:0;height:3px;background:rgba(255,255,255,.9);
  width:var(--p,0%);transition:width var(--dur-base) var(--ease);z-index:11}

/* presenter notes panel */
.notes{position:fixed;inset:auto 0 0 0;max-height:42vh;overflow-y:auto;
  background:var(--c-bg-subtle);border-top:var(--border-med) solid var(--c-accent);
  padding:var(--sp-5) var(--sp-6) var(--sp-8);color:var(--c-text);font-family:var(--font-sans);
  transform:translateY(101%);transition:transform var(--dur-base) var(--ease-out);z-index:12}
.notes.is-on{transform:none}
.notes h4{font-size:var(--fs-100);text-transform:uppercase;letter-spacing:var(--tracking-caps);
  color:var(--c-accent);margin-bottom:var(--sp-3)}
.notes p{font-size:var(--fs-300);line-height:var(--lh-base);max-width:var(--measure)}
.notes p + p{margin-top:var(--sp-3)}

/* overview / slide grid (press O) */
.overview{position:fixed;inset:0;background:var(--c-bg);z-index:20;overflow-y:auto;padding:var(--gutter);
  display:none;font-family:var(--font-sans)}
.overview.is-on{display:block}
.overview h2{margin-bottom:var(--sp-5);color:var(--c-text-strong)}
.ovgrid{display:grid;gap:var(--sp-4);grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.ovcard{aspect-ratio:16/9;border-radius:var(--radius-sm);cursor:pointer;border:var(--border-med) solid transparent;
  background:linear-gradient(170deg,var(--sa,#333),var(--sb,var(--sa,#333)));
  padding:var(--sp-3);color:#fff;font-size:var(--fs-100);overflow:hidden;text-align:left;
  display:grid;align-content:start;gap:var(--sp-1);line-height:var(--lh-snug)}
.ovcard[aria-current="true"]{border-color:var(--c-focus)}
.ovcard b{font-size:var(--fs-200);font-weight:var(--fw-bold)}
.ovcard span{opacity:.8}
.ovcard.on-light{color:#000}

/* help overlay */
.help{position:fixed;inset:0;background:rgba(4,6,9,.9);z-index:30;display:none;place-items:center;
  font-family:var(--font-sans);padding:var(--gutter)}
.help.is-on{display:grid}
.helpcard{background:var(--c-surface);border:var(--border-thin) solid var(--c-border);
  border-radius:var(--radius-lg);padding:var(--sp-7);max-width:520px;display:grid;gap:var(--sp-4);box-shadow:var(--shadow-3)}
.keys{display:grid;gap:var(--sp-2)}
.keyrow{display:grid;grid-template-columns:120px 1fr;gap:var(--sp-4);font-size:var(--fs-200);align-items:center}
kbd{font-family:var(--font-mono);font-size:var(--fs-100);padding:3px 7px;border-radius:var(--radius-xs);
  background:var(--c-surface-2);border:var(--border-thin) solid var(--c-border-strong);color:var(--c-text)}

/* --------------------------------------- diagrams rebuilt from the slide art */
/* Sized so two rows plus their value branches and the caption fit inside the
   708px of usable slide height. present.js also scales any slide that still
   overruns, so nothing can be clipped. */
.deck .icon{width:68px;height:68px;flex:0 0 auto;display:block}
.s-vchain{display:grid;gap:40px;width:100%}
.s-vchain__row{display:grid;gap:14px;justify-items:center}
.s-vchain__label{font-size:26px;font-weight:var(--fw-bold);justify-self:start;opacity:.9}
.s-vchain__seq{display:flex;align-items:center;gap:20px;justify-content:center}
.s-vchain__cell{display:grid;justify-items:center;gap:6px}
.s-vchain__cell em{font-style:normal;font-size:18px;opacity:.75;line-height:1.2}
.s-vchain__arrow{display:flex;opacity:.65}
.s-vchain__arrow .icon{width:40px;height:40px}
.s-vchain__out{display:grid;justify-items:center;gap:6px}
.s-vchain__value{display:flex;align-items:center;gap:18px}
.s-vchain__value b{font-size:26px;font-weight:var(--fw-semi);white-space:nowrap}
.s-vchain__flank{display:flex;opacity:.8}
.s-vchain__flank .icon{width:34px;height:34px}

.s-stack__bars{display:grid;grid-template-columns:1fr;gap:18px;align-items:center}
.s-stack__bars.is-two{grid-template-columns:1fr 1fr}
.s-stack.is-two .s-stack__row{grid-template-columns:1fr 280px}
.s-stack__heads{display:grid;grid-template-columns:1fr 1fr 280px;gap:18px;margin-bottom:6px}
.s-stack__heads span{font-size:22px;font-weight:var(--fw-bold);text-align:center;
  text-transform:uppercase;letter-spacing:.08em;opacity:.8}
.s-col__icon{display:grid;place-items:center;padding:10px 0 4px}
.s-col__icon .icon{width:76px;height:76px}

/* Auto-fit: present.js measures the active slide and sets --fit when the
   content is taller or wider than the slide, so a long slide shrinks rather
   than running off the edge. */
.slide__in{transform:scale(var(--fit,1));transform-origin:center center}

/* --------------------------------------------- contract clauses in the deck */
.s-clause{display:grid;gap:18px;width:100%;max-width:1280px;text-align:left;
  padding:32px 38px;background:rgba(0,0,0,.26);border-radius:14px;
  border-left:6px solid rgba(255,255,255,.55)}
.on-light .s-clause{background:rgba(255,255,255,.55);border-left-color:rgba(0,0,0,.4)}
.s-clause__src{font-size:20px;text-transform:uppercase;letter-spacing:.1em;opacity:.75;font-weight:var(--fw-bold)}
.s-clause__text{font-family:var(--font-mono);font-size:25px;line-height:1.5;margin:0;white-space:pre-wrap}
.s-clause__text mark{background:rgba(250,226,50,.35);color:inherit;font-weight:var(--fw-bold);
  padding:1px 3px;border-radius:3px}
.on-light .s-clause__text mark{background:rgba(250,226,50,.85)}
.s-clause__note{font-size:23px;opacity:.85;margin:0;line-height:1.35}
.s-clausepair{display:grid;grid-template-columns:1fr 1fr;gap:26px;width:100%;text-align:left}
.s-clausepair .s-clause__text{font-size:20px}