/* 大樹神獸 — generated from tokens.json */
/* 字體：<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;700;900&family=Noto+Serif+TC:wght@700;900&display=swap"> */
:root {
  --surface: var(--ink-100);
  --surface-raised: var(--ink-50);
  --surface-sunken: var(--ink-200);
  --text: var(--ink-900);
  --text-muted: var(--ink-600);
  --outline: var(--ink-900);
  --line: var(--ink-300);
  --action: var(--red-500);
  --action-pressed: var(--red-600);
  --on-action: var(--ink-50);
  --brand: var(--green-500);
  --brand-strong: var(--green-800);
  --brand-text: var(--green-600);
  --honor: var(--gold-400);
  --honor-text: var(--gold-700);
  --honor-on-dark: var(--gold-300);
  --focus-ring: var(--green-700);
  --green-50: #eef5ef;
  --green-100: #d3e6d6;
  --green-200: #a9cfb0;
  --green-300: #76ae82;
  --green-400: #4e9160;
  --green-500: #3f7a4a;
  --green-600: #336540;
  --green-700: #2a5236;
  --green-800: #203f2a;
  --green-900: #162c1e;
  --red-50: #fbefec;
  --red-100: #f3d5cf;
  --red-200: #e5aba0;
  --red-300: #d07c6c;
  --red-400: #bc5544;
  --red-500: #a63a2b;
  --red-600: #8e3124;
  --red-700: #73281e;
  --red-800: #581f17;
  --red-900: #3d1610;
  --gold-50: #faf4e6;
  --gold-100: #f1e3bf;
  --gold-200: #e4cd92;
  --gold-300: #d6b76c;
  --gold-400: #c9a04e;
  --gold-500: #ad863a;
  --gold-600: #8c6b2e;
  --gold-700: #6c5224;
  --gold-800: #4e3b1b;
  --gold-900: #332612;
  --ink-50: #fcfaf5;
  --ink-100: #f7f2e8;
  --ink-200: #ede6d8;
  --ink-300: #ddd4c3;
  --ink-400: #bdb3a1;
  --ink-500: #948a79;
  --ink-600: #6e6557;
  --ink-700: #514a40;
  --ink-800: #38332c;
  --ink-900: #26231f;
  --state-ok: #3f7a4a;
  --state-ok-text: #336540;
  --state-ok-bg: #e3f0e5;
  --state-watch: #ffd21f;
  --state-watch-text: #6f6210;
  --state-watch-bg: #f4efcf;
  --state-notice: #e2661b;
  --state-notice-text: #a8460c;
  --state-notice-bg: #fde9da;
  --state-keep: #2e6491;
  --state-keep-bg: #e3edf6;
  --state-move: #75508f;
  --state-move-bg: #eee6f3;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-pill: 999px;
  --stroke-fine: 2px;
  --stroke-ui: 3px;
  --stroke-bold: 4px;
  --stroke-hero: 5px;
  --target-min: 48px;
  --button-height: 54px;
  --marker-size: 44px;
  --font-display: "Noto Serif TC", "Songti TC", "PMingLiU", serif;
  --font-sans: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif;
}
.display { font-family: var(--font-display); font-size: 48px; line-height: 56px; font-weight: 900; letter-spacing: 0.04em; }
.title-lg { font-family: var(--font-display); font-size: 32px; line-height: 40px; font-weight: 900; }
.plaque { font-family: var(--font-display); font-size: 24px; line-height: 32px; font-weight: 900; letter-spacing: 0.15em; }
.title-sm { font-family: var(--font-display); font-size: 20px; line-height: 28px; font-weight: 700; }
.body-lg { font-family: var(--font-sans); font-size: 18px; line-height: 28px; font-weight: 500; }
.body { font-family: var(--font-sans); font-size: 16px; line-height: 26px; font-weight: 400; }
.button { font-family: var(--font-sans); font-size: 19px; line-height: 24px; font-weight: 900; }
.label { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 700; letter-spacing: 0.04em; }
.caption { font-family: var(--font-sans); font-size: 13px; line-height: 20px; font-weight: 400; }
