/* TheraBee — spacing, radii, shadows, motion */
:root{
  --space-0:0;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;
  --space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;

  /* Radii — soft, never sharp. Cards ~24px (p.13–14 mockups), buttons/inputs fully pill. */
  --radius-xs:6px;--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px;--radius-pill:999px;
  --radius-card:var(--radius-lg);
  --radius-button:var(--radius-pill);
  --radius-input:var(--radius-pill);
  --radius-bubble:18px;

  /* Shadows — the brand is flat; shadows are used sparingly for floating UI only. Never on the logo. */
  --shadow-none:none;
  --shadow-sm:0 1px 2px rgba(59,60,60,.08);
  --shadow-md:0 6px 20px rgba(59,60,60,.10);
  --shadow-lg:0 18px 48px rgba(59,60,60,.16);
  --shadow-focus:0 0 0 3px rgba(0,92,117,.35);

  --blur-glass:16px;

  --ease-standard:cubic-bezier(.2,.7,.2,1); /* @kind other */
  --ease-gentle:cubic-bezier(.33,1,.68,1); /* @kind other */
  --dur-fast:120ms; /* @kind other */
  --dur-base:200ms; /* @kind other */
  --dur-slow:360ms; /* @kind other */

  --container-max:1200px;
  --logo-min-width:180px;   /* 1.5" / 180px horizontal lockup minimum */
  --mark-min-width:32px;    /* 0.35" / 32px mark minimum */
}