/* app13-divide（除法森林）— v2 風格覆寫；年齡層：kids（朱砂強調、大圓角、溫暖圓潤）。
   對應簡表：--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-dark→--tp-accent-strong、--c-primary-soft→--tp-accent-soft、
   --c-accent→--tp-warning、--c-accent-dark→--tp-warning、--c-accent-soft→--tp-warning-soft、
   --c-berry→--tp-error、--c-berry-soft→--tp-error-soft、--c-ok→--tp-success、--c-warn→--tp-warning、
   --font→--tp-font-sans；圓角與陰影對應 --tp-radius-* 與 --tp-shadow-*。 */

/* 主軸：把 App 自訂屬性整批改指向 v2 權杖，深色自動對齊 */
html[data-tp-theme="v2"]:root {
  --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-primary: var(--tp-accent-strong);
  --c-primary-dark: var(--tp-accent-strong);
  --c-primary-soft: var(--tp-accent-soft);
  --c-accent: var(--tp-warning);
  --c-accent-dark: var(--tp-warning);
  --c-accent-soft: var(--tp-warning-soft);
  --c-berry: var(--tp-error);
  --c-berry-soft: var(--tp-error-soft);
  --c-ok: var(--tp-success);
  --c-warn: var(--tp-warning);
  --shadow: var(--tp-shadow-2);
  --shadow-sm: var(--tp-shadow-1);
  --r-sm: var(--tp-radius-ctl);
  --r: var(--tp-radius-card);
  --r-lg: var(--tp-radius-xl);
  --font: var(--tp-font-sans);
}

/* 標題字體與字重對齊 kids 層 */
html[data-tp-theme="v2"] h1,
html[data-tp-theme="v2"] h2,
html[data-tp-theme="v2"] h3 {
  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: 3px solid var(--tp-focus-ring);
  outline-color: var(--tp-focus-ring);
}

/* body 背景裝飾暈染保留結構、色調換成 v2 淺底系 */
html[data-tp-theme="v2"] body {
  background-image:
    radial-gradient(ellipse 55% 32% at 0% 0%, var(--tp-accent-soft) 0%, transparent 70%),
    radial-gradient(ellipse 42% 28% at 100% 0%, var(--tp-warning-soft) 0%, transparent 68%);
}

/* 吸頂列寫死底色改跟背景權杖 */
html[data-tp-theme="v2"] .topbar {
  background: var(--tp-bg);
}

/* 寫死白字（主色底上）改 --tp-accent-on */
html[data-tp-theme="v2"] .btn-primary,
html[data-tp-theme="v2"] .btn-berry,
html[data-tp-theme="v2"] .tabs button[aria-selected="true"] {
  color: var(--tp-accent-on);
}
html[data-tp-theme="v2"] .btn-accent:hover {
  background: var(--tp-warning);
}

/* 寫死 #fff 的控制項與列表改跟表面權杖 */
html[data-tp-theme="v2"] .choices button,
html[data-tp-theme="v2"] .seed-input,
html[data-tp-theme="v2"] .answer-input,
html[data-tp-theme="v2"] .keys button,
html[data-tp-theme="v2"] .history li {
  background: var(--tp-surface);
}

/* 進度條軌道寫死米色改跟深一階背景 */
html[data-tp-theme="v2"] .progress {
  background: var(--tp-bg-deep);
}

/* 未得星星與揭曉提示的寫死色 */
html[data-tp-theme="v2"] .star path {
  fill: var(--tp-line);
}
html[data-tp-theme="v2"] .banner.reveal {
  border-color: var(--tp-error);
}

/* D2d 對比補修（1151001）。 */
/* 琥珀鈕：深琥珀底配墨字只有 3.17:1（深色模式淺字配亮琥珀 1.6:1）；改科目淺底配主題文字色並以琥珀描邊，亮暗兩色皆 >= 4.5:1。 */
html[data-tp-theme="v2"] .btn-accent {
  background: var(--tp-warning-soft);
  color: var(--tp-text);
  border-color: var(--tp-warning);
}

html[data-tp-theme="v2"] .btn-accent:hover {
  background: var(--tp-bg-deep);
}