/* ==========================================================================
   Horizon Studio — Spacing, radii, borders, shadow, motion
   The system is built on a strict grid. Radii are minimal — the brand is
   square-edged and architectural; corners are sharp by default, with one
   small softening step reserved for inputs/controls. Elevation is expressed
   through hairline borders and flat ink blocks, not soft shadows.
   ========================================================================== */

:root {
  /* ---- Spacing scale (4px base grid) -------------------------------- */
  --space-0:   0;
  --space-1:   0.25rem;   /* 4  */
  --space-2:   0.5rem;    /* 8  */
  --space-3:   0.75rem;   /* 12 */
  --space-4:   1rem;      /* 16 */
  --space-5:   1.5rem;    /* 24 */
  --space-6:   2rem;      /* 32 */
  --space-7:   3rem;      /* 48 */
  --space-8:   4rem;      /* 64 */
  --space-9:   6rem;      /* 96 */
  --space-10:  8rem;      /* 128 */
  --space-11:  12rem;     /* 192 — section rhythm */

  /* ---- Layout ------------------------------------------------------- */
  --container-max: 1280px;
  --container-wide: 1600px;
  --gutter:        var(--space-5);
  --grid-cols:     12;    /* @kind other */

  /* ---- Radii — sharp by intent -------------------------------------- */
  --radius-none:  0;
  --radius-sm:    2px;     /* inputs, controls, tags                    */
  --radius-md:    4px;     /* cards, dialogs                            */
  --radius-pill:  999px;   /* reserved: avatars, status dots            */

  /* ---- Borders ------------------------------------------------------ */
  --bw-hair:   1px;        /* default structural rule                   */
  --bw-strong: 1.5px;      /* emphasis frame                            */
  --bw-heavy:  3px;        /* brand rule / underline accent             */

  /* ---- Elevation — flat, restrained --------------------------------- */
  --shadow-none: none;
  --shadow-sm:   0 1px 2px rgba(0,0,0,0.06);
  --shadow-md:   0 4px 16px rgba(0,0,0,0.08);
  --shadow-lg:   0 18px 48px rgba(0,0,0,0.14);
  /* On ink surfaces, depth is a hairline of light, not a shadow. */
  --ring-inset:  inset 0 0 0 1px var(--border-on-ink);

  /* ---- Motion — mechanical, precise, no bounce ---------- @kind other */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);      /* @kind other */
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);   /* @kind other */
  --ease-in:       cubic-bezier(0.7, 0, 0.84, 0);   /* @kind other */
  --dur-fast:   120ms;     /* @kind other */
  --dur-base:   200ms;     /* @kind other */
  --dur-slow:   360ms;     /* @kind other */
  --dur-reveal: 640ms;     /* @kind other */ /* editorial reveals */

  /* ---- Z-index -------------------------------------------- @kind other */
  --z-base:    0;          /* @kind other */
  --z-raised:  10;         /* @kind other */
  --z-sticky:  100;        /* @kind other */
  --z-overlay: 1000;       /* @kind other */
  --z-toast:   1100;       /* @kind other */
}