/* سحاب · Tokens v1 · 2026-11-01 — from apps/client/design/v1/Tokens.dc.html (docs/17 §11).
   Dark is the default; light with [data-theme="light"]; "auto" follows the system (prefers-color-scheme).
   Rules of use (the trust line):
   1. --sb-seal and --sb-native are for Sahab's own surface only; no session content passes through them.
   2. --sb-faint is never text (contrast under 4.5:1).
   3. --sb-warning filled = a permission request waits for you, only. */
:root {
  --sb-font-display: "Readex Pro", "IBM Plex Sans Arabic", sans-serif;
  --sb-font-ui: "IBM Plex Sans Arabic", system-ui, sans-serif;
  --sb-font-mono: "JetBrains Mono", "IBM Plex Sans Arabic", ui-monospace, monospace;
  --sb-fs-xs: 11px; --sb-fs-sm: 13px; --sb-fs-md: 15px; --sb-fs-lg: 17px; --sb-fs-xl: 22px; --sb-fs-2xl: 28px; --sb-fs-3xl: 40px; --sb-fs-code: 12.5px;
  --sb-lh-tight: 1.25; --sb-lh-body: 1.6; --sb-lh-code: 1.55;
  --sb-s1: 4px; --sb-s2: 8px; --sb-s3: 12px; --sb-s4: 16px; --sb-s5: 20px; --sb-s6: 24px; --sb-s8: 32px; --sb-s10: 40px;
  --sb-r-xs: 6px; --sb-r-sm: 10px; --sb-r-md: 14px; --sb-r-lg: 20px; --sb-r-xl: 28px; --sb-r-pill: 999px;
  --sb-tap: 44px;
  --sb-gap-decision: 28px;   /* between «ارفض» and «اسمح» */
  --sb-hold-ms: 1200ms;      /* the press-and-hold that allows */
  --sb-ease: cubic-bezier(.2, .8, .2, 1);
}
:root, [data-theme="dark"] {
  --sb-bg: #0A0F14; --sb-surface: #111A22; --sb-surface-2: #18242E;
  --sb-well: #0D141B;    /* session content only */
  --sb-native: #1B2833;  /* sealed: Sahab speaking */
  --sb-text: #E6EDF2; --sb-muted: #97A7B3; --sb-faint: #5F707C;
  --sb-border: #22313C; --sb-border-strong: #344753;
  --sb-primary: #7CC7E8; --sb-on-primary: #04121A; --sb-primary-soft: rgba(124,199,232,.12);
  --sb-success: #5FD3A6;
  --sb-warning: #F3C25B; --sb-warning-soft: rgba(243,194,91,.12); --sb-on-warning: #1A1200;
  --sb-danger: #FF7A7A; --sb-on-danger: #1A0505; --sb-danger-soft: rgba(255,122,122,.12);
  --sb-seal: #EAF2F6;
  --sb-code-kw: #C3A6FF; --sb-code-str: #9EE0B5; --sb-code-cm: #7D8F9B;
  --sb-diff-add: rgba(95,211,166,.14); --sb-diff-del: rgba(255,122,122,.14);
  --sb-shadow: 0 1px 0 rgba(255,255,255,.04) inset, 0 18px 48px rgba(0,0,0,.45);
  --sb-well-shadow: inset 0 6px 14px rgba(0,0,0,.18);
  --sb-scrim: rgba(0,0,0,.55);
  --sb-theme-color: #0A0F14;
  color-scheme: dark;
}
[data-theme="light"] {
  --sb-bg: #F3F5F6; --sb-surface: #FFFFFF; --sb-surface-2: #EEF2F4;
  --sb-well: #F8FAFB; --sb-native: #E6EDF1;
  --sb-text: #0D1B24; --sb-muted: #4E606C; --sb-faint: #8696A1;
  --sb-border: #D6DFE4; --sb-border-strong: #B8C6CE;
  --sb-primary: #0B6E95; --sb-on-primary: #FFFFFF; --sb-primary-soft: rgba(11,110,149,.10);
  --sb-success: #0E7A55;
  --sb-warning: #8A5A00; --sb-warning-soft: rgba(214,150,20,.14); --sb-on-warning: #FFFFFF;
  --sb-danger: #C0262D; --sb-on-danger: #FFFFFF; --sb-danger-soft: rgba(192,38,45,.10);
  --sb-seal: #0D1B24;
  --sb-code-kw: #6B3FD4; --sb-code-str: #13774A; --sb-code-cm: #6A7A85;
  --sb-diff-add: rgba(14,122,85,.10); --sb-diff-del: rgba(192,38,45,.09);
  --sb-shadow: 0 1px 2px rgba(13,27,36,.06), 0 12px 32px rgba(13,27,36,.10);
  --sb-well-shadow: inset 0 4px 10px rgba(13,27,36,.05);
  --sb-scrim: rgba(13,27,36,.35);
  --sb-theme-color: #F3F5F6;
  color-scheme: light;
}
@media (prefers-color-scheme: light) {
  [data-theme="auto"] {
    --sb-bg: #F3F5F6; --sb-surface: #FFFFFF; --sb-surface-2: #EEF2F4;
    --sb-well: #F8FAFB; --sb-native: #E6EDF1;
    --sb-text: #0D1B24; --sb-muted: #4E606C; --sb-faint: #8696A1;
    --sb-border: #D6DFE4; --sb-border-strong: #B8C6CE;
    --sb-primary: #0B6E95; --sb-on-primary: #FFFFFF; --sb-primary-soft: rgba(11,110,149,.10);
    --sb-success: #0E7A55;
    --sb-warning: #8A5A00; --sb-warning-soft: rgba(214,150,20,.14); --sb-on-warning: #FFFFFF;
    --sb-danger: #C0262D; --sb-on-danger: #FFFFFF; --sb-danger-soft: rgba(192,38,45,.10);
    --sb-seal: #0D1B24;
    --sb-code-kw: #6B3FD4; --sb-code-str: #13774A; --sb-code-cm: #6A7A85;
    --sb-diff-add: rgba(14,122,85,.10); --sb-diff-del: rgba(192,38,45,.09);
    --sb-shadow: 0 1px 2px rgba(13,27,36,.06), 0 12px 32px rgba(13,27,36,.10);
    --sb-well-shadow: inset 0 4px 10px rgba(13,27,36,.05);
    --sb-scrim: rgba(13,27,36,.35);
    --sb-theme-color: #F3F5F6;
    color-scheme: light;
  }
}
/* Session states: a shape AND a colour (T-5: never colour alone). */
:root, [data-theme] {
  --sb-st-none: var(--sb-faint);       /* ◌ dashed */
  --sb-st-starting: var(--sb-primary); /* ◐ half */
  --sb-st-ready: var(--sb-success);    /* ● filled */
  --sb-st-running: var(--sb-primary);  /* ◉ pulse */
  --sb-st-idle: var(--sb-muted);       /* ○ hollow */
  --sb-st-stopping: var(--sb-warning); /* ◐ half */
  --sb-st-stopped: var(--sb-faint);    /* ■ square */
  --sb-st-error: var(--sb-danger);     /* ◆ diamond */
  --sb-pending: var(--sb-warning);     /* waits for you */
}