/* ============================================================
   Tiiiime — Spacing, radius, elevation tokens
   ------------------------------------------------------------
   Pulled from the literal padding / cornerRadius / shadow values
   used across the app's SwiftUI views. macOS UI is tight and
   quiet: small paddings, soft continuous-corner rounding, and
   restrained shadows reserved for floating glass surfaces.
   ============================================================ */

:root {
  /* ---- Spacing scale (px) --------------------------------- */
  --space-1: 1px;    /* hairline gap between list rows           */
  --space-2: 2px;
  --space-4: 4px;
  --space-6: 6px;    /* row inner padding                        */
  --space-8: 8px;
  --space-10: 10px;
  --space-12: 12px;  /* default stack gap                        */
  --space-14: 14px;  /* popover horizontal inset                 */
  --space-16: 16px;  /* card padding                             */
  --space-18: 18px;  /* QuickStart header inset                  */
  --space-20: 20px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;  /* QuickStart panel outer breathing room    */

  /* ---- Corner radii --------------------------------------- */
  /* macOS uses "continuous" (squircle) corners. Approximate in
     CSS by pairing border-radius with the values below.        */
  --radius-6: 6px;    /* list / popover row                      */
  --radius-8: 8px;    /* sidebar selection pill, chip            */
  --radius-10: 10px;  /* stat card, grouped container            */
  --radius-12: 12px;  /* sheet field                             */
  --radius-16: 16px;  /* floating glass panel (QuickStart)       */
  --radius-22: 22px;  /* chat bubble                             */
  --radius-pill: 999px; /* menu-bar status pill, capsule buttons */

  /* ---- Borders -------------------------------------------- */
  --border-hairline: 0.5px;   /* retina hairline — card strokes  */
  --border-1: 1px;
  --border-strong: 1.5px;     /* focus ring, selected radio      */

  /* ---- Elevation / shadows -------------------------------- */
  /* Reserved for surfaces that genuinely float: the menu-bar
     popover, QuickStart panel, sheets. Inset content uses fills
     and hairline strokes, never drop shadows.                  */
  --shadow-card:
    0 0.5px 1px rgba(0, 0, 0, 0.04),
    0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-popover:
    0 4px 16px rgba(0, 0, 0, 0.12),
    0 1px 3px rgba(0, 0, 0, 0.10);
  --shadow-panel:
    0 20px 60px rgba(0, 0, 0, 0.28),
    0 4px 14px rgba(0, 0, 0, 0.16);
  /* Accent glow — onboarding primary CTA / live timer pulse.    */
  --glow-accent: 0 0 24px rgba(10, 132, 255, 0.45);

  /* ---- Motion --------------------------------------------- */
  /* SwiftUI .smooth / .spring(response:dampingFraction:). Quiet,
     short, no bounce on functional UI; a gentle spring only for
     glass morph + selection.                                   */
  --ease-smooth: cubic-bezier(0.33, 0, 0.2, 1);   /* @kind other */ /* .smooth */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);  /* @kind other */
  --ease-draw: cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */ /* wordmark pen */
  --dur-fast: 0.15s; /* @kind other */
  --dur-base: 0.22s; /* @kind other */
  --dur-slow: 0.28s; /* @kind other */
  --spring-select: 0.28s cubic-bezier(0.34, 1.2, 0.64, 1); /* @kind other */
}