/* Two-layer elevation: a 1px contact shadow plus a wide diffuse one.
   That pairing is the difference between "a card" and "a premium card". */
:root{
  --shadow-xs: 0 1px 2px rgba(28,26,46,0.04);
  --shadow-sm: 0 1px 2px rgba(28,26,46,0.04), 0 4px 12px -4px rgba(28,26,46,0.07);
  --shadow-md: 0 1px 2px rgba(28,26,46,0.04), 0 12px 28px -10px rgba(28,26,46,0.11);
  --shadow-lg: 0 1px 2px rgba(28,26,46,0.04), 0 20px 44px -14px rgba(28,26,46,0.15);
  --shadow-primary: 0 1px 2px rgba(85,65,184,0.30), 0 6px 16px -4px rgba(106,82,224,0.32);
  --ring-default: inset 0 0 0 1px #E6E4EF; /* @kind other */
  --ring-primary: inset 0 0 0 1px #6A52E0; /* @kind other */
  --ring-primary-thick: inset 0 0 0 1.5px #6A52E0; /* @kind other */
  --ring-tint: inset 0 0 0 1px #DDD7FB; /* @kind other */
}