/* Autodev — design tokens (light + dark) */
:root {
  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --font-display: "Inter", ui-sans-serif, system-ui, sans-serif;

  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;
  --r-pill: 999px;
}

/* ── Light theme (default) ───────────────────────────────────────────── */
:root, [data-theme="light"] {
  /* Surfaces */
  --bg:        #FAFBFD;
  --paper:    #FFFFFF;
  --paper-2:  #F5F6FA;        /* slightly recessed */
  --surface-muted: #FAFBFD;
  --border:   #E4E7EE;
  --border-strong: #C4CAD6;
  --divider:  #EEF0F5;

  /* Text */
  --text:        #0E1014;
  --text-strong: #0E1014;
  --text-muted:  #6B7385;
  --text-subtle: #9098A8;
  --text-on-accent: #FFFFFF;

  /* Accent — Autodev violet */
  --accent-50:  #F1EEFE;
  --accent-100: #E2DCFD;
  --accent-200: #C5B9FB;
  --accent-400: #8771F4;
  --accent-500: #5E47E8;
  --accent-600: #4A35C9;
  --accent-700: #3A2AA0;
  --accent-bg:  var(--accent-50);
  --accent-bg-strong: var(--accent-100);
  --accent-fg:  var(--accent-700);
  --accent-solid: var(--accent-500);
  --accent-solid-hover: var(--accent-600);

  /* OK */
  --ok-50:   #E8F5EE;
  --ok-200:  #B6DEC4;
  --ok-500:  #2B8557;
  --ok-700:  #1F5F3F;
  --ok-bg:   var(--ok-50);
  --ok-fg:   var(--ok-700);

  /* Warn */
  --warn-50: #FBF1DC;
  --warn-200:#F0D89B;
  --warn-500:#B57A12;
  --warn-700:#7E5408;
  --warn-bg: var(--warn-50);
  --warn-fg: var(--warn-700);

  /* Err */
  --err-50:  #FBEAEA;
  --err-200: #F1B9B9;
  --err-500: #C4413B;
  --err-700: #8E2A26;
  --err-bg:  var(--err-50);
  --err-fg:  var(--err-700);

  /* Info */
  --info-50: #E5EEFB;
  --info-200:#B6CDF1;
  --info-500:#2A6FDB;
  --info-700:#1F4FA0;
  --info-bg: var(--info-50);
  --info-fg: var(--info-700);

  /* Working */
  --work-50:  #E2F4F2;
  --work-200: #A8DBD5;
  --work-500: #1F8A7E;
  --work-700: #145A52;
  --work-bg:  var(--work-50);
  --work-fg:  var(--work-700);

  /* Neutrals (for backwards-compat) */
  --ink-900: #0E1014;
  --ink-800: #1A1D24;
  --ink-700: #2A2F3A;
  --ink-600: #4A5160;
  --ink-500: #6B7385;
  --ink-400: #9098A8;
  --ink-300: #C4CAD6;
  --ink-200: #E4E7EE;
  --ink-150: #EEF0F5;
  --ink-100: #F5F6FA;
  --ink-50:  #FAFBFD;

  /* Code surfaces */
  --code-bg:  #0E1014;
  --code-fg:  #D7D9E0;

  /* Shadows */
  --shadow-xs: 0 1px 0 rgba(14,16,20,0.04);
  --shadow-sm: 0 1px 2px rgba(14,16,20,0.06), 0 0 0 1px rgba(14,16,20,0.04);
  --shadow-md: 0 4px 14px rgba(14,16,20,0.06), 0 0 0 1px rgba(14,16,20,0.05);
  --shadow-lg: 0 16px 40px rgba(14,16,20,0.10), 0 0 0 1px rgba(14,16,20,0.05);
}

/* ── Dark theme ──────────────────────────────────────────────────────── */
[data-theme="dark"] {
  --bg:       #0B0D12;
  --paper:    #14171E;
  --paper-2:  #1A1E27;
  --surface-muted: #11141A;
  --border:   #262B36;
  --border-strong: #383F4D;
  --divider:  #1E222C;

  --text:        #ECEEF3;
  --text-strong: #FFFFFF;
  --text-muted:  #9098A8;
  --text-subtle: #6B7385;
  --text-on-accent: #FFFFFF;

  /* Accent stays vivid in dark */
  --accent-50:   #1E1A3A;          /* used as bg-tint */
  --accent-100:  #2A2358;
  --accent-200:  #3E3380;
  --accent-400:  #8771F4;
  --accent-500:  #7259ED;          /* slightly brighter for dark */
  --accent-600:  #5E47E8;
  --accent-700:  #B5A8FA;          /* used as fg on dark */
  --accent-bg:   #1E1A3A;
  --accent-bg-strong: #2A2358;
  --accent-fg:   #C5B9FB;
  --accent-solid: #7259ED;
  --accent-solid-hover: #8771F4;

  --ok-50:   #15281F;
  --ok-200:  #2C5740;
  --ok-500:  #4FBF7E;
  --ok-700:  #9DE0B7;
  --ok-bg:   #15281F;
  --ok-fg:   #9DE0B7;

  --warn-50: #2D2110;
  --warn-200:#5C4319;
  --warn-500:#E5A538;
  --warn-700:#F2CB7C;
  --warn-bg: #2D2110;
  --warn-fg: #F2CB7C;

  --err-50:  #2E1716;
  --err-200: #5E2A28;
  --err-500: #E26661;
  --err-700: #F5A6A2;
  --err-bg:  #2E1716;
  --err-fg:  #F5A6A2;

  --info-50: #122237;
  --info-200:#1F3A66;
  --info-500:#5C95EE;
  --info-700:#A6C5F4;
  --info-bg: #122237;
  --info-fg: #A6C5F4;

  --work-50: #0E2A28;
  --work-200:#1F4F4A;
  --work-500:#3FB9AC;
  --work-700:#8FE0D6;
  --work-bg: #0E2A28;
  --work-fg: #8FE0D6;

  /* Mirror neutrals so old --ink-* references still look right in dark */
  --ink-900: #ECEEF3;
  --ink-800: #D7DAE2;
  --ink-700: #BCC1CC;
  --ink-600: #9098A8;
  --ink-500: #6B7385;
  --ink-400: #4A5160;
  --ink-300: #383F4D;
  --ink-200: #262B36;
  --ink-150: #1E222C;
  --ink-100: #1A1E27;
  --ink-50:  #14171E;

  --code-bg: #0B0D12;
  --code-fg: #D7D9E0;

  --shadow-xs: 0 1px 0 rgba(0,0,0,0.4);
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.04);
  --shadow-md: 0 4px 14px rgba(0,0,0,0.45), 0 0 0 1px rgba(255,255,255,0.05);
  --shadow-lg: 0 24px 60px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.06);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-sans);
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  transition: background 0.2s ease, color 0.2s ease;
}
button { font: inherit; cursor: pointer; border: none; background: none; color: inherit; }
input, textarea { font: inherit; color: inherit; }
input::placeholder, textarea::placeholder { color: var(--text-subtle); }
a { color: inherit; text-decoration: none; }
code, pre { font-family: var(--font-mono); }

/* Helpers */
.theme-paper { background: var(--paper); color: var(--text); }