@layer gamedb.tokens {
  :root,
  [data-gamedb-theme] {
    color-scheme: light;
    --gdb-font-body: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --gdb-font-mono: "Cascadia Code", "SFMono-Regular", Consolas, monospace;
    --gdb-color-canvas: #f7f8fa;
    --gdb-color-surface: #ffffff;
    --gdb-color-surface-raised: #ffffff;
    --gdb-color-text: #19202b;
    --gdb-color-text-muted: #5c6675;
    --gdb-color-border: #d7dde5;
    --gdb-color-border-strong: #aab5c3;
    --gdb-color-accent: #295fa6;
    --gdb-color-accent-strong: #17477f;
    --gdb-color-accent-soft: #e8f1fc;
    --gdb-color-success: #17724b;
    --gdb-color-warning: #8a5700;
    --gdb-color-danger: #a52a2a;
    --gdb-color-focus: #e07a19;
    --gdb-shadow-sm: 0 1px 2px rgb(20 31 45 / 8%);
    --gdb-shadow-md: 0 12px 32px rgb(20 31 45 / 12%);
    --gdb-radius-sm: 0.35rem;
    --gdb-radius-md: 0.65rem;
    --gdb-radius-lg: 1rem;
    --gdb-space-1: 0.25rem;
    --gdb-space-2: 0.5rem;
    --gdb-space-3: 0.75rem;
    --gdb-space-4: 1rem;
    --gdb-space-5: 1.5rem;
    --gdb-space-6: 2rem;
    --gdb-space-7: 3rem;
    --gdb-content-width: 76rem;
    --gdb-reading-width: 48rem;
    --gdb-sidebar-width: 17rem;
    --gdb-motion-fast: 140ms;
    --gdb-motion-standard: 220ms;
  }

  [data-gamedb-theme="dark"] {
    color-scheme: dark;
    --gdb-color-canvas: #11161d;
    --gdb-color-surface: #171e27;
    --gdb-color-surface-raised: #1d2631;
    --gdb-color-text: #edf1f6;
    --gdb-color-text-muted: #abb6c4;
    --gdb-color-border: #34404e;
    --gdb-color-border-strong: #526173;
    --gdb-color-accent: #8cbdf5;
    --gdb-color-accent-strong: #b9d8fb;
    --gdb-color-accent-soft: #183350;
    --gdb-color-success: #72d5a7;
    --gdb-color-warning: #efbd68;
    --gdb-color-danger: #ff9d9d;
    --gdb-color-focus: #ffad5c;
    --gdb-shadow-sm: 0 1px 2px rgb(0 0 0 / 28%);
    --gdb-shadow-md: 0 16px 40px rgb(0 0 0 / 36%);
  }

  @media (prefers-color-scheme: dark) {
    :root:not([data-gamedb-theme]),
    [data-gamedb-theme="system"] {
      color-scheme: dark;
      --gdb-color-canvas: #11161d;
      --gdb-color-surface: #171e27;
      --gdb-color-surface-raised: #1d2631;
      --gdb-color-text: #edf1f6;
      --gdb-color-text-muted: #abb6c4;
      --gdb-color-border: #34404e;
      --gdb-color-border-strong: #526173;
      --gdb-color-accent: #8cbdf5;
      --gdb-color-accent-strong: #b9d8fb;
      --gdb-color-accent-soft: #183350;
      --gdb-color-success: #72d5a7;
      --gdb-color-warning: #efbd68;
      --gdb-color-danger: #ff9d9d;
      --gdb-color-focus: #ffad5c;
      --gdb-shadow-sm: 0 1px 2px rgb(0 0 0 / 28%);
      --gdb-shadow-md: 0 16px 40px rgb(0 0 0 / 36%);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    :root,
    [data-gamedb-theme] {
      --gdb-motion-fast: 0ms;
      --gdb-motion-standard: 0ms;
    }
  }
}