/* ============================================================
   Effects — radius, borders, shadows, motion
   The system is flat: borders + subtle elevation, not heavy drop shadows.
   ============================================================ */
:root {
  /* ---- Corner radius ---- */
  --radius-xs: 5px;    /* badges, small pills */
  --radius-sm: 8px;    /* buttons, chips */
  --radius-md: 11px;   /* inputs, code blocks */
  --radius-lg: 14px;   /* cards */
  --radius-xl: 16px;   /* large panels */
  --radius-pill: 999px;

  /* ---- Borders ---- */
  --border-width: 1px;
  --border-width-strong: 1.5px;
  --border-width-card: 2px;

  /* ---- Elevation (used sparingly on dark) ---- */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.25);
  --shadow-md: 0 6px 20px rgba(0, 0, 0, 0.35);
  --shadow-glow: 0 14px 40px rgba(43, 166, 232, 0.35);  /* azure glow */

  /* ---- Motion ---- */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1); /* @kind other */
  --duration-fast: 120ms; /* @kind other */
  --duration-base: 200ms; /* @kind other */
}