/* Halloween 2026 (Oct 29 to Nov 8), loaded by {ss_halloween} with halloween-2026.js. Comes out after Nov 8.
   Speed rules: only transform and opacity animate, loops pause off screen, pictures load after the page,
   and people who turned off motion get still frames. */
:root{--hw-night:#0e0a17;--hw-pumpkin:#eb8c23;--hw-ember:#ff9f3a;--hw-candle:#ffc46b;--hw-bone:#efe6d8}

/* ---------- every page: bats roosting under the menu ---------- */
.hw-roost-host{position:relative}
.hw-roost{position:absolute;left:0;top:0;width:100%;height:46px;z-index:30;pointer-events:none}
.hw-roost.under{top:calc(100% - 2px)}
html.hw-off .hw-roost{display:none}
.hw-rb{position:absolute;top:-3px;width:41px;height:41px;margin-left:-20.5px;transform:scale(var(--s,1));transform-origin:50% 0;transition:opacity .12s;pointer-events:auto}
.hw-rb i{position:absolute;inset:0;background:url(../images/seasonal/halloween-2026/roost.webp) 0 0/205px 40.5px no-repeat;transform-origin:50% 0}
.hw-rb.gone{opacity:0;pointer-events:none}

/* ---------- effects layer: built on demand, removed when done ---------- */
.hw-fx{position:fixed;inset:0;pointer-events:none;z-index:99990;overflow:hidden;contain:layout paint style}
.hwc{position:absolute;left:0;top:0;width:30px;height:30px;margin:-15px 0 0 -15px;background:url(../images/seasonal/halloween-2026/candy.webp) 0 0/180px 30px no-repeat;will-change:transform,opacity}
.hwe{position:absolute;left:0;top:0;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:radial-gradient(circle,#fff6cf 0%,#ffb13b 45%,rgba(255,120,30,0) 72%);will-change:transform,opacity}
.hwb{position:absolute;left:0;top:0;width:40px;height:30px;margin:-15px 0 0 -20px;will-change:transform,opacity}
.hwb i{position:absolute;inset:0;background:url(../images/seasonal/halloween-2026/bats.webp) 0 0/200px 30px no-repeat;opacity:0;animation:.3s linear infinite}
.hwb i:nth-child(1){animation-name:hwb-f1}.hwb i:nth-child(2){background-position:-80px 0;animation-name:hwb-f2}.hwb i:nth-child(3){background-position:-160px 0;animation-name:hwb-f3}
@keyframes hwb-f1{0%,33%{opacity:1}34%,100%{opacity:0}}@keyframes hwb-f2{0%,33%{opacity:0}34%,66%{opacity:1}67%,100%{opacity:0}}@keyframes hwb-f3{0%,66%{opacity:0}67%,100%{opacity:1}}
.hw-swarm .hwb{width:56px;height:42px;margin:-21px 0 0 -28px}.hw-swarm .hwb i{background-size:280px 42px}.hw-swarm .hwb i:nth-child(2){background-position:-112px 0}.hw-swarm .hwb i:nth-child(3){background-position:-224px 0}
.hws{position:absolute;left:0;top:0;width:22px;height:22px;margin:-11px;border-radius:50%;background:radial-gradient(closest-side,rgba(200,195,215,.55),rgba(200,195,215,0));will-change:transform,opacity}
.hw-ghost-rise{position:absolute;width:44px;height:71px;margin:-60px 0 0 -22px;background:url(../images/seasonal/halloween-2026/ghost.webp) center/contain no-repeat;will-change:transform,opacity}

/* ---------- the haunted look (panel pages and the order form) ---------- */
/* moonlight behind everything, drawn once */
html.hw-on body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(70% 55% at 88% -8%,rgba(150,120,255,.22),transparent 70%),radial-gradient(55% 45% at 4% 104%,rgba(235,140,35,.14),transparent 70%),linear-gradient(180deg,rgba(24,14,40,.55),rgba(10,7,18,.35))}
/* low fog along the bottom of the screen */
.hw-mist{position:fixed;left:0;right:0;bottom:0;height:30vh;z-index:40;pointer-events:none;overflow:hidden;display:none}
html.hw-on .hw-mist{display:block}
.hw-mist i{position:absolute;left:-25%;width:150%;bottom:-6vh;height:100%;
  background:radial-gradient(30% 55% at 18% 82%,rgba(214,204,244,.2),transparent 70%),radial-gradient(26% 50% at 52% 92%,rgba(214,204,244,.17),transparent 70%),radial-gradient(30% 55% at 84% 84%,rgba(214,204,244,.18),transparent 70%);
}
.hw-mist i+i{bottom:-12vh;opacity:.8;transform:translateX(7%)}
/* the title band at night: moon, castle, drifting mist */
html.hw-on .hw-band{background-image:linear-gradient(90deg,rgba(9,6,16,.78) 0%,rgba(9,6,16,.35) 34%,rgba(9,6,16,0) 62%),url(../images/seasonal/halloween-2026/band-night.webp)!important;background-size:cover!important;background-position:center 26%!important;position:relative;overflow:hidden}
html.hw-on .hw-band h1,html.hw-on .c2tb-title{color:#fff2df;text-shadow:0 2px 18px rgba(0,0,0,.7)}
html.hw-on .hw-newbtn{border-color:var(--hw-pumpkin)!important;color:var(--hw-candle)!important;box-shadow:0 0 18px -6px rgba(255,140,40,.8)}
/* cobwebs in box corners */
html.hw-on .hw-web::before{content:"";position:absolute;z-index:6;top:0;left:0;width:130px;height:130px;pointer-events:none;background:url(../images/seasonal/halloween-2026/cobweb.webp) 0 0/contain no-repeat;opacity:.78}
html.hw-on .hw-web-r::before{left:auto;right:0;transform:scaleX(-1)}
/* a spider on its thread; it climbs up if you go for it */
.hw-spider{position:absolute;z-index:7;top:0;left:var(--sl,54%);right:var(--sr,auto);width:34px;height:var(--sh,110px);pointer-events:none;display:none}
html.hw-on .hw-spider{display:block}
.hw-spider .swing{position:absolute;inset:0;transform-origin:50% 0;animation:hw-sway 5.5s ease-in-out 2}
.hw-spider .line{position:absolute;left:50%;top:0;width:1px;height:100%;margin-left:-.5px;transform-origin:50% 0;background:linear-gradient(180deg,rgba(220,214,240,.15),rgba(220,214,240,.75));transition:transform .45s cubic-bezier(.3,.7,.4,1)}
.hw-spider .bug{position:absolute;left:-4px;bottom:-14px;width:42px;height:40px;pointer-events:auto;background:url(../images/seasonal/halloween-2026/spider.webp) center/contain no-repeat;transition:transform .45s cubic-bezier(.3,.7,.4,1)}
.hw-spider.up .line{transform:scaleY(.22)}
.hw-spider.up .bug{transform:translateY(-94px)}
@keyframes hw-sway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@media (max-width:767px){.hw-spider{left:auto;right:14px;height:44px}.hw-spider.up .bug{transform:translateY(-30px)}}
/* a ghost that peeks from behind a box's right edge, inside its own clip */
.hw-ghost-clip{position:absolute;z-index:4;top:0;right:0;bottom:0;width:90px;overflow:hidden;pointer-events:none;display:none}
html.hw-on .hw-ghost-clip{display:block}
.hw-ghost{position:absolute;right:0;bottom:4px;width:70px;height:113px;background:url(../images/seasonal/halloween-2026/ghost.webp) right bottom/contain no-repeat;pointer-events:auto;transform:translateX(100%)}
/* the off switch in the title band */
.c2titleband .container{position:relative}
.hw-toggle{position:absolute;right:15px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border-radius:20px;background:rgba(10,7,18,.55);font:600 13px/1 'Open Sans',sans-serif;color:var(--hw-bone);cursor:pointer;user-select:none;white-space:nowrap;z-index:5}
.hw-toggle input{position:absolute;opacity:0;pointer-events:none}
.hw-toggle .sw{width:34px;height:20px;border-radius:20px;background:#3a3346;position:relative;transition:background .25s}
.hw-toggle .sw::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#cfc7da;transition:transform .25s}
.hw-toggle input:checked + .sw{background:var(--hw-pumpkin)}
.hw-toggle input:checked + .sw::after{transform:translateX(14px);background:#fff}
.hw-toggle .pk{width:18px;height:18px;background:url(../images/seasonal/halloween-2026/pk-dot-lit.webp) center/contain no-repeat}
@media (max-width:767px){.hw-toggle .lbl{display:none}}
/* keep the band's words clear of the off switch */
html.hw-on .c2titleband .c2tb-text{padding-right:170px}
@media (max-width:767px){html.hw-on .c2titleband .c2tb-text{padding-right:78px}}
/* the same switch as a button beside Buy Upgrades: only the pumpkin and a warm edge set it apart */
.pv2-cardact.hw-evbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;color:var(--hw-ember);border-color:rgba(235,140,35,.55);box-shadow:0 0 12px -4px rgba(235,140,35,.55)}
.hw-evbtn .e-pk{width:18px;height:18px;flex:none;margin:-3px 0;background:url(../images/seasonal/halloween-2026/pk-dot-lit.webp) center/contain no-repeat}
.pv2-cardact.hw-evbtn.done{color:var(--hw-candle);border-color:rgba(239,230,216,.25);box-shadow:none;cursor:default}

/* ---------- server list ---------- */
html.hw-on .pv2-gc-dot{width:20px!important;height:20px!important;border-radius:0!important;background:url(../images/seasonal/halloween-2026/pk-dot-unlit.webp) center/contain no-repeat!important;box-shadow:none!important;animation:none!important;position:relative;vertical-align:-4px;margin-left:8px}
html.hw-on .pv2-gc-dot::before{display:none!important}
html.hw-on .pv2-gc-dot.is-online{background-image:url(../images/seasonal/halloween-2026/pk-dot-lit.webp)!important}
html.hw-on .pv2-gc-dot::after{content:""!important;position:absolute!important;inset:-10px!important;border-radius:50%!important;background:radial-gradient(closest-side,rgba(255,165,55,.6),rgba(255,120,30,0))!important;opacity:0;transform:none!important;border:0!important;animation:none!important}
html.hw-on .pv2-gc-dot.is-online::after{opacity:.9}
@keyframes hw-breathe{0%,100%{opacity:1}38%{opacity:.72}55%{opacity:.9}80%{opacity:.8}}
html.hw-on body.pnv2 .pv2-gcard{--gc-glow:#ff9a33;border-color:rgba(235,140,35,.28);box-shadow:0 12px 34px -22px rgba(255,140,40,.55)}
html.hw-on body.pnv2 .pv2-gcard:hover{border-color:rgba(255,150,50,.6);box-shadow:0 0 30px -8px rgba(255,140,40,.7)}

/* ---------- a server's own page ---------- */
html.hw-on .pv2-powergroup ~ *,html.hw-on .panel:has(.pv2-powergroup){border-color:rgba(235,140,35,.32)}
html.hw-on .panel:has(.pv2-powergroup),html.hw-on .pv2-toolsbar{box-shadow:0 14px 40px -26px rgba(255,140,40,.6)}
html.hw-on .pv2-pw-start:not([disabled]){border-color:rgba(235,140,35,.55)!important;color:var(--hw-candle)!important}
/* the status pill: an unlit jack-o'-lantern when stopped, a lit one when running */
html.hw-on .hw-pill,html.hw-on body.pnv2 .pv2-gsinfo .pv2-dv .hw-pill.pv2-pill,html.hw-on body.pnv2 .pv2-gsinfo .pv2-dline .hw-pill.pv2-pill{position:relative!important;padding-left:30px!important}
html.hw-on .hw-pill i{display:none}
html.hw-on .hw-pill::before{content:"";position:absolute;left:6px;top:50%;width:20px;height:20px;margin-top:-10px;background:url(../images/seasonal/halloween-2026/pk-dot-unlit.webp) center/contain no-repeat}
html.hw-on .hw-pill.ok::before{background-image:url(../images/seasonal/halloween-2026/pk-dot-lit.webp)}
html.hw-on .hw-pill.ok::after{content:"";position:absolute;left:-4px;top:50%;width:40px;height:40px;margin-top:-20px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,165,55,.55),rgba(255,120,30,0));pointer-events:none}
/* tool tiles warm up on hover, and the launch settings tool says what's new */
html.hw-on .pv2-tool:hover{border-color:rgba(255,150,50,.65)!important;box-shadow:0 0 22px -8px rgba(255,140,40,.8)!important}
.hw-toolbadge{position:absolute;top:-9px;right:8px;display:none;align-items:center;gap:5px;padding:3px 8px 3px 5px;border-radius:12px;background:#2a1a10;border:1px solid rgba(235,140,35,.7);font:800 10px/1 'Open Sans',sans-serif;letter-spacing:.8px;text-transform:uppercase;color:var(--hw-candle);white-space:nowrap;pointer-events:none}
html.hw-on .hw-toolbadge{display:inline-flex}
.hw-toolbadge i{width:13px;height:13px;background:url(../images/seasonal/halloween-2026/pk-dot-lit.webp) center/contain no-repeat}

/* ---------- the order form ---------- */
html.hw-on .hw-coupon{border-color:rgba(235,140,35,.7)!important;background:rgba(60,30,10,.45)!important;color:var(--hw-candle)!important}
html.hw-on .hw-coupon .check{display:inline-block;width:16px;height:16px;font-size:0;vertical-align:-3px;background:url(../images/seasonal/halloween-2026/pk-dot-lit.webp) center/contain no-repeat}
html.hw-on .hw-due{border-color:rgba(235,140,35,.45)!important;box-shadow:0 0 0 1px rgba(235,140,35,.2),0 18px 44px -26px rgba(255,140,40,.7)}
.hw-due-pk{position:absolute;top:-22px;right:-14px;width:46px;height:46px;background:url(../images/seasonal/halloween-2026/pk-lit.webp) center/contain no-repeat;pointer-events:none;display:none}
html.hw-on .hw-due-pk{display:block}
.hw-due-pk::after{content:"";position:absolute;inset:-12px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,165,55,.45),rgba(255,120,30,0))}
html.hw-on .hw-orderbtn{box-shadow:0 0 26px -6px rgba(255,140,40,.9)!important}
@media (max-width:767px){.hw-due-pk{right:-4px;top:-18px;width:38px;height:38px}}

/* ---------- night bands: dark, eyes in the dark, lightning now and then ---------- */
/* a little more sky for the season */
html.hw-on .c2titleband.hw-band{height:132px}
@media (max-width:991px){html.hw-on .c2titleband.hw-band{height:auto;min-height:126px;padding-top:38px}}
html.hw-on .parallax.hw-band{padding-top:44px;padding-bottom:44px}
.hw-dark{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
html.hw-off .hw-dark,html.hw-nodark .hw-dark{display:none}
html.hw-on .hw-band>.container{position:relative;z-index:2}
.hw-dark .shade,.hw-dark .eyes,.hw-dark .flash{position:absolute;inset:0}
.hw-dark .shade{background:rgba(6,4,14,.36)}
.hw-dark .flash{opacity:0;background:linear-gradient(180deg,rgba(232,226,255,.95),rgba(180,170,240,.6) 70%,rgba(150,140,225,.35))}
.hw-dark .bolt{position:absolute;left:0;top:-4px;opacity:0;background:url(../images/seasonal/halloween-2026/bolt.webp) center top/contain no-repeat}
/* eyes: two small glows, baked so nothing has to blur */
.hw-eye{position:absolute;left:0;top:0;width:30px;height:14px;margin:-7px 0 0 -15px}
.hw-eye i{position:absolute;inset:0;transform-origin:50% 50%}
.hw-eye i::before,.hw-eye i::after{content:"";position:absolute;top:0;width:14px;height:14px;border-radius:50%;
  background:radial-gradient(ellipse 3.4px 2.4px at 50% 50%,#fff6d6 0,#ffcf40 65%,rgba(255,170,40,0) 100%),radial-gradient(closest-side,rgba(255,190,60,.55),rgba(255,150,40,0))}
.hw-eye i::before{left:0}.hw-eye i::after{right:0}
.hw-eye.red i::before,.hw-eye.red i::after{background:radial-gradient(ellipse 3.4px 2.4px at 50% 50%,#ffe0d6 0,#ff5232 65%,rgba(255,60,30,0) 100%),radial-gradient(closest-side,rgba(255,80,40,.55),rgba(255,50,30,0))}

@media (prefers-reduced-motion:reduce){
  .hw-spider .swing,.hwb i{animation:none!important}.hwb i:first-child{opacity:1}
}
