/* app15-decimal（小數點精靈島）— v2 風格覆寫；年齡層：kids（朱砂強調、大圓角、溫暖圓潤）。
   對應簡表：--c-primary→--tp-accent、--c-primary-d→--tp-accent-strong、--c-accent→--tp-warning、--c-accent-d→--tp-warning、
   --c-accent-2→--tp-error、--c-accent-2-d→--tp-error、--c-bg→--tp-bg、--c-surface→--tp-surface、--c-ink→--tp-text、
   --c-muted→--tp-text-soft、--c-line→--tp-line、--c-mint→--tp-accent-soft、--c-pad→--tp-warning-soft、
   --c-ok→--tp-success、--c-ok-bg→--tp-success-soft、--c-warn→--tp-warning、--c-warn-bg→--tp-warning-soft、
   --c-bad→--tp-error、--c-bad-bg→--tp-error-soft、--font→--tp-font-sans；圓角陰影對應 --tp-radius-*／--tp-shadow-*。 */

/* 主軸：把 App 自訂屬性整批改指向 v2 權杖，深色自動對齊 */
html[data-tp-theme="v2"]:root {
  --c-primary: var(--tp-accent-strong);
  --c-primary-d: var(--tp-accent-strong);
  --c-accent: var(--tp-warning);
  --c-accent-d: var(--tp-warning);
  --c-accent-2: var(--tp-error);
  --c-accent-2-d: var(--tp-error);
  --c-bg: var(--tp-bg);
  --c-surface: var(--tp-surface);
  --c-ink: var(--tp-text);
  --c-muted: var(--tp-text-soft);
  --c-line: var(--tp-line);
  --c-mint: var(--tp-accent-soft);
  --c-ok: var(--tp-success);
  --c-ok-bg: var(--tp-success-soft);
  --c-warn: var(--tp-warning);
  --c-warn-bg: var(--tp-warning-soft);
  --c-bad: var(--tp-error);
  --c-bad-bg: var(--tp-error-soft);
  --c-pad: var(--tp-warning-soft);
  --r-sm: var(--tp-radius-ctl);
  --r-md: var(--tp-radius-card);
  --r-lg: var(--tp-radius-xl);
  --r-pill: var(--tp-radius-pill);
  --sh-sm: var(--tp-shadow-1);
  --sh-md: var(--tp-shadow-2);
  --sh-lg: var(--tp-shadow-3);
  --font: var(--tp-font-sans);
}

/* 標題字體與字重對齊 kids 層 */
html[data-tp-theme="v2"] h1,
html[data-tp-theme="v2"] h2,
html[data-tp-theme="v2"] h3,
html[data-tp-theme="v2"] .title {
  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 方格底紋保留結構、色調換成主色淡階 */
html[data-tp-theme="v2"] body {
  background-image:
    linear-gradient(transparent 31px, color-mix(in srgb, var(--tp-accent-strong) 6%, transparent) 32px),
    linear-gradient(90deg, transparent 31px, color-mix(in srgb, var(--tp-accent-strong) 6%, transparent) 32px);
}

/* 吸頂列與品牌圓點的寫死色 */
html[data-tp-theme="v2"] .top {
  background: var(--tp-bg);
}
html[data-tp-theme="v2"] .logo-mark {
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--tp-warning) 45%, transparent);
}

/* 寫死白字（主色底上）改 --tp-accent-on */
html[data-tp-theme="v2"] .btn-primary,
html[data-tp-theme="v2"] .seg button[aria-pressed="true"],
html[data-tp-theme="v2"] .tabs [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"] input[type="text"],
html[data-tp-theme="v2"] input[type="number"],
html[data-tp-theme="v2"] select,
html[data-tp-theme="v2"] .choice,
html[data-tp-theme="v2"] .tcell,
html[data-tp-theme="v2"] .hcell,
html[data-tp-theme="v2"] .token,
html[data-tp-theme="v2"] .slot,
html[data-tp-theme="v2"] #exam-sheet,
html[data-tp-theme="v2"] .coin-f {
  background: var(--tp-surface);
}

/* 壹元硬幣寫死米色改跟警告淺底 */
html[data-tp-theme="v2"] .coin-y {
  background: var(--tp-warning-soft);
}

/* 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);
}

/* D2d 對比補修（1151001）。 */
/* 面底（特異性較高）蓋掉年級按鈕與分頁選取態的主色底；補回（kids 層用深一階 accent 底色）。 */
html[data-tp-theme="v2"] .seg button[aria-pressed="true"],
html[data-tp-theme="v2"] .tabs [aria-selected="true"] {
  background: var(--tp-accent-strong);
  border-color: var(--tp-accent-strong);
}
