/* ── Jetgam radius, depth & motion ────────────────────────────────────
   Prefer thin hairline borders over shadows. Any shadow is soft, large-blur,
   low-opacity. Motion is subtle and slow (200–400ms). */

:root {
  /* Corner radius */
  --radius-sm:   8px;    /* inputs, small chips */
  --radius-md:   12px;   /* buttons */
  --radius-lg:   16px;   /* cards */
  --radius-xl:   24px;   /* large feature panels */
  --radius-pill: 999px;  /* pill buttons, tags */

  /* Depth — soft, large-blur, low-opacity. Hairline borders do most of the work. */
  --shadow-none: none;
  --shadow-sm:   0 1px 2px rgba(12, 20, 24, 0.04);
  --shadow-md:   0 8px 24px rgba(12, 20, 24, 0.06);
  --shadow-lg:   0 24px 60px rgba(12, 20, 24, 0.08);
  --shadow-focus: var(--focus-ring);

  /* Motion — calm and slow */
  --ease-standard: cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */   /* default ease-out */
  --ease-inout:    cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast:   180ms; /* @kind other */
  --dur-base:   260ms; /* @kind other */
  --dur-slow:   360ms; /* @kind other */
  --transition: all var(--dur-base) var(--ease-standard); /* @kind other */
}