/* j24-sci-units（科學記號與單位道場）｜年齡層：junior（墨藍強調、圓角收斂、參考書般俐落）。
   對應簡表：--ink→--tp-text；--ink-soft→--tp-text-soft；--paper→--tp-bg；--paper-2→--tp-bg-deep；--card→--tp-surface；--line→--tp-line。
   --primary→--tp-accent；--primary-2→--tp-accent-strong；--on-primary→--tp-accent-on。
   --bronze→--tp-warning；--bronze-soft→--tp-warning-soft；--gold→--tp-warning（保留原銅褐次強調角色）。
   --sage→--tp-success；--sage-soft→--tp-success-soft；--brick→--tp-error；--brick-soft→--tp-error-soft。
   --radius→--tp-radius-card；--radius-sm→--tp-radius-ctl；--shadow→--tp-shadow-1；--font→--tp-font-sans。 */

/* 一、自訂屬性整批改指 tp 權杖（深色自動對齊，不必另寫深色規則） */
html[data-tp-theme="v2"]:root {
  --ink: var(--tp-text);
  --ink-soft: var(--tp-text-soft);
  --paper: var(--tp-bg);
  --paper-2: var(--tp-bg-deep);
  --card: var(--tp-surface);
  --line: var(--tp-line);
  --primary: var(--tp-accent);
  --primary-2: var(--tp-accent-strong);
  --on-primary: var(--tp-accent-on);
  --bronze: var(--tp-warning);
  --bronze-soft: var(--tp-warning-soft);
  --sage: var(--tp-success);
  --sage-soft: var(--tp-success-soft);
  --brick: var(--tp-error);
  --brick-soft: var(--tp-error-soft);
  --gold: var(--tp-warning);
  --radius: var(--tp-radius-card);
  --radius-sm: var(--tp-radius-ctl);
  --shadow: var(--tp-shadow-1);
  --font: var(--tp-font-sans);
}

/* 二、標題換襯線字，字重走 junior 的 800 */
html[data-tp-theme="v2"] h1,
html[data-tp-theme="v2"] h2,
html[data-tp-theme="v2"] h3 {
  font-family: var(--tp-font-serif);
  font-weight: var(--tp-display-weight);
}

/* 三、body 頂部漸層保留，色調換成 accent 極淺底 */
html[data-tp-theme="v2"] body {
  background-image: linear-gradient(180deg, var(--tp-accent-softer), var(--tp-bg) 280px);
}

/* 四、sticky 頁首寫死半透明白，改 surface */
html[data-tp-theme="v2"] header { background: var(--tp-surface); }

/* 五、寫死 #fff 的輸入框改 surface；計算機底座寫死米色改深一階背景 */
html[data-tp-theme="v2"] select,
html[data-tp-theme="v2"] input[type="text"],
html[data-tp-theme="v2"] input[type="number"],
html[data-tp-theme="v2"] .textin {
  background: var(--tp-surface);
}
html[data-tp-theme="v2"] .calc { background: var(--tp-bg-deep); }

/* 六、選取與聚焦對齊（App 原本無 ::selection，補上；聚焦色由銅褐改 focus-ring） */
html[data-tp-theme="v2"] ::selection { background: var(--tp-accent-soft); }
html[data-tp-theme="v2"] button:focus-visible,
html[data-tp-theme="v2"] input:focus-visible,
html[data-tp-theme="v2"] select:focus-visible,
html[data-tp-theme="v2"] a:focus-visible {
  outline-color: var(--tp-focus-ring);
}