/* ============================================================
   AcePrep — Radii & Shadows
   Rounded corners everywhere — friendly but restrained. Shadows
   are soft and low; the brand leans on the dark OUTLINE to define
   surfaces rather than heavy drop shadows.
   ============================================================ */

:root {
  /* ---- Border radius ---- */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;      /* default for inputs / small cards */
  --radius-lg: 18px;      /* white framed content boxes */
  --radius-xl: 24px;      /* large container cards / stages */
  --radius-2xl: 32px;     /* hero panels */
  --radius-pill: 9999px;  /* pills, nav buttons, number badges */

  /* ---- Border widths ---- */
  --border-hairline: 1px;
  --border-frame: 1.5px;  /* the signature dark box outline */
  --border-frame-bold: 2px;

  /* ---- Shadows (soft, low) ---- */
  --shadow-none: none;
  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.06);
  --shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 8px 20px -12px rgba(15, 23, 42, 0.25);
  --shadow-lg: 0 16px 40px -22px rgba(15, 23, 42, 0.35);
  --shadow-card: 0 10px 30px -18px rgba(15, 23, 42, 0.30);  /* framed boxes lift */
  --shadow-button: 0 8px 16px -10px rgba(15, 23, 42, 0.45);

  /* ---- Motion ---- */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);  /* @kind other */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);       /* @kind other */
  --duration-fast: 0.12s;                          /* @kind other */
  --duration-base: 0.2s;                           /* @kind other */
  --duration-slow: 0.32s;                          /* @kind other */
}