/* ============================================================
   moizz — design tokens (the styling constitution)
   Rule 1: app.css may not contain a raw color or magic number
   that is not defined here. Change this file, restyle the decade.
   v0.1 uses the system font stack; self-hosted Inter/JetBrains
   Mono may replace the stacks below without touching app.css.
   ============================================================ */
:root {

  /* ---- color: near-black, warm-neutral, dark-only in v0.1 ---- */
  --bg:      #0B0C0E;   /* page background */
  --surface: #121417;   /* cards, sidebar */
  --raised:  #181B1F;   /* hover states, inputs, dialogs */
  --border:  #25292F;   /* all borders */

  --text:    #E7E9EC;   /* primary text */
  --muted:   #8B929C;   /* secondary text, labels */
  --faint:   #555C66;   /* timestamps, disabled */

  --accent:  #D9A441;   /* focus, active nav, primary action — at most one
                           accent element per viewport */
  --ok:      #3FB68B;
  --warn:    #D98E41;
  --danger:  #E0564A;
  --info:    #5B8DEF;

  /* status colors appear only in pills, dots and deltas — never as
     backgrounds */

  /* ---- typography: five sizes, two families ---- */
  --font-ui:   system-ui, -apple-system, "Segoe UI", Roboto,
               "Helvetica Neue", sans-serif;
  --font-mono: ui-monospace, "Cascadia Mono", "SF Mono", Consolas,
               Menlo, monospace;

  --fs-caption: 0.75rem;    /* 12 — labels, timestamps, card headers */
  --fs-body:    0.875rem;   /* 14 — base */
  --fs-emph:    1rem;       /* 16 — emphasized body, page h2 */
  --fs-title:   1.25rem;    /* 20 — page titles */
  --fs-hero:    1.75rem;    /* 28 — the single dashboard greeting */

  --lh-body: 1.5;
  --lh-head: 1.2;
  --track-label: 0.06em;    /* uppercase card/section labels */

  /* ---- spacing: 4px scale ---- */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;

  /* ---- shape ---- */
  --r-card: 10px;
  --r-ctl:  6px;
  --r-pill: 999px;

  /* ---- elevation: two shadows in the whole system ---- */
  --shadow-1: 0 1px 2px rgb(0 0 0 / 0.40);            /* raised surfaces */
  --shadow-2: 0 8px 24px rgb(0 0 0 / 0.50);           /* palette, dialogs */

  /* ---- layout ---- */
  --sidebar-w:   220px;
  --topbar-h:    56px;
  --content-max: 1200px;
  --ctl-h:       40px;      /* control height */
  --row-h:       36px;      /* dense table rows */
}