/* base.css — HTML port of the TADH 2026-06-12 deck style system.
 *
 * Mirrors deck.typ + lib.typ + theme-tadh.typ. Geometry: the Typst page is
 * 841.89pt x 473.56pt rendered here at 1920x1080, so 1pt(typst) = 2.2806px.
 * Slide content margin = 25pt = 57px.
 */

/* ---------------------------------------------------------------- fonts */
@font-face {
  font-family: "Zen Antique";
  src: url("fonts/ZenAntique-Regular.ttf");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Hina Mincho";
  src: url("fonts/HinaMincho-Regular.ttf");
  font-weight: 400;
  font-display: swap;
}
/* Body = text cut ("Gen Interface JP"): the Display cut shrinks Latin ~7%
   relative to CJK — it was the "too bold / wrong ratio" culprit. Only the
   two weights actually used are shipped (local fonts/, symlink-free). */
@font-face {
  font-family: "Gen Interface JP";
  src: url("fonts/GenInterfaceJP-Regular.ttf");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Gen Interface JP";
  src: url("fonts/GenInterfaceJP-Bold.ttf");
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("fonts/CormorantGaramond-SemiBold.ttf");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("fonts/CormorantGaramond-Bold.ttf");
  font-weight: 700;
  font-display: swap;
}

/* --------------------------------------------------------------- tokens */
:root {
  /* lib/colors.typ */
  --navy: #123b73;
  --deep-navy: #0e2f5a;
  --dark-navy: #021225;
  --deep-dark-navy: #00132d;
  --ink: #232b33;
  --dark-ink: #1b2430;
  --muted: #6a6a63;
  --blue: #074f95;
  --sky: #4c79ae;
  --sage: #8a9b7a;
  --sage-dark: #6f7f63;
  --gold: #c6a86a;
  --gold-soft: #d2b985;
  --ivory: #f8f5ef;
  --warm-paper: #f3eee6;
  --warm-line: #c9b58f;
  --pale-blue: #eef2f6;
  /* theme-tadh.typ madder family (LLM/MCP layer) */
  --madder: #9a4a32;
  --madder-deep: #7c3a26;
  --madder-soft: #da9e86;
  --madder-pale: #f4e3da;
  --madder-line: #d8b5a6;
  /* lib.typ gradients & soft fills */
  --grad-hero: linear-gradient(222deg, var(--dark-navy), var(--deep-dark-navy));
  --grad-ink: linear-gradient(235deg, var(--deep-navy), #10366a);
  --grad-soft-blue: #f3f0e8;
  --grad-soft-orange: #f5efe3;
  --grad-soft-pink: #f0f2e8;
  /* geometry */
  --pad: 57px; /* 25pt content margin */
  --fit: 1;
  --font-body: "Gen Interface JP", "Noto Sans CJK JP", sans-serif;
  --font-serif: "Zen Antique", serif;
  --font-mono: "DejaVu Sans Mono", "Noto Sans Mono", "Noto Sans CJK JP", monospace;
}

/* --------------------------------------------------------------- global */
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { background: #1c1c1a; font-synthesis: none; }
/* font-synthesis:none everywhere = Typst behavior (never fake-bold
   Zen Antique / Hina Mincho, which only ship a Regular face). */

section.slide {
  position: fixed;
  left: 50%;
  top: 50%;
  width: 1920px;
  height: 1080px;
  transform: translate(-50%, -50%) scale(var(--fit));
  overflow: hidden;
  display: none;
  background: var(--ivory) center / cover no-repeat;
  background-image: url("assets/images/bg1.png");
  font-family: var(--font-body);
  font-size: 41px; /* 18pt body */
  line-height: 1.62; /* leading 0.78em (matched to Typst deck) */
  color: var(--ink);
}
section.slide.active { display: block; }
/* fade only on live navigation (deck.js adds .anim after first paint),
   so headless screenshots never catch a mid-transition frame */
body.anim section.slide.active { animation: slide-in 0.3s ease-out; }
@keyframes slide-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
section.slide[data-bg="bg0"] { background-image: url("assets/images/bg0.png"); }
section.slide[data-bg="bg1"] { background-image: url("assets/images/bg1.png"); }
section.slide[data-bg="bg2"] { background-image: url("assets/images/bg2.png"); }
section.slide[data-bg="bg3"] { background-image: url("assets/images/bg3.png"); }

a { color: var(--blue); text-decoration: none; }
em { font-style: normal; color: var(--blue); }
strong { font-weight: 700; color: #3f6d80; } /* Touying alert teal — matches Typst strong */
/* dark surfaces keep their own strong color */
.quote-strip strong, .slim-strip strong, .dark-card strong,
.mono strong, .divider strong, .ribbon strong { color: inherit; }

/* inline raw — blue bold mono on paper… */
code {
  font-family: var(--font-mono);
  font-weight: 700;
  color: var(--blue);
  font-size: 0.92em;
}
/* …but gold-soft inside dark surfaces (deck.typ dark-card override) */
.dark-card code, .quote-strip code, .divider .chip code { color: var(--gold-soft); }

/* jp() phrase boxing: lines may break only between .j phrases */
span.j { display: inline-block; text-indent: 0; }

/* progress hairline (Typst parity): width set per-slide via --p in deck.js */
section.slide:not(:first-of-type)::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 5.7px;
  width: calc(var(--p, 0) * 100%);
  background: linear-gradient(90deg, var(--gold), var(--navy));
  z-index: 4;
}

/* --------------------------------------------------------------- ribbon */
/* lib/headers.typ top-ribbon: navy gradient band w/ slanted tail, flush left */
.ribbon {
  position: absolute;
  left: 0;
  top: 55px;
  height: 57px;
  display: flex;
  align-items: center;
  padding: 0 23px 0 68px;
  background: linear-gradient(90deg, var(--deep-navy), var(--navy));
  font-family: "Hina Mincho", serif;
  font-size: 29.5px;
  font-weight: 400;
  color: #fff;
  white-space: nowrap;
  line-height: 1;
  z-index: 3;
  box-shadow: 0 6px 18px rgba(2, 18, 37, 0.22);
}
.ribbon::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 0;
  width: 36.5px;
  height: 57px;
  background: var(--navy);
  clip-path: polygon(0 0, 100% 100%, 0 100%);
}

/* ----------------------------------------------------------------- head */
/* lib.typ slide-head: ribbon kicker + Zen Antique title + gold bar + meta */
.head { position: relative; padding: 114px var(--pad) 0 var(--pad); }
.head::after {
  /* top-right metadata (slide-head meta:) */
  /* thin spaces (\2009 + terminating space) replicate Typst CJK–Latin autospacing */
  content: "テクストアナリティクスとデジタルヒューマニティーズ研究会 / 2026.6.12（金）";
  position: absolute;
  top: 75px;
  right: 66px;
  font-size: 23px; /* 10pt */
  color: var(--muted);
  line-height: 1;
}
.head[data-meta]::after { content: attr(data-meta); }
.head h2 {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: 59px; /* 26pt */
  letter-spacing: -2px;
  color: var(--navy);
  line-height: 1.35;
}
.head h2 code { font-size: 0.85em; color: var(--blue); }
.head .bar {
  display: block;
  width: 109px;
  height: 5.7px;
  background: var(--gold);
  /* bottom 52px (was 20px): match Typst's head-to-content gap —
     the tighter HTML gap was flagged as bad spacing (2026-06-12 feedback) */
  margin: 6px 0 52px;
}

/* slide body region below a .head */
.body { position: relative; padding: 0 var(--pad); }

/* ---------------------------------------------------------------- cards */
.card {
  background: rgba(248, 245, 239, 0.96);
  border: 2px solid var(--warm-line);
  border-radius: 25px;
  padding: 27px;
  box-shadow: 0 10px 28px rgba(2, 18, 37, 0.07), 0 2px 7px rgba(2, 18, 37, 0.04);
}
.glow-card {
  background: var(--grad-soft-blue);
  border: 2px solid var(--warm-line);
  border-radius: 25px;
  padding: 27px;
  box-shadow: 0 10px 28px rgba(2, 18, 37, 0.07), 0 2px 7px rgba(2, 18, 37, 0.04);
}
.glow-card.orange { background: var(--grad-soft-orange); }
.glow-card.pink { background: var(--grad-soft-pink); }
.dark-card {
  background: var(--grad-ink);
  border: none;
  border-radius: 25px;
  padding: 32px;
  color: #fff;
  box-shadow: 0 14px 34px rgba(2, 18, 37, 0.22), 0 3px 9px rgba(2, 18, 37, 0.12);
}
.dark-card .card-title {
  display: block;
  font-size: 27px; /* 12pt */
  font-weight: 700;
  color: var(--gold);
  margin-bottom: 5px;
}

/* card titles (typst `title()` — bold navy, tight tracking) */
.t {
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -1.5px;
}

/* ----------------------------------------------------------------- tags */
.tag {
  display: inline-block;
  background: var(--sage-dark);
  color: #fff;
  border-radius: 16px;
  padding: 6.8px 20.5px;
  font-size: 36.5px; /* 16pt */
  font-weight: 700;
  line-height: 1.25;
  vertical-align: middle;
}
.tag.navy { background: var(--navy); }
.tag.blue { background: var(--blue); }
.tag.gold { background: #b29760; color: #fff; } /* gold.darken(10%) w/ white fg, per deck usage */
.tag.madder { background: var(--madder); }
.tag.sage { background: var(--sage-dark); }
.tag.muted { background: var(--muted); }

/* ----------------------------------------------------------------- stat */
.stat {
  background: var(--grad-soft-blue);
  border: 2px solid var(--warm-line);
  border-radius: 25px;
  padding: 23px;
  width: 100%;
  box-shadow: 0 6px 16px rgba(2, 18, 37, 0.06);
}
.stat .label {
  display: block;
  font-size: 34px; /* 15pt */
  font-weight: 700;
  color: var(--muted);
  line-height: 1.3;
  margin-bottom: 4.5px;
}
.stat .value {
  display: block;
  font-size: 36.5px; /* 16pt */
  font-weight: 700;
  color: var(--blue);
  line-height: 1.35;
}

/* -------------------------------------------------------------- capsule */
.capsule {
  background: var(--grad-soft-blue);
  border: 2px solid var(--warm-line);
  border-radius: 25px;
  padding: 18px;
  width: 100%;
  box-shadow: 0 8px 20px rgba(2, 18, 37, 0.07), 0 2px 5px rgba(2, 18, 37, 0.04);
}
.capsule .tag { font-size: 36.5px; }
.capsule .t { display: block; font-size: 38.8px; margin-top: 4px; line-height: 1.45; }

/* ---------------------------------------------------------- quote strip */
.quote-strip {
  background: linear-gradient(100deg, var(--deep-navy), var(--navy) 55%, #1d4a87);
  border-radius: 18px;
  padding: 20.5px 32px;
  color: #fff;
  font-size: 36.5px; /* 16pt */
  font-weight: 700;
  line-height: 1.55;
  box-shadow: 0 12px 30px rgba(2, 18, 37, 0.2), 0 2px 8px rgba(2, 18, 37, 0.12);
}
.quote-strip.madder {
  background: linear-gradient(100deg, var(--madder-deep), var(--madder) 55%, #ad5c42);
  box-shadow: 0 12px 30px rgba(124, 58, 38, 0.24), 0 2px 8px rgba(124, 58, 38, 0.14);
}

/* --------------------------------------------------- mono (code window) */
.mono {
  position: relative;
  background: linear-gradient(235deg, #13202c, #06111d);
  border: 2px solid #233444;
  border-radius: 18px;
  padding: 23px 30px 30px;
  width: 100%;
  box-shadow: 0 14px 34px rgba(2, 18, 37, 0.26), 0 3px 9px rgba(2, 18, 37, 0.14);
}
.mono::before {
  /* three traffic dots */
  content: "";
  display: block;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: #ff5f57;
  box-shadow: 33px 0 0 #ffbd2e, 66px 0 0 #28c840;
  margin-bottom: 23px;
}
.mono[data-lang]::after {
  content: attr(data-lang);
  position: absolute;
  top: 26px;
  right: 30px;
  font-family: var(--font-mono);
  font-size: 21.7px; /* 9.5pt */
  letter-spacing: 1.1px;
  color: #5b6b7a;
}
.mono pre {
  font-family: var(--font-mono);
  font-size: 34px; /* 15pt */
  line-height: 1.45;
  color: #e6edf3;
  white-space: pre-wrap;
  overflow-wrap: break-word;
}
.mono pre code { font: inherit; color: inherit; }
.mono .k { color: #9ecbff; }    /* keys / keywords */
.mono .s { color: #d2b985; }    /* strings — gold-soft */
.mono .c { color: #7d8b99; }    /* comments */
.mono .n { color: #f0c674; }    /* numbers */
.mono .g { color: var(--gold-soft); font-weight: 700; } /* evidence-count comments */
/* warm-paper card variant (Typst card(fill: warm-paper)) */
.card.paper { background: var(--warm-paper); }

/* -------------------------------------------------------------- divider */
/* theme-tadh.typ divider(): numbered kicker, asymmetric, ghost number */
.slide.divider { background-image: url("assets/images/bg3.png"); }
.divider .ghost {
  position: absolute;
  right: -59px;
  top: 50%;
  transform: translateY(calc(-50% + 23px));
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: 536px; /* 235pt */
  line-height: 1;
  letter-spacing: 1px;
  color: rgba(198, 168, 106, 0.2); /* the big phantom — keep it bold */
  z-index: 0;
}
.divider .wrap {
  position: absolute;
  left: calc(var(--pad) + 249px); /* 128pt — well clear of the bg3 left bar (~8.4% wide) */
  right: 14%;
  top: 50%;
  /* -78px: lift clear of the bg3 foliage along the bottom */
  transform: translateY(calc(-50% - 78px));
  z-index: 1;
}
.divider .kicker {
  display: flex;
  align-items: center;
  gap: 27px; /* 12pt */
  margin-bottom: 55px; /* stack spacing 24pt */
}
.divider .num {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: 64px; /* 28pt */
  letter-spacing: 1.1px;
  color: var(--madder);
  line-height: 1;
}
.divider .kicker i {
  width: 3.2px;
  height: 55px;
  background: var(--madder-line);
}
.divider .chip {
  background: linear-gradient(100deg, var(--deep-navy), var(--navy));
  border-radius: 5.7px;
  padding: 9px 23px;
  box-shadow: 0 6px 16px rgba(2, 18, 37, 0.2);
  font-family: "Hina Mincho", serif;
  font-weight: 400;
  font-size: 34px; /* 15pt */
  letter-spacing: 3.4px;
  color: #fff;
  line-height: 1.2;
}
.divider .question {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: 100px; /* 44pt */
  letter-spacing: -2.3px;
  line-height: 1.45;
  color: var(--navy);
  margin-bottom: 55px;
}
.divider .rule {
  display: flex;
  gap: 11.5px; /* 5pt */
  margin-bottom: 55px;
}
.divider .rule::before {
  content: "";
  width: 146px; /* 64pt gold */
  height: 5.7px;
  background: var(--gold);
}
.divider .rule::after {
  content: "";
  width: 25px; /* 11pt sage tick (bg-palette decoration) */
  height: 5.7px;
  background: var(--sage-dark);
}
.divider .note { font-size: 34px; color: var(--muted); line-height: 1.5; }
.sec-dots {
  position: absolute;
  left: calc(var(--pad) + 249px); /* matches .wrap left inset */
  bottom: 59px; /* dy -26pt */
  display: flex;
  gap: 11.4px;
  z-index: 2;
}
.sec-dots i { height: 6.8px; width: 18px; border-radius: 3.4px; background: var(--warm-line); }
.sec-dots i.past { background: var(--gold); }
.sec-dots i.cur { width: 45.6px; background: var(--navy); }
.divider .note code { font-size: 0.95em; }

/* ----------------------------------------------------- columns / layout */
.cols {
  display: flex;
  align-items: stretch;
  gap: 32px; /* 14pt gutter */
}
.cols > .col { flex: 1 1 0; min-width: 0; }
.cols > .col[data-w="2"] { flex-grow: 2; }
.cols > .col[data-w="3"] { flex-grow: 3; }
.cols > .col[data-w="1.5"] { flex-grow: 1.5; }
/* equal-height card rows: make direct cards fill the column */
.cols.fill > .col > .card,
.cols.fill > .col > .glow-card,
.cols.fill > .col > .dark-card,
.cols.fill > .col > .stat,
.cols.fill > .col > .capsule,
.cols.fill > .col > .mono { height: 100%; }

/* ------------------------------------------------- diagram primitives */
/* theme-tadh.typ arch-node palette: data / mcp / llm / human / plain */
.dgm { position: relative; font-size: 25px; /* 11pt */ line-height: 1.35; }
.dgm svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.dgm-node {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-radius: 16px; /* 7pt */
  padding: 18px; /* 8pt */
  font-size: 25px;
  line-height: 1.35;
  background: var(--ivory);
  border: 2px solid var(--navy);
  color: var(--navy);
  box-shadow: 0 7px 18px rgba(2, 18, 37, 0.1), 0 1px 4px rgba(2, 18, 37, 0.06);
}
.dgm-node.mcp { box-shadow: 0 9px 24px rgba(124, 58, 38, 0.3), 0 2px 6px rgba(124, 58, 38, 0.16); }
.dgm-node.data { background: var(--ivory); border-color: var(--navy); color: var(--navy); }
.dgm-node.mcp { background: var(--madder); border-color: var(--madder-deep); color: #fbf1eb; }
.dgm-node.llm { background: var(--madder-pale); border-color: var(--madder); color: var(--madder-deep); }
.dgm-node.human { background: #f4ebd7; border-color: #b09356; color: #67572f; }
.dgm-node.plain { background: var(--warm-paper); border-color: var(--warm-line); color: var(--ink); }
.dgm-node b, .dgm-node strong, .dgm-node code { color: inherit; font-size: inherit; }
/* dashed group hull (arch-group) */
.dgm-group {
  position: absolute;
  border: 2px dashed rgba(18, 59, 115, 0.75);
  background: rgba(18, 59, 115, 0.05);
  border-radius: 25px; /* 11pt */
}
.dgm-group.madder { border-color: rgba(154, 74, 50, 0.75); background: rgba(154, 74, 50, 0.05); }
.dgm-group.gold { border-color: rgba(178, 151, 96, 0.8); background: rgba(198, 168, 106, 0.08); }
/* small group caption (arch-label) */
.dgm-label {
  font-size: 20.5px; /* 9pt */
  font-weight: 700;
  letter-spacing: 1.4px;
  color: var(--navy);
}
.dgm-label.madder { color: var(--madder); }
.dgm-label.gold { color: #8a753f; }
.dgm-label.sage { color: var(--sage-dark); }
/* SVG edges (arch-edge): stroke accents + arrow markers injected by deck.js */
svg .edge {
  fill: none;
  stroke: var(--navy);
  stroke-width: 2.6px;
  stroke-linecap: round;
  marker-end: url(#arr-navy);
}
svg .edge.madder { stroke: var(--madder); marker-end: url(#arr-madder); }
svg .edge.gold { stroke: #b29760; marker-end: url(#arr-gold); }
svg .edge.sage { stroke: var(--sage-dark); marker-end: url(#arr-sage); }
svg .edge.dashed { stroke-dasharray: 9 7; }
svg .edge.noarrow { marker-end: none; }
/* edge labels: small bold accent text on ivory backing */
.edge-label {
  position: absolute;
  font-size: 23px; /* 10pt */
  font-weight: 700;
  color: var(--navy);
  background: rgba(248, 245, 239, 0.94);
  box-shadow: 0 0 0 1px rgba(201, 181, 143, 0.55), 0 2px 6px rgba(2, 18, 37, 0.08);
  padding: 1px 9px;
  border-radius: 8px;
  line-height: 1.3;
  white-space: nowrap;
  transform: translate(-50%, -50%);
}
.edge-label.madder { color: var(--madder); }
.edge-label.gold { color: #8a753f; }
.edge-label.sage { color: var(--sage-dark); }

/* ------------------------------------------------------ cover (slide 1) */
.cover .ribbon { font-size: 29.5px; }
.cover-hero { position: absolute; left: 125px; top: 168px; }
.hero-title {
  font-family: "Cormorant Garamond", "Zen Antique", serif;
  font-weight: 700; /* Cormorant Bold for Latin; CJK falls to Zen Antique 400 */
  font-size: 127.7px; /* 56pt */
  letter-spacing: -1.1px;
  background: var(--grad-hero);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero-title .l { display: block; line-height: 127.7px; }
.hero-title .l2 { margin-top: 16px; } /* leading 0.5em → 171px line advance */
.hero-title .sm { font-size: 1em; } /* kana = kanji = Latin (2026-06-12) */
.hero-title .lg { font-size: 1.12em; }
.hero-title .gap { display: inline-block; width: 23px; }
.hero-sub {
  margin-top: 41px;
  font-size: 50.2px; /* 22pt */
  font-weight: 700;
  letter-spacing: 1.1px;
  color: var(--blue);
  line-height: 1;
}
.gold-rule {
  position: relative;
  width: 980px; /* 430pt */
  height: 3.4px;
  background: var(--gold);
  margin-top: 14px;
}
.gold-rule img {
  position: absolute;
  right: -205px;
  top: -102px;
  height: 138px; /* 60.5pt leaf */
}
.cover .chip {
  display: inline-block;
  margin-top: 68px;
  background: rgba(248, 245, 239, 0.78);
  backdrop-filter: blur(10px) saturate(1.05);
  -webkit-backdrop-filter: blur(10px) saturate(1.05);
  border-radius: 20px;
  padding: 25px 32px;
  line-height: 1.3;
  box-shadow: 0 8px 24px rgba(2, 18, 37, 0.1), 0 0 0 1px rgba(201, 181, 143, 0.35);
}
.cover .chip .name {
  font-size: 38.8px; /* 17pt */
  font-weight: 700;
  color: var(--deep-dark-navy);
}
.cover .chip .affil {
  margin-left: 38px; /* h(1em) */
  font-size: 29.6px; /* 13pt */
  color: var(--muted);
}
.cover .chip .meta2 {
  display: block;
  margin-top: 4.5px;
  font-size: 27.4px; /* 12pt */
  color: var(--muted);
}

/* ------------------------------------------- section-level utilities */
/* font sizes (pt × 2.2806) */
.fs11  { font-size: 25px; }
.fs115 { font-size: 26.2px; }
.fs12  { font-size: 27.4px; }
.fs125 { font-size: 28.5px; }
.fs13  { font-size: 29.6px; }
.fs135 { font-size: 30.8px; }
.fs14  { font-size: 31.9px; }
.fs145 { font-size: 33.1px; }
.fs15  { font-size: 34.2px; }
.fs155 { font-size: 35.4px; }
.fs16  { font-size: 36.5px; }
/* colors */
.mut { color: var(--muted); }
.c-navy { color: var(--navy); }
.c-blue { color: var(--blue); }
.c-madder { color: var(--madder); }
.c-madder-deep { color: var(--madder-deep); }
.c-gold-soft { color: var(--gold-soft); }
.b { font-weight: 700; }
.it { font-style: italic; }
.ctr { text-align: center; }
/* CJK phrase-aware line breaking ≈ deck.typ jp() boxing */
section.slide { word-break: auto-phrase; }

/* card titles at common Typst sizes */
.t.t17 { font-size: 38.8px; }
.t.t18 { font-size: 41px; }
.t.t19 { font-size: 43.3px; }
.t.t20 { font-size: 45.6px; }
.t { display: block; line-height: 1.45; }
.t.inline { display: inline; }

/* vertical rhythm helpers (Typst #v) */
.v2 { height: 4.6px; } .v3 { height: 6.8px; } .v4 { height: 9.1px; }
.v5 { height: 11.4px; } .v6 { height: 13.7px; } .v7 { height: 16px; }
.v8 { height: 18.2px; } .v9 { height: 20.5px; } .v10 { height: 22.8px; }
.v12 { height: 27.4px; }

/* two-column fact grid (label right-aligned / value left) */
.facts {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gutter: 0;
  gap: 16px 23px;
  align-items: center;
}
.facts .k { text-align: right; font-weight: 700; }

/* inline command box (morphdb slide) */
.cmd {
  display: block;
  background: linear-gradient(120deg, #13202c, #0a1622);
  border-radius: 14px;
  padding: 11px 21px;
  font-family: var(--font-mono);
  font-size: 27.4px;
  color: #e6edf3;
  line-height: 1.4;
  box-shadow: inset 0 0 0 1.5px #233444, 0 6px 16px rgba(2, 18, 37, 0.18);
}

/* light stat row cell (ecosystem slide B) */
.eco-stat {
  background: var(--grad-soft-blue);
  border: 2px solid var(--warm-line);
  border-radius: 20.5px;
  padding: 11.4px 20.5px;
  width: 100%;
  box-shadow: 0 6px 16px rgba(2, 18, 37, 0.06);
}
.eco-stat .label { display: block; font-size: 27.4px; font-weight: 700; color: var(--muted); line-height: 1.3; }
.eco-stat .value { display: block; font-size: 36.5px; font-weight: 700; color: var(--blue); line-height: 1.35; }

/* valency derivation table (morphdb) */
table.val { border-collapse: collapse; width: 100%; }
table.val th, table.val td { padding: 6.8px 18px; text-align: left; font-size: 29.6px; line-height: 1.4; }
table.val th { color: var(--navy); font-weight: 700; border-bottom: 1.8px solid var(--madder-line); }
table.val td { border-bottom: 1.1px solid var(--warm-line); }
table.val td.num { text-align: center; font-size: 34.2px; font-weight: 700; color: var(--navy); }
table.val td.num.madder { color: var(--madder-deep); }
table.val tr:last-child td { border-bottom: 1.1px solid var(--warm-line); }

/* entity card (sources slide 1) */
.ent-card {
  background: var(--ivory);
  border: 1.8px solid var(--warm-line);
  border-radius: 16px;
  padding: 11.4px 20.5px;
  box-shadow: 0 4px 12px rgba(2, 18, 37, 0.05);
}
.ent-card .name { display: block; font-size: 30.8px; font-weight: 700; color: var(--navy); line-height: 1.4; }
.ent-card .desc { display: block; font-size: 26.2px; color: var(--muted); line-height: 1.4; }

/* 提案→検証→確定 flow card (sources slide 3) */
.flow-card {
  background: var(--ivory);
  border-radius: 20.5px;
  padding: 20.5px 22.8px;
  flex: 1 1 0;
  min-width: 0;
  box-shadow: 0 8px 20px rgba(2, 18, 37, 0.08), 0 2px 5px rgba(2, 18, 37, 0.05);
}
.flow-card.madder { border: 2.3px solid var(--madder); }
.flow-card.navy { border: 2.3px solid var(--navy); }
.flow-card.gold { border: 2.3px solid #b29760; }
.flow-card .who { font-size: 26.2px; color: var(--muted); font-weight: 700; }
.flow-arrow { font-size: 59px; color: var(--madder); font-weight: 700; align-self: center; }

/* slim footer strip (sources) */
.slim-strip {
  display: block;
  background: linear-gradient(100deg, var(--deep-navy), var(--navy) 55%, #1d4a87);
  border-radius: 16px;
  padding: 18.2px 29.6px;
  color: #fff;
  font-size: 33.1px;
  font-weight: 700;
  line-height: 1.5;
  box-shadow: 0 12px 30px rgba(2, 18, 37, 0.2), 0 2px 8px rgba(2, 18, 37, 0.12);
}

/* grounding-step list (intro slide 3) */
.steps { text-align: left; }
.steps .arrow { display: block; text-align: center; color: var(--madder); font-size: 29.6px; line-height: 1.2; padding: 9px 0; }

/* qr panel (thanks) */
.qr-panel {
  background: rgba(248, 245, 239, 0.96);
  border: 2px solid var(--warm-line);
  border-radius: 25px;
  padding: 23px 18px;
  text-align: center;
  flex: 1 1 0;
  min-width: 0;
  box-shadow: 0 10px 28px rgba(2, 18, 37, 0.07), 0 2px 7px rgba(2, 18, 37, 0.04);
}
.qr-panel .lbl { display: block; font-size: 34.2px; font-weight: 700; color: var(--blue); line-height: 1.3; }
.qr-panel img { display: block; width: 178px; height: 178px; margin: 16px auto 10px; }
.qr-panel .note { display: block; font-size: 27.4px; color: var(--muted); line-height: 1.3; }

/* ------------------------------------------------------------ hud / nav */
#hud {
  position: fixed;
  right: 18px;
  bottom: 12px;
  z-index: 9;
  font-family: var(--font-body);
  font-size: 22px;
  color: var(--muted);
  background: rgba(248, 245, 239, 0.65);
  border-radius: 12px;
  padding: 2px 14px;
  user-select: none;
  font-weight: 700;
}

/* ------------------------------------------------------------ print mode */
body.print { background: #1c1c1a; }
body.print section.slide {
  display: block;
  position: relative;
  left: 0;
  top: 0;
  transform: none;
  margin: 24px auto;
}
body.print #hud { display: none; }

@media print {
  @page { size: 1920px 1080px; margin: 0; }
  html, body { background: #fff; }
  section.slide {
    display: block;
    position: relative;
    left: 0;
    top: 0;
    transform: none;
    margin: 0;
    page-break-after: always;
    break-after: page;
  }
  section.slide:last-of-type { page-break-after: auto; break-after: auto; }
  #hud { display: none; }
}