/* Halloween look (Oct 24 to Nov 1). Everything is scoped to html.sbHalloween, which halloween.js sets.
   To remove it for good: delete halloween.css + halloween.js and their two lines in index.html, sw.js and deploy-files.txt. */
.hwDeco,.hwCard,.hwGhost{display:none}
html.sbHalloween .hwDeco,html.sbHalloween .hwGhost{display:block}
html.sbHalloween .hwCard{display:block}

/* Header: night sky, full moon, bats, orange divider */
html.sbHalloween body>header{background:radial-gradient(120% 140% at 70% 0%,#2a1d45 0%,#161a2e 45%,#111827 100%);border-bottom-color:#f97316}
html.sbHalloween .header-inner{z-index:1}
.hwDeco{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.hwMoon{position:absolute;top:22px;right:330px;width:58px;height:58px;border-radius:50%;background:radial-gradient(circle at 38% 36%,#fff8e1 0%,#fde9b0 55%,#f3cf7a 100%);box-shadow:0 0 22px 6px rgba(253,224,150,.28)}
.hwMoon:before,.hwMoon:after{content:"";position:absolute;border-radius:50%;background:rgba(214,170,90,.35)}
.hwMoon:before{width:12px;height:12px;top:14px;left:30px}.hwMoon:after{width:8px;height:8px;top:34px;left:16px}
.hwStar{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;opacity:.55}
.hwBat{position:absolute;width:34px;height:16px;color:#05070d;opacity:.9}
.hwBat svg{width:100%;height:100%;display:block}
.hwBat.b1{top:26px;right:390px;animation:hwFly 7s ease-in-out infinite}
.hwBat.b2{top:62px;right:250px;width:24px;height:12px;animation:hwFly 9s ease-in-out -3s infinite}
.hwBat.b3{top:14px;left:46%;width:20px;height:10px;animation:hwFly 8s ease-in-out -5s infinite}
.hwBat svg{animation:hwFlap .5s ease-in-out infinite alternate;transform-origin:50% 40%}
@keyframes hwFly{0%,100%{transform:translate(0,0)}50%{transform:translate(-18px,8px)}}
@keyframes hwFlap{from{transform:scaleY(1)}to{transform:scaleY(.55)}}

/* Little ghost floating over the stretcher */
.hwGhost{position:absolute;right:146px;bottom:76px;width:44px;height:54px;z-index:1;pointer-events:none;animation:hwBob 3.2s ease-in-out infinite}
.hwGhost svg{width:100%;height:100%;display:block;filter:drop-shadow(0 0 8px rgba(255,255,255,.35))}
@keyframes hwBob{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-7px) rotate(3deg)}}

/* Kicker under the site name */
.hwKicker{display:none}
html.sbHalloween .hwKicker{display:inline-flex;align-items:center;gap:7px;width:max-content;max-width:100%;margin-top:2px;padding:3px 10px 3px 6px;border-radius:999px;background:rgba(249,115,22,.16);border:1px solid rgba(249,115,22,.5);color:#fdba74;font-size:.82rem;font-weight:650;letter-spacing:.02em}
.hwKicker svg{width:18px;height:18px;flex:none}

/* Accents: orange where the site used navy lines; text stays navy/ink for reading */
html.sbHalloween .tabs.tabs button[aria-selected="true"]{border-bottom-color:#ea580c}
html.sbHalloween .homeIco{background:#FFEDD5;color:#9A3412}
html.sbHalloween .homeTiles .homeTile:hover{border-color:#ea580c;background:#FFF7ED}
html.sbHalloween .homeTiles .homeTile.homeFeature{border-color:var(--blue)}
html.sbHalloween .homeTiles .homeTile.homeFeature .homeIco{background:#E3E9F3;color:var(--blue)}
html.sbHalloween .sbNav>.sbOn .sbIco{background:#FFEDD5}
html.sbHalloween .sbNav>.sbOn{color:#9A3412}

/* Home card: poisons and antidotes quiz */
.hwCard{position:relative;overflow:hidden;border:1px solid #fdba74;border-radius:12px;margin:0 0 26px;padding:18px 18px 16px;background:linear-gradient(135deg,#FFF7ED 0%,#FFEDD5 100%);color:var(--ink)}
.hwWeb{position:absolute;top:0;right:0;width:92px;height:92px;opacity:.4;pointer-events:none;color:#9A3412}
.hwWeb svg{width:100%;height:100%;display:block}
.hwCard>*:not(.hwWeb){position:relative}
.hwHead{display:flex;align-items:center;gap:12px;margin:0 0 6px}
.hwHead svg{width:40px;height:40px;flex:none}
.hwHead h3{margin:0;font-size:1.12rem;font-weight:750;line-height:1.3}
.hwCard p{margin:0 0 12px}
.hwCard .hwSub{color:#5b3a1e;font-size:.95rem}
.hwCard button.primary{background:#9A3412;border-color:#9A3412;color:#fff}
.hwCard button.primary:hover{background:#7c2d12}
.hwQ{font-weight:700;margin:4px 0 10px;line-height:1.45}
.hwCount{font-size:.85rem;color:#7c4a24;font-weight:650;margin:0 0 4px}
.hwOpts{display:grid;gap:8px;margin:0 0 12px}
.hwOpts button{width:100%;text-align:left;min-height:46px;background:#fff;font-weight:600}
.hwOpts button[disabled]{cursor:default;opacity:1}
.hwOpts button.hwRight{background:#DCFCE7;border-color:#15803d;color:#14532d}
.hwOpts button.hwWrong{background:#FEE2E2;border-color:#b91c1c;color:#7f1d1d}
.hwWhy{background:#fff;border-left:3px solid #9A3412;border-radius:6px;padding:10px 12px;margin:0 0 12px;font-size:.95rem}
.hwScore{font-size:1.05rem;font-weight:700}
.hwOff{background:none;border:0;min-height:0;padding:4px 0;color:#7c4a24;font-weight:600;font-size:.88rem;text-decoration:underline;text-underline-offset:2px}
.hwOff:hover{background:none;color:#9A3412}
.hwActs{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}

/* Footer switch (shows all season, even when the look is off) */
.hwSwitch{margin:14px 0 0;font-size:.9rem;color:var(--muted)}
.hwSwitch button{min-height:34px;padding:4px 12px;margin-left:6px;font-size:.88rem}

@media(max-width:700px){
 .hwMoon{top:8px;right:auto;left:58%;width:34px;height:34px;box-shadow:0 0 14px 4px rgba(253,224,150,.25)}
 .hwMoon:before{width:7px;height:7px;top:8px;left:18px}.hwMoon:after{width:5px;height:5px;top:20px;left:9px}
 .hwBat.b1{top:44px;right:auto;left:57%;width:22px;height:11px}
 .hwBat.b2{display:none}
 .hwBat.b3{top:48px;left:auto;right:8px;width:16px;height:8px}
 .hwGhost{right:98px;bottom:62px;width:28px;height:34px}
 html.sbHalloween .hwKicker{font-size:.74rem;padding:2px 8px 2px 4px}
 .hwKicker svg{width:15px;height:15px}
 .hwCard{padding:16px 14px 14px;margin-bottom:20px}
 .hwWeb{width:64px;height:64px;opacity:.3}
 .hwHead h3{padding-right:30px}
}
@media (prefers-reduced-motion:reduce){.hwBat,.hwBat svg,.hwGhost{animation:none!important}}

/* Darker, ghostlier, witchier (Aaron 2026-10-29) */
html.sbHalloween,html.sbHalloween body{background:#0a0812}
html.sbHalloween body>header{background:radial-gradient(120% 160% at 72% 0%,#24163d 0%,#0d0a18 55%,#06050b 100%);border-image:linear-gradient(90deg,#f97316,#a855f7 55%,#22c55e) 1}
html.sbHalloween main{position:relative;z-index:1}
.hwMoon{width:66px;height:66px;top:16px;right:360px;background:radial-gradient(circle at 38% 36%,#fffbeb 0%,#fde9b0 55%,#e9c36a 100%);box-shadow:0 0 30px 10px rgba(253,224,150,.2)}
.hwMoon:before,.hwMoon:after{display:none}
.hwWitch{position:absolute;top:18px;right:336px;width:104px;height:58px;animation:hwRide 6s ease-in-out infinite}
.hwWitch svg,.hwSpook svg,.hwSpider svg,.hwHaunt svg{width:100%;height:100%;display:block}
.hwSpook{position:absolute;opacity:.7;filter:drop-shadow(0 0 6px rgba(255,255,255,.35))}
.hwSpook.s1{top:70px;left:40%;width:26px;height:32px;animation:hwFloat 7s ease-in-out infinite}
.hwSpook.s2{top:12px;left:56%;width:18px;height:22px;opacity:.5;animation:hwFloat 9s ease-in-out -3s infinite}
.hwSpider{position:absolute;top:0;left:33%;width:18px;height:42px;transform-origin:50% 0;animation:hwDangle 5s ease-in-out infinite}
.hwFog{position:absolute;left:-10%;right:-10%;bottom:-6px;height:40px;background:radial-gradient(40% 60% at 20% 70%,rgba(210,200,240,.16),transparent 70%),radial-gradient(35% 60% at 55% 80%,rgba(210,200,240,.13),transparent 70%),radial-gradient(40% 60% at 85% 70%,rgba(190,240,210,.10),transparent 70%);animation:hwFog 14s ease-in-out infinite alternate}
.hwHaunt{display:none}
html.sbHalloween .hwHaunt{display:block;position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden;background:radial-gradient(60% 50% at 8% 85%,rgba(124,58,237,.18),transparent 70%),radial-gradient(50% 40% at 95% 60%,rgba(34,197,94,.08),transparent 70%)}
.hwHaunt .g{position:absolute;opacity:.09}
.hwHaunt .g.a{left:2%;top:34%;width:110px;height:134px;animation:hwFloat 11s ease-in-out infinite}
.hwHaunt .g.b{right:2%;top:58%;width:90px;height:110px;animation:hwFloat 13s ease-in-out -5s infinite}
.hwHaunt .g.c{left:3%;top:80%;width:60px;height:74px;opacity:.06;animation:hwFloat 10s ease-in-out -2s infinite}
@keyframes hwRide{0%,100%{transform:translate(0,0) rotate(-3deg)}50%{transform:translate(-10px,4px) rotate(2deg)}}
@keyframes hwFloat{0%,100%{transform:translate(0,0)}50%{transform:translate(10px,-10px)}}
@keyframes hwDangle{0%,100%{transform:translateY(-4px) rotate(-4deg)}50%{transform:translateY(4px) rotate(4deg)}}
@keyframes hwFog{from{transform:translateX(0)}to{transform:translateX(6%)}}
html.sbHalloween .hwKicker{background:rgba(168,85,247,.16);border-color:rgba(168,85,247,.55);color:#e9d5ff}
.hwCard{border-color:#c4b5fd;background:linear-gradient(135deg,#F5F3FF 0%,#EDE9FE 100%)}
.hwCard .hwSub{color:#4c1d95}
.hwCard button.primary{background:#6d28d9;border-color:#6d28d9}
.hwCard button.primary:hover{background:#5b21b6}
.hwWeb{color:#6d28d9}
.hwCount{color:#5b21b6}
.hwWhy{border-left-color:#6d28d9}
.hwOff{color:#5b21b6}.hwOff:hover{color:#4c1d95}
@media(max-width:700px){
 .hwMoon{top:8px;left:56%;width:42px;height:42px}
 .hwWitch{top:10px;right:auto;left:calc(56% - 14px);width:70px;height:40px}
 .hwSpook,.hwSpider{display:none}
 .hwBat.b1{top:58px;left:48%}
}
@media (prefers-reduced-motion:reduce){.hwWitch,.hwSpook,.hwSpider,.hwFog,.hwHaunt .g{animation:none!important}}

/* Flying bats (Aaron 2026-10-29: "Add bats") */
.hwFlock{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.hwFlock .fb{position:absolute;left:100%;animation:hwCross var(--d,14s) linear var(--w,0s) infinite}
.hwFlock .fb>span{display:block;animation:hwWave var(--wv,2.6s) ease-in-out infinite alternate}
.hwFlock .fb svg{display:block;width:var(--s,30px);height:calc(var(--s,30px)*.46);color:#140b22;filter:drop-shadow(0 0 1.5px #d8b4fe) drop-shadow(0 0 7px rgba(168,85,247,.7));animation:hwFlapF var(--fl,.32s) ease-in-out infinite alternate;transform-origin:50% 50%}
@keyframes hwFlapF{from{transform:scaleY(1)}to{transform:scaleY(.2)}}
@keyframes hwCross{from{transform:translateX(0)}to{transform:translateX(calc(-100vw - 160px))}}
@keyframes hwWave{from{transform:translateY(-10px)}to{transform:translateY(12px)}}
@media(prefers-reduced-motion:reduce){.hwFlock{display:none}}
