/* AI Center v1.3 design tokens (AUTHORING.md). Light = the mockup; dark = derived from the same roles.
   Theme: <html data-theme="light|dark">; no attribute = follow the OS (prefers-color-scheme). */
:root {
  color-scheme: light;
  --font-ui: 'Be Vietnam Pro', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'Cascadia Mono', Consolas, monospace;

  /* surfaces */
  --bg: #F7F6F3;            /* canvas (warm paper) */
  --surface: #FFFFFF;
  --sunken: #F0EEE9;        /* nav, user bubble, code */
  --hover: #ECE9E2;
  --table-head: #F7F6F3;
  --grid: #EFECE6;
  --band: #ECE7DD;          /* chart band of a peer group */

  /* lines */
  --border: #E5E1D8;
  --border-strong: #D3CEC2;

  /* text */
  --ink: #1C1917;           /* headings, primary buttons */
  --body: #3D3833;
  --muted: #6B6359;         /* min for small text on white */
  --muted-2: #5F574E;       /* small text on sunken */
  --placeholder: #8C8478;

  /* brand / AI (honey) */
  --honey: #F2B23A;
  --honey-soft: #FCF1D9;
  --honey-ink: #8A5A00;
  --honey-line: #F1DDB0;
  --honey-track: #E9D3A6;

  /* status */
  --info: #2457D6;  --info-hover: #1A43AC;  --info-soft: #EAF0FD;
  --success: #1E7A4C; --success-soft: #E7F4EC;
  --warning: #9A4F00; --warning-soft: #FFF1DD; --warning-dot: #C26A00;
  --danger: #B42318;  --danger-soft: #FCEBE9;

  /* data series */
  --series-android: #2F5BD3;
  --series-ios: #E08A1E;
  --series-ref: #6B6359;
  --series-3: #1E7A4C;
  --series-4: #8A5A00;
  --series-5: #7A4FC9;
  --series-6: #B42318;

  /* controls */
  --primary-bg: #1C1917;
  --primary-fg: #FFFFFF;
  --primary-hover: #34302B;
  --switch-off: #8C8478;
  --focus: #2457D6;
  --overlay: rgba(28, 25, 23, .36);

  /* shape + depth */
  --r-card: 12px;
  --r-ctl: 8px;
  --r-composer: 16px;
  --r-pill: 999px;
  --shadow-float: 0 8px 24px rgba(28, 25, 23, .08);
  --shadow-pop: 0 12px 32px rgba(28, 25, 23, .12);
  --shadow-seg: 0 1px 2px rgba(28, 25, 23, .08);

  /* layout */
  --nav-w: 248px;
  --content-pad: 24px 32px 40px;
  --reading: 720px;
}

/* Dark: same roles, warm near-black neutrals; honey stays the brand fill, tinted soft backgrounds. */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #171513;
  --surface: #211E1B;
  --sunken: #1B1917;
  --hover: #2C2824;
  --table-head: #1D1B18;
  --grid: #2A2622;
  --band: #2E2A25;
  --border: #34302B;
  --border-strong: #4A443D;
  --ink: #F4F0E9;
  --body: #DAD4CB;
  --muted: #A69D91;
  --muted-2: #A69D91;
  --placeholder: #8A8276;
  --honey: #F2B23A;
  --honey-soft: #3A2E17;
  --honey-ink: #F5C46A;
  --honey-line: #5A4520;
  --honey-track: #5A4520;
  --info: #8FB0FF;  --info-hover: #B3C9FF; --info-soft: #1C2742;
  --success: #6CCB98; --success-soft: #16301F;
  --warning: #F2A65A; --warning-soft: #3A2814; --warning-dot: #F2A65A;
  --danger: #FF8A80;  --danger-soft: #3D1A17;
  --series-android: #7C9CF5;
  --series-ios: #F0A04B;
  --series-ref: #A69D91;
  --series-3: #6CCB98;
  --series-4: #F5C46A;
  --series-5: #B59AF0;
  --series-6: #FF8A80;
  --primary-bg: #F4F0E9;
  --primary-fg: #171513;
  --primary-hover: #DAD4CB;
  --switch-off: #8A8276;
  --focus: #8FB0FF;
  --overlay: rgba(0, 0, 0, .55);
  --shadow-float: 0 8px 24px rgba(0, 0, 0, .35);
  --shadow-pop: 0 12px 32px rgba(0, 0, 0, .45);
  --shadow-seg: 0 1px 2px rgba(0, 0, 0, .4);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-theme="dark"]) {
    color-scheme: dark;
    --bg: #171513;
    --surface: #211E1B;
    --sunken: #1B1917;
    --hover: #2C2824;
    --table-head: #1D1B18;
    --grid: #2A2622;
    --band: #2E2A25;
    --border: #34302B;
    --border-strong: #4A443D;
    --ink: #F4F0E9;
    --body: #DAD4CB;
    --muted: #A69D91;
    --muted-2: #A69D91;
    --placeholder: #8A8276;
    --honey: #F2B23A;
    --honey-soft: #3A2E17;
    --honey-ink: #F5C46A;
    --honey-line: #5A4520;
    --honey-track: #5A4520;
    --info: #8FB0FF;  --info-hover: #B3C9FF; --info-soft: #1C2742;
    --success: #6CCB98; --success-soft: #16301F;
    --warning: #F2A65A; --warning-soft: #3A2814; --warning-dot: #F2A65A;
    --danger: #FF8A80;  --danger-soft: #3D1A17;
    --series-android: #7C9CF5;
    --series-ios: #F0A04B;
    --series-ref: #A69D91;
    --series-3: #6CCB98;
    --series-4: #F5C46A;
    --series-5: #B59AF0;
    --series-6: #FF8A80;
    --primary-bg: #F4F0E9;
    --primary-fg: #171513;
    --primary-hover: #DAD4CB;
    --switch-off: #8A8276;
    --focus: #8FB0FF;
    --overlay: rgba(0, 0, 0, .55);
    --shadow-float: 0 8px 24px rgba(0, 0, 0, .35);
    --shadow-pop: 0 12px 32px rgba(0, 0, 0, .45);
    --shadow-seg: 0 1px 2px rgba(0, 0, 0, .4);
  }
}
