:root {
  --sp-orange: #ff781e;
  --sp-dark: #08070f;
  --sp-surface: #1a1928;
  --sp-surface-2: #232235;
  --sp-border: rgba(255,255,255,0.08);
  --sp-muted: rgba(255,255,255,0.45);
  --sp-text: #ffffff;
  --sp-green: #27be75;
  --sp-blue: #378add;
  --sp-amber: #ef9f27;
  --sp-red: #ff3b30;
  --sp-red-fill: rgba(255,59,48,0.13);
  --sp-font: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --sp-mono: "Space Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
  --radius: 10px;
  --radius-card: 12px;
}

:root[data-theme="light"] {
  --sp-dark: #f4ece3;
  --sp-surface: #fffdf9;
  --sp-surface-2: #f7f0e8;
  --sp-border: rgba(31,27,22,0.14);
  --sp-muted: rgba(35,31,26,0.58);
  --sp-text: #171612;
  --sp-red-fill: rgba(255,59,48,0.09);
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --sp-dark: #f4ece3;
    --sp-surface: #fffdf9;
    --sp-surface-2: #f7f0e8;
    --sp-border: rgba(31,27,22,0.14);
    --sp-muted: rgba(35,31,26,0.58);
    --sp-text: #171612;
    --sp-red-fill: rgba(255,59,48,0.09);
  }
}