/* Trí Lữ Design Tokens V1 — shared values for new learning interfaces. */
:root {
  --tl-font-ui:"Avenir Next","Be Vietnam Pro",system-ui,-apple-system,sans-serif;
  --tl-font-jp:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;
  --tl-font-shodo:"YuKyokasho","Klee","Hiragino Mincho ProN","Noto Serif JP",serif;
  --tl-font-mono:"JetBrains Mono",ui-monospace,monospace;

  --tl-ink:#172833;
  --tl-ink-soft:#52616a;
  --tl-seal:#a53b2e;
  --tl-sepia:#80582f;
  --tl-paper:rgba(255,252,244,.70);
  --tl-paper-soft:rgba(245,240,228,.54);
  --tl-glass:rgba(250,252,249,.64);
  --tl-glass-strong:rgba(250,252,249,.82);
  --tl-glass-border:rgba(255,255,255,.62);
  --tl-hair:color-mix(in srgb,var(--tl-ink) 16%,transparent);
  --tl-wash:rgba(165,59,46,.075);
  --tl-focus:#1f7087;
  --tl-success:#34745a;
  --tl-danger:#a53b2e;

  --tl-subject-math:#5667a8;
  --tl-subject-physics:#287d8e;
  --tl-subject-chemistry:#a36a2d;
  --tl-subject-biology:#4d7658;
  --tl-subject-japanese:#a53b2e;

  --tl-space-1:4px;
  --tl-space-2:8px;
  --tl-space-3:12px;
  --tl-space-4:18px;
  --tl-space-5:26px;
  --tl-space-6:38px;
  --tl-space-7:52px;
  --tl-space-8:72px;

  --tl-radius-control:12px;
  --tl-radius-panel:22px;
  --tl-radius-surface:28px;
  --tl-control-min:44px;
  --tl-control-primary:50px;
  --tl-menu-level1-max:6;
  --tl-blur:18px;
  --tl-shadow:0 24px 64px rgba(23,40,51,.15),inset 0 1px rgba(255,255,255,.66);

  --tl-text-meta:11px;
  --tl-text-body:16px;
  --tl-text-body-large:18px;
  --tl-text-jp:24px;
  --tl-text-title:clamp(38px,4.5vw,60px);
}

html[data-mode="dark"],html[data-theme="dark"] {
  --tl-ink:#f0eee6;
  --tl-ink-soft:#bec6c8;
  --tl-seal:#e88977;
  --tl-sepia:#d4b075;
  --tl-paper:rgba(8,26,43,.72);
  --tl-paper-soft:rgba(5,18,30,.56);
  --tl-glass:rgba(5,18,30,.64);
  --tl-glass-strong:rgba(5,18,30,.84);
  --tl-glass-border:rgba(255,255,255,.16);
  --tl-hair:rgba(210,235,248,.19);
  --tl-wash:rgba(232,137,119,.09);
  --tl-focus:#78c9db;
  --tl-shadow:0 26px 68px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.07);
}

@media (prefers-reduced-transparency:reduce) {
  :root { --tl-blur:0px; }
}

@media (prefers-reduced-motion:reduce) {
  :root { scroll-behavior:auto; }
}