/* jr08-english-grammar（文法拆解室）｜年齡層：junior
   對應簡表：--ink→--tp-text、--ink-soft→--tp-text-soft、--muted→--tp-text-faint、--line→--tp-line
   --paper→--tp-bg、--paper-2→--tp-bg-deep、--card→--tp-surface
   --primary→--tp-accent、--primary-2→--tp-accent-strong、--on-primary→--tp-accent-on、--accent→--tp-accent-text
   --sage、--ok→--tp-success；--bad→--tp-error；--hint→--tp-warning；各 soft 階同理
   --radius→--tp-radius-card、--radius-sm→--tp-radius-ctl、--shadow→--tp-shadow-2、--shadow-sm→--tp-shadow-1、--font→--tp-font-sans */
html[data-tp-theme="v2"]:root {
  --ink: var(--tp-text);
  --ink-soft: var(--tp-text-soft);
  --muted: var(--tp-text-soft);
  --paper: var(--tp-bg);
  --paper-2: var(--tp-bg-deep);
  --card: var(--tp-surface);
  --primary: var(--tp-accent);
  --primary-2: var(--tp-accent-strong);
  --on-primary: var(--tp-accent-on);
  --accent: var(--tp-accent-text);
  --accent-soft: var(--tp-accent-soft);
  --sage: var(--tp-success);
  --sage-soft: var(--tp-success-soft);
  --line: var(--tp-line);
  --ok: var(--tp-success);
  --ok-soft: var(--tp-success-soft);
  --bad: var(--tp-error);
  --bad-soft: var(--tp-error-soft);
  --hint: var(--tp-warning);
  --hint-soft: var(--tp-warning-soft);
  --radius: var(--tp-radius-card);
  --radius-sm: var(--tp-radius-ctl);
  --shadow: var(--tp-shadow-2);
  --shadow-sm: var(--tp-shadow-1);
  --font: var(--tp-font-sans);
}
/* 寫死色碼覆寫 */
html[data-tp-theme="v2"] .topbar { background-color: var(--tp-bg); }
html[data-tp-theme="v2"] ::selection { background-color: var(--tp-accent-soft); }
html[data-tp-theme="v2"] :focus-visible { outline-color: var(--tp-accent); }
/* 模式卡：accent 變體與主按鈕同走年齡層強調色 */
html[data-tp-theme="v2"] .mode.accent {
  background-color: var(--tp-accent);
  border-color: var(--tp-accent);
  color: var(--tp-accent-on);
}
html[data-tp-theme="v2"] .mode.primary span,
html[data-tp-theme="v2"] .mode.accent span { color: var(--tp-accent-on); opacity: 0.9; }
/* 關卡編號保留科目識別色（英語） */
html[data-tp-theme="v2"] .stage-no { background-color: var(--tp-subject-en-soft); color: var(--tp-subject-en); }
/* 白底元件改吃表面權杖 */
html[data-tp-theme="v2"] table.cmp,
html[data-tp-theme="v2"] .stem,
html[data-tp-theme="v2"] .chip,
html[data-tp-theme="v2"] .opt,
html[data-tp-theme="v2"] .order-zone,
html[data-tp-theme="v2"] .check,
html[data-tp-theme="v2"] .calc-grid button { background-color: var(--tp-surface); }
html[data-tp-theme="v2"] input[type="text"],
html[data-tp-theme="v2"] input[type="number"],
html[data-tp-theme="v2"] textarea,
html[data-tp-theme="v2"] select { background-color: var(--tp-surface); color: var(--tp-text); caret-color: var(--tp-accent); }
/* 選取態跟 accent */
html[data-tp-theme="v2"] .opt[aria-pressed="true"] { background-color: var(--tp-accent-soft); border-color: var(--tp-accent); }
html[data-tp-theme="v2"] .token { background-color: var(--tp-accent-soft); border-color: var(--tp-accent); }
html[data-tp-theme="v2"] .token[aria-pressed="true"] {
  background-color: var(--tp-accent);
  border-color: var(--tp-accent);
  color: var(--tp-accent-on);
}
/* 回饋框邊線對齊語意色 */
html[data-tp-theme="v2"] .feedback.ok { border-color: var(--tp-success); }
html[data-tp-theme="v2"] .feedback.hint { border-color: var(--tp-warning); }
html[data-tp-theme="v2"] .feedback.bad { border-color: var(--tp-error); }
/* 書寫格線顏色對齊邊線權杖 */
html[data-tp-theme="v2"] .write-lines { background-image: repeating-linear-gradient(to bottom, transparent, transparent 30px, var(--tp-line) 31px); }