/* ── Ogleby effects: radii, borders, shadows, motion ───────────────
   The brand leans on FLAT high-contrast blocks and a signature hard
   offset shadow (the "sticker" look from the logo), not soft blur. */
:root {
  /* Corner radii — mostly crisp; pills for tags/switches */
  --radius-none: 0;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-xl: 22px;
  --radius-pill: 999px;

  /* Borders — the brand draws hard 2px black keylines */
  --border-w: 2px;
  --border-w-thick: 3px;

  /* Signature hard offset shadow (no blur) — the sticker pop */
  --shadow-hard-sm: 3px 3px 0 var(--og-black);
  --shadow-hard-md: 5px 5px 0 var(--og-black);
  --shadow-hard-lg: 8px 8px 0 var(--og-black);
  --shadow-hard-yellow: 5px 5px 0 var(--og-yellow);
  --shadow-hard-blue: 5px 5px 0 var(--og-blue);

  /* Soft shadows — used sparingly for floating UI (menus, toasts) */
  --shadow-soft-sm: 0 1px 2px rgba(18,18,18,0.08);
  --shadow-soft-md: 0 6px 20px rgba(18,18,18,0.12);
  --shadow-soft-lg: 0 18px 48px rgba(18,18,18,0.18);

  /* Motion — snappy, confident; slight overshoot on press-back */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);   /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast: 120ms;  /* @kind other */
  --dur-med: 200ms;   /* @kind other */
  --dur-slow: 360ms;  /* @kind other */
}