/* ============================================================
   RedTangle @ COSCUP 2026 — 「帳本紙 × 硃砂印 × 紅線」
   Design tokens
   ============================================================ */
:root {
  /* 紙與墨 */
  --paper:      #F7F6F1;  /* 帳本紙 */
  --paper-rule: #E7E4DA;  /* 帳本格線 */
  --card:       #FFFFFF;
  --ink:        #20242F;  /* 藍黑墨 */
  --ink-soft:   #5B5F6C;
  --ink-faint:  #9A9DA8;

  /* 題旨雙色：硬幣 vs 憑證 */
  --seal:       #C2402D;  /* 硃砂（憑證/信任/RedTangle）*/
  --seal-deep:  #9C2F20;
  --coin:       #9A7514;  /* 黃銅（硬幣/金流）文字級 */
  --coin-fill:  #C9A227;  /* 黃銅 填色級 */

  /* 圖譜輔色 */
  --tie:        #34608D;  /* 靛青（邊/連結/對照組）*/
  --dead:       #A6A398;  /* 收攤/墓碑 灰 */

  --f-display: "RT Serif TC", "Noto Serif TC", "Songti TC", "STSong", "PMingLiU", serif;
  --f-body: "RT Sans TC", "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", sans-serif;
  --f-mono: "SF Mono", ui-monospace, Menlo, Consolas, monospace;
}

/* ---------- 基底 ---------- */
.reveal-viewport {
  background: var(--paper);
  /* 帳本紙：極淡的直欄格線 */
  background-image:
    repeating-linear-gradient(90deg,
      transparent 0, transparent 79px,
      var(--paper-rule) 79px, var(--paper-rule) 80px);
}
.reveal { font-family: var(--f-body); font-size: 30px; color: var(--ink);
  line-break: strict; letter-spacing: .015em; -webkit-font-smoothing: antialiased; }
.reveal .slides section { text-align: left; padding: 0; }
.reveal p { line-height: 1.62; margin: 0 0 .6em; text-wrap: pretty; }
.reveal strong { color: var(--seal-deep); font-weight: 700; }
.reveal em { font-style: normal; color: var(--coin); }
.reveal a { color: var(--tie); text-decoration: none; border-bottom: 1px solid var(--tie); }

.reveal .progress { height: 4px; color: var(--seal); }
.reveal .controls { color: var(--seal); }
.reveal .slide-number { background: transparent; color: var(--ink-faint); font-family: var(--f-mono); font-size: 16px; }

/* ---------- 標題 ---------- */
.reveal h1, .reveal h2, .reveal h3 {
  font-family: var(--f-display);
  color: var(--ink);
  font-weight: 900;
  letter-spacing: .01em;
  text-wrap: balance;
  margin: 0 0 .5em;
}
.reveal h1 { font-size: 84px; line-height: 1.18; }
.reveal h2 { font-size: 54px; line-height: 1.25; }
.reveal h3 { font-size: 34px; line-height: 1.35; }

/* eyebrow：小標籤列 */
.eyebrow {
  display: flex; align-items: center; gap: 14px;
  font-family: var(--f-body); font-size: 20px; letter-spacing: .18em;
  color: var(--ink-soft); margin-bottom: 26px;
}
.eyebrow .rule { flex: 1; height: 1px; background: var(--paper-rule); }

/* ---------- 朱印 ---------- */
.stamp {
  display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 7px;
  background: var(--seal); color: #FBF6EE;
  font-family: var(--f-display); font-weight: 900; font-size: 26px;
  box-shadow: inset 0 0 0 2px rgba(251,246,238,.35), inset 0 0 14px rgba(0,0,0,.18);
  transform: rotate(-2deg);
}
.stamp.coin-stamp { background: var(--coin-fill); color: #3D2F05; }
.stamp.big { width: 108px; height: 108px; font-size: 62px; border-radius: 14px; }

/* ---------- 版面工具 ---------- */
.pad { padding: 64px 72px; box-sizing: border-box; height: 100%; display: flex; flex-direction: column; }
.pad > .grow { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.cols { display: flex; gap: 48px; align-items: stretch; }
.cols > * { flex: 1; min-width: 0; }
.pad > .grow.cols { flex-direction: row; align-items: center; }
.center-slide { text-align: center; align-items: center; }

.note-src { position: absolute; bottom: 20px; right: 28px; font-size: 15px; color: var(--ink-faint); font-family: var(--f-mono); }

/* 卡片 */
.card {
  background: var(--card); border: 1px solid var(--paper-rule); border-radius: 10px;
  padding: 26px 30px; box-shadow: 0 1px 0 rgba(32,36,47,.04);
}
.card h3 { margin-bottom: .35em; }
.card .kicker { font-size: 19px; letter-spacing: .14em; color: var(--ink-soft); margin-bottom: 10px; }

/* 大數字 stat */
.stat { display: flex; flex-direction: column; gap: 2px; }
.stat .num { font-family: var(--f-display); font-weight: 900; font-size: 72px; line-height: 1.05; color: var(--ink); font-variant-numeric: tabular-nums; }
.stat .num.seal { color: var(--seal); }
.stat .num.coin { color: var(--coin); }
.stat .lbl { font-size: 21px; color: var(--ink-soft); }

/* 表格 */
.reveal table.ledger { border-collapse: collapse; width: 100%; font-size: 24px; }
.reveal table.ledger th {
  font-family: var(--f-body); font-weight: 600; font-size: 20px; letter-spacing: .1em;
  color: var(--ink-soft); text-align: left; padding: 10px 18px;
  border-bottom: 2px solid var(--ink);
}
.reveal table.ledger td { padding: 12px 18px; border-bottom: 1px solid var(--paper-rule); vertical-align: top; }
.reveal table.ledger.dense { font-size: 21px; }
.reveal table.ledger.dense td { padding: 8px 14px; }
.reveal table.ledger.dense th { padding: 6px 14px; }
.reveal table.ledger.dense .st { font-size: 17px; padding: 2px 10px; }
.reveal table.ledger td.mono, .mono { font-family: var(--f-mono); font-size: 21px; }

/* 狀態符號 */
.st { font-size: 20px; padding: 3px 12px; border-radius: 999px; white-space: nowrap; }
.st.dead  { background: #ECEAE2; color: #6B6858; }
.st.zomb  { background: #F4E9D8; color: #8A6A1F; }
.st.alive { background: #E7EEE6; color: #3E6B3E; }

/* ---------- 時間線 ---------- */
.tl { position: relative; }
.tl .axis { position: absolute; left: 0; right: 0; top: 50%; height: 2px; background: var(--ink); }

/* ---------- 紅線（SVG 共用樣式） ---------- */
svg text { font-family: var(--f-body); }
svg .thread { stroke: var(--seal); fill: none; }
svg .node { fill: var(--card); stroke: var(--ink); stroke-width: 2; }
svg .node.seal { fill: var(--seal); stroke: var(--seal-deep); }
svg .lbl { fill: var(--ink); font-size: 20px; }
svg .lbl.soft { fill: var(--ink-soft); }

/* fragment 微調：半透明而不是消失，講到才點亮 */
.reveal .fragment.dim-until { opacity: .18; visibility: visible; transition: opacity .25s; }
.reveal .fragment.dim-until.visible { opacity: 1; }

/* 章節分隔頁 */
.divider { background: var(--ink); }
.divider .pad { color: #EDEBE4; }
.divider h2 { color: #F4F1E8; font-size: 72px; }
.divider .eyebrow { color: #B9B6AC; }
.divider .eyebrow .rule { background: #4A4E5A; }
.divider p { color: #C9C6BC; }

/* 講者備忘 */
.speaker-only { display: none; }

/* 不可在行尾拆開的詞 */
.nb { white-space: nowrap; }