/* ============================================================
   j02-history-timeline（歷史時光機）v2 風格覆寫——只覆寫，不改版面
   年齡層：junior（國中）；科目：社會·歷史（識別色 --tp-subject-soc）
   對應簡表：--paper→--tp-bg；--surface→--tp-surface；--ink→--tp-text；--ink-soft→--tp-text-soft
   --primary→--tp-accent；--primary-deep→--tp-accent-strong；--on-primary→--tp-accent-on
   --accent→--tp-accent；--accent-2→--tp-warning；--good→--tp-success；--bad→--tp-error；--hint→--tp-warning
   --r→--tp-radius-card；--r-sm→--tp-radius-ctl；--shadow→--tp-shadow-2；--font→--tp-font-sans
   ============================================================ */

html[data-tp-theme="v2"]:root {
  --ink: var(--tp-text);
  --ink-soft: var(--tp-text-soft);
  --paper: var(--tp-bg);
  --surface: var(--tp-surface);
  --primary: var(--tp-accent);
  --primary-deep: var(--tp-accent-strong);
  --on-primary: var(--tp-accent-on);
  --accent: var(--tp-accent);
  --accent-2: var(--tp-warning);
  --line: var(--tp-line);
  --good: var(--tp-success);
  --good-bg: var(--tp-success-soft);
  --bad: var(--tp-error);
  --bad-bg: var(--tp-error-soft);
  --hint: var(--tp-warning);
  --hint-bg: var(--tp-warning-soft);
  --shadow: var(--tp-shadow-2);
  --r: var(--tp-radius-card);
  --r-sm: var(--tp-radius-ctl);
  --font: var(--tp-font-sans);
  color-scheme: light dark;
}

/* 背景暈染改 accent 極淺階，底色隨 --paper 走 */
html[data-tp-theme="v2"] body {
  background-image: radial-gradient(900px 420px at 0% -10%, var(--tp-accent-softer), transparent 60%);
}

/* 標題換襯線 */
html[data-tp-theme="v2"] h1,
html[data-tp-theme="v2"] h2 {
  font-family: var(--tp-font-serif);
}

/* 眉題與 pill 為科目識別 */
html[data-tp-theme="v2"] .kicker {
  color: var(--tp-subject-soc);
}
html[data-tp-theme="v2"] .pill {
  background-color: var(--tp-subject-soc-soft);
  color: var(--tp-subject-soc);
}

/* 副主按鈕與主按鈕同 accent 系，hover 加深 */
html[data-tp-theme="v2"] .btn-accent {
  color: var(--tp-accent-on);
  border-color: var(--tp-accent-strong);
}
html[data-tp-theme="v2"] .btn-primary:hover,
html[data-tp-theme="v2"] .btn-accent:hover {
  background-color: var(--tp-accent-strong);
  border-color: var(--tp-accent-strong);
}

/* 寫死白底的輸入框改 surface */
html[data-tp-theme="v2"] input,
html[data-tp-theme="v2"] select {
  background-color: var(--tp-surface);
  color: var(--tp-text);
}

/* 排序握把寫死米色改深一階背景 */
html[data-tp-theme="v2"] .grip {
  background-color: var(--tp-bg-deep);
}

/* 配對與選項選中態改 accent 淺底 */
html[data-tp-theme="v2"] .match-btn.is-on,
html[data-tp-theme="v2"] .choice.is-on {
  background-color: var(--tp-accent-soft);
}

/* 練習卷寫死白底改 surface */
html[data-tp-theme="v2"] .sheet {
  background-color: var(--tp-surface);
}

/* 計算機螢幕：墨底紙字 */
html[data-tp-theme="v2"] .calc-screen {
  background-color: var(--tp-text);
  color: var(--tp-bg);
}