/* c1-gsat-english（學測英文）v2 風格覆寫；年齡層 more。 */
/* 對應：--desk→--tp-bg-deep、--paper→--tp-bg、--sheet→--tp-surface、--ink→--tp-text、 */
/* --muted→--tp-text-soft、--line→--tp-line、--pen→--tp-accent、--pen-soft→--tp-accent-soft、 */
/* --ok→--tp-success、--ok-soft→--tp-success-soft、--scrim→--tp-ink。 */
/* 主操作用深藍強調，品牌識別用 --tp-subject-en；答錯與危險態改錯誤紅。 */

/* ---- 自訂屬性改指權杖（特異性高於 App 的 html.dark，深色自動對齊） ---- */
html[data-tp-theme="v2"]:root {
  --desk: var(--tp-bg-deep);
  --paper: var(--tp-bg);
  --sheet: var(--tp-surface);
  --ink: var(--tp-text);
  --muted: var(--tp-text-soft);
  --line: var(--tp-line);
  --pen: var(--tp-accent);
  --pen-soft: var(--tp-accent-soft);
  --ok: var(--tp-success);
  --ok-soft: var(--tp-success-soft);
  --scrim: var(--tp-ink);
  color-scheme: light;
}
html[data-tp-theme="v2"][data-theme="dark"]:root { color-scheme: dark; }
@media (prefers-color-scheme: dark) {
  html[data-tp-theme="v2"]:not([data-theme="light"]):root { color-scheme: dark; }
}

/* ---- 字體：內文黑體、標題與 .serif 襯線 ---- */
html[data-tp-theme="v2"] body { font-family: var(--tp-font-sans); }
html[data-tp-theme="v2"] h1,
html[data-tp-theme="v2"] h2,
html[data-tp-theme="v2"] h3,
html[data-tp-theme="v2"] .serif { font-family: var(--tp-font-serif); }
html[data-tp-theme="v2"] :focus-visible { outline-color: var(--tp-focus-ring); }

/* ---- 分層：頁首、底列、導航用深一階邊線 ---- */
html[data-tp-theme="v2"] .top { border-bottom-color: var(--tp-line-strong); }
html[data-tp-theme="v2"] .dock,
html[data-tp-theme="v2"] .nav { border-top-color: var(--tp-line-strong); }

/* ---- 卡片：深邊線、無陰影、方正小圓角 ---- */
html[data-tp-theme="v2"] .stat,
html[data-tp-theme="v2"] .card,
html[data-tp-theme="v2"] .sheet,
html[data-tp-theme="v2"] .drill,
html[data-tp-theme="v2"] .wordlist,
html[data-tp-theme="v2"] .empty,
html[data-tp-theme="v2"] .qcard,
html[data-tp-theme="v2"] .result,
html[data-tp-theme="v2"] .review,
html[data-tp-theme="v2"] .weekbox,
html[data-tp-theme="v2"] .hist li,
html[data-tp-theme="v2"] .setting,
html[data-tp-theme="v2"] .badge,
html[data-tp-theme="v2"] .modal-card {
  border-color: var(--tp-line-strong);
  box-shadow: var(--tp-card-shadow);
}
html[data-tp-theme="v2"] .stat,
html[data-tp-theme="v2"] .card,
html[data-tp-theme="v2"] .sheet,
html[data-tp-theme="v2"] .drill,
html[data-tp-theme="v2"] .wordlist,
html[data-tp-theme="v2"] .empty,
html[data-tp-theme="v2"] .qcard,
html[data-tp-theme="v2"] .result,
html[data-tp-theme="v2"] .review,
html[data-tp-theme="v2"] .weekbox,
html[data-tp-theme="v2"] .hist li,
html[data-tp-theme="v2"] .setting,
html[data-tp-theme="v2"] .badge,
html[data-tp-theme="v2"] .modal-card { border-radius: var(--tp-radius-card); }
html[data-tp-theme="v2"] .btn,
html[data-tp-theme="v2"] .input,
html[data-tp-theme="v2"] .choice,
html[data-tp-theme="v2"] .heat,
html[data-tp-theme="v2"] .explain,
html[data-tp-theme="v2"] .bucket { border-radius: var(--tp-radius-ctl); }
html[data-tp-theme="v2"] .chip,
html[data-tp-theme="v2"] .pill { border-radius: var(--tp-radius-chip); }

/* ---- 品牌與識別：科目色（英語） ---- */
html[data-tp-theme="v2"] .mark {
  background: var(--tp-subject-en);
  color: var(--tp-accent-on);
  font-family: var(--tp-font-serif);
}
html[data-tp-theme="v2"] .kicker { color: var(--tp-subject-en); }
html[data-tp-theme="v2"] .pass-seal { border-color: var(--tp-subject-en); color: var(--tp-subject-en); }

/* ---- 主操作與選取態：深藍強調 ---- */
html[data-tp-theme="v2"] .sw.on { background: var(--tp-accent); }
html[data-tp-theme="v2"] .heat.today { box-shadow: 0 0 0 2px var(--tp-accent); }

/* ---- 答錯與危險態改錯誤紅（--pen 已改指強調藍，不再當錯誤色） ---- */
html[data-tp-theme="v2"] .choice.wrong {
  border-color: var(--tp-error);
  background: var(--tp-error-soft);
}
html[data-tp-theme="v2"] .danger { color: var(--tp-error); }

/* ---- 遮罩：App 寫死色碼，改為夜紙半透明，深淺色皆適用 ---- */
html[data-tp-theme="v2"] .modal,
html[data-tp-theme="v2"].dark .modal {
  background: color-mix(in srgb, var(--tp-night-deep) 55%, transparent);
}

/* ---- 主按鈕：墨色實心鈕與「開始模擬」横幅改主強調（--ink 仍保留給文字） ---- */
html[data-tp-theme="v2"] .btn.primary {
  background: var(--tp-accent);
  border-color: var(--tp-accent);
  color: var(--tp-accent-on);
}
html[data-tp-theme="v2"] .btn.primary:hover,
html[data-tp-theme="v2"] .btn.primary:active {
  background: var(--tp-accent-strong);
  border-color: var(--tp-accent-strong);
}
html[data-tp-theme="v2"] .mock {
  background: var(--tp-accent);
  color: var(--tp-accent-on);
}
html[data-tp-theme="v2"] .mock:hover,
html[data-tp-theme="v2"] .mock:active { background: var(--tp-accent-strong); }

/* ---- 被選取的分頁/切換鈕：墨色實心改主強調 ---- */
html[data-tp-theme="v2"] .chip.on,
html[data-tp-theme="v2"] .pill.on {
  background: var(--tp-accent);
  border-color: var(--tp-accent);
  color: var(--tp-accent-on);
}