/* Seasonal Halloween skin. Everything is scoped to body.halloween, which halloween.js only adds on desktop during the Halloween window. */
.hw-toggle{display:none}
@media (min-width:861px) and (hover:hover) and (pointer:fine){
  .hw-toggle{display:block;position:absolute;right:12px;bottom:34px;z-index:1200;padding:6px 12px;border-radius:999px;border:1px solid rgba(255,140,30,.55);background:rgba(18,8,26,.75);color:#ffb347;font-size:11px;font-weight:600;letter-spacing:.4px;text-transform:none;cursor:pointer;opacity:.7;transition:opacity .2s}
  .hw-toggle:hover,.hw-toggle:focus-visible{opacity:1}
  .hw-fx{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
  .hw-fx[hidden]{display:none}
  .hw-moon{position:absolute;top:14px;right:76px;width:84px;height:84px;border-radius:50%;opacity:.95;
    background:
      radial-gradient(circle at 30% 34%,rgba(120,70,20,.38) 0 7px,transparent 8px),
      radial-gradient(circle at 62% 26%,rgba(120,70,20,.3) 0 5px,transparent 6px),
      radial-gradient(circle at 58% 62%,rgba(120,70,20,.4) 0 11px,transparent 12px),
      radial-gradient(circle at 26% 68%,rgba(120,70,20,.28) 0 6px,transparent 7px),
      radial-gradient(circle at 76% 52%,rgba(120,70,20,.26) 0 4px,transparent 5px),
      radial-gradient(circle at 36% 32%,#ffd9a0 0,#f3a850 55%,#d9772a 100%);
    box-shadow:0 0 18px 4px rgba(255,150,40,.45),0 0 70px 24px rgba(255,110,20,.22)}
  .hw-moon::after{content:"";position:absolute;left:-26px;top:22px;width:34px;height:14px;background:#07040c;opacity:.9;
    clip-path:polygon(0 50%,18% 10%,36% 40%,50% 0,64% 40%,82% 10%,100% 50%,82% 70%,64% 55%,50% 100%,36% 55%,18% 70%);animation:hwmoonbat 6s ease-in-out infinite alternate}
  @keyframes hwmoonbat{from{transform:translate(18px,14px) scale(.9)}to{transform:translate(70px,-4px) scale(1.1)}}
  .hw-fog{position:absolute;left:-30%;width:160%;bottom:0;height:38%;opacity:.5;pointer-events:none;filter:blur(18px);will-change:transform;
    background:radial-gradient(closest-side at 15% 70%,rgba(150,110,200,.5),transparent),radial-gradient(closest-side at 45% 80%,rgba(120,90,180,.45),transparent),radial-gradient(closest-side at 75% 65%,rgba(180,140,220,.42),transparent),radial-gradient(closest-side at 95% 85%,rgba(140,100,190,.4),transparent);
    animation:hwfog 50s ease-in-out infinite alternate}
  .hw-fog2{height:28%;opacity:.38;animation-duration:75s;animation-direction:alternate-reverse}
  @keyframes hwfog{from{transform:translateX(-8%)}to{transform:translateX(8%)}}
  .hw-bat{position:absolute;left:-90px;width:44px;color:#07040c;filter:drop-shadow(0 0 2px rgba(0,0,0,.5));animation:hwbat 24s linear infinite,hwflap .32s ease-in-out infinite alternate}
  .hw-bat svg{display:block;width:100%;height:auto}
  .hw-bat1{top:14%;animation-delay:2s,0s}
  .hw-bat2{top:32%;width:34px;animation-duration:30s,.27s;animation-delay:11s,0s}
  .hw-bat3{top:22%;width:52px;animation-duration:36s,.36s;animation-delay:19s,0s}
  @keyframes hwbat{0%{transform:translateX(0) translateY(0)}18%{transform:translateX(45vw) translateY(26px)}36%{transform:translateX(115vw) translateY(-14px)}100%{transform:translateX(115vw) translateY(-14px)}}
  @keyframes hwflap{from{scale:1 1}to{scale:1 .55}}

  body.halloween{background:#0a0610}
  body.halloween header{border-bottom-color:rgba(255,140,30,.22)}
  body.halloween header h1{background:linear-gradient(135deg,#ff8c1e,#b595ff);-webkit-background-clip:text;background-clip:text}
  body.halloween #stage{background:radial-gradient(circle at center,#2a1440,#0a0610);box-shadow:0 0 44px rgba(255,120,30,.22)}
  body.halloween .leaflet-container{background:#1c0f2a}
  body.halloween .leaflet-popup-content-wrapper,body.halloween .leaflet-popup-tip{background:#1c1030}
  body.halloween #panel{background:rgba(26,14,40,.97)}
  body.halloween #panel.pinned{border-color:#ff8c1e}
  body.halloween aside{background:rgba(30,16,46,.95);border-color:rgba(255,140,30,.18)}
  body.halloween h3{color:#ffb347}
  body.halloween .stat b,body.halloween .pc h4,body.halloween .foot a{color:#ffb347}
  body.halloween .plist a{border-bottom-color:#ff8c1e}
  body.halloween .plist a:hover{color:#ffb347;border-color:#ffb347}
  body.halloween .plist .tag{color:#ffb347;border-color:rgba(255,179,71,.55)}
  body.halloween input:focus,body.halloween select:focus{border-color:#ff8c1e}
  body.halloween .primary{background:linear-gradient(135deg,#ffb347,#ff8c1e);color:#1a0a02}
  body.halloween .compass{color:#ff8c1e}
}
@media (prefers-reduced-motion:reduce){.hw-fog,.hw-bat,.hw-moon::after{animation:none!important}.hw-bat{display:none}}
