/* ============================================================
   k13-english-sentences（英文句子工廠）v2 風格覆寫
   年齡層：kids；科目：英語（識別色 --tp-subject-en）
   自訂屬性→權杖對應簡表：
   ・--c-bg→--tp-bg、--c-surface→--tp-surface、--c-ink→--tp-text、--c-muted→--tp-text-soft、--c-line→--tp-line
   ・--c-primary／--c-primary-dark→accent 系（主按鈕、頁籤選取、字卡框）
   ・--c-secondary→--tp-subject-en（眉題、進度條、作答框）；--c-secondary-2→accent（焦點環、選取框）
   ・--c-good→--tp-success、--c-bad→--tp-error、--c-hint→--tp-warning
   ・--radius*→--tp-radius-ctl／-card／-xl；--shadow*→--tp-shadow-1／-2；--font→--tp-font-sans
   ============================================================ */

html[data-tp-theme="v2"]:root {
  --c-primary: var(--tp-accent-strong);
  --c-primary-dark: var(--tp-accent-strong);
  --c-secondary: var(--tp-subject-en);
  --c-secondary-2: var(--tp-accent-strong);
  --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-good: var(--tp-success);
  --c-bad: var(--tp-error);
  --c-hint: var(--tp-warning);
  --c-gold: var(--tp-warning-soft);
  --c-paper: var(--tp-bg-deep);
  --c-metal: var(--tp-text-faint);
  --radius-sm: var(--tp-radius-ctl);
  --radius: var(--tp-radius-card);
  --radius-lg: var(--tp-radius-xl);
  --shadow: var(--tp-shadow-2);
  --shadow-sm: var(--tp-shadow-1);
  --font: var(--tp-font-sans);
}

/* 背景：保留柔光暈染，換成權杖淺色階（深色自動換夜間透明度色） */
html[data-tp-theme="v2"] body {
  background-color: var(--tp-bg);
  background-image:
    radial-gradient(circle at 8% 0%, var(--tp-accent-softer), transparent 28%),
    radial-gradient(circle at 100% 8%, var(--tp-subject-en-soft), transparent 26%);
}

/* 標題換襯線，孩子向大標更有份量 */
html[data-tp-theme="v2"] h1,
html[data-tp-theme="v2"] h2 {
  font-family: var(--tp-font-serif);
}

/* 主按鈕與次按鈕：底已指 accent／科目綠，字色統一 accent-on（深色自動反轉） */
html[data-tp-theme="v2"] .primary,
html[data-tp-theme="v2"] .secondary,
html[data-tp-theme="v2"] .tab[aria-selected="true"] {
  color: var(--tp-accent-on);
}

/* 白底控制項統一換表面色（深色跟著變夜間白面） */
html[data-tp-theme="v2"] .ghost,
html[data-tp-theme="v2"] .tab,
html[data-tp-theme="v2"] .choice,
html[data-tp-theme="v2"] .chip,
html[data-tp-theme="v2"] .seg label,
html[data-tp-theme="v2"] .tile,
html[data-tp-theme="v2"] input[type="text"] {
  background-color: var(--tp-surface);
}

/* 選取態：淺底跟 accent */
html[data-tp-theme="v2"] .choice[aria-pressed="true"] {
  background-color: var(--tp-accent-soft);
}

/* 作答框：科目英語綠淺底 */
html[data-tp-theme="v2"] .lane {
  background-color: var(--tp-subject-en-soft);
}

/* 進度條軌道 */
html[data-tp-theme="v2"] .bar {
  background-color: var(--tp-bg-deep);
}

/* 回饋框三態 */
html[data-tp-theme="v2"] .fb.ok {
  background-color: var(--tp-success-soft);
}
html[data-tp-theme="v2"] .fb.hint {
  background-color: var(--tp-warning-soft);
}
html[data-tp-theme="v2"] .fb.bad {
  background-color: var(--tp-error-soft);
}

/* 面板寫死的邊線色 */
html[data-tp-theme="v2"] .panel {
  border-color: var(--tp-line);
}

/* 列印學習單：白紙黑字改隨主題，仍保卡片感 */
html[data-tp-theme="v2"] .sheet {
  background-color: var(--tp-surface);
  color: var(--tp-text);
}
html[data-tp-theme="v2"] .sheet h2 {
  color: var(--tp-text);
}
html[data-tp-theme="v2"] .q-block {
  border-bottom-color: var(--tp-line);
}
html[data-tp-theme="v2"] .write-line {
  border-bottom-color: var(--tp-text);
}