/* ==========================================================================
   AmanERP · Concept 01 · Quiet — design tokens
   Law: colour is a signal, never decoration. Amber means "this needs you".
   ========================================================================== */
:root {
  /* ---- Colour roles (light page) ---- */
  --paper: #FCFCFD;        /* page */
  --mist: #F2F4F6;         /* surfaces, section alternation */
  --ink: #0F1216;          /* text, primary buttons, focus rings */
  --graphite: #4A515C;     /* secondary text (7.8:1) */
  --line: #7D8591;         /* control borders (3.6:1) */
  --hairline: #DDE1E6;     /* decorative dividers only */

  /* ---- Signal: the only accent, one meaning ---- */
  --signal: #B87B00;       /* indicator on light surfaces */
  --signal-lit: #F2A900;   /* indicator on the dark stage */
  --signal-text: #7A5200;  /* signal as text on light (6.8:1) */
  --signal-glow: rgb(242 169 0 / 0.5);

  /* ---- Cockpit stage (where the product runs) ---- */
  --stage: #0B0D10;
  --stage-2: #111418;      /* raised surfaces: panels, app shell */
  --stage-3: #171A1F;      /* chips, inputs */
  --stage-line: #252A31;   /* borders on stage */
  --stage-ink: #E7EAEE;    /* text on stage (15.9:1) */
  --stage-muted: #8E96A3;  /* secondary text on stage (6.3:1) */
  --stage-off: #2A2F37;    /* an unlit light, rulers */
  --stage-dots: #1B1F25;   /* dot grid */

  /* ---- Type ---- */
  --font-sans: "Anek Latin", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-deva: "Anek Devanagari", "Anek Latin", "Noto Sans Devanagari", sans-serif;
  --font-mono: "Martian Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Nine type tokens. Display width (font-stretch > 100%) is only used at h2 and above. */
  --fs-display: clamp(2.75rem, 1.2rem + 4.4vw, 5rem);      /* 44 → 80 */
  --fs-h1:      clamp(2.125rem, 1.35rem + 2.5vw, 3.5rem);  /* 34 → 56 */
  --fs-h2:      clamp(1.875rem, 1.45rem + 1.2vw, 2.5rem);  /* 30 → 40 */
  --fs-h3:      clamp(1.1875rem, 1.12rem + 0.25vw, 1.375rem); /* 19 → 22 */
  --fs-lead:    clamp(1.125rem, 1.07rem + 0.2vw, 1.25rem); /* 18 → 20 */
  --fs-body:    clamp(1rem, 0.97rem + 0.12vw, 1.0625rem);  /* 16 → 17 */
  --fs-small:   0.875rem;                                  /* 14 */
  --fs-data:    0.8125rem;                                 /* 13, tabular */
  --fs-label:   0.6875rem;                                 /* 11, mono captions and UI micro-labels */

  /* ---- Spacing (8-pt, with 4 and 12 for UI) ---- */
  --s-1: 0.25rem;  /* 4 */
  --s-2: 0.5rem;   /* 8 */
  --s-3: 0.75rem;  /* 12 */
  --s-4: 1rem;     /* 16 */
  --s-5: 1.5rem;   /* 24 */
  --s-6: 2rem;     /* 32 */
  --s-7: 2.5rem;   /* 40 */
  --s-8: 3rem;     /* 48 */
  --s-9: 4rem;     /* 64 */
  --s-10: 5rem;    /* 80 */
  --s-11: 6rem;    /* 96 */
  --s-12: 8rem;    /* 128 */
  --section: clamp(4rem, 1.6rem + 7.4vw, 8rem);  /* 64 → 128 */

  /* ---- Layout ---- */
  --container: 75rem;                            /* 1200 */
  --margin: clamp(1.25rem, 0.3rem + 4.2vw, 5rem); /* 20 → 80 */
  --gutter: clamp(1rem, 0.8rem + 0.6vw, 1.5rem);  /* 16 → 24 */
  --nav-h: 4rem;
  --measure: 66ch;

  /* ---- Radii: two, plus full for tags ---- */
  --r-1: 6px;    /* controls */
  --r-2: 12px;   /* cards, product frames, stages */
  --r-full: 999px;

  /* ---- Elevation: two ---- */
  --e-1: 0 0 0 1px var(--hairline), 0 1px 2px rgb(15 18 22 / 0.06);
  --e-2: 0 24px 48px -16px rgb(15 18 22 / 0.18), 0 0 0 1px rgb(15 18 22 / 0.06);

  /* ---- Motion: damped, settling; nothing bounces ---- */
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --dur-1: 160ms;  /* feedback */
  --dur-2: 320ms;  /* reveals */
}