/* ===== Halloween Week 2026 look =====
   Loaded by partials/header.php only while the event runs (Oct 25 to Nov 1 UTC)
   or when a visitor previews it with ?halloween=preview.
   Everything is scoped to body.halloween so nothing leaks if the class is missing.
   No backdrop-filter anywhere (it makes text soft). */

body.halloween {
  --hw-orange: #ff7a18;
  --hw-orange-text: #ff9a4d;
  --hw-purple: #8b5cf6;
  --hw-purple-text: #b9a2ff;
  --rd-yellow: #ff8a2a;
  --rd-purple: #b9a2ff;
  --accent-primary: #ff8a2a;
  --accent-purple: #b9a2ff;
  --link-color: #ff9a4d;
  --header-color: #ff8a2a;
  --border-color: rgba(255, 122, 24, 0.28);
  --bar-gold-start: #ffb347;
  --bar-gold-end: #ff7a18;
  --bar-third-start: #b9a2ff;
  --bar-third-end: #8b5cf6;
  --card-glow: 0 0 30px rgba(255, 122, 24, 0.15);
  background:
    radial-gradient(1100px 520px at 50% -80px, rgba(139, 92, 246, 0.16), transparent 70%) no-repeat,
    var(--bg-primary);
}
/* Classic theme: keep it calm, just swap the yellow for a pumpkin orange */
body.classic.halloween {
  --rd-yellow: #f0883e;
  --accent-primary: #58a6ff;
  --link-color: #58a6ff;
  --border-color: rgba(240, 136, 62, 0.35);
  --bar-gold-start: #f0883e;
  --bar-gold-end: #d0701f;
  background: #0d1117;
}

/* Header: pumpkin by the logo, a spooky underline */
body.halloween header.site-header { border-bottom: 1px solid rgba(255, 122, 24, 0.45); box-shadow: 0 1px 0 rgba(139, 92, 246, 0.35); }
body.halloween .site-header .sh-logo { gap: 2px; position: relative; }
.hw-pumpkin { display: none; }
body.halloween .site-header .sh-logo .hw-pumpkin { display: block; flex: 0 0 auto; margin-left: -4px; align-self: flex-end; margin-bottom: 4px; }
@media (max-width: 480px) {
  body.halloween .site-header .sh-logo .hw-pumpkin { width: 26px; height: 24px; margin-bottom: 2px; }
}
body.halloween .site-header nav ul#nav-menu > li > a:hover { color: var(--hw-orange-text); }
body.halloween .site-header nav ul#nav-menu > li > a.nav-current { box-shadow: inset 0 -2px 0 var(--hw-orange); }

/* Ticker: LIVE becomes BOO! */
body.halloween .rd-ticker { background: rgba(139, 92, 246, 0.08); }
body.halloween .rd-ticker-label { color: var(--hw-orange-text); border-right-color: rgba(255, 122, 24, 0.4); letter-spacing: 3px; }
body.halloween .rd-ticker-label .rd-dot.pink { background: var(--hw-orange); box-shadow: 0 0 10px var(--hw-orange); }
body.halloween .rd-ticker-item.steal .t-tag,
body.halloween .rd-ticker-item.steal .t-pts { color: var(--hw-purple-text); }

/* Homepage touches */
body.halloween #intro-hero.rd-hero {
  border-color: rgba(255, 122, 24, 0.5);
  background: linear-gradient(160deg, rgba(255, 122, 24, 0.12), rgba(139, 92, 246, 0.06) 45%, rgba(10, 14, 23, 0.6) 75%);
}
body.classic.halloween #intro-hero.rd-hero { background: #161b22; border-color: rgba(240, 136, 62, 0.5); }
body.halloween #bounty-card.rd-bounty { border-color: rgba(255, 122, 24, 0.45); }
body.halloween .rd-section > h2.rd-h::after {
  content: '';
  display: inline-block;
  width: 26px; height: 11px;
  margin-left: 10px;
  vertical-align: middle;
  background: var(--hw-purple);
  opacity: 0.7;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M50 14c-2-5-6-6-6-6s1 4-1 6c-6-6-16-9-28-6 6 2 9 6 9 10-6-2-12-1-17 3 9-1 15 2 18 7 3-4 8-5 13-3 2-3 5-5 8-5h8c3 0 6 2 8 5 5-2 10-1 13 3 3-5 9-8 18-7-5-4-11-5-17-3 0-4 3-8 9-10-12-3-22 0-28 6-2-2-1-6-1-6s-4 1-6 6z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M50 14c-2-5-6-6-6-6s1 4-1 6c-6-6-16-9-28-6 6 2 9 6 9 10-6-2-12-1-17 3 9-1 15 2 18 7 3-4 8-5 13-3 2-3 5-5 8-5h8c3 0 6 2 8 5 5-2 10-1 13 3 3-5 9-8 18-7-5-4-11-5-17-3 0-4 3-8 9-10-12-3-22 0-28 6-2-2-1-6-1-6s-4 1-6 6z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Bats: a fixed layer behind the content, so they never cover text */
.hw-bats { display: none; }
body.halloween .hw-bats {
  display: block;
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: -1;
}
.hw-bat { position: absolute; width: 46px; height: 19px; fill: rgba(185, 162, 255, 0.42); }
.hw-bat.b1 { top: 14%; left: -60px; animation: hw-fly 46s linear infinite, hw-flap 1.4s ease-in-out infinite; }
.hw-bat.b2 { top: 38%; left: -60px; width: 30px; height: 12px; fill: rgba(255, 154, 77, 0.38); animation: hw-fly 64s linear -22s infinite, hw-flap 1.1s ease-in-out infinite; }
.hw-bat.b3 { top: 70%; left: -60px; width: 38px; height: 16px; animation: hw-fly 82s linear -50s infinite, hw-flap 1.7s ease-in-out infinite; }
body.classic .hw-bat { fill: rgba(139, 148, 158, 0.28); }
@keyframes hw-fly {
  0%   { translate: 0 0; }
  25%  { translate: 30vw -26px; }
  50%  { translate: 60vw 10px; }
  75%  { translate: 90vw -18px; }
  100% { translate: calc(100vw + 120px) 0; }
}
@keyframes hw-flap {
  0%, 100% { scale: 1 1; }
  50% { scale: 1 0.55; }
}
@media (prefers-reduced-motion: reduce) {
  .hw-bat { animation: none !important; }
  .hw-bat.b1 { left: auto; right: 6%; top: 18%; }
  .hw-bat.b2 { left: 4%; top: 44%; }
  .hw-bat.b3 { left: auto; right: 12%; top: 76%; }
}
@media print { .hw-bats { display: none !important; } }