/* Halloween-only finishing layer for the existing retro layout.
   Keep this separate from the shared stylesheet and other seasonal themes. */
[data-halloween="true"] {
  --primary: #ff9a48;
  --primary-hover: #ffc080;
  --primary-focus: rgba(255, 154, 72, .22);
  --primary-inverse: #241327;
  --dark-color: #ffcc99;
  --ink: #1e1224;
  --paper: #f3ecdc;
}

/* Retire the old emoji stand-ins, not the floating illustration concept.
   Real aria-hidden SVG nodes are mounted by halloween-decorations.js. */
[data-halloween="true"] nav::before,
[data-halloween="true"] nav::after,
[data-halloween="true"] main::before,
[data-halloween="true"] .menu-section::after,
[data-halloween="true"] .review-card::after,
[data-halloween="true"] footer::after,
[data-halloween="true"]::after {
  content: none;
  animation: none;
}

/* No full-page brightness animation: it also creates a containing block
   for fixed illustrations and makes reading the menu unnecessarily busy. */
[data-halloween="true"] body { animation: none; }
[data-halloween="true"] h1,
[data-halloween="true"] h2,
[data-halloween="true"] h3 {
  animation: none;
  text-shadow: 2px 3px 0 #301638;
}
[data-halloween="true"] .menu-section::before,
[data-halloween="true"] .review-card::before,
[data-halloween="true"] .recommendation-card::before { animation: none; }

/* Keep the purple menu overlays, now with the print-like edge and shadow
   of the new retro layout. Warm orange prices remain the reading anchor. */
[data-halloween="true"] .menu-section {
  background: linear-gradient(135deg, rgba(82, 37, 106, .94), rgba(44, 22, 61, .98));
  border-color: #a86bb6;
  box-shadow: 5px 6px 0 rgba(16, 8, 22, .55);
}
[data-halloween="true"] .menu-section h4 {
  color: #f3dfed;
  border-bottom-color: #c58acb;
}
[data-halloween="true"] .menu-section .menu-item {
  background: rgba(25, 13, 35, .44);
  border-left-color: #c57a43;
}
[data-halloween="true"] .menu-section .menu-item:hover {
  background: rgba(113, 62, 137, .45);
}
[data-halloween="true"] .menu-section .menu-item.featured {
  border-color: #e9a55b;
  background: rgba(154, 82, 48, .23);
}
[data-halloween="true"] .menu-item span:last-child { color: #ffb96d; }
[data-halloween="true"] .mobile-nav-menu {
  background: #321c46;
  border-left-color: #a86bb6;
}

/* Selected existing banners, not new content blocks. Decorations occupy
   reserved edge space and never sit over banner copy or controls. */
[data-halloween="true"] .menu-highlight,
[data-halloween="true"] .specials-banner {
  position: relative;
  background: #d87a31;
  border: 2px solid #f0b363;
  box-shadow: 6px 7px 0 #241329;
  padding-left: clamp(30px, 6vw, 82px);
  padding-right: clamp(30px, 6vw, 82px);
}
[data-halloween="true"] .menu-highlight h4,
[data-halloween="true"] .specials-banner h4 { color: #25152d; }
[data-halloween="true"] .menu-highlight p {
  color: #ffead0;
  background: #643b2a;
  text-shadow: none;
}
[data-halloween="true"] .top-ticker {
  background: #321c46;
  color: #f6d5b0;
  border-bottom-color: #a86bb6;
}
[data-halloween="true"] .top-ticker .tick-star { color: #f6ae65; }
[data-halloween="true"] .hero-hgroup { position: relative; padding-top: 24px; }
.halloween-edition,
.halloween-web,
.halloween-banner-bat,
.halloween-heading-pumpkin,
.halloween-floaters,
.halloween-floater {
  pointer-events: none !important;
  user-select: none;
}
.halloween-edition,
.halloween-web,
.halloween-banner-bat,
.halloween-heading-pumpkin,
.halloween-floaters { display: none; }
[data-halloween="true"] .halloween-edition {
  display: block;
  position: absolute;
  top: -10px;
  left: 0;
  font: 700 10px/1.5 'Space Mono', monospace;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: #e9c0ec;
  border-bottom: 1px dashed #a86bb6;
  padding-bottom: 4px;
}
[data-halloween="true"] .halloween-web {
  display: block;
  position: absolute;
  width: 62px;
  height: 88px;
  top: -2px;
  right: -2px;
  z-index: 1;
  transform-origin: top right;
}
[data-halloween="true"] .halloween-banner-bat {
  display: block;
  position: absolute;
  left: -17px;
  top: -20px;
  width: 58px;
  height: 34px;
  transform: rotate(-14deg);
  animation: scran-bat-perch 8s ease-in-out infinite;
}
[data-halloween="true"] main section > h3.halloween-heading {
  padding-right: 60px;
  position: relative;
}
[data-halloween="true"] .halloween-heading-pumpkin {
  display: block;
  position: absolute;
  right: 5px;
  top: 0;
  width: 40px;
  height: 40px;
  transform: rotate(9deg);
}
[data-halloween="true"] .halloween-floaters {
  display: block;
  position: fixed;
  inset: 0;
  z-index: 2;
  overflow: hidden;
}
.halloween-floater {
  display: block;
  position: absolute;
  /* Outer gutters only. Never fly through the reading column. */
  width: clamp(26px, calc((100vw - 1200px) / 2 - 24px), 72px);
  height: auto;
  filter: drop-shadow(2px 4px 0 rgba(12, 7, 18, .25));
}
.halloween-floater--ghost {
  right: max(8px, calc((100vw - 1380px) / 4));
  top: 230px;
  animation: scran-ghost-drift 7.6s ease-in-out infinite;
}
.halloween-floater--bat {
  left: max(8px, calc((100vw - 1380px) / 4));
  top: 310px;
  animation: scran-bat-drift 9.4s ease-in-out -3s infinite;
}
.halloween-floater--small-bat {
  right: max(10px, calc((100vw - 1380px) / 4));
  top: 69%;
  width: 42px;
  animation: scran-bat-drift 11.8s ease-in-out -6s infinite reverse;
}
/* Restrained reference-led caution tape, with small distressed ink flecks.
   Own flow space prevents the crisscross from obscuring headings or prices. */
.halloween-tape-break { display: none; }
[data-halloween="true"] .halloween-tape-break {
  display: block;
  width: min(100%, 460px);
  height: 76px;
  margin: 2.5rem auto 1.25rem;
  position: relative;
  pointer-events: none;
  user-select: none;
  overflow: hidden;
}
.halloween-tape {
  display: block;
  position: absolute;
  left: 4%;
  top: 22px;
  width: 92%;
  height: 28px;
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
  font: 800 14px/22px 'Bricolage Grotesque', sans-serif;
  letter-spacing: .06em;
  text-transform: uppercase;
  border-top: 3px dashed currentColor;
  border-bottom: 3px dashed currentColor;
}
.halloween-tape::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(105deg, transparent 0 38px, rgba(243, 236, 220, .35) 39px 40px, transparent 41px 47px);
  opacity: .7;
}
.halloween-tape--yellow {
  color: #29202a;
  background: #e9bd43;
  transform: rotate(-6deg);
}
.halloween-tape--ink {
  top: 32px;
  left: 16%;
  width: 72%;
  color: #e7e0ce;
  background: #29202a;
  transform: rotate(7deg);
  border-style: dotted;
  font: 700 11px/22px 'Space Mono', monospace;
}
[data-halloween="true"] .halloween-tape-break--zombie {
  margin: -2rem auto 1.5rem;
  height: 55px;
  width: min(90%, 380px);
}
.halloween-tape--red {
  background: #e4dac5;
  color: #a33427;
  transform: rotate(-3deg);
  font-size: 12px;
}
@keyframes scran-ghost-drift {
  0%, 100% { transform: translate(0, 0) rotate(-6deg); }
  50% { transform: translate(-4px, -14px) rotate(5deg); }
}
@keyframes scran-bat-drift {
  0%, 100% { transform: translate(0, 0) rotate(-9deg); }
  35% { transform: translate(5px, -12px) rotate(6deg); }
  70% { transform: translate(2px, 8px) rotate(-3deg); }
}
@keyframes scran-bat-perch {
  0%, 85%, 100% { transform: rotate(-14deg); }
  90% { transform: rotate(-6deg) translateY(-3px); }
  95% { transform: rotate(-17deg); }
}
/* On smaller screens the desktop gutters disappear. Move illustrations to
   reserved hero space instead of floating them over the menu while scrolling. */
@media (max-width: 1320px) {
  [data-halloween="true"] .hero-hgroup { padding-top: 68px; }
  [data-halloween="true"] .halloween-floaters {
    position: absolute;
    inset: 12px 0 auto;
    height: 58px;
    /* Allow the ghost's upward drift beyond this short hero-only container. */
    overflow: visible;
  }
  .halloween-floater--ghost { top: 0; right: 10px; width: 40px; }
  .halloween-floater--bat { top: 15px; left: auto; right: 72px; width: 50px; }
  .halloween-floater--small-bat { display: none; }
}
@media (max-width: 768px) {
  [data-halloween="true"] .halloween-edition { font-size: 8px; letter-spacing: .1em; }
  [data-halloween="true"] .halloween-web { width: 36px; height: 52px; }
  [data-halloween="true"] .halloween-banner-bat { width: 42px; left: -8px; top: -17px; }
  [data-halloween="true"] .menu-highlight,
  [data-halloween="true"] .specials-banner { padding: 1.6rem 1.9rem; }
  [data-halloween="true"] .halloween-heading-pumpkin { width: 30px; height: 30px; }
  .halloween-tape { font-size: 11px; letter-spacing: .02em; }
  .halloween-tape--ink { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-halloween="true"] .halloween-floater,
  [data-halloween="true"] .halloween-banner-bat,
  [data-halloween="true"] .open-status-badge,
  [data-halloween="true"] .open-status .status-main {
    animation: none !important;
  }
}