/* k25-vertical-arith（直式計算教練） kids 層 v2 風格覆寫。
   基底對應：--c-bg→--tp-bg；--c-surface→--tp-surface；--c-ink→--tp-text；--c-ink-soft→--tp-text-soft；--c-line→--tp-line。
   主色對應：--c-primary→--tp-accent；--c-primary-deep→--tp-accent-text；--c-hat→--tp-amber。
   輔色對應：--c-accent→--tp-subject-en；--c-accent-2→--tp-subject-math。
   語意對應：--c-good→--tp-success；--c-good-bg→--tp-success-soft；--c-bad→--tp-error；--c-bad-bg→--tp-error-soft；--c-carry→--tp-warning-soft；--c-given→--tp-bg-deep。
   形狀對應：--radius-sm→--tp-radius-ctl；--radius→--tp-radius-card；--radius-lg→--tp-radius-xl；--shadow→--tp-shadow-2；--shadow-soft→--tp-shadow-1；--font→--tp-font-sans。*/

html[data-tp-theme="v2"]:root {
  --c-primary: var(--tp-accent-strong);
  --c-primary-deep: var(--tp-accent-text);
  --c-accent: var(--tp-subject-en);
  --c-accent-2: var(--tp-subject-math);
  --c-hat: var(--tp-amber);
  --c-bg: var(--tp-bg);
  --c-surface: var(--tp-surface);
  --c-ink: var(--tp-text);
  --c-ink-soft: var(--tp-text-soft);
  --c-line: var(--tp-line);
  --c-good: var(--tp-success);
  --c-good-bg: var(--tp-success-soft);
  --c-bad: var(--tp-error);
  --c-bad-bg: var(--tp-error-soft);
  --c-carry: var(--tp-warning-soft);
  --c-given: var(--tp-bg-deep);
  --radius-sm: var(--tp-radius-ctl);
  --radius: var(--tp-radius-card);
  --radius-lg: var(--tp-radius-xl);
  --shadow: var(--tp-shadow-2);
  --shadow-soft: var(--tp-shadow-1);
  --font: var(--tp-font-sans);
}

html[data-tp-theme="v2"] h1,
html[data-tp-theme="v2"] h2 {
  font-family: var(--tp-font-serif);
  font-weight: var(--tp-display-weight);
}

html[data-tp-theme="v2"] ::selection {
  background: var(--tp-accent-soft);
  color: var(--tp-text);
}

html[data-tp-theme="v2"] :focus-visible {
  outline-color: var(--tp-focus-ring);
}

/* body 點狀底紋保留，色調換朱砂淺底系 */
html[data-tp-theme="v2"] body {
  background-image: radial-gradient(var(--tp-accent-soft) 1.1px, transparent 1.1px);
}

/* 寫死的白面改為主題卡片面 */
html[data-tp-theme="v2"] .choice,
html[data-tp-theme="v2"] .seg button,
html[data-tp-theme="v2"] .chip,
html[data-tp-theme="v2"] .cell.in,
html[data-tp-theme="v2"] .pad button,
html[data-tp-theme="v2"] .paper {
  background: var(--tp-surface);
}

/* 寫死的米色底，換主題深一階背景 */
html[data-tp-theme="v2"] .blurb,
html[data-tp-theme="v2"] .cell.is-locked {
  background: var(--tp-bg-deep);
}

/* 按下的圖示鈕寫死淺橘底，換主色淺底 */
html[data-tp-theme="v2"] .icon-btn[aria-pressed="true"] {
  background: var(--tp-accent-soft);
}

/* 輸入格寫死框線，換主題邊線 */
html[data-tp-theme="v2"] .cell.in {
  border-color: var(--tp-line);
}

/* 目前步驟的藍色光暈，換墨藍淺底權杖 */
html[data-tp-theme="v2"] .cell.is-current {
  box-shadow: 0 0 0 3px var(--tp-subject-math-soft);
}

/* 主色底上的寫死白字 */
html[data-tp-theme="v2"] .btn,
html[data-tp-theme="v2"] .choice.primary,
html[data-tp-theme="v2"] .choice.primary span,
html[data-tp-theme="v2"] .ghost-digit,
html[data-tp-theme="v2"] .seg button[aria-pressed="true"],
html[data-tp-theme="v2"] .chip[aria-pressed="true"] {
  color: var(--tp-accent-on);
}

/* 次要鈕白底改主題面，字色回主題墨色 */
html[data-tp-theme="v2"] .btn.secondary {
  background: var(--tp-surface);
  color: var(--tp-text);
}

/* 吸底操作列寫死的米白半透明底，換主題背景 */
html[data-tp-theme="v2"] .action-bar {
  background: var(--tp-bg);
}

/* D2d 對比補修（1151001）。 */
/* 面底（特異性較高）蓋掉 .choice.primary 與按下態的主色底，白字落在白底上；.btn 白字蓋掉 .btn.ghost 的字色；補回（kids 層用深一階 accent 底色）。 */
html[data-tp-theme="v2"] .choice.primary,
html[data-tp-theme="v2"] .seg button[aria-pressed="true"],
html[data-tp-theme="v2"] .chip[aria-pressed="true"] {
  background: var(--tp-accent-strong);
  border-color: var(--tp-accent-strong);
}

html[data-tp-theme="v2"] .btn.ghost {
  color: var(--tp-accent-text);
}
