/* ============================================================
   Martinelli Design System — Elevation, Radius, Motion
   Faithful to src/styles/tokens.css
   ============================================================ */

:root {
  /* === Shadows === */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.07);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.09);
  --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.12);
  --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.03);
  --shadow-overlay: 0 20px 60px rgba(0, 0, 0, 0.15);
  --shadow-focus: 0 0 0 3px #E8EFF9;
  --shadow-error: 0 0 0 3px #FCEAEA;

  /* === Border radius === */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 14px;
  --radius-2xl: 16px;
  --radius-3xl: 18px;
  --radius-full: 9999px;

  /* === Spacing scale (4px base) === */
  --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;

  /* === Motion — durations === */
  --duration-fast: 150ms;   /* @kind other */
  --duration-normal: 200ms; /* @kind other */
  --duration-slow: 300ms;   /* @kind other */
  --duration-slower: 350ms; /* @kind other */

  /* === Motion — easing === */
  --ease-default: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
}

/* === Keyframes === */
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }
@keyframes slideIn { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes slideInRight { from { opacity: 0; transform: translateX(30px); } to { opacity: 1; transform: translateX(0); } }
@keyframes slideUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

/* === Reduced motion === */
@media (prefers-reduced-motion: reduce) {
  *, ::before, ::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}