/* ============================================================
   Elysium+ Design System — Effects, Shadows & Motion Tokens
   ============================================================ */

:root {
  /* ── Shadows (warm-tinted, editorial) ── */
  --shadow-none:     none;
  --shadow-xs:       0 1px 2px rgba(22, 58, 112, 0.06);
  --shadow-sm:       0 2px 8px rgba(22, 58, 112, 0.08),
                     0 1px 2px rgba(22, 58, 112, 0.04);
  --shadow-md:       0 4px 16px rgba(22, 58, 112, 0.10),
                     0 2px 4px rgba(22, 58, 112, 0.06);
  --shadow-lg:       0 8px 32px rgba(22, 58, 112, 0.12),
                     0 4px 8px rgba(22, 58, 112, 0.06);
  --shadow-xl:       0 16px 48px rgba(22, 58, 112, 0.14),
                     0 8px 16px rgba(22, 58, 112, 0.06);
  --shadow-2xl:      0 32px 80px rgba(22, 58, 112, 0.18);

  /* ── Semantic Shadows ── */
  --shadow-card:     var(--shadow-sm);
  --shadow-card-hover: var(--shadow-md);
  --shadow-stamp:    inset 0 0 0 2px rgba(22, 58, 112, 0.60),
                     0 2px 8px rgba(22, 58, 112, 0.12);
  --shadow-ticket:   var(--shadow-md);
  --shadow-modal:    var(--shadow-2xl);
  --shadow-button:   0 2px 8px rgba(22, 58, 112, 0.20);
  --shadow-button-hover: 0 4px 16px rgba(22, 58, 112, 0.28);

  /* ── Borders ── */
  --border-thin:   1px solid var(--color-border);
  --border-mid:    1px solid var(--color-border-strong);
  --border-thick:  2px solid var(--color-border-strong);
  --border-stamp:  2px dashed rgba(22, 58, 112, 0.40); /* @kind other */
  --border-ticket: 1px solid var(--color-ivory-700);   /* @kind other */

  /* ── Transitions ── */
  --duration-fast:    120ms; /* @kind other */
  --duration-normal:  220ms; /* @kind other */
  --duration-slow:    380ms; /* @kind other */
  --duration-slower:  600ms; /* @kind other */

  --ease-out:       cubic-bezier(0.16, 1, 0.3, 1);  /* @kind other */
  --ease-in-out:    cubic-bezier(0.4, 0, 0.2, 1);   /* @kind other */
  --ease-spring:    cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */

  --transition-fast:   all var(--duration-fast) var(--ease-out);   /* @kind other */
  --transition-normal: all var(--duration-normal) var(--ease-out); /* @kind other */
  --transition-slow:   all var(--duration-slow) var(--ease-out);   /* @kind other */

  /* ── Opacity ── */
  --opacity-disabled: 0.40; /* @kind other */
  --opacity-muted:    0.60; /* @kind other */
  --opacity-subtle:   0.75; /* @kind other */

  /* ── Blur ── */
  --blur-sm:   4px;  /* @kind other */
  --blur-md:   12px; /* @kind other */
  --blur-lg:   24px; /* @kind other */
  --blur-glass: 20px; /* @kind other */
}