/* Generated from docs/design-system/tokens.json; run pnpm design:tokens. */
:root {
  --bg-page: #f2f5f3;
  --surface: #ffffff;
  --surface-sunken: #f7f9f8;
  --surface-hover: #ebf1ee;
  --line: #d1ddd6;
  --line-strong: #92aaa1;
  --line-control: #71867d;
  --ink: #18342e;
  --ink-muted: #4f665f;
  --ink-disabled: #8a9c95;
  --brand: #163f36;
  --brand-hover: #0e2d26;
  --on-brand: #ffffff;
  --brand-soft: #e2ede7;
  --brand-ink: var(--brand);
  --logo-word: var(--brand);
  --link: #1a6650;
  --focus: #b26325;
  --backdrop: #163f3660;
  --success: #2b8556;
  --success-ink: #1b6440;
  --success-soft: #e2f2e8;
  --warning: #a8701a;
  --warning-ink: #744a08;
  --warning-soft: #fbefd6;
  --danger: #c2392d;
  --danger-ink: #7b321e;
  --danger-soft: #fbe8e4;
  --on-danger: #ffffff;
  --info: #2f6bb0;
  --info-ink: #1d4d88;
  --info-soft: #e5edf8;
  --neutral: var(--line-control);
  --neutral-soft: #eaefec;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-full: 9999px;
  --sidebar-width: 240px;
  --topbar-height: 56px;
  --control-sm: 28px;
  --control-md: 32px;
  --control-lg: 40px;
  --touch-target: 44px;
  --content-max: 1200px;
  --drawer-width: 640px;
  --dialog-width: 560px;
  --shadow-popover: 0 4px 16px #163f361f;
  --shadow-drawer: -4px 0 20px #163f3620;
  --shadow-dialog: 0 12px 40px #163f3633;
  --font-sans: system-ui, -apple-system, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
}
:root[data-theme="dark"] {
  --bg-page: #0e1613;
  --surface: #151f1b;
  --surface-sunken: #111a17;
  --surface-hover: #1e2a26;
  --line: #2a3833;
  --line-strong: #41544c;
  --line-control: #71877e;
  --ink: #e3ece8;
  --ink-muted: #a0b3ab;
  --ink-disabled: #5f726b;
  --brand: #7cc4a5;
  --brand-hover: #97d4ba;
  --on-brand: #0b1f19;
  --brand-soft: #1b3830;
  --brand-ink: #a3dcc4;
  --logo-word: var(--ink);
  --link: #8fd3b7;
  --focus: #ee9a5c;
  --backdrop: #000000a6;
  --success: #5cb98a;
  --success-ink: #93dab3;
  --success-soft: #16301f;
  --warning: #d6a243;
  --warning-ink: #f0c97c;
  --warning-soft: #33270f;
  --danger: #e86b5d;
  --danger-ink: #ff9f92;
  --danger-soft: #3b1a16;
  --on-danger: #1f0a07;
  --info: #72a6e2;
  --info-ink: #acc9f1;
  --info-soft: #16253a;
  --neutral: #7f948b;
  --neutral-soft: #1f2b27;
  --shadow-popover: 0 4px 16px #00000080;
  --shadow-drawer: -4px 0 20px #00000099;
  --shadow-dialog: 0 12px 40px #000000b3;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg-page: #0e1613;
    --surface: #151f1b;
    --surface-sunken: #111a17;
    --surface-hover: #1e2a26;
    --line: #2a3833;
    --line-strong: #41544c;
    --line-control: #71877e;
    --ink: #e3ece8;
    --ink-muted: #a0b3ab;
    --ink-disabled: #5f726b;
    --brand: #7cc4a5;
    --brand-hover: #97d4ba;
    --on-brand: #0b1f19;
    --brand-soft: #1b3830;
    --brand-ink: #a3dcc4;
    --logo-word: var(--ink);
    --link: #8fd3b7;
    --focus: #ee9a5c;
    --backdrop: #000000a6;
    --success: #5cb98a;
    --success-ink: #93dab3;
    --success-soft: #16301f;
    --warning: #d6a243;
    --warning-ink: #f0c97c;
    --warning-soft: #33270f;
    --danger: #e86b5d;
    --danger-ink: #ff9f92;
    --danger-soft: #3b1a16;
    --on-danger: #1f0a07;
    --info: #72a6e2;
    --info-ink: #acc9f1;
    --info-soft: #16253a;
    --neutral: #7f948b;
    --neutral-soft: #1f2b27;
    --shadow-popover: 0 4px 16px #00000080;
    --shadow-drawer: -4px 0 20px #00000099;
    --shadow-dialog: 0 12px 40px #000000b3;
  }
}
.page-title { font-family: var(--font-sans); font-size: 24px; line-height: 32px; font-weight: 600; }
.section-title { font-family: var(--font-sans); font-size: 18px; line-height: 26px; font-weight: 600; }
.card-title { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 600; }
.body { font-family: var(--font-sans); font-size: 14px; line-height: 22px; font-weight: 400; }
.body-strong { font-family: var(--font-sans); font-size: 14px; line-height: 22px; font-weight: 600; }
.label { font-family: var(--font-sans); font-size: 13px; line-height: 20px; font-weight: 500; }
.caption { font-family: var(--font-sans); font-size: 12px; line-height: 18px; font-weight: 400; }
.metric { font-family: var(--font-sans); font-size: 28px; line-height: 36px; font-weight: 600; }
.mobile-body { font-family: var(--font-sans); font-size: 16px; line-height: 26px; font-weight: 400; }
.mono { font-family: var(--font-mono); font-size: 13px; line-height: 20px; font-weight: 400; }
.mono-small { font-family: var(--font-mono); font-size: 12px; line-height: 18px; font-weight: 400; }