/* Хэллоуинская тема. Подключается, только если в config/config.php: 'halloween' => ['enabled' => true]. */
html.halloween {
  --background: oklch(0.13 0.035 300);
  --card: oklch(0.175 0.04 300);
  --card-foreground: oklch(0.98 0.01 70);
  --foreground: oklch(0.97 0.012 75);
  --primary: oklch(0.74 0.19 52);
  --primary-foreground: oklch(0.16 0.03 300);
  --accent: oklch(0.66 0.23 305);
  --accent-foreground: oklch(0.98 0.01 70);
  --muted: oklch(0.22 0.035 300);
  --muted-foreground: oklch(0.74 0.03 300);
  --border: oklch(0.29 0.045 300);
  --input: oklch(0.29 0.045 300);
  --ring: oklch(0.74 0.19 52);
  --shadow-glow: 0 0 60px oklch(0.74 0.19 52 / 0.45);
}
html.halloween ::selection { background: oklch(0.74 0.19 52 / 0.45); color: #fff; }
html.halloween img[src*="chili-hero"] { filter: hue-rotate(38deg) saturate(0.85) brightness(0.9); }

/* общее тёмно-фиолетовое/оранжевое свечение по краям экрана */
html.halloween body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 39;
  background:
    radial-gradient(ellipse 80% 40% at 50% 112%, rgba(255, 120, 20, 0.14), transparent 70%),
    radial-gradient(ellipse 70% 35% at 50% -12%, rgba(130, 70, 230, 0.2), transparent 70%),
    radial-gradient(ellipse at center, transparent 55%, rgba(8, 2, 18, 0.45) 100%);
}

/* Декор привязан к странице (прокручивается вместе с ней): слой во всю высоту документа */
.hw-layer { position: absolute; left: 0; top: 0; width: 100%; overflow: hidden; pointer-events: none; z-index: 38; }

/* туман — пятна, дрейфующие по страницам (анимация только transform → без перерисовки) */
.hw-fogp { position: absolute; left: 0; width: 200%; height: 260px; opacity: 0.5; will-change: transform;
  background-image: radial-gradient(ellipse 22% 50% at 20% 60%, rgba(190, 160, 255, 0.2), transparent 70%), radial-gradient(ellipse 26% 45% at 62% 55%, rgba(255, 170, 90, 0.14), transparent 70%), radial-gradient(ellipse 20% 50% at 90% 65%, rgba(190, 160, 255, 0.16), transparent 70%);
  background-size: 25% 100%; animation: hw-fog 120s linear infinite; }
.hw-fogp.rev { animation-direction: reverse; animation-duration: 170s; opacity: 0.4; }
@keyframes hw-fog { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-50%, 0, 0); } }

/* паутина */
.hw-web { position: absolute; aspect-ratio: 1; color: #e6dcff; opacity: 0.5; }
.hw-web.r { transform: scaleX(-1); }

/* тыквы стоят на карточках и в углах страницы */
.hw-pumpkin { position: absolute; pointer-events: auto; width: 54px; height: 49px; cursor: pointer; border: 0; padding: 0; background: none; -webkit-tap-highlight-color: transparent; transition: transform 0.2s; transform-origin: bottom center; }
.hw-pumpkin::before { content: ''; position: absolute; inset: -40%; border-radius: 50%; background: radial-gradient(circle, rgba(255,140,30,0.5), transparent 65%); animation: hw-glow 2.4s ease-in-out infinite; pointer-events: none; z-index: -1; }
.hw-pumpkin svg { position: relative; display: block; }
.hw-pumpkin:hover { transform: scale(1.12) rotate(-4deg); }
.hw-pumpkin:active { transform: scale(0.94); }
@keyframes hw-glow { 0%, 100% { opacity: 0.6; } 50% { opacity: 1; } }
@media (max-width: 640px) { .hw-pumpkin { width: 42px; height: 38px; } }

/* паук на нити */
.hw-spider { position: absolute; width: 34px; }
.hw-spider .thread { position: absolute; left: 50%; bottom: 100%; width: 1px; background: rgba(230, 220, 255, 0.55); height: 0; }
.hw-spider .body { display: block; width: 34px; height: 34px; transform-origin: top center; animation: hw-swing 3.4s ease-in-out infinite; }
@keyframes hw-swing { 0%, 100% { transform: rotate(-4deg); } 50% { transform: rotate(4deg); } }

/* вспышка молнии */
.hw-flash { display: none; position: fixed; inset: 0; z-index: 44; pointer-events: none; background: rgba(190, 170, 255, 0.55); opacity: 0; mix-blend-mode: screen; }
.hw-flash.go { animation: hw-flash 0.9s ease-out; }
@keyframes hw-flash { 0% { opacity: 0; } 6% { opacity: 0.55; } 14% { opacity: 0.08; } 22% { opacity: 0.4; } 100% { opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  .hw-fogp, .hw-pumpkin::before, .hw-spider .body { animation: none; }
}