/* seminar.html deck styles — offline 16:9 deck, projector + phone, print view.
   Loaded only by seminar.html; no CDN, no framework. */

:root {
  --deck-bg: #ffffff;
  --deck-fg: #14161a;
  --deck-muted: #5b6470;
  --deck-accent: #0b5cad;
  --deck-accent2: #b02a30;
  --deck-ok: #1a7f37;
  --deck-warn: #9a6700;
  --deck-card: #f2f4f7;
  --deck-border: #ccd2da;
  --deck-script-bg: #fbfbfc;
}
html[data-theme="dark"] {
  --deck-bg: #14161a;
  --deck-fg: #e8eaee;
  --deck-muted: #a8b0ba;
  --deck-accent: #7ab3f5;
  --deck-accent2: #ff7a80;
  --deck-ok: #4ade80;
  --deck-warn: #fbbf24;
  --deck-card: #1d2026;
  --deck-border: #3a3f47;
  --deck-script-bg: #191c22;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body.deck {
  background: var(--deck-bg);
  color: var(--deck-fg);
  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* ---------- deck stage ---------- */
#deck { position: relative; }
.slide {
  display: none;
  width: 100%;
  min-height: 100vh;
  padding: 4.5vh 5vw 8vh;
}
.slide.active { display: block; }

/* 16:9 frame on a projector, one slide per screen on a phone */
@media (min-width: 900px) and (min-aspect-ratio: 1/1) {
  .slide { min-height: 100vh; }
}

.slide h1.head {
  font-size: clamp(1.5rem, 3.4vw, 2.6rem);
  line-height: 1.18;
  margin: 0 0 2.2vh;
  max-width: 62ch;
  font-weight: 700;
}
.slide h1.head .zh, .slide h1.head .en { display: inline; }
.slide .kicker {
  font-size: 0.95rem;
  color: var(--deck-muted);
  margin: 0 0 1.2vh;
  letter-spacing: 0.02em;
}
.slide .body {
  display: block;
  font-size: clamp(1.05rem, 1.55vw, 1.35rem);
  line-height: 1.45;
}
.slide figure { margin: 0; }
.slide figure img, .slide figure svg { max-width: 100%; height: auto; display: block; }
.slide figcaption, .slide .cap {
  font-size: 0.92rem;
  color: var(--deck-muted);
  margin-top: 1vh;
  max-width: 78ch;
}
.slide p { margin: 0.5em 0; max-width: 78ch; }
.slide ul, .slide ol { margin: 0.4em 0; padding-left: 1.3em; max-width: 74ch; }
.slide li { margin: 0.35em 0; }

/* visual evidence: figure + short note side by side on wide screens */
.evidence { display: grid; gap: 2.2vw; align-items: start; }
@media (min-width: 900px) {
  .evidence.two { grid-template-columns: 1.25fr 1fr; }
  .evidence.wide { grid-template-columns: 1fr; }
}
.evidence .note {
  font-size: clamp(1rem, 1.35vw, 1.2rem);
  background: var(--deck-card);
  border-left: 4px solid var(--deck-accent);
  border-radius: 8px;
  padding: 1.4vh 1.4vw;
}
.evidence .note b { color: var(--deck-accent); }

/* key-number callouts */
.bignum {
  font-size: clamp(1.6rem, 3.6vw, 2.8rem);
  font-weight: 700;
  line-height: 1.1;
  color: var(--deck-accent);
}
.bignum small { font-size: 0.45em; font-weight: 600; color: var(--deck-fg); display: block; margin-top: 0.4em; }
.numrow { display: flex; flex-wrap: wrap; gap: 1.6vw; margin: 1vh 0; }
.numrow .cell { background: var(--deck-card); border: 1px solid var(--deck-border); border-radius: 10px; padding: 1.2vh 1.2vw; min-width: 12ch; }

/* take-home box (reused on the summary slide) */
.takehome { border: 2px solid var(--deck-accent); border-radius: 10px; padding: 1.6vh 1.6vw; margin: 1vh 0; background: var(--deck-card); }
.takehome h3 { margin: 0 0 0.4em; font-size: 1.15em; color: var(--deck-accent); }

/* caveats / pending chips */
.chips { display: flex; flex-wrap: wrap; gap: 0.6vw; margin: 1vh 0; }
.chip { border: 1px solid var(--deck-border); border-radius: 999px; padding: 0.25em 0.9em; font-size: 0.9rem; background: var(--deck-card); }
.chip.warn { border-color: var(--deck-warn); color: var(--deck-warn); }
.chip.ok { border-color: var(--deck-ok); color: var(--deck-ok); }

/* source marker (rule 3) */
sup.src { font-size: 0.72em; color: var(--deck-muted); }
sup.src a { color: inherit; text-decoration: none; border-bottom: 1px dotted currentColor; }

/* ---------- slide chrome: number, section, disposable mark ---------- */
.slide .chrome {
  position: absolute; left: 5vw; right: 5vw; bottom: 2.4vh;
  display: flex; align-items: baseline; gap: 1.2vw;
  font-size: 0.85rem; color: var(--deck-muted);
  border-top: 1px solid var(--deck-border); padding-top: 0.8vh;
}
.slide .chrome .num { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--deck-fg); }
.slide .chrome .sec { flex: 1; }
.slide .chrome .disp { color: var(--deck-warn); font-weight: 600; }
.slide .chrome .keys { opacity: 0.85; }

/* ---------- script blocks (both languages, English canonical) ---------- */
.script {
  display: none;
  margin-top: 2.4vh;
  border: 1px dashed var(--deck-border);
  border-radius: 8px;
  background: var(--deck-script-bg);
  padding: 1.4vh 1.4vw;
  font-size: 0.95rem;
  line-height: 1.55;
}
.script .lbl { font-weight: 700; color: var(--deck-accent); font-size: 0.85rem; letter-spacing: 0.03em; }
.script p { margin: 0.35em 0; }
.script .time { font-variant-numeric: tabular-nums; color: var(--deck-muted); font-weight: 600; }
.script .tr { color: var(--deck-muted); font-style: italic; }
html[data-script="on"] .script { display: block; }

/* ---------- modes ---------- */
/* print view: slides + script together, for browser PDF export */
html[data-view="print"] body.deck { background: #fff; }
html[data-view="print"] .slide {
  display: block !important;
  page-break-after: always;
  break-after: page;
  min-height: 0;
  padding: 3vh 4vw;
  border-bottom: 1px solid var(--deck-border);
}
html[data-view="print"] .script { display: block !important; }
html[data-view="print"] .chrome .keys { display: none; }

/* presenter view: current slide + script + next slide + timer */
html[data-view="present"] body.deck { background: #101216; }
html[data-view="present"] #deck { display: grid; grid-template-columns: 1.55fr 1fr; gap: 0; height: 100vh; }
html[data-view="present"] .slide { display: none; min-height: 0; padding: 3vh 3vw 6vh; }
html[data-view="present"] .slide.active { display: block; }
html[data-view="present"] #presenter {
  display: block; overflow-y: auto; padding: 3vh 2vw; color: #e8eaee;
  border-left: 1px solid var(--deck-border); background: var(--deck-script-bg);
}
html[data-view="present"] #presenter .script { display: block; border: 0; background: transparent; }
html[data-view="present"] #presenter .next { margin-top: 3vh; opacity: 0.75; }
html[data-view="present"] #presenter .next h2 { font-size: 1.1rem; margin: 0 0 0.5em; }
html[data-view="present"] #presenter .timer { font-size: 2rem; font-variant-numeric: tabular-nums; font-weight: 700; color: var(--deck-accent); }
#presenter { display: none; }

/* ---------- help overlay ---------- */
#deckhelp {
  position: fixed; inset: 0; z-index: 50; display: none;
  background: rgba(10, 12, 16, 0.82); color: #fff; padding: 8vh 8vw; font-size: 1.05rem;
}
html[data-help="on"] #deckhelp { display: block; }
#deckhelp h2 { margin-top: 0; }
#deckhelp table { border-collapse: collapse; }
#deckhelp td { padding: 0.3em 1em 0.3em 0; vertical-align: top; }
#deckhelp kbd {
  border: 1px solid #888; border-bottom-width: 2px; border-radius: 5px;
  padding: 0.1em 0.5em; font: 0.9em ui-monospace, Menlo, Consolas, monospace; background: #22262e;
}

/* ---------- Q&A and backup sections ---------- */
.qa { border-left: 4px solid var(--deck-accent2); padding-left: 1em; margin: 1.2vh 0; }
.qa .q { font-weight: 700; }
.qa .a { color: var(--deck-fg); }
.qa .use { color: var(--deck-muted); font-size: 0.88rem; }

/* source map appendix */
table.srcmap { border-collapse: collapse; width: 100%; font-size: 0.85rem; }
table.srcmap th, table.srcmap td { border: 1px solid var(--deck-border); padding: 4px 7px; text-align: left; vertical-align: top; }
table.srcmap th { background: var(--deck-card); }
table.srcmap code { font-size: 0.95em; word-break: break-all; }

/* print: hide chrome/help, keep everything else */
@media print {
  .chrome .keys, #deckhelp, .lang-toggle { display: none !important; }
}
