/* ============================================================
   k05-protractor（量角器大師）v2 風格覆寫｜年齡層：kids
   自訂屬性→權杖對應簡表：
   --c-bg→--tp-bg；--c-surface→--tp-surface；--c-line→--tp-line；
   --c-ink→--tp-text；--c-ink-soft→--tp-text-soft；
   --c-primary 系→--tp-accent 系；--c-teal 系→--tp-subject-math 系；
   --c-rose 系→--tp-error 系；--c-good→--tp-success；
   圓角→--tp-radius-*；陰影→--tp-shadow-*；字體→--tp-font-sans。
   ============================================================ */

/* 一、自訂屬性整批轉向權杖（深色隨權杖自動切換） */
html[data-tp-theme="v2"]:root {
  --c-primary: var(--tp-accent-strong);
  --c-primary-dark: var(--tp-accent-strong);
  --c-primary-soft: var(--tp-accent-soft);
  --c-teal: var(--tp-subject-math);
  --c-teal-dark: var(--tp-subject-math);
  --c-teal-soft: var(--tp-subject-math-soft);
  --c-rose: var(--tp-error);
  --c-rose-dark: var(--tp-error);
  --c-rose-soft: var(--tp-error-soft);
  --c-ink: var(--tp-text);
  --c-ink-soft: var(--tp-text-soft);
  --c-line: var(--tp-line);
  --c-bg: var(--tp-bg);
  --c-surface: var(--tp-surface);
  --c-good: var(--tp-success);
  --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"] body {
  background-image: radial-gradient(circle, var(--tp-accent-soft) 1.1px, transparent 1.2px);
}
html[data-tp-theme="v2"] ::selection {
  background: var(--tp-accent-soft);
}
html[data-tp-theme="v2"] :focus-visible,
html[data-tp-theme="v2"] .figure:focus-visible {
  outline-color: var(--tp-focus-ring);
}
html[data-tp-theme="v2"] .card {
  border-color: var(--tp-line);
}
html[data-tp-theme="v2"] .btn {
  background: var(--tp-accent-strong);
  color: var(--tp-accent-on);
  border-radius: var(--tp-radius-ctl);
}
html[data-tp-theme="v2"] .btn:hover {
  background: var(--tp-accent-strong);
}
html[data-tp-theme="v2"] .btn.teal {
  background: var(--tp-subject-math);
  color: var(--tp-accent-on);
}
html[data-tp-theme="v2"] .btn.teal:hover {
  background: color-mix(in srgb, var(--tp-subject-math) 85%, #000000);
}
html[data-tp-theme="v2"] .pick,
html[data-tp-theme="v2"] .text-input,
html[data-tp-theme="v2"] .choice,
html[data-tp-theme="v2"] .num-row input,
html[data-tp-theme="v2"] .map-item {
  border-radius: var(--tp-radius-ctl);
}
html[data-tp-theme="v2"] .pick input {
  accent-color: var(--tp-accent-strong);
}
html[data-tp-theme="v2"] .pick.on {
  border-color: var(--tp-accent-strong);
  background: var(--tp-accent-soft);
}
html[data-tp-theme="v2"] .text-input,
html[data-tp-theme="v2"] .choice,
html[data-tp-theme="v2"] .num-row input {
  background: var(--tp-surface);
}
html[data-tp-theme="v2"] .bar {
  background: var(--tp-bg-deep);
}
html[data-tp-theme="v2"] .figure-wrap {
  background-image: linear-gradient(var(--tp-surface), var(--tp-surface-2));
}
html[data-tp-theme="v2"] .feedback.good {
  background: var(--tp-success-soft);
  color: var(--tp-success);
}
html[data-tp-theme="v2"] .feedback.hint {
  background: var(--tp-warning-soft);
  color: var(--tp-warning);
}
html[data-tp-theme="v2"] .map-item {
  background: var(--tp-surface-2);
}
html[data-tp-theme="v2"] .paper {
  background: var(--tp-surface);
  color: var(--tp-text);
}
html[data-tp-theme="v2"] .paper-brand,
html[data-tp-theme="v2"] .paper-foot {
  color: var(--tp-text-soft);
}