:root {
  /* Brand */
  --piky-primary: #186ff2;
  --piky-ink: #253247;

  /* Neutrals */
  --bg: #ffffff;
  --surface: #f7f9fc;
  --surface-2: #eef3fa;
  --border: #d7dee9;
  --text: #253247;
  --text-muted: #6b778c;

  /* Interactions */
  --link: #186ff2;
  --primary-hover: #2678f3;
  --primary-active: #0c5ed9;
  --focus-ring: #86b4f8;

  /* Semantics */
  --success: #16a34a;
  --warning: #f59e0b;
  --danger: #ef4444;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b1220;
    --surface: #111a2e;
    --surface-2: #17233c;
    --border: #22304b;
    --text: #e6ecf7;
    --text-muted: #aab6cc;

    /* Keep primary for fills; use lighter links in dark mode */
    --piky-primary: #186ff2;
    --link: #2678f3;
    --primary-hover: #5696f5;
    --primary-active: #186ff2;
    --focus-ring: #5696f5;
  }
}