/* ============================================================
   Parastatiko — Elevation & motion tokens
   Synced from the Claude Design project. Borders do the
   structural work; shadows only lift floating surfaces.
   ============================================================ */

:root {
  /* ---- Shadows (soft, cool-tinted) --------------------------- */
  --shadow-none:  none;
  --shadow-xs:    0 1px 1px rgba(22, 27, 33, 0.03);
  --shadow-sm:    0 1px 2px rgba(22, 27, 33, 0.05),
                  0 1px 3px rgba(22, 27, 33, 0.04);
  --shadow-md:    0 2px 4px rgba(22, 27, 33, 0.05),
                  0 4px 12px rgba(22, 27, 33, 0.06);
  --shadow-lg:    0 6px 16px rgba(22, 27, 33, 0.08),
                  0 2px 6px rgba(22, 27, 33, 0.05);
  --shadow-xl:    0 16px 40px rgba(22, 27, 33, 0.14),
                  0 4px 12px rgba(22, 27, 33, 0.08);
  --shadow-inset: inset 0 1px 2px rgba(22, 27, 33, 0.06);

  /* ---- Motion ------------------------------------------------ */
  --ease-standard: cubic-bezier(0.2, 0, 0.1, 1);
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:       cubic-bezier(0.4, 0, 1, 1);

  --duration-fast:   120ms;
  --duration-base:   180ms;
  --duration-slow:   260ms;

  --transition-colors: color var(--duration-fast) var(--ease-standard),
                       background-color var(--duration-fast) var(--ease-standard),
                       border-color var(--duration-fast) var(--ease-standard),
                       box-shadow var(--duration-fast) var(--ease-standard);

  /* ---- Z-index ----------------------------------------------- */
  --z-base:     0;
  --z-sticky:   100;
  --z-dropdown: 400;
  --z-overlay:  800;
  --z-modal:    900;
  --z-toast:    1000;
}