/* tokens.css — design tokens only */

:root {
  /* Color — light */
  --page-bg: #f4f5f7;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --surface-subtle: #eef0f3;
  --text-primary: #101114;
  --text-secondary: #5c6068;
  --text-tertiary: #8a8f98;
  --border: rgba(16, 17, 20, 0.1);
  --border-strong: rgba(16, 17, 20, 0.18);
  --accent: #1677ff;
  --accent-strong: #0868eb;
  --accent-soft: rgba(22, 119, 255, 0.1);
  --success: #1f8a4c;
  --warning: #b86e00;
  --danger: #c62828;
  --hero-bg: #0b0d14;
  --hero-text: #f7f8fc;
  --hero-muted: rgba(247, 248, 252, 0.64);
  --nav-bg: rgba(244, 245, 247, 0.86);
  --code-bg: #0f1218;
  --code-text: #d7dae0;
  --shadow: 0 18px 50px rgba(16, 17, 20, 0.08);
  --focus: var(--accent);

  /* Type — system stack (Apple where available; Helvetica/Arial elsewhere) */
  --lim-font-sans:
    "SF Pro Display",
    "SF Pro Icons",
    "Helvetica Neue",
    Helvetica,
    Arial,
    sans-serif;
  --lim-font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --lim-font-weight-regular: 400;
  --lim-font-weight-medium: 500;
  --lim-font-weight-semibold: 600;
  --lim-font-weight-bold: 700;

  /* Legacy aliases → single sans stack */
  --font-sans: var(--lim-font-sans);
  --font-display: var(--lim-font-sans);
  --font-mono: var(--lim-font-mono);

  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-md: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: clamp(1.75rem, 3vw, 2.25rem);
  --text-4xl: clamp(2.25rem, 4.5vw, 3.5rem);
  --text-5xl: clamp(2.75rem, 6vw, 5.5rem);

  --leading-tight: 1;
  --leading-snug: 1.3;
  --leading-normal: 1.6;
  --leading-hero: 0.92;
  --tracking-tight: -0.045em;
  --tracking-section: -0.03em;
  --tracking-caps: 0.12em;

  /* Space */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
  --space-9: 104px;

  /* Shape */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 28px;
  --radius-full: 999px;

  /* Layout */
  --header-h: 64px;
  --sidebar-w: 260px;
  --toc-w: 220px;
  --content-max: 760px;
  --detail-max: 1280px;
  --shell-max: 1440px;

  /* Motion */
  --duration-fast: 160ms;
  --duration-medium: 320ms;
  --duration-slow: 560ms;
  --ease-standard: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-emphasized: cubic-bezier(0.22, 1, 0.36, 1);
}

[data-theme="dark"],
[data-theme="night"] {
  --page-bg: #090b10;
  --surface: #12151c;
  --surface-raised: #171b24;
  --surface-subtle: #1a1f2a;
  --text-primary: #f2f3f5;
  --text-secondary: #a0a5b0;
  --text-tertiary: #747b88;
  --border: rgba(255, 255, 255, 0.1);
  --border-strong: rgba(255, 255, 255, 0.18);
  --accent: #4193ff;
  --accent-strong: #65a7ff;
  --accent-soft: rgba(65, 147, 255, 0.14);
  --success: #3dba6e;
  --warning: #e0a03a;
  --danger: #ef6a6a;
  --nav-bg: rgba(9, 11, 16, 0.86);
  --code-bg: #0a0c11;
  --code-text: #d7dae0;
  --shadow: 0 22px 60px rgba(0, 0, 0, 0.4);
}
