/* ==============================================
   Design Tokens — replace brand colors to match Winity
   ============================================== */
:root {
  /* Brand palette — FILL THESE to match Winity brand */
  --brand-primary: #3ee6e0; /* TODO: replace with HEX from Winity */
  --brand-secondary: #2575fc; /* TODO */
  --brand-accent: #e9417d; /* TODO */
  --success: #22c55e;
  --warning: #f59e0b;
  --error: #ef4444;

  /* Surfaces & text (Dark theme by default) */
  --bg: #0b0b0b;
  --surface: #141414;
  --surface-2: #1c1c1c;
  --surface-3: #232323;
  --text-primary: #ffffff;
  --text-secondary: #b8b8b8;
  --text-muted: #8a8a8a;

  /* Layout */
  --container-max: 1280px;
  --radius: 16px;
  --radius-sm: 10px;
  --shadow-1: 0 8px 24px rgba(0,0,0,.25);
  --shadow-2: 0 2px 8px rgba(0,0,0,.35);

  /* Gradients */
  --gradient-1: linear-gradient(135deg, var(--brand-primary), var(--brand-accent));
  --gradient-2: linear-gradient(135deg, var(--surface-2), var(--surface-3));

  /* Focus ring */
  --focus-ring: 2px solid var(--brand-accent);
}
@media (prefers-color-scheme: light) {
  :root {
    --bg: #fafafa;
    --surface: #ffffff;
    --surface-2: #f4f4f5;
    --surface-3: #ececf0;
    --text-primary: #0b0b0b;
    --text-secondary: #3d3d3d;
    --text-muted: #606060;
    --shadow-1: 0 8px 24px rgba(0,0,0,.08);
    --shadow-2: 0 2px 8px rgba(0,0,0,.08);
  }
}