/* ============================================================
   Sinh Vũ — Radius, elevation, border & motion tokens
   Slightly rounded, not soft. Subtle tactile shadows.
   ============================================================ */

:root {
  /* ---- Border radius ---- */
  --radius-sm: 6px;   /* small components: chips, inputs, badges */
  --radius-md: 12px;  /* cards, buttons */
  --radius-lg: 20px;  /* large panels */
  --radius-xl: 28px;  /* hero / feature panels */
  --radius-pill: 999px; /* used rarely — tags, avatars only */
  --radius-round: 50%;

  /* ---- Border widths ---- */
  --border-hairline: 1px;
  --border-medium:   1.5px;

  /* ---- Elevation — soft, minimal, tactile (light surfaces) ---- */
  --shadow-xs: 0 1px 2px rgba(3, 29, 68, 0.06);
  --shadow-sm: 0 1px 2px rgba(3, 29, 68, 0.06),
               0 2px 6px rgba(3, 29, 68, 0.05);
  --shadow-md: 0 2px 4px rgba(3, 29, 68, 0.05),
               0 8px 20px rgba(3, 29, 68, 0.08);
  --shadow-lg: 0 4px 8px rgba(3, 29, 68, 0.06),
               0 18px 40px rgba(3, 29, 68, 0.12);
  --shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.5);

  /* Press / embossed paper feel */
  --shadow-pressed: inset 0 2px 4px rgba(3, 29, 68, 0.12);

  /* Shadows tuned for dark navy surfaces */
  --shadow-dark-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-dark-md: 0 6px 18px rgba(0, 0, 0, 0.34);
  --shadow-dark-lg: 0 16px 44px rgba(0, 0, 0, 0.44);

  /* ---- Motion — slow, confident, no bounce ---- */
  --ease-out:   cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-in-out:cubic-bezier(0.45, 0, 0.2, 1); /* @kind other */
  --dur-fast:   140ms; /* @kind other */
  --dur-base:   240ms; /* @kind other */
  --dur-slow:   420ms; /* @kind other */
  --dur-reveal: 640ms; /* @kind other */

  /* ---- Focus ring offset ---- */
  --focus-offset: 2px;

  /* ---- Z-index scale ---- */
  --z-base:    1; /* @kind other */
  --z-sticky:  100; /* @kind other */
  --z-overlay: 1000; /* @kind other */
  --z-modal:   1100; /* @kind other */
  --z-toast:   1200; /* @kind other */
}
