:root {
  /* Core Brand Variables */
  --brand-primary: #00C2FF;
  --brand-bg: #0F172A;
  --brand-secondary: #7C3AED;

  /* CSS Custom Properties Color Tokens */
  --color-gunmetal: #0F172A;
  --color-electric-cyan: #00C2FF;
  --color-vivid-purple: #7C3AED;

  /* Artie ⚡ 5-Color Mood Tokens */
  --artie-happy: #22C55E;
  --artie-excited: #EAB308;
  --artie-focused: #3B82F6;
  --artie-calm: #A855F7;
  --artie-alert: #EF4444;

  /* WCAG 2.2 AA Touch Target Standard Tokens (>= 48x48dp / 48x48px) */
  --touch-target-min-width: 48px;
  --touch-target-min-height: 48px;
  --touch-target-min-size: 48px;
}

/* WCAG 2.2 AA Touch Target Standard Helper Utility Class */
.touch-target-min {
  min-width: var(--touch-target-min-width);
  min-height: var(--touch-target-min-height);
}

/* Toast Progress & Entrance Keyframes */
@keyframes rt-toast-progress {
  from { width: 100%; }
  to { width: 0%; }
}

@keyframes rt-toast-slide-in {
  from { transform: translateX(100%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

@keyframes rt-toast-slide-out {
  from { transform: translateX(0); opacity: 1; }
  to { transform: translateX(100%); opacity: 0; }
}

.animate-rt-toast-progress {
  animation: rt-toast-progress 4s linear forwards;
}

.animate-rt-toast-slide-in {
  animation: rt-toast-slide-in 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-rt-toast-slide-out {
  animation: rt-toast-slide-out 0.25s ease-in forwards;
}