/* ============================================================
   GridNorth Studio — Elevation, Radii & Borders
   Calm, credible surfaces. Shadows are soft and navy-tinted
   (never gray), corners are modestly rounded (4–12px), borders
   are hairline neutrals. No glow, no heavy drop shadows.
   ============================================================ */

:root {
  /* ---- Corner radii -------------------------------------- */
  --radius-xs:   3px;   /* chips, tags, table cells        */
  --radius-sm:   6px;   /* buttons, inputs, badges         */
  --radius-md:   10px;  /* cards, panels                   */
  --radius-lg:   16px;  /* feature tiles, modals           */
  --radius-pill: 999px; /* pills, avatars, toggles         */

  /* ---- Border widths ------------------------------------- */
  --border-hairline: 1px;
  --border-thick:    2px;
  --border-accent:   3px; /* left-accent rules, active tab  */

  /* ---- Shadows (navy-tinted, soft) ----------------------- */
  --shadow-xs:  0 1px 2px rgba(13, 34, 58, 0.06);
  --shadow-sm:  0 1px 3px rgba(13, 34, 58, 0.08), 0 1px 2px rgba(13, 34, 58, 0.04);
  --shadow-md:  0 4px 12px rgba(13, 34, 58, 0.10), 0 2px 4px rgba(13, 34, 58, 0.05);
  --shadow-lg:  0 12px 32px rgba(13, 34, 58, 0.14), 0 4px 8px rgba(13, 34, 58, 0.06);
  --shadow-focus: 0 0 0 3px var(--focus-ring);

  /* ---- Motion -------------------------------------------- *
   * Quick, professional, no bounce. Ease-out for entrances,
   * standard ease for state changes.                          */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --dur-fast:   120ms; /* @kind other */
  --dur-base:   180ms; /* @kind other */
  --dur-slow:   280ms; /* @kind other */
}