[data-theme="chaos"] {
  --ink: #0a0014;
  --panel: #120024;
  --plum: #1a0830;
  --background: var(--ink);
  --foreground: #eceaf2;
  --muted-foreground: #9a8aad;
  --headline: #eceaf2;
  --border: #3a1060;
  --accent: #b47aff;
  --accent-muted: #c86bff;
  --accent-secondary: #ff1744;
  --grid-line: rgba(168, 178, 193, 0.12);
  --grid-size: 28px;
  --grid-opacity: 1;
  --panel-shadow: 0 0 32px rgba(180, 122, 255, 0.08);
  --glow-accent: 0 0 22px rgba(180, 122, 255, 0.32);
  --btn-yes-bg: linear-gradient(135deg, #b47aff, #ff1744);
  --btn-yes-fg: #0a0014;
  --btn-yes-border: #b47aff;
  --btn-no-bg: transparent;
  --btn-no-fg: #9a8aad;
  --btn-no-border: #3a1060;
  --font-mono: "Comic Sans MS", "Comic Sans", cursive, sans-serif;
  --font-sans: "Comic Sans MS", "Comic Sans", cursive, sans-serif;
  --font-serif: "Comic Sans MS", "Comic Sans", cursive, sans-serif;
}

body[data-theme="chaos"] .step-title {
  font-style: normal;
  font-weight: 700;
  animation: chaosWiggle 2s ease-in-out infinite;
}

body[data-theme="chaos"] .btn-yes {
  background: linear-gradient(135deg, #b47aff, #ff1744);
  border-radius: 999px;
  font-weight: 700;
  animation: chaosPulse 1.5s ease infinite;
}

body[data-theme="chaos"] .btn-no {
  border-radius: 999px;
}

body[data-theme="chaos"] .panel {
  border-radius: 1rem;
  border-width: 2px;
  background-image:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size: 18px 18px;
  background-color: var(--panel);
}

body[data-theme="chaos"] .food-card.is-selected {
  animation: chaosBounce 0.5s ease;
}

body[data-theme="chaos"] .chip.is-selected,
body[data-theme="chaos"] .food-card.is-selected {
  box-shadow: var(--glow-accent);
}

@keyframes chaosWiggle {
  0%,
  100% {
    transform: rotate(-1deg);
  }
  50% {
    transform: rotate(1deg);
  }
}

@keyframes chaosPulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}

@keyframes chaosBounce {
  0%,
  100% {
    transform: scale(1.04);
  }
  50% {
    transform: scale(1.12);
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-theme="chaos"] .step-title,
  body[data-theme="chaos"] .btn-yes {
    animation: none;
  }

  body[data-theme="chaos"] .food-card.is-selected {
    animation: none;
  }
}