/* fuentes.dev brand tokens. Light is the default; dark follows the OS unless data-theme="light" is set. */

:root {
  /* Brand colors (fixed) */
  --hollow: #141B1F;
  --limestone: #EDEBE4;
  --blaze: #F26B1D;
  --blaze-deep: #B3470A;
  --hemlock: #2E4A3F;
  --buffalo: #4C8DA6;
  --bluff: #6E746C;

  /* Semantic colors (light) */
  --bg: var(--limestone);
  --surface: #E4E1D8;
  --fg: var(--hollow);
  --muted: #5A6058;
  --line: #D3D0C6;
  --accent: var(--blaze);
  --accent-text: var(--blaze-deep);
  --inverse-bg: var(--hollow);
  --inverse-fg: var(--limestone);

  /* Type */
  --font-mono: "Martian Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Spacing and radius */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-6: 24px; --space-8: 32px; --space-12: 48px; --space-24: 96px;
  --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-icon: 22%; --radius-full: 9999px;
  --shadow-card: 0 10px 30px -14px rgba(20, 27, 31, 0.45);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #101619; --surface: #18211F; --fg: var(--limestone); --muted: #9AA097; --line: #263036;
    --accent-text: var(--blaze); --inverse-bg: var(--limestone); --inverse-fg: var(--hollow);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #101619; --surface: #18211F; --fg: var(--limestone); --muted: #9AA097; --line: #263036;
  --accent-text: var(--blaze); --inverse-bg: var(--limestone); --inverse-fg: var(--hollow);
  color-scheme: dark;
}