:root {
  /* ── Border radius ─────────────────────────────── */
  --radius-none: 0px;     /* dividers, thread lines */
  --radius-sm: 6px;       /* chips, small buttons */
  --radius-md: 12px;      /* DEFAULT — cards, inputs, buttons, panels */
  --radius-lg: 16px;      /* modals, image previews */
  --radius-xl: 20px;      /* large/featured containers */
  --radius-full: 9999px;  /* avatars, badges, pill buttons */

  /* ── Elevation — light & diffused ──────────────── */
  --shadow-subtle: 0 1px 2px rgba(0,0,0,0.04);
  --shadow-medium: 0 2px 8px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-large: 0 8px 24px rgba(0,0,0,0.08), 0 2px 8px rgba(0,0,0,0.04);
  --shadow-overlay: 0 16px 48px rgba(0,0,0,0.12), 0 4px 12px rgba(0,0,0,0.06);

  /* Blue focus ring — 2px page-colored ring + 4px blue */
  --focus-ring: 0 0 0 2px var(--gray-50), 0 0 0 4px var(--edu-blue-500);

  /* ── Motion ────────────────────────────────────── */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --dur-fast: 120ms;   /* @kind other */
  --dur-base: 200ms;   /* @kind other */
  --tooltip-enter: 400ms; /* @kind other */
}