/* Hallow's End on Talents Forever. Built from lab/halloween-src (python lab/halloween-src/build.py writes lab/halloween.css).
   Everything here hangs off html.hw-on, set in the head before the first draw (server.js HALLOW_TAGS), so a reader who turns the look off
   sees the site exactly as it always is. The chip, the strip and its switch show either way while the season is on. */
:root{--hw-pump:#ff8a1f;--hw-pump2:#d9631a;--hw-ember:#ffb066;--hw-fel:#8dff4a;--hw-fel2:#3fd11a;--hw-plum:#7a4bb3;--hw-night:#0c0912}
.hw-sky,.hw-yard,.hw-web,.hw-feet,.hw-nf,.hw-fog,.hw-pk-spot,.hw-ct,.hw-swarm,.hw-ghost,.hw-candyrain{display:none}

/* ---------- the night: a plum glow up top, the moon, bats crossing behind the page ---------- */
html.hw-on{background:radial-gradient(1200px 600px at 82% -200px,rgba(122,75,179,.34),transparent 70%) no-repeat,radial-gradient(900px 460px at 6% -160px,rgba(255,122,24,.11),transparent 70%) no-repeat,var(--bg,#121212)}
html.hw-on body{background:transparent!important}
html.hw-on .hw-sky{display:block;position:absolute;left:0;right:0;top:0;height:640px;z-index:-1;pointer-events:none;overflow:hidden;-webkit-mask-image:linear-gradient(#000 50%,transparent);mask-image:linear-gradient(#000 50%,transparent)}
.hw-moon{--mz:min(84px,calc((100% - 1200px) / 2 - 22px));position:absolute;top:44px;right:calc(((100% - 1200px) / 2 - var(--mz)) / 2);width:var(--mz);height:auto;aspect-ratio:1;border-radius:50%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3CradialGradient id='b' cx='.38' cy='.34' r='.72'%3E%3Cstop offset='0' stop-color='%23fff8e0'/%3E%3Cstop offset='.45' stop-color='%23f7dc9c'/%3E%3Cstop offset='.8' stop-color='%23e6b462'/%3E%3Cstop offset='1' stop-color='%23c88a3a'/%3E%3C/radialGradient%3E%3CradialGradient id='e' cx='.42' cy='.38' r='.62'%3E%3Cstop offset='.72' stop-color='%235a2a08' stop-opacity='0'/%3E%3Cstop offset='.96' stop-color='%235a2a08' stop-opacity='.22'/%3E%3Cstop offset='1' stop-color='%237a4210' stop-opacity='.1'/%3E%3C/radialGradient%3E%3Cfilter id='s' x='-10%25' y='-10%25' width='120%25' height='120%25'%3E%3CfeGaussianBlur stdDeviation='2'/%3E%3C/filter%3E%3CclipPath id='c'%3E%3Ccircle cx='50' cy='50' r='49'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23c)'%3E%3Ccircle cx='50' cy='50' r='50' fill='url(%23b)'/%3E%3Cg filter='url(%23s)'%3E%3Cpath d='M30 28c6-6 17-6 20 1s-2 13-9 14-15-1-14-7 3-3 3-8z' fill='%23b07a36' opacity='0.38'/%3E%3Cpath d='M52 38c5-4 13-2 14 4s-4 9-9 8-8-8-5-12z' fill='%23b07a36' opacity='0.34'/%3E%3Cpath d='M58 52c6-2 12 2 11 8s-8 8-12 5-4-11 1-13z' fill='%23b07a36' opacity='0.3'/%3E%3Cpath d='M20 46c4-6 12-4 13 2s-3 14-9 15-9-4-8-9 4-4 4-8z' fill='%23b07a36' opacity='0.32'/%3E%3Cpath d='M40 58c4-2 8 1 7 5s-6 5-8 2 0-6 1-7z' fill='%23b07a36' opacity='0.26'/%3E%3Cpath d='M34 22c3-2 7-1 7 2s-4 4-6 3-2-4-1-5z' fill='%23b07a36' opacity='0.22'/%3E%3C/g%3E%3Cpath d='M46 74L75.4 80.0' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L69.9 92.1' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L59.7 100.7' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L46.7 104.0' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L33.6 101.3' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L23.0 93.3' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L16.9 81.4' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L16.6 68.0' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L22.1 55.9' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L32.3 47.3' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L45.3 44.0' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L58.4 46.7' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L69.0 54.7' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Cpath d='M46 74L75.1 66.6' stroke='%23fff3d0' stroke-width='.7' opacity='.14'/%3E%3Ccircle cx='47.9' cy='63.2' r='0.70' fill='%23a87434' opacity='0.09'/%3E%3Ccircle cx='91.7' cy='48.5' r='0.69' fill='%23fff3d0' opacity='0.13'/%3E%3Ccircle cx='58.5' cy='54.9' r='0.70' fill='%23a87434' opacity='0.16'/%3E%3Ccircle cx='38.9' cy='36.5' r='0.43' fill='%23a87434' opacity='0.06'/%3E%3Ccircle cx='65.7' cy='36.3' r='0.54' fill='%23a87434' opacity='0.05'/%3E%3Ccircle cx='13.1' cy='84.9' r='0.61' fill='%23a87434' opacity='0.16'/%3E%3Ccircle cx='43.6' cy='45.3' r='0.70' fill='%23a87434' opacity='0.11'/%3E%3Ccircle cx='82.1' cy='54.9' r='0.89' fill='%23a87434' opacity='0.11'/%3E%3Ccircle cx='50.6' cy='15.0' r='0.66' fill='%23fff3d0' opacity='0.10'/%3E%3Ccircle cx='40.3' cy='10.6' r='0.74' fill='%23a87434' opacity='0.16'/%3E%3Ccircle cx='63.7' cy='37.9' r='0.52' fill='%23fff3d0' opacity='0.12'/%3E%3Ccircle cx='17.6' cy='27.7' r='0.52' fill='%23a87434' opacity='0.05'/%3E%3Ccircle cx='77.1' cy='44.1' r='0.61' fill='%23a87434' opacity='0.12'/%3E%3Ccircle cx='11.7' cy='25.2' r='0.66' fill='%23a87434' opacity='0.07'/%3E%3Ccircle cx='66.5' cy='11.1' r='0.47' fill='%23fff3d0' opacity='0.12'/%3E%3Ccircle cx='69.0' cy='51.2' r='0.52' fill='%23fff3d0' opacity='0.08'/%3E%3Ccircle cx='48.0' cy='88.5' r='0.59' fill='%23a87434' opacity='0.10'/%3E%3Ccircle cx='54.1' cy='23.3' r='0.76' fill='%23a87434' opacity='0.15'/%3E%3Ccircle cx='8.6' cy='30.5' r='0.76' fill='%23fff3d0' opacity='0.07'/%3E%3Ccircle cx='74.8' cy='50.1' r='0.45' fill='%23a87434' opacity='0.16'/%3E%3Ccircle cx='91.9' cy='50.3' r='0.31' fill='%23fff3d0' opacity='0.15'/%3E%3Ccircle cx='64.2' cy='31.5' r='0.37' fill='%23fff3d0' opacity='0.10'/%3E%3Ccircle cx='37.7' cy='65.5' r='0.57' fill='%23a87434' opacity='0.10'/%3E%3Ccircle cx='59.8' cy='11.9' r='0.50' fill='%23fff3d0' opacity='0.13'/%3E%3Ccircle cx='26.0' cy='31.9' r='0.45' fill='%23a87434' opacity='0.13'/%3E%3Ccircle cx='19.1' cy='82.5' r='0.55' fill='%23a87434' opacity='0.07'/%3E%3Ccircle cx='47.6' cy='12.9' r='0.64' fill='%23fff3d0' opacity='0.13'/%3E%3Ccircle cx='43.1' cy='57.4' r='0.84' fill='%23a87434' opacity='0.11'/%3E%3Ccircle cx='37.2' cy='39.0' r='0.74' fill='%23a87434' opacity='0.05'/%3E%3Ccircle cx='67.7' cy='83.9' r='0.78' fill='%23a87434' opacity='0.15'/%3E%3Ccircle cx='52.9' cy='74.3' r='0.53' fill='%23a87434' opacity='0.13'/%3E%3Ccircle cx='23.9' cy='30.7' r='0.78' fill='%23fff3d0' opacity='0.12'/%3E%3Ccircle cx='18.5' cy='52.9' r='0.72' fill='%23fff3d0' opacity='0.11'/%3E%3Ccircle cx='14.0' cy='37.9' r='0.35' fill='%23fff3d0' opacity='0.07'/%3E%3Ccircle cx='15.6' cy='34.2' r='0.72' fill='%23fff3d0' opacity='0.09'/%3E%3Ccircle cx='10.5' cy='49.0' r='0.57' fill='%23a87434' opacity='0.06'/%3E%3Ccircle cx='57.9' cy='46.4' r='0.83' fill='%23a87434' opacity='0.15'/%3E%3Ccircle cx='8.6' cy='38.3' r='0.47' fill='%23a87434' opacity='0.13'/%3E%3Ccircle cx='32.9' cy='51.4' r='0.39' fill='%23fff3d0' opacity='0.07'/%3E%3Ccircle cx='47.0' cy='58.9' r='0.81' fill='%23a87434' opacity='0.10'/%3E%3Ccircle cx='64' cy='30' r='4.2' fill='%23b98448' opacity='.24'/%3E%3Cpath d='M60.0 31.3A4.2 4.2 0 0 0 65.3 34.0' fill='none' stroke='%23fff3d0' stroke-width='0.92' opacity='.42'/%3E%3Cpath d='M61.1 28.3A3.4 3.4 0 0 1 65.7 27.1' fill='none' stroke='%238a5a2a' stroke-width='0.76' opacity='.26'/%3E%3Ccircle cx='28' cy='64' r='3.4' fill='%23b98448' opacity='.24'/%3E%3Cpath d='M24.8 65.0A3.4 3.4 0 0 0 29.0 67.2' fill='none' stroke='%23fff3d0' stroke-width='0.75' opacity='.42'/%3E%3Cpath d='M25.6 62.6A2.7 2.7 0 0 1 29.4 61.6' fill='none' stroke='%238a5a2a' stroke-width='0.61' opacity='.26'/%3E%3Ccircle cx='46' cy='74' r='5.2' fill='%23b98448' opacity='.24'/%3E%3Cpath d='M41.1 75.6A5.2 5.2 0 0 0 47.6 78.9' fill='none' stroke='%23fff3d0' stroke-width='1.14' opacity='.42'/%3E%3Cpath d='M42.4 71.9A4.2 4.2 0 0 1 48.1 70.4' fill='none' stroke='%238a5a2a' stroke-width='0.94' opacity='.26'/%3E%3Ccircle cx='72' cy='66' r='2.6' fill='%23b98448' opacity='.24'/%3E%3Cpath d='M69.5 66.8A2.6 2.6 0 0 0 72.8 68.5' fill='none' stroke='%23fff3d0' stroke-width='0.57' opacity='.42'/%3E%3Cpath d='M70.2 65.0A2.1 2.1 0 0 1 73.0 64.2' fill='none' stroke='%238a5a2a' stroke-width='0.47' opacity='.26'/%3E%3Ccircle cx='38' cy='40' r='2.2' fill='%23b98448' opacity='.24'/%3E%3Cpath d='M35.9 40.7A2.2 2.2 0 0 0 38.7 42.1' fill='none' stroke='%23fff3d0' stroke-width='0.50' opacity='.42'/%3E%3Cpath d='M36.5 39.1A1.8 1.8 0 0 1 38.9 38.5' fill='none' stroke='%238a5a2a' stroke-width='0.40' opacity='.26'/%3E%3Ccircle cx='80' cy='46' r='2.8' fill='%23b98448' opacity='.24'/%3E%3Cpath d='M77.3 46.8A2.8 2.8 0 0 0 80.8 48.7' fill='none' stroke='%23fff3d0' stroke-width='0.62' opacity='.42'/%3E%3Cpath d='M78.0 44.9A2.2 2.2 0 0 1 81.1 44.0' fill='none' stroke='%238a5a2a' stroke-width='0.50' opacity='.26'/%3E%3Ccircle cx='22' cy='34' r='2' fill='%23b98448' opacity='.24'/%3E%3Cpath d='M20.1 34.6A2 2 0 0 0 22.6 35.9' fill='none' stroke='%23fff3d0' stroke-width='0.50' opacity='.42'/%3E%3Cpath d='M20.6 33.2A1.6 1.6 0 0 1 22.8 32.6' fill='none' stroke='%238a5a2a' stroke-width='0.40' opacity='.26'/%3E%3Ccircle cx='56' cy='84' r='2.4' fill='%23b98448' opacity='.24'/%3E%3Cpath d='M53.7 84.7A2.4 2.4 0 0 0 56.7 86.3' fill='none' stroke='%23fff3d0' stroke-width='0.53' opacity='.42'/%3E%3Cpath d='M54.3 83.0A1.9 1.9 0 0 1 57.0 82.3' fill='none' stroke='%238a5a2a' stroke-width='0.43' opacity='.26'/%3E%3Ccircle cx='68' cy='78' r='1.8' fill='%23b98448' opacity='.24'/%3E%3Cpath d='M66.3 78.5A1.8 1.8 0 0 0 68.5 79.7' fill='none' stroke='%23fff3d0' stroke-width='0.50' opacity='.42'/%3E%3Cpath d='M66.7 77.3A1.4 1.4 0 0 1 68.7 76.7' fill='none' stroke='%238a5a2a' stroke-width='0.40' opacity='.26'/%3E%3Ccircle cx='32' cy='80' r='1.6' fill='%23b98448' opacity='.24'/%3E%3Cpath d='M30.5 80.5A1.6 1.6 0 0 0 32.5 81.5' fill='none' stroke='%23fff3d0' stroke-width='0.50' opacity='.42'/%3E%3Cpath d='M30.9 79.4A1.3 1.3 0 0 1 32.6 78.9' fill='none' stroke='%238a5a2a' stroke-width='0.40' opacity='.26'/%3E%3Ccircle cx='50' cy='22' r='1.8' fill='%23b98448' opacity='.24'/%3E%3Cpath d='M48.3 22.5A1.8 1.8 0 0 0 50.5 23.7' fill='none' stroke='%23fff3d0' stroke-width='0.50' opacity='.42'/%3E%3Cpath d='M48.7 21.3A1.4 1.4 0 0 1 50.7 20.7' fill='none' stroke='%238a5a2a' stroke-width='0.40' opacity='.26'/%3E%3Ccircle cx='50' cy='50' r='50' fill='url(%23e)'/%3E%3C/g%3E%3C/svg%3E") center/100% 100% no-repeat;
  box-shadow:0 0 30px 6px rgba(255,196,110,.28),0 0 90px 30px rgba(255,170,70,.12),0 0 180px 70px rgba(255,150,60,.06)}
@media (max-width:1339px){.hw-moon{display:none}}
html.hw-witching .hw-moon{box-shadow:0 0 30px 8px rgba(150,255,130,.26),0 0 100px 26px rgba(120,220,110,.12)}
.hw-bat{position:absolute;left:0;top:0;width:var(--w,30px);height:calc(var(--w,30px) / 2);opacity:0;animation:hw-fly var(--d,34s) linear infinite;animation-delay:var(--dl,0s)}
.hw-bat.back{animation-direction:reverse}
.hw-bat i{position:absolute;inset:0;animation:hw-bob var(--bob,1.9s) ease-in-out infinite alternate}
.hw-bat b{position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 20'%3E%3Cdefs%3E%3ClinearGradient id='w' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%232c1f3e'/%3E%3Cstop offset='1' stop-color='%23120c1a'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M24 6.4L25.1 3.4L26 6.9Q26.9 7.6 27.6 8.3C31 5.4 37.4 3.2 46.8 4.2Q44.2 6.2 43.8 9.6Q41 8.4 38.2 10.6Q35.4 9.6 32.8 12.2Q30.2 11.4 27.8 13.2C27 15.2 25.4 16.6 24 16.8C22.6 16.6 21 15.2 20.2 13.2Q17.8 11.4 15.2 12.2Q12.6 9.6 9.8 10.6Q7 8.4 4.2 9.6Q3.8 6.2 1.2 4.2C10.6 3.2 17 5.4 20.4 8.3Q21.1 7.6 22 6.9L22.9 3.4L24 6.4z' fill='url(%23w)' stroke='%23a284d6' stroke-width='.4' stroke-opacity='.55'/%3E%3Cpath d='M27.4 8.6L46.8 4.2M27.4 8.6L43.8 9.6M27.4 8.6L38.2 10.6M27.4 8.6L32.8 12.2M20.6 8.6L1.2 4.2M20.6 8.6L4.2 9.6M20.6 8.6L9.8 10.6M20.6 8.6L15.2 12.2' stroke='%2307050a' stroke-width='.7' stroke-linecap='round' opacity='.9'/%3E%3Cellipse cx='24' cy='10.4' rx='2.6' ry='3.4' fill='%230c0810'/%3E%3Ccircle cx='23.1' cy='9.3' r='.62' fill='%23ffb066'/%3E%3Ccircle cx='24.9' cy='9.3' r='.62' fill='%23ffb066'/%3E%3C/svg%3E") center/contain no-repeat;animation:hw-flap var(--fl,.21s) ease-in-out infinite alternate;filter:drop-shadow(0 0 3px rgba(170,120,240,.55))}
.hw-bat.back b{transform:scaleX(-1);animation-name:hw-flapb}
@keyframes hw-fly{0%{opacity:0;transform:translate(-80px,var(--y0,120px))}6%{opacity:var(--o,.75)}50%{transform:translate(50vw,var(--y1,60px))}94%{opacity:var(--o,.75)}100%{opacity:0;transform:translate(calc(100vw + 80px),var(--y0,120px))}}
@keyframes hw-bob{from{transform:translateY(-7px)}to{transform:translateY(7px)}}
@keyframes hw-flap{from{transform:scaleY(1)}to{transform:scaleY(.35) translateY(2px)}}
@keyframes hw-flapb{from{transform:scaleX(-1) scaleY(1)}to{transform:scaleX(-1) scaleY(.35) translateY(2px)}}

/* ---------- the graveyard at the foot of every page ---------- */
html.hw-on .hw-yard{display:block;position:relative;height:150px;margin-top:8px;pointer-events:none;overflow:hidden;
  background:none 30% 100%/1800px 150px repeat-x,radial-gradient(60% 90% at 50% 100%,rgba(122,75,179,.5),transparent 75%),radial-gradient(30% 60% at 78% 85%,rgba(141,255,74,.10),transparent 70%),linear-gradient(to top,rgba(70,40,120,.55),rgba(70,40,120,.18) 55%,transparent);
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 42%);mask-image:linear-gradient(to bottom,transparent,#000 42%)}
.hw-yard .hw-mid{position:absolute;left:0;right:0;bottom:0;height:150px;z-index:1;background:none 62% 100%/1400px 150px repeat-x}
.hw-yard .hw-near{position:absolute;left:0;right:0;bottom:0;height:150px;z-index:4;background:none center bottom/1200px 150px repeat-x}
.hw-yard .hw-lan{position:absolute;z-index:5;bottom:9px;width:30px;height:30px}
.hw-yard .hw-pile{position:absolute;z-index:5;bottom:4px;width:60px;height:24px;margin-left:-30px;pointer-events:auto;cursor:pointer;transform-origin:50% 100%;transition:transform 2.6s cubic-bezier(.3,.8,.3,1);-webkit-tap-highlight-color:transparent}
.hw-yard .hw-pile svg{display:block;width:100%;height:100%;overflow:visible;filter:brightness(.72) saturate(.85) drop-shadow(0 0 6px rgba(255,140,40,.12))}
.hw-yard .hw-pile:hover{transform:scale(1.04,.96);transition-duration:.25s}
.hw-yard .hw-pile.kicked{transform:scale(1.12,.4);transition:transform .12s ease-out}
@media (max-width:640px){.hw-yard .hw-pile{width:46px;height:18px;margin-left:-23px;bottom:3px}}
.hw-yard .hw-eyes{position:absolute;z-index:5;width:12px;height:4px;margin-left:-6px;animation:hw-peer var(--ed,15s) var(--el,0s) infinite}
.hw-yard .hw-eyes i{position:absolute;top:0;width:4px;height:3px;border-radius:50% 50% 45% 45%;background:radial-gradient(circle at 50% 55%,#fff6c0 0 20%,#ffc83a 45%,#d07a10);box-shadow:0 0 4px 1px rgba(255,190,60,.55);transform:rotate(14deg)}
.hw-yard .hw-eyes i+i{left:8px;transform:rotate(-14deg)}
.hw-yard .hw-eyes.g i{background:radial-gradient(circle at 50% 55%,#f4ffd0 0 20%,#b8ff5a 45%,#5a9a10);box-shadow:0 0 4px 1px rgba(170,255,80,.5)}
.hw-yard .hw-eyes.shy{animation:none;opacity:0;transform:scaleY(.1);transition:opacity .15s,transform .15s}
@keyframes hw-peer{0%,58%{opacity:0;transform:scaleY(.1)}61%{opacity:1;transform:scaleY(1)}70%{opacity:1;transform:scaleY(1)}71%{opacity:1;transform:scaleY(.1)}72.5%{opacity:1;transform:scaleY(1)}79%{opacity:1;transform:translateX(3px) scaleY(1)}86%{opacity:1;transform:translateX(3px) scaleY(1)}89%,100%{opacity:0;transform:translateX(3px) scaleY(.1)}}
@media (max-width:640px){
  html.hw-on .hw-yard{height:112px;background-size:1350px 112px,auto,auto,auto}
  .hw-yard .hw-mid{height:112px;background-size:1050px 112px}
  .hw-yard .hw-near{height:112px;background-size:900px 112px}
  .hw-yard .hw-lan{width:24px;height:24px;bottom:6px}
  .hw-yard .hw-lan+.hw-lan:not(:last-child){display:none}
}
/* the Wickerman burning on the far hills, its embers rising; wisps drifting over the graves */
.hw-wick{position:absolute;left:30%;bottom:22px;width:30px;height:54px;z-index:2}
@media (max-width:640px){.hw-wick{bottom:16px;width:22px;height:40px}}
.hw-wick svg{position:relative;width:100%;height:100%}
.hw-wick::before{content:"";position:absolute;left:-26px;right:-26px;bottom:-10px;height:50px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,140,40,.45),rgba(255,100,20,.12) 60%,transparent);animation:hw-flicker 2.2s linear infinite}
.hw-wick .fl{transform-origin:50% 100%;transform-box:fill-box;animation:hw-flame .55s ease-in-out infinite alternate}
@keyframes hw-flame{from{transform:scale(1,1)}to{transform:scale(.92,1.1) skewX(-3deg)}}
.hw-wick i{position:absolute;left:50%;bottom:20px;width:2px;height:2px;border-radius:50%;background:#ffc46a;box-shadow:0 0 4px #ff8a1f;opacity:0;animation:hw-ember 2.8s ease-out infinite}
.hw-wick i:nth-of-type(2){animation-delay:-.5s;margin-left:3px;animation-duration:3.3s}.hw-wick i:nth-of-type(3){animation-delay:-1.1s;margin-left:-4px}
.hw-wick i:nth-of-type(4){animation-delay:-1.7s;margin-left:5px;animation-duration:2.4s}.hw-wick i:nth-of-type(5){animation-delay:-2.2s;margin-left:-2px;animation-duration:3.6s}.hw-wick i:nth-of-type(6){animation-delay:-.2s;margin-left:1px}
@keyframes hw-ember{0%{opacity:0;transform:translate(0,0)}10%{opacity:1}100%{opacity:0;transform:translate(9px,-58px)}}
.hw-wisp{position:absolute;bottom:38px;z-index:3;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle,#eaffc4,#8dff4a 45%,rgba(141,255,74,0) 72%);box-shadow:0 0 10px 3px rgba(141,255,74,.35);animation:hw-wisp var(--wd,20s) ease-in-out infinite alternate}
@keyframes hw-wisp{0%{transform:translate(0,0);opacity:.2}25%{opacity:.9}50%{transform:translate(60px,var(--wy,-10px));opacity:.5}75%{opacity:.95}100%{transform:translate(-40px,6px);opacity:.3}}
/* tree one's spider, under the talents: down its thread now and then, and back up */
.hw-spider{display:none}
html.hw-on .hw-spider{display:block;position:absolute;top:0;right:30px;width:14px;height:64px;pointer-events:none}
.hw-spider i{position:absolute;left:50%;top:0;width:1px;height:64px;margin-left:-.5px;background:linear-gradient(rgba(232,226,208,.8),rgba(232,226,208,.45));transform-origin:top;transform:scaleY(.1);animation:hw-thread 14s ease-in-out infinite}
.hw-spider svg{position:absolute;left:-1px;top:0;width:16px;height:16px;filter:drop-shadow(0 0 1.5px rgba(232,226,208,.55)) drop-shadow(0 0 4px rgba(150,120,220,.35));transform:translateY(2px);animation:hw-drop 14s ease-in-out infinite}
@keyframes hw-thread{0%,58%,100%{transform:scaleY(.1)}70%,80%{transform:scaleY(.36)}}
@keyframes hw-drop{0%,58%,100%{transform:translateY(2px)}70%,80%{transform:translateY(19px)}74%{transform:translateY(18px) rotate(6deg)}77%{transform:translateY(19px) rotate(-5deg)}}
.hw-yard .hw-lan svg{position:relative;width:100%;height:100%}
.hw-lan::before,.hw-pk-spot.lit::before,.hw-head::before{content:"";position:absolute;inset:-35%;border-radius:50%;background:radial-gradient(circle,rgba(255,170,60,.55),rgba(255,120,30,.18) 45%,transparent 70%);animation:hw-flicker 3.2s linear infinite;pointer-events:none}
.hw-yard .hw-mist{position:absolute;z-index:3;left:-15%;right:-15%;bottom:6px;height:58px;background:radial-gradient(30% 55% at 22% 70%,rgba(206,194,240,.16),transparent 70%),radial-gradient(26% 50% at 58% 62%,rgba(206,194,240,.13),transparent 70%),radial-gradient(30% 60% at 88% 72%,rgba(190,230,200,.10),transparent 70%);animation:hw-mist 26s ease-in-out infinite alternate}
.hw-yard .hw-mist.m2{z-index:6;bottom:-14px;height:40px;opacity:.75;animation-duration:34s;animation-direction:alternate-reverse}
@keyframes hw-mist{from{transform:translateX(-5%)}to{transform:translateX(5%)}}
@keyframes hw-flicker{0%,100%{opacity:1}9%{opacity:.84}14%{opacity:.98}31%{opacity:.9}38%{opacity:1}52%{opacity:.76}57%{opacity:.95}74%{opacity:.88}81%{opacity:1}}

/* ---------- the calculator: cobwebs in the trees, a dusk over the art, a lantern glow on full talents ---------- */
html.hw-on .tbody::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Cdefs%3E%3CradialGradient id='wg' cx='90' cy='0' r='100' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23f4efe2'/%3E%3Cstop offset='.6' stop-color='%23e8e2d0' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23d8d0e8' stop-opacity='.35'/%3E%3C/radialGradient%3E%3CradialGradient id='dw'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.6' stop-color='%23dfe8ff' stop-opacity='.8'/%3E%3Cstop offset='1' stop-color='%23b9c4ff' stop-opacity='.2'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg%3E%3Cg opacity='0.36'%3E%3Cpath d='M90 0L2.0 0.0M90 0L9.7 24.6M90 0L21.2 48.2M90 0L40.6 68.0M90 0L64.0 79.9M90 0L90.0 88.0M74.0 0.0Q77.2 1.9 74.7 4.7Q78.4 5.7 76.9 9.2Q80.8 9.1 80.6 12.9Q84.1 11.5 85.1 15.2Q88.0 12.8 90.0 16.0M60.0 0.0Q65.9 3.6 61.3 8.8Q68.2 10.7 65.4 17.2Q72.7 17.0 72.4 24.3Q79.0 21.6 80.7 28.5Q86.2 24.0 90.0 30.0M45.0 0.0Q53.9 5.4 47.0 13.2Q57.2 16.0 53.1 25.8Q64.0 25.5 63.5 36.4Q73.5 32.5 76.1 42.8Q84.3 36.0 90.0 45.0M29.0 0.0Q41.1 7.3 31.7 17.8Q45.6 21.7 40.0 35.0Q54.8 34.6 54.1 49.4Q67.6 44.0 71.1 58.0Q82.3 48.8 90.0 61.0M12.0 0.0Q27.4 9.4 15.4 22.8Q33.2 27.7 26.1 44.7Q45.0 44.2 44.2 63.1Q61.3 56.3 65.9 74.2Q80.1 62.4 90.0 78.0' fill='none' stroke='url(%23wg)' stroke-width='.65' stroke-linecap='round'/%3E%3Cpath d='M14.6 31.8q-3 6-1 13 1 4-1.6 7' fill='none' stroke='url(%23wg)' stroke-width='.45'/%3E%3Ccircle cx='54.1' cy='49.4' r='1.40' fill='url(%23dw)'/%3E%3Ccircle cx='53.7' cy='48.9' r='0.42' fill='%23fff'/%3E%3Ccircle cx='61.3' cy='8.8' r='1.21' fill='url(%23dw)'/%3E%3Ccircle cx='60.9' cy='8.4' r='0.36' fill='%23fff'/%3E%3Ccircle cx='44.2' cy='63.1' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='43.8' cy='62.7' r='0.38' fill='%23fff'/%3E%3Ccircle cx='15.4' cy='22.8' r='1.49' fill='url(%23dw)'/%3E%3Ccircle cx='15.0' cy='22.4' r='0.45' fill='%23fff'/%3E%3Ccircle cx='47.0' cy='13.2' r='1.32' fill='url(%23dw)'/%3E%3Ccircle cx='46.6' cy='12.8' r='0.40' fill='%23fff'/%3E%3Ccircle cx='65.4' cy='17.2' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='65.0' cy='16.8' r='0.38' fill='%23fff'/%3E%3Ccircle cx='26.1' cy='44.7' r='1.15' fill='url(%23dw)'/%3E%3Ccircle cx='25.8' cy='44.4' r='0.34' fill='%23fff'/%3E%3Cpath d='M62 0v22' stroke='%23e8e2d0' stroke-width='.5'/%3E%3Cg transform='translate(62 25)'%3E%3Cellipse rx='2.6' ry='3.2' fill='%2315110c'/%3E%3Ccircle cy='-3.6' r='1.8' fill='%2315110c'/%3E%3Cpath d='M-2 -1l-4-3M-2 1l-4.5 0M-2 2.5l-4 3.5M2 -1l4-3M2 1l4.5 0M2 2.5l4 3.5' stroke='%2315110c' stroke-width='.7' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") top right/92px 92px no-repeat,radial-gradient(60% 18% at 28% 100%,rgba(200,190,235,.13),transparent 70%),radial-gradient(55% 15% at 78% 100%,rgba(200,190,235,.1),transparent 70%),linear-gradient(180deg,rgba(28,12,44,.42),rgba(0,0,0,.66))}
html.hw-on .tree:first-child .tbody::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Cdefs%3E%3CradialGradient id='wg' cx='90' cy='0' r='100' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23f4efe2'/%3E%3Cstop offset='.6' stop-color='%23e8e2d0' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23d8d0e8' stop-opacity='.35'/%3E%3C/radialGradient%3E%3CradialGradient id='dw'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.6' stop-color='%23dfe8ff' stop-opacity='.8'/%3E%3Cstop offset='1' stop-color='%23b9c4ff' stop-opacity='.2'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg%3E%3Cg opacity='0.36'%3E%3Cpath d='M90 0L2.0 0.0M90 0L9.7 24.6M90 0L21.2 48.2M90 0L40.6 68.0M90 0L64.0 79.9M90 0L90.0 88.0M74.0 0.0Q77.2 1.9 74.7 4.7Q78.4 5.7 76.9 9.2Q80.8 9.1 80.6 12.9Q84.1 11.5 85.1 15.2Q88.0 12.8 90.0 16.0M60.0 0.0Q65.9 3.6 61.3 8.8Q68.2 10.7 65.4 17.2Q72.7 17.0 72.4 24.3Q79.0 21.6 80.7 28.5Q86.2 24.0 90.0 30.0M45.0 0.0Q53.9 5.4 47.0 13.2Q57.2 16.0 53.1 25.8Q64.0 25.5 63.5 36.4Q73.5 32.5 76.1 42.8Q84.3 36.0 90.0 45.0M29.0 0.0Q41.1 7.3 31.7 17.8Q45.6 21.7 40.0 35.0Q54.8 34.6 54.1 49.4Q67.6 44.0 71.1 58.0Q82.3 48.8 90.0 61.0M12.0 0.0Q27.4 9.4 15.4 22.8Q33.2 27.7 26.1 44.7Q45.0 44.2 44.2 63.1Q61.3 56.3 65.9 74.2Q80.1 62.4 90.0 78.0' fill='none' stroke='url(%23wg)' stroke-width='.65' stroke-linecap='round'/%3E%3Cpath d='M14.6 31.8q-3 6-1 13 1 4-1.6 7' fill='none' stroke='url(%23wg)' stroke-width='.45'/%3E%3Ccircle cx='54.1' cy='49.4' r='1.40' fill='url(%23dw)'/%3E%3Ccircle cx='53.7' cy='48.9' r='0.42' fill='%23fff'/%3E%3Ccircle cx='61.3' cy='8.8' r='1.21' fill='url(%23dw)'/%3E%3Ccircle cx='60.9' cy='8.4' r='0.36' fill='%23fff'/%3E%3Ccircle cx='44.2' cy='63.1' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='43.8' cy='62.7' r='0.38' fill='%23fff'/%3E%3Ccircle cx='15.4' cy='22.8' r='1.49' fill='url(%23dw)'/%3E%3Ccircle cx='15.0' cy='22.4' r='0.45' fill='%23fff'/%3E%3Ccircle cx='47.0' cy='13.2' r='1.32' fill='url(%23dw)'/%3E%3Ccircle cx='46.6' cy='12.8' r='0.40' fill='%23fff'/%3E%3Ccircle cx='65.4' cy='17.2' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='65.0' cy='16.8' r='0.38' fill='%23fff'/%3E%3Ccircle cx='26.1' cy='44.7' r='1.15' fill='url(%23dw)'/%3E%3Ccircle cx='25.8' cy='44.4' r='0.34' fill='%23fff'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") top right/92px 92px no-repeat,radial-gradient(60% 18% at 28% 100%,rgba(200,190,235,.13),transparent 70%),radial-gradient(55% 15% at 78% 100%,rgba(200,190,235,.1),transparent 70%),linear-gradient(180deg,rgba(28,12,44,.42),rgba(0,0,0,.66))}
html.hw-on .tree:nth-child(2) .tbody::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Cdefs%3E%3CradialGradient id='wg' cx='90' cy='0' r='100' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23f4efe2'/%3E%3Cstop offset='.6' stop-color='%23e8e2d0' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23d8d0e8' stop-opacity='.35'/%3E%3C/radialGradient%3E%3CradialGradient id='dw'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.6' stop-color='%23dfe8ff' stop-opacity='.8'/%3E%3Cstop offset='1' stop-color='%23b9c4ff' stop-opacity='.2'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg transform='translate(90 0) scale(-1 1)'%3E%3Cg opacity='0.28'%3E%3Cpath d='M90 0L2.0 0.0M90 0L9.7 24.6M90 0L21.2 48.2M90 0L40.6 68.0M90 0L64.0 79.9M90 0L90.0 88.0M74.0 0.0Q77.2 1.9 74.7 4.7Q78.4 5.7 76.9 9.2Q80.8 9.1 80.6 12.9Q84.1 11.5 85.1 15.2Q88.0 12.8 90.0 16.0M60.0 0.0Q65.9 3.6 61.3 8.8Q68.2 10.7 65.4 17.2Q72.7 17.0 72.4 24.3Q79.0 21.6 80.7 28.5Q86.2 24.0 90.0 30.0M45.0 0.0Q53.9 5.4 47.0 13.2Q57.2 16.0 53.1 25.8Q64.0 25.5 63.5 36.4Q73.5 32.5 76.1 42.8Q84.3 36.0 90.0 45.0M29.0 0.0Q41.1 7.3 31.7 17.8Q45.6 21.7 40.0 35.0Q54.8 34.6 54.1 49.4Q67.6 44.0 71.1 58.0Q82.3 48.8 90.0 61.0M12.0 0.0Q27.4 9.4 15.4 22.8Q33.2 27.7 26.1 44.7Q45.0 44.2 44.2 63.1Q61.3 56.3 65.9 74.2Q80.1 62.4 90.0 78.0' fill='none' stroke='url(%23wg)' stroke-width='.65' stroke-linecap='round'/%3E%3Cpath d='M14.6 31.8q-3 6-1 13 1 4-1.6 7' fill='none' stroke='url(%23wg)' stroke-width='.45'/%3E%3Ccircle cx='54.1' cy='49.4' r='1.36' fill='url(%23dw)'/%3E%3Ccircle cx='53.7' cy='48.9' r='0.41' fill='%23fff'/%3E%3Ccircle cx='15.4' cy='22.8' r='1.25' fill='url(%23dw)'/%3E%3Ccircle cx='15.0' cy='22.4' r='0.38' fill='%23fff'/%3E%3Ccircle cx='72.4' cy='24.3' r='1.14' fill='url(%23dw)'/%3E%3Ccircle cx='72.0' cy='23.9' r='0.34' fill='%23fff'/%3E%3Ccircle cx='71.1' cy='58.0' r='1.42' fill='url(%23dw)'/%3E%3Ccircle cx='70.7' cy='57.6' r='0.42' fill='%23fff'/%3E%3Ccircle cx='53.1' cy='25.8' r='1.62' fill='url(%23dw)'/%3E%3Ccircle cx='52.7' cy='25.3' r='0.49' fill='%23fff'/%3E%3Ccircle cx='26.1' cy='44.7' r='1.58' fill='url(%23dw)'/%3E%3Ccircle cx='25.6' cy='44.3' r='0.47' fill='%23fff'/%3E%3Ccircle cx='47.0' cy='13.2' r='1.49' fill='url(%23dw)'/%3E%3Ccircle cx='46.5' cy='12.7' r='0.45' fill='%23fff'/%3E%3Cpath d='M62 0v22' stroke='%23e8e2d0' stroke-width='.5'/%3E%3Cg transform='translate(62 25)'%3E%3Cellipse rx='2.6' ry='3.2' fill='%2315110c'/%3E%3Ccircle cy='-3.6' r='1.8' fill='%2315110c'/%3E%3Cpath d='M-2 -1l-4-3M-2 1l-4.5 0M-2 2.5l-4 3.5M2 -1l4-3M2 1l4.5 0M2 2.5l4 3.5' stroke='%2315110c' stroke-width='.7' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") top left/70px 70px no-repeat,radial-gradient(60% 18% at 50% 100%,rgba(200,190,235,.12),transparent 70%),linear-gradient(180deg,rgba(28,12,44,.42),rgba(0,0,0,.66))}
html.hw-on .tree:nth-child(3) .tbody::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Cdefs%3E%3CradialGradient id='wg' cx='90' cy='0' r='100' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23f4efe2'/%3E%3Cstop offset='.6' stop-color='%23e8e2d0' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23d8d0e8' stop-opacity='.35'/%3E%3C/radialGradient%3E%3CradialGradient id='dw'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.6' stop-color='%23dfe8ff' stop-opacity='.8'/%3E%3Cstop offset='1' stop-color='%23b9c4ff' stop-opacity='.2'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg%3E%3Cg opacity='0.36'%3E%3Cpath d='M90 0L2.0 0.0M90 0L9.7 24.6M90 0L21.2 48.2M90 0L40.6 68.0M90 0L64.0 79.9M90 0L90.0 88.0M74.0 0.0Q77.2 1.9 74.7 4.7Q78.4 5.7 76.9 9.2Q80.8 9.1 80.6 12.9Q84.1 11.5 85.1 15.2Q88.0 12.8 90.0 16.0M60.0 0.0Q65.9 3.6 61.3 8.8Q68.2 10.7 65.4 17.2Q72.7 17.0 72.4 24.3Q79.0 21.6 80.7 28.5Q86.2 24.0 90.0 30.0M45.0 0.0Q53.9 5.4 47.0 13.2Q57.2 16.0 53.1 25.8Q64.0 25.5 63.5 36.4Q73.5 32.5 76.1 42.8Q84.3 36.0 90.0 45.0M29.0 0.0Q41.1 7.3 31.7 17.8Q45.6 21.7 40.0 35.0Q54.8 34.6 54.1 49.4Q67.6 44.0 71.1 58.0Q82.3 48.8 90.0 61.0M12.0 0.0Q27.4 9.4 15.4 22.8Q33.2 27.7 26.1 44.7Q45.0 44.2 44.2 63.1Q61.3 56.3 65.9 74.2Q80.1 62.4 90.0 78.0' fill='none' stroke='url(%23wg)' stroke-width='.65' stroke-linecap='round'/%3E%3Cpath d='M14.6 31.8q-3 6-1 13 1 4-1.6 7' fill='none' stroke='url(%23wg)' stroke-width='.45'/%3E%3Ccircle cx='54.1' cy='49.4' r='1.40' fill='url(%23dw)'/%3E%3Ccircle cx='53.7' cy='48.9' r='0.42' fill='%23fff'/%3E%3Ccircle cx='61.3' cy='8.8' r='1.21' fill='url(%23dw)'/%3E%3Ccircle cx='60.9' cy='8.4' r='0.36' fill='%23fff'/%3E%3Ccircle cx='44.2' cy='63.1' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='43.8' cy='62.7' r='0.38' fill='%23fff'/%3E%3Ccircle cx='15.4' cy='22.8' r='1.49' fill='url(%23dw)'/%3E%3Ccircle cx='15.0' cy='22.4' r='0.45' fill='%23fff'/%3E%3Ccircle cx='47.0' cy='13.2' r='1.32' fill='url(%23dw)'/%3E%3Ccircle cx='46.6' cy='12.8' r='0.40' fill='%23fff'/%3E%3Ccircle cx='65.4' cy='17.2' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='65.0' cy='16.8' r='0.38' fill='%23fff'/%3E%3Ccircle cx='26.1' cy='44.7' r='1.15' fill='url(%23dw)'/%3E%3Ccircle cx='25.8' cy='44.4' r='0.34' fill='%23fff'/%3E%3Cpath d='M62 0v22' stroke='%23e8e2d0' stroke-width='.5'/%3E%3Cg transform='translate(62 25)'%3E%3Cellipse rx='2.6' ry='3.2' fill='%2315110c'/%3E%3Ccircle cy='-3.6' r='1.8' fill='%2315110c'/%3E%3Cpath d='M-2 -1l-4-3M-2 1l-4.5 0M-2 2.5l-4 3.5M2 -1l4-3M2 1l4.5 0M2 2.5l4 3.5' stroke='%2315110c' stroke-width='.7' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") top right/76px 76px no-repeat,radial-gradient(60% 18% at 40% 100%,rgba(200,190,235,.12),transparent 70%),linear-gradient(180deg,rgba(28,12,44,.42),rgba(0,0,0,.66))}
html.hw-on .hw-web{display:block;position:absolute;top:0;right:0;z-index:3;width:120px;height:120px;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Cdefs%3E%3CradialGradient id='wg' cx='90' cy='0' r='100' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23f4efe2'/%3E%3Cstop offset='.6' stop-color='%23e8e2d0' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23d8d0e8' stop-opacity='.35'/%3E%3C/radialGradient%3E%3CradialGradient id='dw'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.6' stop-color='%23dfe8ff' stop-opacity='.8'/%3E%3Cstop offset='1' stop-color='%23b9c4ff' stop-opacity='.2'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg%3E%3Cg opacity='1'%3E%3Cpath d='M90 0L2.0 0.0M90 0L9.7 24.6M90 0L21.2 48.2M90 0L40.6 68.0M90 0L64.0 79.9M90 0L90.0 88.0M74.0 0.0Q77.2 1.9 74.7 4.7Q78.4 5.7 76.9 9.2Q80.8 9.1 80.6 12.9Q84.1 11.5 85.1 15.2Q88.0 12.8 90.0 16.0M60.0 0.0Q65.9 3.6 61.3 8.8Q68.2 10.7 65.4 17.2Q72.7 17.0 72.4 24.3Q79.0 21.6 80.7 28.5Q86.2 24.0 90.0 30.0M45.0 0.0Q53.9 5.4 47.0 13.2Q57.2 16.0 53.1 25.8Q64.0 25.5 63.5 36.4Q73.5 32.5 76.1 42.8Q84.3 36.0 90.0 45.0M29.0 0.0Q41.1 7.3 31.7 17.8Q45.6 21.7 40.0 35.0Q54.8 34.6 54.1 49.4Q67.6 44.0 71.1 58.0Q82.3 48.8 90.0 61.0M12.0 0.0Q27.4 9.4 15.4 22.8Q33.2 27.7 26.1 44.7Q45.0 44.2 44.2 63.1Q61.3 56.3 65.9 74.2Q80.1 62.4 90.0 78.0' fill='none' stroke='url(%23wg)' stroke-width='.65' stroke-linecap='round'/%3E%3Cpath d='M14.6 31.8q-3 6-1 13 1 4-1.6 7' fill='none' stroke='url(%23wg)' stroke-width='.45'/%3E%3Ccircle cx='47.0' cy='13.2' r='1.36' fill='url(%23dw)'/%3E%3Ccircle cx='46.6' cy='12.7' r='0.41' fill='%23fff'/%3E%3Ccircle cx='76.1' cy='42.8' r='1.58' fill='url(%23dw)'/%3E%3Ccircle cx='75.6' cy='42.3' r='0.47' fill='%23fff'/%3E%3Ccircle cx='44.2' cy='63.1' r='1.42' fill='url(%23dw)'/%3E%3Ccircle cx='43.7' cy='62.7' r='0.43' fill='%23fff'/%3E%3Ccircle cx='15.4' cy='22.8' r='1.15' fill='url(%23dw)'/%3E%3Ccircle cx='15.1' cy='22.5' r='0.34' fill='%23fff'/%3E%3Ccircle cx='72.4' cy='24.3' r='1.37' fill='url(%23dw)'/%3E%3Ccircle cx='72.0' cy='23.9' r='0.41' fill='%23fff'/%3E%3Ccircle cx='63.5' cy='36.4' r='1.13' fill='url(%23dw)'/%3E%3Ccircle cx='63.2' cy='36.1' r='0.34' fill='%23fff'/%3E%3Ccircle cx='53.1' cy='25.8' r='1.66' fill='url(%23dw)'/%3E%3Ccircle cx='52.6' cy='25.3' r='0.50' fill='%23fff'/%3E%3Cpath d='M62 0v22' stroke='%23e8e2d0' stroke-width='.5'/%3E%3Cg transform='translate(62 25)'%3E%3Cellipse rx='2.6' ry='3.2' fill='%2315110c'/%3E%3Ccircle cy='-3.6' r='1.8' fill='%2315110c'/%3E%3Cpath d='M-2 -1l-4-3M-2 1l-4.5 0M-2 2.5l-4 3.5M2 -1l4-3M2 1l4.5 0M2 2.5l4 3.5' stroke='%2315110c' stroke-width='.7' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") top right/contain no-repeat;opacity:.3}
html.hw-on .gd-head > .hw-web.v-bats,html.hw-on .gd-head > .hw-web.v-spider,html.hw-on .gd-head > .hw-web.v-vine{background:none;opacity:1}
.hw-web.v-bats i{position:absolute;top:0;width:calc(24px * var(--s,1));height:calc(var(--th) + 36px * var(--s,1));margin-right:calc(-12px * var(--s,1));transform-origin:50% 0;animation:hw-sway 4.2s ease-in-out var(--d,0s) infinite}
.hw-web.v-bats u{position:absolute;left:50%;top:0;width:1px;height:var(--th);background:linear-gradient(rgba(220,214,235,.05),rgba(220,214,235,.4))}
.hw-web.v-bats b{position:absolute;left:0;top:var(--th);width:100%;height:calc(36px * var(--s,1));background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 24'%3E%3Cpath d='M6.2 0v1.8q0 .9.9 1M9.8 0v1.8q0 .9-.9 1' stroke='%230e0a12' stroke-width='.9' fill='none' stroke-linecap='round'/%3E%3Cpath d='M8 2.6C12.6 2.6 14.4 6.4 13.8 10.6l-.9-.5-.2 1.4-.9-.4c-.4 1.9-1.3 3.6-2.4 4.5H6.6C5.5 14.7 4.6 13 4.2 11.1l-.9.4-.2-1.4-.9.5C1.6 6.4 3.4 2.6 8 2.6z' fill='%2322172e' stroke='%238a66b8' stroke-width='.55' stroke-linejoin='round'/%3E%3Cpath d='M4.6 4.2c1.3 3.2 1.6 6.6 1 10.2M11.4 4.2c-1.3 3.2-1.6 6.6-1 10.2M8 3.2v11.6' stroke='%234a3466' stroke-width='.5' fill='none'/%3E%3Cpath d='M5.4 18.6c0-1.8 1.2-3 2.6-3s2.6 1.2 2.6 3-1.2 2.4-2.6 2.4-2.6-.6-2.6-2.4z M5.8 19.8l-.7 3.6 2-2.4z M10.2 19.8l.7 3.6-2-2.4z' fill='%2322172e' stroke='%238a66b8' stroke-width='.5' stroke-linejoin='round'/%3E%3Cpath d='M6.5 18.9h1M8.5 18.9h1' stroke='%23ffb066' stroke-width='.7' stroke-linecap='round'/%3E%3C/svg%3E") center top/contain no-repeat;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.hw-web.v-spider i{position:absolute;right:34px;top:0;width:22px;height:48px;animation:hw-spbob 5.5s ease-in-out infinite}
.hw-web.v-spider u{position:absolute;left:50%;top:0;width:1px;height:24px;background:linear-gradient(rgba(220,214,235,.05),rgba(220,214,235,.45))}
.hw-web.v-spider svg{position:absolute;left:0;top:22px;width:22px;height:22px;filter:drop-shadow(0 0 1.5px rgba(232,226,208,.55))}
@keyframes hw-spbob{0%,100%{height:48px}45%{height:64px}60%{height:61px}}
.hw-web.v-spider i{transition:none}.hw-web.v-spider i u{height:calc(100% - 16px)}.hw-web.v-spider i svg{top:auto;bottom:0}
.hw-web.v-vine svg{position:absolute;right:0;top:0;width:150px;height:113px;filter:brightness(.82) saturate(.9) drop-shadow(0 2px 2px rgba(0,0,0,.5))}
.hw-web.v-vine em{position:absolute;right:66px;top:62px;width:28px;height:28px;filter:drop-shadow(0 0 6px rgba(255,150,40,.6))}
.hw-web.v-vine em svg{width:100%;height:100%}
@media (prefers-reduced-motion:reduce){.hw-web.v-bats i,.hw-web.v-spider i{animation:none}}
@media print{.hw-web{display:none!important}}
html.hw-on .masthead{border-image:linear-gradient(90deg,var(--hw-pump2),rgba(122,75,179,.5) 45%,transparent) 1}
html.hw-on .mbookw::before{background:radial-gradient(circle at 42% 46%,rgba(255,138,31,.5),rgba(255,110,20,.16) 46%,transparent 68%)}
html.hw-on .mbookw::after{background:radial-gradient(circle at 60% 56%,rgba(141,255,74,.34),rgba(80,220,50,.1) 50%,transparent 70%)}
html.hw-on .banner{box-shadow:inset 0 0 0 1px rgba(255,138,31,.18)}
html.hw-on .banner::after{background-image:linear-gradient(90deg,rgba(28,12,44,.0),rgba(28,12,44,.32))}
html.hw-on.hw-lantern .trees .talent.maxed{box-shadow:0 0 0 2px #000,0 0 0 3px var(--hw-pump),0 0 14px 2px rgba(255,138,31,.6)}
html.hw-on.hw-bones .trees .talent img,html.hw-on.hw-bones .trees .talent .lab-spr{filter:grayscale(1) contrast(1.35) brightness(1.25) sepia(.15)}

/* ---------- the Headless Horseman's Hearthstone: the book's way home burns orange and fel green, bats ride the flames ---------- */
html.hw-on .hs-fx .w1 u{background:conic-gradient(from 0deg,rgba(255,138,31,0) 0 38%,rgba(255,110,20,.35) 58%,rgba(255,150,40,.95) 86%,#fff0c4 97%,rgba(255,138,31,0) 100%);filter:drop-shadow(0 0 3px rgba(255,130,30,.9))}
html.hw-on .hs-fx .w2 u{background:conic-gradient(from 0deg,rgba(141,255,74,0) 0 38%,rgba(63,209,26,.35) 58%,rgba(141,255,74,.95) 86%,#eaffc4 97%,rgba(141,255,74,0) 100%)}
html.hw-on .hs-fx .w3 u{background:conic-gradient(from 0deg,rgba(122,75,179,0) 0 38%,rgba(122,75,179,.35) 58%,rgba(190,140,255,.9) 86%,#f0e4ff 97%,rgba(122,75,179,0) 100%);filter:drop-shadow(0 0 3px rgba(150,95,225,.9))}
html.hw-on .hs-fx b u::before{width:14px;height:7px;top:-4px;border-radius:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 20'%3E%3Cdefs%3E%3ClinearGradient id='w' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%232c1f3e'/%3E%3Cstop offset='1' stop-color='%23120c1a'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M24 6.4L25.1 3.4L26 6.9Q26.9 7.6 27.6 8.3C31 5.4 37.4 3.2 46.8 4.2Q44.2 6.2 43.8 9.6Q41 8.4 38.2 10.6Q35.4 9.6 32.8 12.2Q30.2 11.4 27.8 13.2C27 15.2 25.4 16.6 24 16.8C22.6 16.6 21 15.2 20.2 13.2Q17.8 11.4 15.2 12.2Q12.6 9.6 9.8 10.6Q7 8.4 4.2 9.6Q3.8 6.2 1.2 4.2C10.6 3.2 17 5.4 20.4 8.3Q21.1 7.6 22 6.9L22.9 3.4L24 6.4z' fill='url(%23w)' stroke='%23a284d6' stroke-width='.4' stroke-opacity='.55'/%3E%3Cpath d='M27.4 8.6L46.8 4.2M27.4 8.6L43.8 9.6M27.4 8.6L38.2 10.6M27.4 8.6L32.8 12.2M20.6 8.6L1.2 4.2M20.6 8.6L4.2 9.6M20.6 8.6L9.8 10.6M20.6 8.6L15.2 12.2' stroke='%2307050a' stroke-width='.7' stroke-linecap='round' opacity='.9'/%3E%3Cellipse cx='24' cy='10.4' rx='2.6' ry='3.4' fill='%230c0810'/%3E%3Ccircle cx='23.1' cy='9.3' r='.62' fill='%23ffb066'/%3E%3Ccircle cx='24.9' cy='9.3' r='.62' fill='%23ffb066'/%3E%3C/svg%3E") center/contain no-repeat;filter:brightness(1.6) drop-shadow(0 0 3px rgba(255,140,40,.9));transform:scaleY(calc(1 / var(--flat))) scale(var(--sz,1))}
html.hw-on .hs-wrap::after{background:radial-gradient(circle closest-side,rgba(255,150,40,.55),rgba(255,110,20,.28) 45%,rgba(80,220,50,.14) 72%,transparent 100%)}
html.hw-on .hs-wrap::before{content:"";position:absolute;inset:-12px;border-radius:50%;z-index:2;pointer-events:none;opacity:0;
  background:conic-gradient(from 0deg,transparent,rgba(141,255,74,.85) 6%,transparent 12%,rgba(255,150,40,.8) 19%,transparent 25%,rgba(141,255,74,.85) 33%,transparent 40%,rgba(255,150,40,.8) 47%,transparent 54%,rgba(141,255,74,.85) 62%,transparent 69%,rgba(255,150,40,.8) 77%,transparent 84%,rgba(141,255,74,.85) 92%,transparent);
  -webkit-mask:radial-gradient(circle,transparent 55%,#000 62%,transparent 72%);mask:radial-gradient(circle,transparent 55%,#000 62%,transparent 72%);filter:blur(1px)}
html.hw-on .hs-wrap.casting::before{animation:hw-flames .6s ease-in both}
@keyframes hw-flames{0%{opacity:0;transform:scale(.8) rotate(0)}40%{opacity:1}100%{opacity:1;transform:scale(1.25) rotate(-80deg)}}
html.hw-on .hs-tr i{background:linear-gradient(180deg,#ffe0a0 0,#ffad3a 22%,#e8701a 55%,#9a3a08 100%)}
html.hw-on .hs-tr u{background:radial-gradient(ellipse 50% 50% at 50% 50%,#fff 0,rgba(220,255,190,.9) 25%,rgba(141,255,74,.5) 55%,transparent 75%)}
html.hw-on .hs-ic{box-shadow:0 0 0 1px #000,0 0 0 2px #8a7434,0 0 0 3px #3a2f12,0 0 14px rgba(255,138,31,.6),0 0 22px rgba(141,255,74,.3)}
html.hw-on .hs-tr small{color:#ffe7c4}
html.hw-on .hs-tr{width:min(320px,74vw)}
html.hw-on .hs-bar.on .hs-tr u{transform:translateX(min(320px,74vw))}
html.hw-on .hs-tr b{padding:0 30px 0 6px;font-size:11.5px;white-space:nowrap}

/* ---------- the bucket: by the What's new button. Click it to trick or treat; its five little pumpkins are today's hunt; the moon beside it turns Halloween off ---------- */
.hw-kit{display:inline-flex;align-items:center;gap:4px;align-self:center;flex:none;margin-left:12px}
.hw-kit-sm{margin-left:auto}
.hw-chip{position:relative;display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:2px 11px 2px 4px;border-radius:999px;font:inherit;font-size:13px;font-weight:700;color:var(--hw-ember);background:#241811;box-shadow:inset 0 0 0 1px #7a3e14;cursor:pointer;transition:background .12s,box-shadow .12s}
.hw-chip:hover{background:#33200f;box-shadow:inset 0 0 0 1px var(--hw-pump2),0 0 14px rgba(255,138,31,.25)}
.hw-chip .hw-ico{width:26px;height:26px;flex:none}
.hw-chip .hw-ico svg{display:block;width:100%;height:100%}
.hw-chip .hw-lbl{min-width:86px;text-align:center;white-space:nowrap}
html[lang="de"] .hw-chip .hw-lbl{min-width:120px}
.hw-chip.wait{color:#b39a80}
.hw-chip.wait .hw-lbl{font-weight:600;font-variant-numeric:tabular-nums}
.hw-chip.ready .hw-ico{animation:hw-wobble 2.4s ease-in-out 1s 3}
.hw-chip.knocked .hw-ico{animation:hw-knock .5s ease-in-out}
.hw-chip.nope{animation:hw-nope .35s ease-in-out}
@keyframes hw-wobble{0%,70%,100%{transform:rotate(0)}76%{transform:rotate(-10deg)}82%{transform:rotate(8deg)}88%{transform:rotate(-5deg)}94%{transform:rotate(2deg)}}
@keyframes hw-knock{0%,100%{transform:none}15%{transform:rotate(-14deg) translateY(-2px)}35%{transform:rotate(10deg)}55%{transform:rotate(-6deg)}75%{transform:rotate(3deg)}}
@keyframes hw-nope{0%,100%{transform:none}25%{transform:translateX(-3px)}50%{transform:translateX(3px)}75%{transform:translateX(-2px)}}
/* today's five: dark until found, then lit */
.hw-dots{display:inline-flex;gap:1px;padding-left:7px;border-left:1px solid #4a2c14}
.hw-dots i{width:13px;height:13px;transition:filter .3s,opacity .3s}
.hw-dots svg{display:block;width:100%;height:100%}
.hw-dots i:not(.on){opacity:.5;filter:grayscale(.85) brightness(.8) contrast(.9)}
.hw-dots i.on{filter:drop-shadow(0 0 3px rgba(255,150,40,.8));animation:hw-pop .6s cubic-bezier(.2,1.6,.4,1)}
/* the moon: Halloween off, one click */
.hw-off{display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer;opacity:.7;transition:opacity .15s,background .15s}
.hw-off svg{width:18px;height:18px;filter:drop-shadow(0 0 4px rgba(255,226,150,.35))}
.hw-off:hover{opacity:1;background:rgba(255,226,150,.08)}
.hw-chip:focus-visible,.hw-off:focus-visible{outline:2px solid var(--gold,#ffd100);outline-offset:2px}
html:not(.hw-on) .hw-kit:not(.off){display:none}
.hw-chip.hw-slot{display:inline-block;visibility:hidden;width:266px;height:32px;padding:0;margin-left:12px;box-shadow:none;background:none}
html:not(.hw-on) .hw-chip.hw-slot{width:127px!important}
@media (max-width:1100px){html:not(.hw-on) .hw-chip.hw-slot{width:46px!important}}
html[lang="de"] .hw-chip.hw-slot{width:286px}
/* the way back, with the look off: a quiet line at the foot of the page */
.hw-back{margin:14px auto 6px;text-align:center;font-size:12px;color:var(--muted,#8a8a8a)}
.hw-back button{margin-left:4px;padding:0;font:inherit;font-weight:700;color:#d9a35a;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.hw-back button:hover{color:#ffc27a}
html.hw-on .hw-back{display:none}
/* beside What's new on wider screens, whatever order the header's own script puts its buttons in (Back to Class arrives after the slot) */
@media (min-width:481px){.masthead .hw-kit,.masthead .hw-slot{order:1}.masthead:has(.hw-kit) #whatsNew,.masthead:has(.hw-slot) #whatsNew{order:1}}
/* narrow: the bucket alone, its five pumpkins as a row of dots under it, the moon beside */
@media (max-width:560px){
  .hw-kit{gap:2px;margin-left:6px}
  .hw-chip{width:34px;height:34px;min-height:0;padding:3px;gap:0;justify-content:center}
  .hw-chip .hw-lbl{display:none}
  .hw-chip .hw-dots{position:absolute;left:50%;bottom:-6px;gap:1px;padding:1px 3px;border:0;border-radius:6px;background:#140d08;box-shadow:0 0 0 1px #4a2c14;transform:translateX(-50%)}
  .hw-chip .hw-dots i{width:6px;height:6px;border-radius:50%;background:#3a2c22;box-shadow:inset 0 0 0 1px #8a6a4a;opacity:1;filter:none}
  .hw-chip .hw-dots i.on{background:var(--hw-pump);box-shadow:0 0 4px var(--hw-pump);filter:none}
  .hw-chip .hw-dots svg{display:none}
  .hw-off{width:26px;height:26px}
  .hw-chip.hw-slot{width:80px;height:34px;margin-left:6px}
  html[lang="de"] .hw-chip.hw-slot{width:80px}
}
@media (max-width:480px){
  .masthead .hw-kit,.masthead .hw-slot{order:2}
  .masthead:has(.hw-kit):not(.haspin) .mtext,.masthead:has(.hw-slot):not(.haspin) .mtext{flex-basis:calc(100% - 228px)}
}
/* mid widths (561 to 1180): the calculator's header is busy (addon, Back to Class, What's new), so the bucket goes compact as on a phone, its
   five pumpkins as dots under it, and the site's own line under the name keeps its room */
@media (min-width:561px) and (max-width:1180px){
  .masthead .hw-chip{width:34px;height:34px;min-height:0;padding:3px;gap:0;justify-content:center}
  .masthead .hw-chip .hw-lbl{display:none}
  .masthead .hw-chip .hw-dots{position:absolute;left:50%;bottom:-6px;gap:1px;padding:1px 3px;border:0;border-radius:6px;background:#140d08;box-shadow:0 0 0 1px #4a2c14;transform:translateX(-50%)}
  .masthead .hw-chip .hw-dots i{width:6px;height:6px;border-radius:50%;background:#3a2c22;box-shadow:inset 0 0 0 1px #8a6a4a;opacity:1;filter:none}
  .masthead .hw-chip .hw-dots i.on{background:var(--hw-pump);box-shadow:0 0 4px var(--hw-pump);filter:none}
  .masthead .hw-chip .hw-dots svg{display:none}
  .masthead .hw-chip.hw-slot,html[lang="de"] .masthead .hw-chip.hw-slot,.masthead .hw-chip.hw-slot.give,html[lang="de"] .masthead .hw-chip.hw-slot.give{width:80px;height:34px}
}
/* 561 to 820 on the calculator's English header (the German one has #tomeBtn too but no empty corner, hence the lang guard) (the one with Back to Class, two rows tall): its row has no room left even without
   Halloween, so the bucket and the switch sit up in its empty top right corner, by the moon. Other headers (German, guides) have no empty
   corner and keep the compact bucket in their row */
@media (min-width:561px) and (max-width:820px){
  html:not([lang="de"]) body:not(.gd) .masthead:has(#tomeBtn){position:relative}
  html:not([lang="de"]) body:not(.gd) .masthead:has(#tomeBtn) .hw-kit,html:not([lang="de"]) body:not(.gd) .masthead:has(#tomeBtn) .hw-chip.hw-slot{position:absolute;top:12px;right:16px;z-index:2;margin:0}
}
/* 746 to 820 the title takes fewer lines, so the row's buttons, centred, rose into that corner and the bucket covered What's new; they
   sit at the row's foot here, as they do below 746 */
@media (min-width:746px) and (max-width:820px){html:not([lang="de"]) body:not(.gd) .masthead:has(#tomeBtn)>#addonBtn,html:not([lang="de"]) body:not(.gd) .masthead:has(#tomeBtn)>#tomeBtn,html:not([lang="de"]) body:not(.gd) .masthead:has(#tomeBtn)>#whatsNew{align-self:flex-end}}

/* ---------- the drawing: one small box under the header once all five are lit ---------- */
.hw-draw{position:relative;display:flex;align-items:center;gap:12px;margin:0 0 14px;padding:10px 44px 10px 12px;border-radius:6px;color:#efe6d6;background:radial-gradient(120% 160% at 0 0,rgba(255,138,31,.13),transparent 55%),#17121b;box-shadow:inset 0 0 0 1px #3d2a4a,inset 0 2px 0 rgba(255,138,31,.5);animation:hw-open .22s ease-out}
html:not(.hw-on) .hw-draw{display:none}
@keyframes hw-open{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.hw-draw>.hw-ico{width:34px;height:34px;flex:none;align-self:flex-start;margin-top:2px}
.hw-draw>.hw-ico svg{display:block;width:100%;height:100%;filter:drop-shadow(0 0 8px rgba(255,150,40,.5))}
.hw-dbody{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.hw-draw p{margin:0;font-size:14px;line-height:1.4}
.hw-draw p b{font-family:Cinzel,Georgia,serif;color:#ffc27a}
.hw-draw form{display:flex;flex:1 1 300px;gap:8px;max-width:400px}
.hw-draw input{flex:1 1 120px;min-width:0;min-height:34px;padding:6px 10px;border:0;border-radius:4px;font:inherit;font-size:13px;color:#efe6d6;background:#0d0a10;box-shadow:inset 0 0 0 1px #4a3a55}
.hw-draw input:focus{outline:2px solid var(--hw-pump);outline-offset:1px}
.hw-draw .code{font:700 15px/1 ui-monospace,Consolas,monospace;letter-spacing:.12em;color:var(--hw-fel)}
.hw-draw .hw-res{flex-basis:100%;min-height:0;margin:0;font-size:12.5px;font-weight:600;color:#ffe2b8}
.hw-draw .hw-res:empty{display:none}
.hw-dfoot{flex-basis:100%;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin-top:-2px;font-size:12px;color:#a99bb3}
.hw-dfoot details{flex-basis:auto}
.hw-dfoot details[open]{flex-basis:100%}
.hw-dfoot summary{cursor:pointer;color:#c9b8d6;text-decoration:underline;text-decoration-color:rgba(201,184,214,.4);text-underline-offset:2px}
.hw-dfoot ol{margin:6px 0 0;padding-left:18px;line-height:1.45}
.hw-dfoot li{margin:0 0 3px}
.hw-by img{width:16px;height:16px;margin:0 6px 0 0;border-radius:4px;background:#0e1424;padding:2px;vertical-align:-5px}
.hw-by a{color:#ffd7a0;text-underline-offset:2px}
.hw-btn{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:6px 16px;border-radius:4px;font:inherit;font-size:13px;font-weight:700;color:#1a0f05;background:linear-gradient(180deg,#ffc061,#f08a26 55%,#c8601a);box-shadow:0 0 0 1px #000,inset 0 1px 0 rgba(255,240,200,.7),0 2px 8px rgba(0,0,0,.5);cursor:pointer}
.hw-btn:hover{filter:brightness(1.08)}
.hw-btn:disabled{cursor:default;color:#9e8f80;background:#2a2320;box-shadow:inset 0 0 0 1px #4a3d33;filter:none}
.hw-x{position:absolute;top:8px;right:8px;z-index:1;width:28px;height:28px;border-radius:4px;font-size:18px;line-height:28px;color:#b4a6bf}
.hw-x:hover{color:#fff;background:rgba(255,255,255,.06)}
.hw-draw :focus-visible{outline:2px solid var(--gold,#ffd100);outline-offset:2px}
.hw-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- the hidden pumpkins ---------- */
html.hw-on .hw-pk-spot{display:inline-grid;place-items:center;position:relative;z-index:3;width:36px;height:36px;margin:0 2px;padding:0;vertical-align:middle;border-radius:50%;cursor:pointer;-webkit-tap-highlight-color:transparent}
.hw-pk-spot svg{width:26px;height:26px;transition:transform .2s;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.hw-pk-spot:hover svg,.hw-pk-spot:focus-visible svg{transform:scale(1.15) rotate(-6deg)}
.hw-pk-spot:focus-visible{outline:2px solid var(--hw-pump);outline-offset:1px}
.hw-pk-spot.lit{cursor:default}
.hw-pk-spot svg{position:relative}
.hw-pk-spot.pop svg{animation:hw-pop .7s cubic-bezier(.2,1.6,.4,1),hw-catch 1.1s linear}
.hw-pk-spot.pop::after{content:"";position:absolute;left:50%;top:50%;width:100%;height:100%;margin:-50% 0 0 -50%;border-radius:50%;pointer-events:none;box-shadow:0 0 0 1px rgba(255,200,110,.3),0 0 18px 6px rgba(255,150,40,.42),inset 0 0 12px rgba(255,170,60,.35);animation:hw-catchring .9s .12s cubic-bezier(.2,.7,.3,1) both}
@keyframes hw-catch{0%{filter:brightness(.35) saturate(.6) drop-shadow(0 2px 3px rgba(0,0,0,.6))}12%{filter:brightness(1.6) saturate(1.2) drop-shadow(0 0 6px rgba(255,170,60,.9))}20%{filter:brightness(.6) saturate(.8) drop-shadow(0 2px 3px rgba(0,0,0,.6))}34%{filter:brightness(1.4) saturate(1.15) drop-shadow(0 0 8px rgba(255,170,60,.9))}44%{filter:brightness(.95) drop-shadow(0 0 5px rgba(255,170,60,.6))}60%{filter:brightness(1.3) drop-shadow(0 0 9px rgba(255,170,60,.85))}100%{filter:brightness(1) drop-shadow(0 2px 3px rgba(0,0,0,.6))}}
@keyframes hw-catchring{from{transform:scale(.45);opacity:1}to{transform:scale(2.6);opacity:0}}
@keyframes hw-pop{0%{transform:scale(.6)}50%{transform:scale(1.45) rotate(8deg)}100%{transform:scale(1)}}
html.hw-on .hw-pk-spot.abs{position:absolute;margin:0}
.tbody>.hw-pk-spot.abs{left:6px;bottom:6px}
html.hw-on .hw-pk-spot:not(.abs){width:30px;height:30px;margin:-8px 2px -8px 6px}
.hw-pk-spot:not(.abs) svg{width:24px;height:24px}
details>.hw-pk-spot.fold{right:14px;bottom:10px}
.banner>.hw-pk-spot.abs{left:56px;bottom:2px}
@media (max-width:640px){.banner>.hw-pk-spot.abs{left:auto;bottom:auto;right:8px;top:8px}}
.lab-foot>.hw-pk-spot.abs{right:10px;bottom:8px}
.lf-tip>.hw-pk-spot.abs{right:10px;top:8px}

/* ---------- moments: combat text, candy, swarms, the ghost ---------- */
html.hw-on .hw-ct{display:block;position:fixed;z-index:210;pointer-events:none;font:800 15px/1 "Open Sans",system-ui,sans-serif;color:var(--hw-pump);text-shadow:0 1px 0 #000,0 0 4px #000,0 0 10px rgba(0,0,0,.8);white-space:nowrap;transform:translate(-50%,0);animation:hw-rise 1.5s ease-out forwards}
.hw-ct.fel{color:var(--hw-fel)}.hw-ct.gold{color:#ffd75e;font-size:18px}
@keyframes hw-rise{0%{opacity:0;transform:translate(-50%,6px) scale(.7)}12%{opacity:1;transform:translate(-50%,-6px) scale(1.15)}25%{transform:translate(-50%,-12px) scale(1)}100%{opacity:0;transform:translate(-50%,-56px)}}
html.hw-on .hw-swarm{display:block;position:fixed;inset:0;z-index:205;pointer-events:none;overflow:hidden}
.hw-swarm .hw-bat{opacity:1;animation:hw-burst var(--d,1.4s) cubic-bezier(.3,.6,.4,1) forwards;animation-delay:var(--dl,0s)}
@keyframes hw-burst{0%{opacity:0;transform:translate(var(--x0),var(--y0)) scale(.4)}10%{opacity:1}100%{opacity:0;transform:translate(var(--x1),var(--y1)) scale(1.1)}}
html.hw-on .hw-ghost{display:block;position:fixed;z-index:205;left:0;top:30vh;width:72px;height:84px;pointer-events:none;animation:hw-haunt 5.5s ease-in-out forwards}
.hw-ghost svg{width:100%;height:100%;filter:drop-shadow(0 0 14px rgba(220,220,255,.55));animation:hw-bob 1.1s ease-in-out infinite alternate}
@keyframes hw-haunt{0%{opacity:0;transform:translate(-90px,40px)}10%{opacity:.9}50%{transform:translate(50vw,-30px)}90%{opacity:.9}100%{opacity:0;transform:translate(calc(100vw + 90px),20px)}}
html.hw-on .hw-candyrain{display:block;position:fixed;left:0;right:0;top:0;height:100vh;z-index:204;pointer-events:none;overflow:hidden}
.hw-candyrain i:nth-child(3n+1){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 1c2 0 3 2 4 5l3 9c.6 2-1 4-3 4H6c-2 0-3.6-2-3-4l3-9c1-3 2-5 4-5z' fill='%23ffd24a'/%3E%3Cpath d='M5 11.6l1-5.6C7 3 8 1 10 1s3 2 4 5l1 5.6z' fill='%23ff8a1f'/%3E%3Cpath d='M7.6 4.6C8.2 2.4 9 1 10 1s1.8 1.4 2.4 3.6z' fill='%23fff6e0'/%3E%3C/svg%3E")}
.hw-candyrain i:nth-child(3n+2){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 28'%3E%3Cpath d='M10 15v12' stroke='%23e8dcc8' stroke-width='1.6' stroke-linecap='round'/%3E%3Ccircle cx='10' cy='9' r='8' fill='%237dd03a'/%3E%3Cpath d='M10 9c0-2 2-3 3.4-2s1.6 3.6-.4 5-6 .6-6.6-2.4 1.6-6 5-6.4 7 1.8 6.6 5.6' stroke='%23eaffc4' stroke-width='1.4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");height:24px}
.hw-candyrain i{position:absolute;top:-30px;width:24px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 20'%3E%3Cpath d='M2 3l7 7-7 7zM28 3l-7 7 7 7z' fill='%23ff8a1f'/%3E%3Cellipse cx='15' cy='10' rx='7.5' ry='6' fill='%23ffb066'/%3E%3Cpath d='M10 6.5c2 3 2 4 0 7M15 4.2c2 3.5 2 8 0 11.6M20 6.5c-2 3-2 4 0 7' stroke='%23d9631a' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") center/contain no-repeat;animation:hw-fall var(--d,2.4s) cubic-bezier(.4,.1,.7,1) forwards;animation-delay:var(--dl,0s)}
@keyframes hw-fall{0%{opacity:1;transform:translateY(0) rotate(0)}85%{opacity:1}100%{opacity:0;transform:translateY(105vh) rotate(var(--r,540deg))}}
.hw-head{position:absolute;inset:-2px;z-index:3;display:grid;place-items:center;pointer-events:none;animation:hw-pop .6s cubic-bezier(.2,1.6,.4,1)}
.hw-head svg{position:relative;width:100%;height:100%}
html:not(.hw-on) .hw-head{display:none}
/* the trick's mist rolls in at the edges and along the bottom and leaves the middle clear, so the trees stay readable while it passes */
html.hw-on .hw-fog{display:block;position:fixed;inset:0;z-index:203;pointer-events:none;background:radial-gradient(38% 30% at 0 78%,rgba(214,210,240,.34),transparent 72%),radial-gradient(36% 32% at 100% 30%,rgba(214,210,240,.3),transparent 72%),radial-gradient(70% 34% at 50% 104%,rgba(190,180,230,.38),transparent 72%),radial-gradient(ellipse 75% 70% at 50% 45%,transparent 55%,rgba(40,30,60,.3) 100%);animation:hw-fogin 4.5s ease-in-out both}
@keyframes hw-fogin{0%,100%{opacity:0}15%,80%{opacity:1}}

/* the toast: the site's own place for a short word, at the foot, a moment */
.hw-toast{position:fixed;left:50%;bottom:22px;z-index:220;display:flex;align-items:center;gap:10px;box-sizing:border-box;width:max-content;max-width:min(92vw,460px);padding:8px 14px 8px 8px;border-radius:6px;font-size:13px;line-height:1.35;color:#efe6d6;background:#120d16;box-shadow:0 0 0 1px #000,inset 0 0 0 1px #5a3a6a,0 8px 22px rgba(0,0,0,.6);transform:translate(-50%,10px);opacity:0;transition:opacity .18s,transform .18s;pointer-events:none}
.hw-toast.on{opacity:1;transform:translate(-50%,0)}
/* when the site's own message is up in the same spot ("Link copied"), ours steps up above it (by its height, --tl from halloween.js) instead of sitting on its words */
html:has(#toast.show) .hw-toast.on{transform:translate(-50%,calc(-1 * var(--tl,44px)))}
.hw-toast svg{width:30px;height:30px;flex:none}
.hw-toast b{color:#ffc27a}
.hw-toast b.t{color:#d9b8ff}
.hw-toast .ep{color:#c27cff;font-weight:700}

.hw-idle,.hw-idle *,.hw-idle *::before{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){
  .hw-bat,.hw-bat i,.hw-bat b,.hw-yard .hw-mist,.hw-chip.ready .hw-ico,.hw-chip.knocked .hw-ico,.hw-chip.nope,.hw-dots i.on,.hw-draw,.hw-pk-spot.pop svg,.hw-pk-spot.pop::after,.hw-head,.hw-costume{animation:none!important}
  html.hw-on .hw-sky .hw-bat{opacity:.5;transform:translate(var(--sx,40vw),var(--y0,80px))}
  .hw-fog{animation-duration:.01s}
  .hw-wick .fl,.hw-wick i,.hw-wick::before,.hw-wisp,.hw-spider i,.hw-spider svg{animation:none!important}
  .hw-wick i{display:none}
  .hw-lan::before,.hw-pk-spot.lit::before,.hw-head::before{animation:none}
}
@media print{.hw-sky,.hw-yard,.hw-web,.hw-kit,.hw-draw,.hw-pk-spot,.hw-costume,.hw-nf,.hw-fog,.hw-toast{display:none!important}}
/* on paper (20 Oct 2026): the trees keep the site's own dark layer without their webs, the cards lose theirs, and the small things
   that had no print rule (the tree's spider, the graveyard's eyes and pile, the emblem's costume, the headstones) stay off the page */
@media print{html.hw-on .tbody::before{background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.65))!important}html.hw-on .hw-cw.hw-cwr,html.hw-on .hw-cw.hw-cwl{background-image:none!important}.hw-spider,.hw-eyes,.hw-pile,.hw-acc,.hw-leaves,.hw-icospider,.hw-grave{display:none!important}}
/* the pumpkin on the RestedXP card */
#rxpCard>.hw-pk-spot.abs{left:30px;bottom:-12px}
.hw-under{position:relative;height:0}
.hw-under>.hw-pk-spot.abs{right:14px;top:-46px}
/* the 404's word for the lost */
html.hw-on .hw-nf{display:flex;align-items:center;gap:10px;margin:10px 0 4px;padding:8px 12px;border-radius:4px;color:#ffd7a0;background:rgba(255,138,31,.07);box-shadow:inset 0 0 0 1px rgba(255,138,31,.22)}
.hw-nf svg{width:28px;height:28px;flex:none;filter:drop-shadow(0 0 6px rgba(255,150,40,.6))}
/* the Hallowed Wand's costume, worn beside the class's name on the banner for a minute */
.hw-costume{display:inline-flex;align-items:center;gap:5px;margin:2px 0 4px;padding:1px 10px 1px 3px;border-radius:999px;font:700 11px/18px "Open Sans",system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#1a0f05;background:linear-gradient(180deg,#ffc061,#f08a26);box-shadow:0 0 0 1px #000,0 0 12px rgba(255,138,31,.45);animation:hw-pop .6s cubic-bezier(.2,1.6,.4,1)}
html:not(.hw-on) .hw-costume{display:none}
/* the site's own messages ("Tap a talent to add a point", "Link copied") sit above everything Halloween puts on the page: the toast has no z-index of its own, so a crow or a prop could stand on its words */
html.hw-on .toast{z-index:250}
/* a looping animation held still while the page scrolls (halloween.js hold()) */
.hw-hold,.hw-holdb::before,.hw-holda::after{animation-play-state:paused!important}
.gd-hallow{position:relative;margin:0 0 28px;padding:20px 22px 20px 96px;border-radius:10px;background:radial-gradient(120% 140% at 0 50%,rgba(255,140,40,.16),transparent 60%),#16101c;box-shadow:inset 0 0 0 1px #4a3258}
.gd-hallow::before{content:"";position:absolute;left:18px;top:50%;width:60px;height:57px;margin-top:-29px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-9 -3 18 19'%3E%3Cdefs%3E%3CradialGradient id='p' cx='.4' cy='.35' r='.7'%3E%3Cstop offset='0' stop-color='%23ffb04a'/%3E%3Cstop offset='.6' stop-color='%23ff8a1f'/%3E%3Cstop offset='1' stop-color='%23b8480c'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cpath d='M0 2.4v1.8' stroke='%233f6a1f' stroke-width='1.6'/%3E%3Cpath d='M0 4C-5.4 4-8 6.6-8 9.6S-5.2 15.4 0 15.4 8 12.6 8 9.6 5.4 4 0 4z' fill='url(%23p)' stroke='%232a1205' stroke-width='.8'/%3E%3Cpath d='M-3 4.4c-1.8 1.8-1.8 9 0 10.6M3 4.4c1.8 1.8 1.8 9 0 10.6' fill='none' stroke='%23a5410a' stroke-width='.7'/%3E%3Cpath d='M-4.6 7.6l1.7-1.6 1.6 1.6z M1.3 7.6l1.7-1.6 1.6 1.6z M-3.4 8.6q3.4 2.6 6.8 0l-1 .4-.6 1-.7-.8-.9.9-.8-.9-.7.8-.6-1z' fill='%23ffe27a'/%3E%3C/svg%3E") center/contain no-repeat;filter:drop-shadow(0 0 10px rgba(255,150,40,.55))}
.gd-hallow h2{margin-top:0}
@media (max-width:640px){.gd-hallow{padding:78px 16px 16px}.gd-hallow::before{left:16px;top:16px;margin-top:0;width:52px;height:50px}}
html.hw-on .gd-tal.gone img,html.hw-on .gd-tile.gone:not(.dim) img{opacity:.78;filter:grayscale(1) brightness(1.25) sepia(.25) hue-rotate(170deg) saturate(.7) drop-shadow(0 0 3px rgba(205,225,255,.6));animation:hw-gonebob 3.6s ease-in-out infinite alternate}
html.hw-on .gd-tal.gone img:nth-child(2n),html.hw-on .gd-tile.gone:not(.dim):nth-child(2n) img{animation-duration:4.4s;animation-delay:-1.3s}
html.hw-on .gd-tal.gone img:nth-child(3n){animation-delay:-2.2s}
/* its own name (20 Oct 2026): a second keyframes block named hw-haunt here replaced the ghost's flight, so the Boo ghost only bobbed at the left edge */
@keyframes hw-gonebob{from{transform:translateY(0)}to{transform:translateY(-2px)}}
@media (prefers-reduced-motion:reduce){html.hw-on .gd-tal.gone img,html.hw-on .gd-tile.gone:not(.dim) img{animation:none}}
html.hw-on .hw-grave{display:block;width:22px;height:24px;margin-top:2px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%238a8496'/%3E%3Cstop offset='1' stop-color='%234a4556'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M2 22.5h20' stroke='%23332a20' stroke-width='1.6' stroke-linecap='round'/%3E%3Cpath d='M5.5 22V9.5C5.5 5.4 8.4 3 12 3s6.5 2.4 6.5 6.5V22z' fill='url(%23g)' stroke='%232a2532' stroke-width='.8'/%3E%3Cpath d='M9 10.6h6M12 8v6.4' stroke='%232e2a36' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M14.6 15.5l-1.4 2 .9 1.6' stroke='%23302a38' stroke-width='.6' fill='none'/%3E%3Cpath d='M4.5 22.2c1-1.4 2-1.8 3-1.2M16.5 22.2c1-1.5 2.2-1.9 3.2-1' stroke='%235a6a2a' stroke-width='.9' fill='none'/%3E%3C/svg%3E") center/contain no-repeat;opacity:.85}
.hw-costume{display:none!important}
.hw-acc{position:absolute;left:0;top:0;width:100%;height:100%;z-index:2;pointer-events:none;animation:hw-accin .5s cubic-bezier(.2,1.5,.4,1) both}
.hw-acc svg{display:block;width:100%;height:100%;overflow:visible}
.hw-acc-0{top:-21%;filter:drop-shadow(0 2px 3px rgba(0,0,0,.7))}
.hw-acc-4{z-index:-1}.hw-acc-4 .wl{transform-origin:14px 22px;animation:hw-wingl .32s ease-in-out infinite alternate}.hw-acc-4 .wr{transform-origin:40px 22px;animation:hw-wingr .32s ease-in-out infinite alternate}
.hw-acc-6 .orb{transform-origin:27px 27px;animation:hw-orbit 2.4s linear infinite;filter:drop-shadow(0 0 4px rgba(170,255,140,.9))}
.banner .emblem.hw-dress-2 img{filter:grayscale(1) contrast(1.35) brightness(1.2) sepia(.15)}
.banner .emblem.hw-dress-3 img{filter:sepia(.35) hue-rotate(55deg) saturate(1.6) brightness(.95)}
.banner .emblem.hw-dress-5{animation:hw-ghostbob 2.6s ease-in-out infinite}.banner .emblem.hw-dress-5 img{opacity:.5;filter:brightness(1.5) saturate(.3) drop-shadow(0 0 6px rgba(230,240,255,.9))}
@keyframes hw-accin{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}
@keyframes hw-wingl{from{transform:rotate(10deg)}to{transform:rotate(-14deg)}}
@keyframes hw-wingr{from{transform:rotate(-10deg)}to{transform:rotate(14deg)}}
@keyframes hw-orbit{to{transform:rotate(360deg)}}
@keyframes hw-ghostbob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@media (prefers-reduced-motion:reduce){.hw-acc,.hw-acc *,.banner .emblem.hw-dress-5{animation:none!important}}

/* ---------- feats: the achievement toast, drawn in the spirit of the game's (no game art) ---------- */
.hw-ach{position:fixed;left:50%;bottom:84px;z-index:221;display:flex;align-items:center;gap:12px;box-sizing:border-box;width:min(92vw,400px);padding:8px 14px 8px 8px;border-radius:8px;
  background:linear-gradient(180deg,#2a2110,#14100a);box-shadow:0 0 0 1px #000,inset 0 0 0 2px #8a7434,inset 0 0 0 3px #3a2f12,0 0 26px rgba(255,190,80,.25),0 10px 26px rgba(0,0,0,.6);
  transform:translate(-50%,16px) scale(.96);opacity:0;transition:opacity .25s,transform .35s cubic-bezier(.2,1.4,.4,1);pointer-events:none;overflow:hidden}
.hw-ach.on{opacity:1;transform:translate(-50%,0) scale(1)}
.hw-ach::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(100deg,transparent,rgba(255,240,200,.28),transparent);transform:skewX(-18deg);animation:hw-shine 1.6s .3s ease-out both}
@keyframes hw-shine{from{left:-40%}to{left:120%}}
.hw-ach .sh{position:relative;flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#3a2a10,#0e0a05);box-shadow:0 0 0 2px #c89b1a,0 0 0 3px #3a2a08,0 0 14px rgba(255,170,60,.4)}
.hw-ach .sh svg{width:34px;height:34px}
.hw-ach .tx{flex:1;min-width:0}
.hw-ach small{display:block;font:700 10px/1.3 "Open Sans",system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#d8c48a}
.hw-ach b{display:block;font-family:Cinzel,Georgia,serif;font-size:15px;line-height:1.25;color:#ffd75e;text-shadow:0 1px 0 #4a3608}
.hw-ach .pts{flex:none;display:grid;place-items:center;width:30px;height:34px;font:800 14px/1 "Open Sans",system-ui,sans-serif;color:#2a1c06;background:linear-gradient(180deg,#ffe28a,#c89b1a);clip-path:polygon(50% 0,100% 18%,100% 70%,50% 100%,0 70%,0 18%)}
/* ---------- Let the Fires Come: the banner burns until three buckets put it out ---------- */
.hw-fire{display:none}
html.hw-on .hw-fire{display:flex;position:absolute;left:0;right:0;bottom:0;height:78%;z-index:5;align-items:flex-end;justify-content:center;margin:0;padding:0;border:0;border-radius:0 0 6px 6px;cursor:pointer;
  background:linear-gradient(to top,rgba(255,96,14,calc(.42 * var(--burn))),rgba(255,140,40,calc(.12 * var(--burn))) 60%,transparent);transition:background .4s}
.hw-fire .fls{position:absolute;left:3%;right:3%;bottom:0;height:100%;display:flex;align-items:flex-end;justify-content:space-between;pointer-events:none}
.hw-fire .fls i{display:block;flex:none;width:calc(7.5% * var(--fw,1));rotate:var(--fr,0deg);margin:0 -.6%;height:calc(82% * var(--fs,1));background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 48' preserveAspectRatio='none'%3E%3Cdefs%3E%3ClinearGradient id='o' x1='0' y1='1' x2='0' y2='0'%3E%3Cstop offset='0' stop-color='%23ff5a0e'/%3E%3Cstop offset='.6' stop-color='%23ff9a2a'/%3E%3Cstop offset='1' stop-color='%23ffd25a' stop-opacity='.2'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M10 48C1 46-1 36 4 28c0 4 2 6 3 6-1-8 2-16 8-21-2 7 0 11 3 14 1-3 1-6 0-9 4 6 4 14 1 20-2 6-5 9-9 10z' fill='url(%23o)'/%3E%3Cpath d='M10.4 48c-4-1-5-5-3-9 1 2 2 2 3 2-.6-3 1-6 3-7-.4 2 .4 4 1.4 5 1.4 3 .4 7-4.4 9z' fill='%23ffe27a'/%3E%3C/svg%3E") center bottom/100% 100% no-repeat;transform-origin:50% 100%;scale:1 var(--burn);transition:scale .4s;animation:hw-lick var(--fd,.5s) ease-in-out infinite alternate;filter:drop-shadow(0 0 6px rgba(255,140,40,.7))}
@keyframes hw-lick{from{transform:scaleX(1) skewX(0)}to{transform:scaleX(.86) skewX(-6deg) translateY(-3%)}}
.hw-fire .hint{position:relative;margin-bottom:10px;padding:4px 12px;border-radius:999px;font:700 12px/1.3 "Open Sans",system-ui,sans-serif;color:#eaf6ff;background:rgba(20,40,70,.82);box-shadow:inset 0 0 0 1px #5aa8e0;pointer-events:none}
.hw-fire.out{pointer-events:none;background:transparent}
.hw-fire.out .fls i{scale:1 0}
.hw-fire.out::after{content:"";position:absolute;left:30%;right:30%;bottom:10%;height:60%;border-radius:50%;background:radial-gradient(closest-side,rgba(200,200,210,.45),transparent);animation:hw-smoke 1.1s ease-out forwards}
@keyframes hw-smoke{from{opacity:.9;transform:translateY(0) scale(.6)}to{opacity:0;transform:translateY(-40px) scale(1.4)}}
.hw-fire:focus-visible{outline:2px solid #5aa8e0;outline-offset:-2px}
.hw-splash{position:fixed;inset:0;z-index:222;pointer-events:none}
.hw-splash i{position:absolute;width:6px;height:8px;margin:-4px 0 0 -3px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:radial-gradient(circle at 35% 35%,#f2fbff,#7cc8f4 60%,#2f86c0);animation:hw-drip var(--d,.6s) ease-out forwards}
@keyframes hw-drip{0%{opacity:1;transform:translate(0,0)}60%{opacity:1;transform:translate(var(--dx),var(--dy))}100%{opacity:0;transform:translate(calc(var(--dx) * 1.2),calc(var(--dy) + 30px))}}

/* ---------- the Headless Horseman rides across the night ---------- */
.hw-rider{display:none}
html.hw-on .hw-rider{display:block;position:fixed;left:0;top:20px;z-index:206;width:220px;height:204px;pointer-events:none;animation:hw-ride 7s linear forwards}
.hw-rider .gal{position:absolute;inset:0;animation:hw-gallop .34s ease-in-out infinite alternate;filter:drop-shadow(0 0 10px rgba(141,255,74,.45))}
.hw-rider svg{width:100%;height:100%}
.hw-rider i{position:absolute;left:24px;top:96px;width:5px;height:5px;border-radius:50%;background:#b6ff6a;box-shadow:0 0 8px #8dff4a;opacity:0;animation:hw-trail 1.1s linear infinite}
.hw-rider i:nth-of-type(2){animation-delay:-.2s;top:86px}.hw-rider i:nth-of-type(3){animation-delay:-.45s;top:104px}.hw-rider i:nth-of-type(4){animation-delay:-.7s;top:92px;background:#ffb04a;box-shadow:0 0 8px #ff8a1f}.hw-rider i:nth-of-type(5){animation-delay:-.9s;top:100px}
@keyframes hw-ride{0%{transform:translate(-200px,40px)}50%{transform:translate(50vw,4px)}100%{transform:translate(calc(100vw + 40px),-16px)}}
@keyframes hw-gallop{from{transform:translateY(0) rotate(-2deg)}to{transform:translateY(-7px) rotate(3deg)}}
@keyframes hw-trail{0%{opacity:0;transform:translate(0,0) scale(1)}15%{opacity:1}100%{opacity:0;transform:translate(-70px,10px) scale(.3)}}
@media (prefers-reduced-motion:reduce){.hw-ach,.hw-ach::after,.hw-fire .fls i,.hw-fire.out::after{animation:none!important;transition:none!important}.hw-rider{display:none!important}}
/* the snatch: the Horseman's lantern is a button while he rides */
.hw-snatch{position:absolute;left:58%;top:2%;width:22%;height:22%;margin:0;padding:0;border:0;border-radius:50%;background:none;cursor:pointer;pointer-events:auto}
.hw-snatch:focus-visible{outline:2px solid var(--gold,#ffd100);outline-offset:2px}
.hw-snatch:disabled{cursor:default}
/* the banner's hiding spot stays above a fire */
html.hw-on .banner>.hw-pk-spot.abs{z-index:6}
@media print{.hw-ach,.hw-fire,.hw-rider,.hw-splash{display:none!important}}

/* small touches: talent tooltips get a web in their corner and a pumpkin edge; the sticky section bar a line of firelight */
html.hw-on .tip{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Cdefs%3E%3CradialGradient id='wg' cx='90' cy='0' r='100' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23f4efe2'/%3E%3Cstop offset='.6' stop-color='%23e8e2d0' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23d8d0e8' stop-opacity='.35'/%3E%3C/radialGradient%3E%3CradialGradient id='dw'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.6' stop-color='%23dfe8ff' stop-opacity='.8'/%3E%3Cstop offset='1' stop-color='%23b9c4ff' stop-opacity='.2'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg%3E%3Cg opacity='0.36'%3E%3Cpath d='M90 0L2.0 0.0M90 0L9.7 24.6M90 0L21.2 48.2M90 0L40.6 68.0M90 0L64.0 79.9M90 0L90.0 88.0M74.0 0.0Q77.2 1.9 74.7 4.7Q78.4 5.7 76.9 9.2Q80.8 9.1 80.6 12.9Q84.1 11.5 85.1 15.2Q88.0 12.8 90.0 16.0M60.0 0.0Q65.9 3.6 61.3 8.8Q68.2 10.7 65.4 17.2Q72.7 17.0 72.4 24.3Q79.0 21.6 80.7 28.5Q86.2 24.0 90.0 30.0M45.0 0.0Q53.9 5.4 47.0 13.2Q57.2 16.0 53.1 25.8Q64.0 25.5 63.5 36.4Q73.5 32.5 76.1 42.8Q84.3 36.0 90.0 45.0M29.0 0.0Q41.1 7.3 31.7 17.8Q45.6 21.7 40.0 35.0Q54.8 34.6 54.1 49.4Q67.6 44.0 71.1 58.0Q82.3 48.8 90.0 61.0M12.0 0.0Q27.4 9.4 15.4 22.8Q33.2 27.7 26.1 44.7Q45.0 44.2 44.2 63.1Q61.3 56.3 65.9 74.2Q80.1 62.4 90.0 78.0' fill='none' stroke='url(%23wg)' stroke-width='.65' stroke-linecap='round'/%3E%3Cpath d='M14.6 31.8q-3 6-1 13 1 4-1.6 7' fill='none' stroke='url(%23wg)' stroke-width='.45'/%3E%3Ccircle cx='54.1' cy='49.4' r='1.40' fill='url(%23dw)'/%3E%3Ccircle cx='53.7' cy='48.9' r='0.42' fill='%23fff'/%3E%3Ccircle cx='61.3' cy='8.8' r='1.21' fill='url(%23dw)'/%3E%3Ccircle cx='60.9' cy='8.4' r='0.36' fill='%23fff'/%3E%3Ccircle cx='44.2' cy='63.1' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='43.8' cy='62.7' r='0.38' fill='%23fff'/%3E%3Ccircle cx='15.4' cy='22.8' r='1.49' fill='url(%23dw)'/%3E%3Ccircle cx='15.0' cy='22.4' r='0.45' fill='%23fff'/%3E%3Ccircle cx='47.0' cy='13.2' r='1.32' fill='url(%23dw)'/%3E%3Ccircle cx='46.6' cy='12.8' r='0.40' fill='%23fff'/%3E%3Ccircle cx='65.4' cy='17.2' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='65.0' cy='16.8' r='0.38' fill='%23fff'/%3E%3Ccircle cx='26.1' cy='44.7' r='1.15' fill='url(%23dw)'/%3E%3Ccircle cx='25.8' cy='44.4' r='0.34' fill='%23fff'/%3E%3Cpath d='M62 0v22' stroke='%23e8e2d0' stroke-width='.5'/%3E%3Cg transform='translate(62 25)'%3E%3Cellipse rx='2.6' ry='3.2' fill='%2315110c'/%3E%3Ccircle cy='-3.6' r='1.8' fill='%2315110c'/%3E%3Cpath d='M-2 -1l-4-3M-2 1l-4.5 0M-2 2.5l-4 3.5M2 -1l4-3M2 1l4.5 0M2 2.5l4 3.5' stroke='%2315110c' stroke-width='.7' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");background-position:top right;background-size:44px 44px;background-repeat:no-repeat;box-shadow:inset 0 0 0 1px rgba(255,138,31,.16),0 6px 18px rgba(0,0,0,.5)}
html.hw-on .lab-sections{box-shadow:inset 0 -1px 0 rgba(255,138,31,.45),0 1px 10px rgba(255,120,30,.12),0 10px 18px rgba(0,0,0,.5)}

/* the guide pages: a lit jack-o'-lantern at the character's feet with its light on the floor, firelight under the chapter bar */
html.hw-on .hw-feet:not([hidden]){display:block;position:absolute;z-index:1;width:44px;height:44px;margin:-40px 0 0 -22px;pointer-events:none}
.hw-feet::before{content:"";position:absolute;left:-60px;right:-60px;top:20px;height:44px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,150,50,.32),rgba(255,120,30,.1) 60%,transparent);animation:hw-flicker 3s linear infinite}
.hw-feet svg{position:relative;width:100%;height:100%;filter:drop-shadow(0 0 10px rgba(255,150,40,.7))}
html.hw-on .gd-bar{box-shadow:inset 0 -1px 0 rgba(255,138,31,.45),0 1px 10px rgba(255,120,30,.12)}
@media (prefers-reduced-motion:reduce){.hw-feet::before{animation:none}}
@media print{.hw-feet{display:none!important}}

/* a bat asleep upside down from the top edge of the class tab you are on, swaying a little */
@keyframes hw-sway{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
.hw-hubbat{display:none}
html.hw-on .hw-hubbat{display:block;position:absolute;top:0;z-index:2;width:calc(18px * var(--s,1));height:calc(var(--th) + 28px * var(--s,1));margin-left:calc(-9px * var(--s,1));transform-origin:50% 0;animation:hw-sway 4.2s ease-in-out var(--d,0s) infinite;pointer-events:auto}
.hw-hubbat i{position:absolute;left:50%;top:0;width:1px;height:var(--th);background:linear-gradient(rgba(220,214,235,.05),rgba(220,214,235,.4))}
.hw-hubbat b{position:absolute;left:0;top:var(--th);width:100%;height:calc(28px * var(--s,1));background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 24'%3E%3Cpath d='M6.2 0v1.8q0 .9.9 1M9.8 0v1.8q0 .9-.9 1' stroke='%230e0a12' stroke-width='.9' fill='none' stroke-linecap='round'/%3E%3Cpath d='M8 2.6C12.6 2.6 14.4 6.4 13.8 10.6l-.9-.5-.2 1.4-.9-.4c-.4 1.9-1.3 3.6-2.4 4.5H6.6C5.5 14.7 4.6 13 4.2 11.1l-.9.4-.2-1.4-.9.5C1.6 6.4 3.4 2.6 8 2.6z' fill='%2322172e' stroke='%238a66b8' stroke-width='.55' stroke-linejoin='round'/%3E%3Cpath d='M4.6 4.2c1.3 3.2 1.6 6.6 1 10.2M11.4 4.2c-1.3 3.2-1.6 6.6-1 10.2M8 3.2v11.6' stroke='%234a3466' stroke-width='.5' fill='none'/%3E%3Cpath d='M5.4 18.6c0-1.8 1.2-3 2.6-3s2.6 1.2 2.6 3-1.2 2.4-2.6 2.4-2.6-.6-2.6-2.4z M5.8 19.8l-.7 3.6 2-2.4z M10.2 19.8l.7 3.6-2-2.4z' fill='%2322172e' stroke='%238a66b8' stroke-width='.5' stroke-linejoin='round'/%3E%3Cpath d='M6.5 18.9h1M8.5 18.9h1' stroke='%23ffb066' stroke-width='.7' stroke-linecap='round'/%3E%3C/svg%3E") center top/contain no-repeat;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6));transition:opacity .2s}
.hw-hubbat.gone b{opacity:0}.hw-hubbat.gone i{opacity:.3}
@media (prefers-reduced-motion:reduce){html.hw-on .hw-hubbat{animation:none}}
@media print{.hw-hubbat{display:none!important}}
@media print{html.hw-on .gd-bar,html.hw-on .lab-sections{box-shadow:none}html.hw-on .tip{background-image:none}}
.hw-costume svg{width:16px;height:16px;flex:none;border-radius:50%;background:#1a1420;padding:1px}
.hw-ach .sh svg{display:block}

/* a hidden pumpkin gives itself away now and then: a small wobble every eight seconds or so, never in step with another */
html.hw-on .hw-pk-spot:not(.lit) svg{transform-origin:50% 90%;animation:hw-nudge 8.5s ease-in-out infinite}
html.hw-on .hw-pk-spot[data-spot^="b"]:not(.lit) svg,html.hw-on .hw-pk-spot[data-spot^="r"]:not(.lit) svg{animation-delay:-3s}
html.hw-on .hw-pk-spot[data-spot^="t"]:not(.lit) svg,html.hw-on .hw-pk-spot[data-spot^="l"]:not(.lit) svg{animation-delay:-5.5s}
@keyframes hw-nudge{0%,86%,100%{rotate:0deg}89%{rotate:-10deg}92%{rotate:8deg}95%{rotate:-4deg}98%{rotate:1deg}}
@media (prefers-reduced-motion:reduce){html.hw-on .hw-pk-spot:not(.lit) svg{animation:none}}

/* ---------- the whole night (19 Oct, "still just doesn't feel halloween enough"): a starry plum sky behind every page, fog low in the
   window, the panels a shade of plum, a string of jack-o'-lantern lights on the header's line, firelit titles, spiders in the margins ---------- */
.hw-night,.hw-lights,.hw-dangle,.hw-cloud{display:none}
html.hw-on{--bg:#100c15;--panel:#1c1722;--panel2:#241d2c;--line:#3b3046;background:radial-gradient(1400px 700px at 80% -240px,rgba(122,75,179,.42),transparent 70%) no-repeat,radial-gradient(1000px 520px at 8% -180px,rgba(255,122,24,.13),transparent 70%) no-repeat,#100c15}
html.hw-on .hw-night{display:block;position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
/* the stars fade behind the reading column (--cl, --cr from halloween.js col()), so none sits between two lines of text */
.hw-night::before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 360 360'%3E%3Ccircle cx='86' cy='196' r='0.7' fill='%23efe4ff' opacity='0.80'/%3E%3Ccircle cx='225' cy='24' r='0.5' fill='%23efe4ff' opacity='0.80'/%3E%3Ccircle cx='93' cy='84' r='1.2' fill='%23fff1d6' opacity='0.53'/%3E%3Ccircle cx='171' cy='230' r='0.6' fill='%23ffffff' opacity='0.39'/%3E%3Ccircle cx='312' cy='188' r='1.2' fill='%23ffffff' opacity='0.26'/%3E%3Ccircle cx='57' cy='345' r='0.5' fill='%23ffffff' opacity='0.43'/%3E%3Ccircle cx='296' cy='97' r='1' fill='%23efe4ff' opacity='0.68'/%3E%3Ccircle cx='257' cy='332' r='0.8' fill='%23fff1d6' opacity='0.69'/%3E%3Ccircle cx='160' cy='337' r='0.7' fill='%23ffffff' opacity='0.31'/%3E%3Ccircle cx='178' cy='93' r='1.2' fill='%23fff1d6' opacity='0.51'/%3E%3Ccircle cx='308' cy='152' r='0.8' fill='%23fff1d6' opacity='0.59'/%3E%3Ccircle cx='211' cy='210' r='0.7' fill='%23ffffff' opacity='0.66'/%3E%3Ccircle cx='308' cy='357' r='1.2' fill='%23fff1d6' opacity='0.67'/%3E%3Ccircle cx='310' cy='347' r='1' fill='%23fff1d6' opacity='0.59'/%3E%3Ccircle cx='236' cy='228' r='1' fill='%23ffffff' opacity='0.41'/%3E%3Ccircle cx='23' cy='307' r='0.8' fill='%23ffffff' opacity='0.30'/%3E%3Ccircle cx='148' cy='54' r='0.7' fill='%23efe4ff' opacity='0.51'/%3E%3Ccircle cx='314' cy='16' r='1' fill='%23efe4ff' opacity='0.71'/%3E%3Ccircle cx='259' cy='119' r='0.7' fill='%23ffffff' opacity='0.55'/%3E%3Ccircle cx='111' cy='28' r='1' fill='%23ffffff' opacity='0.57'/%3E%3Ccircle cx='350' cy='105' r='0.7' fill='%23ffffff' opacity='0.34'/%3E%3Ccircle cx='353' cy='122' r='0.7' fill='%23efe4ff' opacity='0.83'/%3E%3Ccircle cx='136' cy='313' r='0.8' fill='%23fff1d6' opacity='0.64'/%3E%3Ccircle cx='245' cy='37' r='1' fill='%23fff1d6' opacity='0.41'/%3E%3Ccircle cx='259' cy='86' r='0.7' fill='%23efe4ff' opacity='0.51'/%3E%3Ccircle cx='188' cy='197' r='0.5' fill='%23fff1d6' opacity='0.72'/%3E%3Ccircle cx='113' cy='136' r='1' fill='%23ffffff' opacity='0.63'/%3E%3Ccircle cx='228' cy='120' r='0.7' fill='%23efe4ff' opacity='0.66'/%3E%3Ccircle cx='219' cy='100' r='0.8' fill='%23ffffff' opacity='0.26'/%3E%3Ccircle cx='344' cy='8' r='0.7' fill='%23efe4ff' opacity='0.40'/%3E%3Ccircle cx='108' cy='217' r='0.6' fill='%23efe4ff' opacity='0.47'/%3E%3Ccircle cx='273' cy='304' r='0.7' fill='%23efe4ff' opacity='0.43'/%3E%3Ccircle cx='38' cy='293' r='1' fill='%23ffffff' opacity='0.66'/%3E%3Ccircle cx='112' cy='80' r='0.7' fill='%23ffffff' opacity='0.39'/%3E%3Ccircle cx='244' cy='234' r='0.5' fill='%23efe4ff' opacity='0.31'/%3E%3Ccircle cx='342' cy='243' r='0.6' fill='%23ffffff' opacity='0.51'/%3E%3Ccircle cx='29' cy='267' r='0.6' fill='%23efe4ff' opacity='0.78'/%3E%3Ccircle cx='97' cy='283' r='0.5' fill='%23ffffff' opacity='0.57'/%3E%3Ccircle cx='113' cy='301' r='1' fill='%23efe4ff' opacity='0.36'/%3E%3Ccircle cx='122' cy='298' r='0.5' fill='%23efe4ff' opacity='0.73'/%3E%3Ccircle cx='212' cy='152' r='1' fill='%23efe4ff' opacity='0.73'/%3E%3Ccircle cx='167' cy='228' r='0.7' fill='%23efe4ff' opacity='0.50'/%3E%3Ccircle cx='13' cy='149' r='0.6' fill='%23fff1d6' opacity='0.25'/%3E%3Ccircle cx='355' cy='156' r='1.2' fill='%23fff1d6' opacity='0.38'/%3E%3Ccircle cx='164' cy='271' r='1.2' fill='%23efe4ff' opacity='0.56'/%3E%3Ccircle cx='196' cy='320' r='0.5' fill='%23efe4ff' opacity='0.76'/%3E%3Cpath d='M58 94L59.1 97.6 62 98 59.1 99.0 58 102 57.7 99.0 54 98 57.7 97.6z' fill='%23fff6e0' opacity='.8'/%3E%3Cpath d='M31 273L31.9 276.2 35 277 31.9 277.6 31 281 30.5 277.6 27 277 30.5 276.2z' fill='%23fff6e0' opacity='.8'/%3E%3Cpath d='M184 80L184.6 82.8 188 84 184.6 84.2 184 88 183.2 84.2 180 84 183.2 82.8z' fill='%23fff6e0' opacity='.8'/%3E%3C/svg%3E") 0 0/360px 360px,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 300'%3E%3Ccircle cx='139' cy='112' r='0.6' fill='%23fff1d6' opacity='0.36'/%3E%3Ccircle cx='2' cy='151' r='1' fill='%23fff1d6' opacity='0.30'/%3E%3Ccircle cx='281' cy='210' r='1.2' fill='%23fff1d6' opacity='0.48'/%3E%3Ccircle cx='284' cy='285' r='0.8' fill='%23ffffff' opacity='0.34'/%3E%3Ccircle cx='15' cy='40' r='1' fill='%23fff1d6' opacity='0.29'/%3E%3Ccircle cx='115' cy='224' r='0.5' fill='%23ffffff' opacity='0.80'/%3E%3Ccircle cx='202' cy='218' r='0.8' fill='%23efe4ff' opacity='0.78'/%3E%3Ccircle cx='273' cy='119' r='0.7' fill='%23ffffff' opacity='0.74'/%3E%3Ccircle cx='213' cy='2' r='0.8' fill='%23efe4ff' opacity='0.28'/%3E%3Ccircle cx='254' cy='42' r='0.6' fill='%23ffffff' opacity='0.50'/%3E%3Ccircle cx='289' cy='1' r='1' fill='%23ffffff' opacity='0.37'/%3E%3Ccircle cx='99' cy='268' r='0.6' fill='%23ffffff' opacity='0.57'/%3E%3Ccircle cx='150' cy='172' r='1' fill='%23efe4ff' opacity='0.80'/%3E%3Ccircle cx='21' cy='58' r='0.5' fill='%23ffffff' opacity='0.67'/%3E%3Ccircle cx='52' cy='183' r='0.5' fill='%23fff1d6' opacity='0.28'/%3E%3Ccircle cx='205' cy='256' r='1.2' fill='%23fff1d6' opacity='0.41'/%3E%3Ccircle cx='299' cy='36' r='1.2' fill='%23ffffff' opacity='0.49'/%3E%3Ccircle cx='49' cy='151' r='1.2' fill='%23fff1d6' opacity='0.47'/%3E%3Ccircle cx='157' cy='170' r='1.2' fill='%23efe4ff' opacity='0.30'/%3E%3Ccircle cx='33' cy='265' r='0.7' fill='%23efe4ff' opacity='0.52'/%3E%3Ccircle cx='60' cy='284' r='1.2' fill='%23fff1d6' opacity='0.26'/%3E%3Ccircle cx='99' cy='130' r='0.6' fill='%23efe4ff' opacity='0.38'/%3E%3Cpath d='M104 39L105.1 42.4 108 43 105.1 43.8 104 47 103.7 43.8 100 43 103.7 42.4z' fill='%23fff6e0' opacity='.8'/%3E%3Cpath d='M184 43L184.4 46.1 188 47 184.4 47.5 184 51 183.0 47.5 180 47 183.0 46.1z' fill='%23fff6e0' opacity='.8'/%3E%3Cpath d='M224 23L224.6 25.9 228 27 224.6 27.3 224 31 223.2 27.3 220 27 223.2 25.9z' fill='%23fff6e0' opacity='.8'/%3E%3C/svg%3E") 140px 90px/300px 300px;-webkit-mask-image:linear-gradient(#000,rgba(0,0,0,.35) 60%,transparent 92%),linear-gradient(90deg,#000 calc(var(--cl,-99px) - 28px),rgba(0,0,0,.16) var(--cl,-99px),rgba(0,0,0,.16) var(--cr,-99px),#000 calc(var(--cr,-99px) + 28px));-webkit-mask-composite:source-in;mask-image:linear-gradient(#000,rgba(0,0,0,.35) 60%,transparent 92%),linear-gradient(90deg,#000 calc(var(--cl,-99px) - 28px),rgba(0,0,0,.16) var(--cl,-99px),rgba(0,0,0,.16) var(--cr,-99px),#000 calc(var(--cr,-99px) + 28px));mask-composite:intersect}
.hw-night::after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 300'%3E%3Ccircle cx='139' cy='112' r='0.6' fill='%23fff1d6' opacity='0.36'/%3E%3Ccircle cx='2' cy='151' r='1' fill='%23fff1d6' opacity='0.30'/%3E%3Ccircle cx='281' cy='210' r='1.2' fill='%23fff1d6' opacity='0.48'/%3E%3Ccircle cx='284' cy='285' r='0.8' fill='%23ffffff' opacity='0.34'/%3E%3Ccircle cx='15' cy='40' r='1' fill='%23fff1d6' opacity='0.29'/%3E%3Ccircle cx='115' cy='224' r='0.5' fill='%23ffffff' opacity='0.80'/%3E%3Ccircle cx='202' cy='218' r='0.8' fill='%23efe4ff' opacity='0.78'/%3E%3Ccircle cx='273' cy='119' r='0.7' fill='%23ffffff' opacity='0.74'/%3E%3Ccircle cx='213' cy='2' r='0.8' fill='%23efe4ff' opacity='0.28'/%3E%3Ccircle cx='254' cy='42' r='0.6' fill='%23ffffff' opacity='0.50'/%3E%3Ccircle cx='289' cy='1' r='1' fill='%23ffffff' opacity='0.37'/%3E%3Ccircle cx='99' cy='268' r='0.6' fill='%23ffffff' opacity='0.57'/%3E%3Ccircle cx='150' cy='172' r='1' fill='%23efe4ff' opacity='0.80'/%3E%3Ccircle cx='21' cy='58' r='0.5' fill='%23ffffff' opacity='0.67'/%3E%3Ccircle cx='52' cy='183' r='0.5' fill='%23fff1d6' opacity='0.28'/%3E%3Ccircle cx='205' cy='256' r='1.2' fill='%23fff1d6' opacity='0.41'/%3E%3Ccircle cx='299' cy='36' r='1.2' fill='%23ffffff' opacity='0.49'/%3E%3Ccircle cx='49' cy='151' r='1.2' fill='%23fff1d6' opacity='0.47'/%3E%3Ccircle cx='157' cy='170' r='1.2' fill='%23efe4ff' opacity='0.30'/%3E%3Ccircle cx='33' cy='265' r='0.7' fill='%23efe4ff' opacity='0.52'/%3E%3Ccircle cx='60' cy='284' r='1.2' fill='%23fff1d6' opacity='0.26'/%3E%3Ccircle cx='99' cy='130' r='0.6' fill='%23efe4ff' opacity='0.38'/%3E%3Cpath d='M104 39L105.1 42.4 108 43 105.1 43.8 104 47 103.7 43.8 100 43 103.7 42.4z' fill='%23fff6e0' opacity='.8'/%3E%3Cpath d='M184 43L184.4 46.1 188 47 184.4 47.5 184 51 183.0 47.5 180 47 183.0 46.1z' fill='%23fff6e0' opacity='.8'/%3E%3Cpath d='M224 23L224.6 25.9 228 27 224.6 27.3 224 31 223.2 27.3 220 27 223.2 25.9z' fill='%23fff6e0' opacity='.8'/%3E%3C/svg%3E") 60px 30px/300px 300px;-webkit-mask-image:linear-gradient(#000,transparent 70%),linear-gradient(90deg,#000 calc(var(--cl,-99px) - 28px),rgba(0,0,0,.16) var(--cl,-99px),rgba(0,0,0,.16) var(--cr,-99px),#000 calc(var(--cr,-99px) + 28px));-webkit-mask-composite:source-in;mask-image:linear-gradient(#000,transparent 70%),linear-gradient(90deg,#000 calc(var(--cl,-99px) - 28px),rgba(0,0,0,.16) var(--cl,-99px),rgba(0,0,0,.16) var(--cr,-99px),#000 calc(var(--cr,-99px) + 28px));mask-composite:intersect;animation:hw-twinkle 4.6s ease-in-out infinite alternate}
@keyframes hw-twinkle{from{opacity:.15}to{opacity:1}}
.hw-night i{position:absolute;left:-20%;right:-20%;bottom:-6vh;height:34vh;background:radial-gradient(28% 50% at 18% 70%,rgba(180,160,230,.16),transparent 70%),radial-gradient(30% 46% at 52% 80%,rgba(180,160,230,.13),transparent 70%),radial-gradient(26% 52% at 84% 66%,rgba(160,220,180,.10),transparent 70%);animation:hw-mist 30s ease-in-out infinite alternate}
.hw-night i+i{bottom:-12vh;height:26vh;opacity:.8;animation-duration:42s;animation-direction:alternate-reverse}
.hw-night b{position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 40%,transparent 55%,rgba(40,14,60,.55) 100%)}
/* clouds crossing the moon */
html.hw-on .hw-cloud{display:block;position:absolute;top:var(--ct,40px);left:0;width:var(--cw,260px);height:calc(var(--cw,260px) * .26);border-radius:50%;background:radial-gradient(50% 50% at 50% 55%,rgba(150,128,190,.30),rgba(150,128,190,.12) 55%,transparent 72%),radial-gradient(30% 40% at 30% 40%,rgba(170,150,210,.22),transparent 70%),radial-gradient(28% 38% at 70% 45%,rgba(170,150,210,.18),transparent 70%);filter:blur(2px);animation:hw-drift var(--cd,110s) linear infinite;animation-delay:var(--cdl,0s)}
@keyframes hw-drift{from{transform:translateX(-320px)}to{transform:translateX(calc(100vw + 40px))}}
/* the moon on every screen: in the margin when there is one, else rising behind the header's right side */
@media (max-width:1339px){.hw-moon{display:block;--mz:120px;top:-30px;right:-26px;filter:brightness(.55) saturate(.9)}}
@media (max-width:640px){.hw-moon{--mz:96px;top:-34px;right:-30px;filter:brightness(.45) saturate(.9)}}
/* a string of lights along the header's line */
html.hw-on .masthead{position:relative}
html.hw-on .masthead{z-index:21}   /* over the guide's sticky chapter bar (20), under the drawer (70) */
html.hw-on .hw-lights{display:block;position:absolute;left:0;right:0;top:100%;height:34px;margin-top:-4px;z-index:2;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 34'%3E%3Cdefs%3E%3CradialGradient id='hff8a1f'%3E%3Cstop offset='0' stop-color='%23ff8a1f' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%23ff8a1f' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%23ff8a1f' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='hb06cff'%3E%3Cstop offset='0' stop-color='%23b06cff' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%23b06cff' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%23b06cff' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='h8dff4a'%3E%3Cstop offset='0' stop-color='%238dff4a' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%238dff4a' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%238dff4a' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='hffc24a'%3E%3Cstop offset='0' stop-color='%23ffc24a' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%23ffc24a' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%23ffc24a' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='gb' cx='.38' cy='.3' r='.75'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.3' stop-color='%23fff' stop-opacity='.2'/%3E%3Cstop offset='1' stop-color='%23000' stop-opacity='.25'/%3E%3C/radialGradient%3E%3CradialGradient id='pk' cx='.4' cy='.35' r='.7'%3E%3Cstop offset='0' stop-color='%23ffb04a'/%3E%3Cstop offset='.6' stop-color='%23ff8a1f'/%3E%3Cstop offset='1' stop-color='%23b8480c'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cpath d='M0 3Q70 17 140 3' fill='none' stroke='%230e140b' stroke-width='1.7'/%3E%3Cpath d='M0 2.5Q70 16.5 140 2.5' fill='none' stroke='%234d5c3c' stroke-width='.45' stroke-dasharray='2.2 1.6' opacity='.7'/%3E%3Cpath d='M140 3Q210 17 280 3' fill='none' stroke='%230e140b' stroke-width='1.7'/%3E%3Cpath d='M140 2.5Q210 16.5 280 2.5' fill='none' stroke='%234d5c3c' stroke-width='.45' stroke-dasharray='2.2 1.6' opacity='.7'/%3E%3Cpath d='M280 3Q350 17 420 3' fill='none' stroke='%230e140b' stroke-width='1.7'/%3E%3Cpath d='M280 2.5Q350 16.5 420 2.5' fill='none' stroke='%234d5c3c' stroke-width='.45' stroke-dasharray='2.2 1.6' opacity='.7'/%3E%3Ccircle cx='0' cy='2.6' r='1.9' fill='%232a2a2e'/%3E%3Ccircle cx='-0.5' cy='2.1' r='.6' fill='%239a9aa6'/%3E%3Ccircle cx='140' cy='2.6' r='1.9' fill='%232a2a2e'/%3E%3Ccircle cx='139.5' cy='2.1' r='.6' fill='%239a9aa6'/%3E%3Ccircle cx='280' cy='2.6' r='1.9' fill='%232a2a2e'/%3E%3Ccircle cx='279.5' cy='2.1' r='.6' fill='%239a9aa6'/%3E%3Cg transform='translate(28 7.48) rotate(5.5)'%3E%3Crect x='-1.5' y='0' width='3' height='3.4' rx='.5' fill='%231c2416'/%3E%3Crect x='-1.5' y='1.2' width='3' height='.5' fill='%233a4a2e'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='%23b06cff'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='url(%23gb)'/%3E%3C/g%3E%3Cg transform='translate(48 9.31) rotate(2.9)'%3E%3Crect x='-1.5' y='0' width='3' height='3.4' rx='.5' fill='%231c2416'/%3E%3Crect x='-1.5' y='1.2' width='3' height='.5' fill='%233a4a2e'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='%23ffc24a'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='url(%23gb)'/%3E%3C/g%3E%3Cg transform='translate(70 10.00) rotate(0.0)'%3E%3Crect x='-1.3' y='0' width='2.6' height='2.6' rx='.5' fill='%231c2416'/%3E%3Cpath d='M0 2.4v1.8' stroke='%233f6a1f' stroke-width='1.3'/%3E%3Cpath d='M0 4C-5.4 4-8 6.6-8 9.6S-5.2 15.4 0 15.4 8 12.6 8 9.6 5.4 4 0 4z' fill='url(%23pk)'/%3E%3Cpath d='M-3 4.4c-1.8 1.8-1.8 9 0 10.6M3 4.4c1.8 1.8 1.8 9 0 10.6' fill='none' stroke='%23a5410a' stroke-width='.7' opacity='.8'/%3E%3Cpath d='M-4.6 7.6l1.7-1.6 1.6 1.6z M1.3 7.6l1.7-1.6 1.6 1.6z M-3.4 8.6q3.4 2.6 6.8 0l-1 .4-.6 1-.7-.8-.9.9-.8-.9-.7.8-.6-1z' fill='%23ffe27a'/%3E%3Cpath d='M.4 4.2q.6-2.2 2.6-2.4' fill='none' stroke='%233f6a1f' stroke-width='.9' stroke-linecap='round'/%3E%3C/g%3E%3Cg transform='translate(92 9.31) rotate(-2.9)'%3E%3Crect x='-1.5' y='0' width='3' height='3.4' rx='.5' fill='%231c2416'/%3E%3Crect x='-1.5' y='1.2' width='3' height='.5' fill='%233a4a2e'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='%238dff4a'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='url(%23gb)'/%3E%3C/g%3E%3Cg transform='translate(113 7.36) rotate(-5.6)'%3E%3Crect x='-1.5' y='0' width='3' height='3.4' rx='.5' fill='%231c2416'/%3E%3Crect x='-1.5' y='1.2' width='3' height='.5' fill='%233a4a2e'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='%23b06cff'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='url(%23gb)'/%3E%3C/g%3E%3Cg transform='translate(168 7.48) rotate(5.5)'%3E%3Crect x='-1.5' y='0' width='3' height='3.4' rx='.5' fill='%231c2416'/%3E%3Crect x='-1.5' y='1.2' width='3' height='.5' fill='%233a4a2e'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='%238dff4a'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='url(%23gb)'/%3E%3C/g%3E%3Cg transform='translate(189 9.37) rotate(2.7)'%3E%3Crect x='-1.5' y='0' width='3' height='3.4' rx='.5' fill='%231c2416'/%3E%3Crect x='-1.5' y='1.2' width='3' height='.5' fill='%233a4a2e'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='%23ffc24a'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='url(%23gb)'/%3E%3C/g%3E%3Cg transform='translate(210 10.00) rotate(0.0)'%3E%3Crect x='-1.3' y='0' width='2.6' height='2.6' rx='.5' fill='%231c2416'/%3E%3Cpath d='M0 2.4v1.8' stroke='%233f6a1f' stroke-width='1.3'/%3E%3Cpath d='M0 4C-5.4 4-8 6.6-8 9.6S-5.2 15.4 0 15.4 8 12.6 8 9.6 5.4 4 0 4z' fill='url(%23pk)'/%3E%3Cpath d='M-3 4.4c-1.8 1.8-1.8 9 0 10.6M3 4.4c1.8 1.8 1.8 9 0 10.6' fill='none' stroke='%23a5410a' stroke-width='.7' opacity='.8'/%3E%3Cpath d='M-4.6 7.6l1.7-1.6 1.6 1.6z M1.3 7.6l1.7-1.6 1.6 1.6z M-3 8.8q3 1.8 6 0q-3 2.8-6 0z' fill='%23ffe27a'/%3E%3Cpath d='M.4 4.2q.6-2.2 2.6-2.4' fill='none' stroke='%233f6a1f' stroke-width='.9' stroke-linecap='round'/%3E%3C/g%3E%3Cg transform='translate(232 9.31) rotate(-2.9)'%3E%3Crect x='-1.5' y='0' width='3' height='3.4' rx='.5' fill='%231c2416'/%3E%3Crect x='-1.5' y='1.2' width='3' height='.5' fill='%233a4a2e'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='%23b06cff'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='url(%23gb)'/%3E%3C/g%3E%3Cg transform='translate(253 7.36) rotate(-5.6)'%3E%3Crect x='-1.5' y='0' width='3' height='3.4' rx='.5' fill='%231c2416'/%3E%3Crect x='-1.5' y='1.2' width='3' height='.5' fill='%233a4a2e'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='%238dff4a'/%3E%3Cpath d='M-2.4 3.4C-3.2 6-2.6 8.6 0 10.2 2.6 8.6 3.2 6 2.4 3.4z' fill='url(%23gb)'/%3E%3C/g%3E%3C/svg%3E") 30px 0/280px 34px repeat-x;filter:drop-shadow(0 2px 2px rgba(0,0,0,.55))}
.hw-lights::before,.hw-lights::after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 34'%3E%3Cdefs%3E%3CradialGradient id='hff8a1f'%3E%3Cstop offset='0' stop-color='%23ff8a1f' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%23ff8a1f' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%23ff8a1f' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='hb06cff'%3E%3Cstop offset='0' stop-color='%23b06cff' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%23b06cff' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%23b06cff' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='h8dff4a'%3E%3Cstop offset='0' stop-color='%238dff4a' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%238dff4a' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%238dff4a' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='hffc24a'%3E%3Cstop offset='0' stop-color='%23ffc24a' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%23ffc24a' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%23ffc24a' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='gb' cx='.38' cy='.3' r='.75'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.3' stop-color='%23fff' stop-opacity='.2'/%3E%3Cstop offset='1' stop-color='%23000' stop-opacity='.25'/%3E%3C/radialGradient%3E%3CradialGradient id='pk' cx='.4' cy='.35' r='.7'%3E%3Cstop offset='0' stop-color='%23ffb04a'/%3E%3Cstop offset='.6' stop-color='%23ff8a1f'/%3E%3Cstop offset='1' stop-color='%23b8480c'/%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='28' cy='14.5' r='8' fill='url(%23hb06cff)'/%3E%3Ccircle cx='70' cy='20.0' r='13' fill='url(%23hff8a1f)'/%3E%3Ccircle cx='113' cy='14.4' r='8' fill='url(%23hb06cff)'/%3E%3Ccircle cx='189' cy='16.4' r='8' fill='url(%23hffc24a)'/%3E%3Ccircle cx='232' cy='16.3' r='8' fill='url(%23hb06cff)'/%3E%3C/svg%3E") 30px 0/280px 34px repeat-x;mix-blend-mode:screen;animation:hw-flicker 2.9s linear infinite}
.hw-lights::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 34'%3E%3Cdefs%3E%3CradialGradient id='hff8a1f'%3E%3Cstop offset='0' stop-color='%23ff8a1f' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%23ff8a1f' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%23ff8a1f' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='hb06cff'%3E%3Cstop offset='0' stop-color='%23b06cff' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%23b06cff' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%23b06cff' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='h8dff4a'%3E%3Cstop offset='0' stop-color='%238dff4a' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%238dff4a' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%238dff4a' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='hffc24a'%3E%3Cstop offset='0' stop-color='%23ffc24a' stop-opacity='.8'/%3E%3Cstop offset='.45' stop-color='%23ffc24a' stop-opacity='.25'/%3E%3Cstop offset='1' stop-color='%23ffc24a' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='gb' cx='.38' cy='.3' r='.75'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.3' stop-color='%23fff' stop-opacity='.2'/%3E%3Cstop offset='1' stop-color='%23000' stop-opacity='.25'/%3E%3C/radialGradient%3E%3CradialGradient id='pk' cx='.4' cy='.35' r='.7'%3E%3Cstop offset='0' stop-color='%23ffb04a'/%3E%3Cstop offset='.6' stop-color='%23ff8a1f'/%3E%3Cstop offset='1' stop-color='%23b8480c'/%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='48' cy='16.3' r='8' fill='url(%23hffc24a)'/%3E%3Ccircle cx='92' cy='16.3' r='8' fill='url(%23h8dff4a)'/%3E%3Ccircle cx='168' cy='14.5' r='8' fill='url(%23h8dff4a)'/%3E%3Ccircle cx='210' cy='20.0' r='13' fill='url(%23hff8a1f)'/%3E%3Ccircle cx='253' cy='14.4' r='8' fill='url(%23h8dff4a)'/%3E%3C/svg%3E");animation-duration:3.7s;animation-delay:-1.3s}
.hw-lights i{position:absolute;left:0;right:0;top:12px;height:30px;background:radial-gradient(ellipse 50% 100% at 50% 0,rgba(255,140,40,.10),transparent 80%);pointer-events:none}
@media (max-width:640px){html.hw-on .hw-lights{height:28px;margin-top:-3px;background-size:230px 28px;background-position:12px 0}.hw-lights::before,.hw-lights::after{background-size:230px 28px;background-position:12px 0}}
/* spiders down from the top of the page into the side margins, wide screens */
html.hw-on .hw-dangle{display:block;position:absolute;top:0;left:var(--dx);width:16px;height:var(--dl,240px);pointer-events:none;animation:hw-dangle var(--dd,7s) ease-in-out infinite alternate;transform-origin:50% 0}
.hw-dangle i{position:absolute;left:50%;top:0;bottom:12px;width:1px;background:linear-gradient(rgba(232,226,208,.15),rgba(232,226,208,.6))}
.hw-dangle svg{position:absolute;left:0;bottom:0;width:16px;height:16px;filter:drop-shadow(0 0 1.5px rgba(232,226,208,.5)) drop-shadow(0 0 5px rgba(150,120,220,.4))}
@keyframes hw-dangle{0%{transform:scaleY(.86) rotate(1.5deg)}100%{transform:scaleY(1.04) rotate(-1.5deg)}}
@media (max-width:1339px){html.hw-on .hw-dangle{display:none}}
/* firelit titles */
html.hw-on .masthead .brand,html.hw-on #bannerName,html.hw-on .gd-title{color:#ffcf5c;text-shadow:0 0 14px rgba(255,128,30,.55),0 0 2px rgba(255,170,60,.6),0 2px 0 rgba(70,20,0,.85)}
/* the header's small grey line and the breadcrumb sit on the starry sky: a halo of the night's own colour round each letter, so a star behind
   a glyph never reads as part of it (20 Oct 2026: a star on the c of "dual spec" read as "spee") */
html.hw-on .masthead .tag,html.hw-on .tnav{text-shadow:0 0 2px #100c15,0 0 3px #100c15,0 0 6px rgba(16,12,21,.85)}
/* panels: a plum edge and a little firelight on the top line */
html.hw-on .tree,html.hw-on .banner,html.hw-on .gd-head{box-shadow:0 0 0 1px rgba(122,75,179,.35),0 -1px 0 rgba(255,138,31,.45),0 10px 30px rgba(20,6,34,.55)}
@media (prefers-reduced-motion:reduce){.hw-night::after,.hw-night i,.hw-cloud,.hw-lights::before,.hw-lights::after,.hw-dangle{animation:none!important}.hw-cloud{display:none!important}}
@media print{.hw-night,.hw-lights,.hw-dangle,.hw-cloud{display:none!important}}
/* the calculator's grey chrome in the same plum (same lightness, so nothing reads differently) */
html.hw-on .classes{background-color:#19141f}
html.hw-on .classes a:not([aria-pressed="true"]):not(:hover){background-color:#29222f}
html.hw-on .topbar{background-color:#2a2332}
html.hw-on .tree .thead{background-color:#31293a}
html.hw-on .lab-sections{background-color:rgba(22,16,28,.95)}
/* the fire, less even: a scorch and heat under the flames, the odd flame darker, embers going up */
html.hw-on .hw-fire::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(to top,rgba(60,14,0,.75),rgba(140,40,0,.32) 40%,transparent 85%),radial-gradient(60% 50% at 50% 100%,rgba(255,120,20,.35),transparent 70%);opacity:var(--burn);transition:opacity .4s;pointer-events:none}
.hw-fire .fls i:nth-child(3n){filter:brightness(.8) saturate(1.2) drop-shadow(0 0 6px rgba(255,120,30,.6))}
.hw-fire .emb{position:absolute;inset:0;pointer-events:none;overflow:hidden;opacity:var(--burn);transition:opacity .4s}
.hw-fire .emb b{position:absolute;bottom:12%;width:3px;height:3px;border-radius:50%;background:#ffd27a;box-shadow:0 0 6px 1px #ff8a1f;opacity:0;animation:hw-emb var(--ed,2s) ease-out infinite;animation-delay:var(--edl,0s)}
@keyframes hw-emb{0%{opacity:0;transform:translate(0,0)}15%{opacity:1}100%{opacity:0;transform:translate(var(--ex,0),-90px) scale(.4)}}
@media (prefers-reduced-motion:reduce){.hw-fire .emb{display:none}}
/* the treats, easier to see: the Horseman's green fire wraps the book; lanterns put a lit pumpkin on every full talent */
html.hw-on .hs-home.hs-hot .hs-wrap{filter:drop-shadow(0 0 8px #8dff4a) drop-shadow(0 0 20px rgba(63,209,26,.75));animation:hw-fel 1.1s ease-in-out infinite alternate}
@keyframes hw-fel{from{filter:drop-shadow(0 0 6px #8dff4a) drop-shadow(0 0 14px rgba(63,209,26,.6))}to{filter:drop-shadow(0 0 12px #b6ff6a) drop-shadow(0 0 28px rgba(63,209,26,.9))}}
html.hw-on.hw-lantern .trees .talent.maxed:not(.ps-me)::before{content:"";position:absolute;right:1px;top:1px;z-index:3;width:15px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-9 -3 18 19'%3E%3Cdefs%3E%3CradialGradient id='p' cx='.4' cy='.35' r='.7'%3E%3Cstop offset='0' stop-color='%23ffb04a'/%3E%3Cstop offset='.6' stop-color='%23ff8a1f'/%3E%3Cstop offset='1' stop-color='%23b8480c'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cpath d='M0 2.4v1.8' stroke='%233f6a1f' stroke-width='1.6'/%3E%3Cpath d='M0 4C-5.4 4-8 6.6-8 9.6S-5.2 15.4 0 15.4 8 12.6 8 9.6 5.4 4 0 4z' fill='url(%23p)' stroke='%232a1205' stroke-width='.8'/%3E%3Cpath d='M-3 4.4c-1.8 1.8-1.8 9 0 10.6M3 4.4c1.8 1.8 1.8 9 0 10.6' fill='none' stroke='%23a5410a' stroke-width='.7'/%3E%3Cpath d='M-4.6 7.6l1.7-1.6 1.6 1.6z M1.3 7.6l1.7-1.6 1.6 1.6z M-3.4 8.6q3.4 2.6 6.8 0l-1 .4-.6 1-.7-.8-.9.9-.8-.9-.7.8-.6-1z' fill='%23ffe27a'/%3E%3C/svg%3E") center/contain no-repeat;filter:drop-shadow(0 0 4px rgba(255,150,40,.9));pointer-events:none;animation:hw-pop .6s cubic-bezier(.2,1.6,.4,1)}
@media (prefers-reduced-motion:reduce){html.hw-on .hs-home.hs-hot .hs-wrap,html.hw-on.hw-lantern .trees .talent.maxed::before{animation:none}}
/* guide pages on phones: the header is one grid row (book, title, button); the bucket takes a short row of its own under the button */
@media (max-width:640px){body.gd .masthead>.hw-kit{grid-column:1/-1;grid-row:2;justify-self:end;margin:-2px 0 4px}}
/* pages with a breadcrumb under the header: room for the lanterns to hang above it */
html.hw-on .masthead+.tnav{padding-top:12px}
/* a few brighter stars with a soft glow, twinkling out of step; now and then a shooting star near the top */
.hw-night .hw-bright{position:absolute;width:3px;height:3px;border-radius:50%;background:#fffaf0;box-shadow:0 0 4px 1px rgba(255,250,235,.8),0 0 12px 3px rgba(200,180,255,.35);animation:hw-twinkle var(--tw,5s) ease-in-out infinite alternate}
.hw-night .hw-bright::before,.hw-night .hw-bright::after{content:"";position:absolute;left:50%;top:50%;width:15px;height:1px;margin:-.5px 0 0 -7.5px;background:linear-gradient(90deg,transparent,rgba(255,250,235,.7),transparent)}
.hw-night .hw-bright::after{transform:rotate(90deg)}
.hw-night .hw-bright.hw-dim{display:none}
html.hw-on .hw-shoot{display:block;position:absolute;left:62%;top:42px;width:120px;height:1.5px;border-radius:2px;background:linear-gradient(90deg,#fffaf0,rgba(255,240,210,.5) 30%,transparent);box-shadow:0 0 6px rgba(255,240,210,.6);opacity:0;animation:hw-shoot 26s linear infinite;animation-delay:8s}
.hw-shoot{display:none}
@keyframes hw-shoot{0%,95%{opacity:0;transform:translate(0,0) rotate(-20deg)}95.6%{opacity:1}99%{opacity:.8}100%{opacity:0;transform:translate(-260px,95px) rotate(-20deg)}}
@media (prefers-reduced-motion:reduce){.hw-shoot{display:none!important}.hw-night .hw-bright{animation:none}}
/* a touch screen (phones and tablets): the night holds still and scrolls with the page. A sky fixed behind the page, or anything moving
   under it (bats, twinkle, mist), makes the browser keep a second copy of the whole page on the GPU (two 390x8425 layers on /warrior at
   390), so a phone repainted the page twice on every class switch (20 Oct 2026, Chris: 'the mobile version of Halloween animations made
   the site run fairly slow on my phone like tagging between classes'). Six switches at 390 with the CPU slowed 4x drew 115 to 139 frames
   with the moving sky, 192 to 246 with it still, 237 to 262 with the look off. The still sky is the pose readers who ask for less motion
   get; the stars fade out down the screen as before, so the first screen looks the same. Taps, the pumpkins and the class tab's bat still play. */
@media (hover:none) and (pointer:coarse){
  html.hw-on .hw-night{position:absolute}
  .hw-night i{display:none}
  .hw-night::after,.hw-night .hw-bright,.hw-dangle,.hw-sky .hw-bat,.hw-sky .hw-bat i,.hw-sky .hw-bat b{animation:none!important}
  html.hw-on .hw-sky .hw-bat{opacity:.5;transform:translate(var(--sx,40vw),var(--y0,80px))}
  .hw-cloud,.hw-shoot{display:none!important}
}

/* ---------- the bag (19 Oct evening, Chris: "a button that gives them some type of value"): the bucket says what it holds, a prize to
   win, your tickets, or today's treat; it opens one small box with the prize and a name to enter, six ticket slots (one for entering,
   one per pumpkin), and today's treat for the class on the page ---------- */
.hw-kit.give .hw-chip .hw-lbl{min-width:86px}
html[lang="de"] .hw-kit.give .hw-chip .hw-lbl{min-width:106px}
.hw-chip.hw-slot.give{width:266px}
html[lang="de"] .hw-chip.hw-slot.give{width:286px}
@media (max-width:560px){.hw-chip.hw-slot.give,html[lang="de"] .hw-chip.hw-slot.give{width:80px}}
.hw-chip.in{color:#b6ff6a;box-shadow:inset 0 0 0 1px #3f7a1c}
.hw-chip[aria-expanded="true"]{background:#33200f;box-shadow:inset 0 0 0 1px var(--hw-pump2),0 0 14px rgba(255,138,31,.25)}
.hw-draw .hw-dbody{display:grid;gap:10px;align-items:start}
.hw-draw .hw-row1{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px}
.hw-draw .hw-row1 p{margin:0}
/* a long prize title wraps inside the box instead of running under the close x on a phone (finish-hallow-s-end-draw, measured 320 to 768, en and de) */
.hw-draw .hw-dbody{grid-template-columns:minmax(0,1fr)}.hw-draw .hw-row1>p{min-width:0;overflow-wrap:break-word}
.hw-draw .hw-row1 p b{font-size:15px}
.hw-draw .sub{display:block;margin-top:1px;font-size:12px;color:#a99bb3}
.hw-draw p.in{font-size:13.5px}
.hw-draw p.in b{font-family:inherit;color:#b6ff6a}
.hw-tix{display:flex;flex-wrap:wrap;align-items:center;gap:4px}
.hw-tix i{display:block;width:22px;height:22px;flex:none}
.hw-tix i svg{display:block;width:100%;height:100%}
.hw-tix i.pk:not(.on){opacity:.45;filter:grayscale(.8) brightness(.75)}
.hw-tix i.pk.on{filter:drop-shadow(0 0 5px rgba(255,150,40,.8))}
.hw-tix .tk{width:30px;height:20px;margin-right:4px;border-radius:3px;background:#2a2232;box-shadow:inset 0 0 0 1px #4a3a55;
  -webkit-mask:radial-gradient(circle 4px at 0 50%,transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 4px at 100% 50%,transparent 98%,#000) right/51% 100% no-repeat;
  mask:radial-gradient(circle 4px at 0 50%,transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 4px at 100% 50%,transparent 98%,#000) right/51% 100% no-repeat}
.hw-tix .tk.on{background:linear-gradient(180deg,#ffd27a,#f08a26);box-shadow:inset 0 0 0 1px #8a4a10}
.hw-tix .tk.ghost{display:none}
.hw-tix span{margin-left:8px;font-size:12px;color:#cfc3d6}
.hw-tix i.fx{width:20px;height:20px;margin-left:2px;background:center/contain no-repeat;opacity:.38;filter:grayscale(1) brightness(.8)}
.hw-tix i.fx.cat{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.6 20.6c2.6.2 4.2-1.2 4-3.4-.2-1.6-1.6-2.2-2.4-1.4' fill='none' stroke='%23e9dcff' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M6.4 21.4c-.8-3.6.2-7.4 2.8-9.4L8.4 6.2l2.8 2.4h2.4l2.8-2.4-.8 5.8c2.6 2 3.6 5.8 2.8 9.4z' fill='%23e9dcff'/%3E%3Ccircle cx='10.8' cy='11.6' r='.9' fill='%2315101c'/%3E%3Ccircle cx='14' cy='11.6' r='.9' fill='%2315101c'/%3E%3C/svg%3E")}
.hw-tix i.fx.witch{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2.5 17.6l19-4.2' stroke='%23e9dcff' stroke-width='1.3' stroke-linecap='round'/%3E%3Cpath d='M1 15.4l4.4.6-.6 3.6z' fill='%23e9dcff'/%3E%3Cpath d='M9.6 16.2l1.8-5.8 3.4-.4 1.6 5z' fill='%23e9dcff'/%3E%3Ccircle cx='13.4' cy='8.6' r='1.7' fill='%23e9dcff'/%3E%3Cpath d='M10.2 7.4l6.4-.6-2.2-1.4L13 1.4z' fill='%23e9dcff'/%3E%3Cpath d='M15.4 11.4l3 .8' stroke='%23e9dcff' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E")}
.hw-tix i.fx.on{opacity:1;filter:drop-shadow(0 0 5px rgba(190,140,255,.85))}
.hw-draw .hw-fine{flex-basis:100%;margin:2px 0 0;font-size:11.5px;line-height:1.4;color:#b9adc4}
.hw-draw .hw-won{flex-basis:100%;margin:4px 0 0;font-size:12.5px;color:#e8dcf4}
.hw-draw .hw-won b{color:#ffd27a;font-weight:700;font-family:inherit;font-variant:normal;text-transform:none;letter-spacing:0}
.hw-draw .hw-won .me{margin-left:6px;color:#9dff6a;font-weight:700}
.hw-draw .hw-won .sub{margin-left:6px;color:#a99bb8;font-size:11.5px}
.hw-draw .hw-again{padding:0;border:0;background:none;font:inherit;color:#ffd27a;text-decoration:underline;cursor:pointer}
.hw-draw .hw-again:disabled{color:#b9adc4;text-decoration:none;cursor:default}
a.hw-treat{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:8px 10px;border-radius:5px;font-size:13px;color:#efe6d6;text-decoration:none;background:rgba(141,255,74,.05);box-shadow:inset 0 0 0 1px rgba(141,255,74,.22)}
a.hw-treat:hover{background:rgba(141,255,74,.1)}
a.hw-treat b{color:#ffd27a}
a.hw-treat .tl{min-width:0}
a.hw-treat .pts{margin-left:6px;font-size:12px;font-variant-numeric:tabular-nums;color:#a99bb3}
a.hw-treat .go{margin-left:auto;padding:4px 12px;border-radius:4px;font-size:12px;font-weight:700;color:#1a0f05;background:linear-gradient(180deg,#ffc061,#f08a26)}
a.hw-treat:focus-visible{outline:2px solid var(--gold,#ffd100);outline-offset:2px}
.hw-toast b.tk{color:#b6ff6a}
@media (max-width:560px){.hw-tix span{flex-basis:100%;margin:4px 0 0}.hw-draw{padding-right:40px}}

/* ---------- the switch (19 Oct, Chris: "a very simple toggle off & on ... by the halloween button"): a toggle with a pumpkin for a knob,
   beside the bucket when on, alone in the same place when off ---------- */
.hw-sw{position:relative;display:inline-flex;align-items:center;flex:none;gap:7px;height:30px;margin:0 2px;padding:0 10px 0 4px;border:0;border-radius:15px;cursor:pointer;font:inherit;font-size:12px;font-weight:700;white-space:nowrap;color:#ffd7a0;background:#2a160a;box-shadow:inset 0 0 0 1px #7a3e14;transition:background .15s,box-shadow .15s}
.hw-sw::before{content:"";flex:none;width:38px;height:22px;border-radius:11px;background:#d9631a;box-shadow:inset 0 0 0 1px #ff9a3a,0 0 8px rgba(255,138,31,.35);transition:background .15s}
.hw-sw i{position:absolute;top:6px;left:22px;width:18px;height:18px;border-radius:50%;background:#2a1408;transition:left .15s}
.hw-sw i svg{display:block;width:100%;height:100%}
.hw-sw[aria-checked="false"]{color:#b9b9b9;background:#1e1e1e;box-shadow:inset 0 0 0 1px #4a4a4a}
.hw-sw[aria-checked="false"]::before{background:#3a3a3a;box-shadow:inset 0 0 0 1px #5a5a5a}
.hw-sw[aria-checked="false"] i{left:6px;background:#2a2a2a}
.hw-sw[aria-checked="false"] i svg{filter:grayscale(1) brightness(1.3)}
.hw-sw:hover{filter:brightness(1.12)}
.hw-sw:focus-visible{outline:2px solid var(--gold,#ffd100);outline-offset:2px}
@media (max-width:1100px){.hw-sw{padding:0 4px;gap:0}.hw-sw .hw-swl{display:none}}
.hw-kit.off{min-height:32px;margin-left:12px}
@media (max-width:560px){.hw-kit.off{margin-left:6px}}
@media (prefers-reduced-motion:reduce){.hw-sw,.hw-sw i{transition:none}}
@media print{.hw-kit{display:none!important}}

/* ---------- the middle of the page, quietly ---------- */
html.hw-on ::selection{background:rgba(255,138,31,.38);color:#fff}
html.hw-on{scrollbar-color:#4a3466 #120d18}
html.hw-on ::-webkit-scrollbar-thumb{background:#4a3466;border-radius:6px;border:2px solid #120d18}
html.hw-on ::-webkit-scrollbar-thumb:hover{background:#6a4a90}
html.hw-on ::-webkit-scrollbar-track{background:#120d18}
/* a web in the corner of every third plain card */
html.hw-on .hw-cw.hw-cwr{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Cdefs%3E%3CradialGradient id='wg' cx='90' cy='0' r='100' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23f4efe2'/%3E%3Cstop offset='.6' stop-color='%23e8e2d0' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23d8d0e8' stop-opacity='.35'/%3E%3C/radialGradient%3E%3CradialGradient id='dw'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.6' stop-color='%23dfe8ff' stop-opacity='.8'/%3E%3Cstop offset='1' stop-color='%23b9c4ff' stop-opacity='.2'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg%3E%3Cg opacity='0.36'%3E%3Cpath d='M90 0L2.0 0.0M90 0L9.7 24.6M90 0L21.2 48.2M90 0L40.6 68.0M90 0L64.0 79.9M90 0L90.0 88.0M74.0 0.0Q77.2 1.9 74.7 4.7Q78.4 5.7 76.9 9.2Q80.8 9.1 80.6 12.9Q84.1 11.5 85.1 15.2Q88.0 12.8 90.0 16.0M60.0 0.0Q65.9 3.6 61.3 8.8Q68.2 10.7 65.4 17.2Q72.7 17.0 72.4 24.3Q79.0 21.6 80.7 28.5Q86.2 24.0 90.0 30.0M45.0 0.0Q53.9 5.4 47.0 13.2Q57.2 16.0 53.1 25.8Q64.0 25.5 63.5 36.4Q73.5 32.5 76.1 42.8Q84.3 36.0 90.0 45.0M29.0 0.0Q41.1 7.3 31.7 17.8Q45.6 21.7 40.0 35.0Q54.8 34.6 54.1 49.4Q67.6 44.0 71.1 58.0Q82.3 48.8 90.0 61.0M12.0 0.0Q27.4 9.4 15.4 22.8Q33.2 27.7 26.1 44.7Q45.0 44.2 44.2 63.1Q61.3 56.3 65.9 74.2Q80.1 62.4 90.0 78.0' fill='none' stroke='url(%23wg)' stroke-width='.65' stroke-linecap='round'/%3E%3Cpath d='M14.6 31.8q-3 6-1 13 1 4-1.6 7' fill='none' stroke='url(%23wg)' stroke-width='.45'/%3E%3Ccircle cx='54.1' cy='49.4' r='1.40' fill='url(%23dw)'/%3E%3Ccircle cx='53.7' cy='48.9' r='0.42' fill='%23fff'/%3E%3Ccircle cx='61.3' cy='8.8' r='1.21' fill='url(%23dw)'/%3E%3Ccircle cx='60.9' cy='8.4' r='0.36' fill='%23fff'/%3E%3Ccircle cx='44.2' cy='63.1' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='43.8' cy='62.7' r='0.38' fill='%23fff'/%3E%3Ccircle cx='15.4' cy='22.8' r='1.49' fill='url(%23dw)'/%3E%3Ccircle cx='15.0' cy='22.4' r='0.45' fill='%23fff'/%3E%3Ccircle cx='47.0' cy='13.2' r='1.32' fill='url(%23dw)'/%3E%3Ccircle cx='46.6' cy='12.8' r='0.40' fill='%23fff'/%3E%3Ccircle cx='65.4' cy='17.2' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='65.0' cy='16.8' r='0.38' fill='%23fff'/%3E%3Ccircle cx='26.1' cy='44.7' r='1.15' fill='url(%23dw)'/%3E%3Ccircle cx='25.8' cy='44.4' r='0.34' fill='%23fff'/%3E%3Cpath d='M62 0v22' stroke='%23e8e2d0' stroke-width='.5'/%3E%3Cg transform='translate(62 25)'%3E%3Cellipse rx='2.6' ry='3.2' fill='%2315110c'/%3E%3Ccircle cy='-3.6' r='1.8' fill='%2315110c'/%3E%3Cpath d='M-2 -1l-4-3M-2 1l-4.5 0M-2 2.5l-4 3.5M2 -1l4-3M2 1l4.5 0M2 2.5l4 3.5' stroke='%2315110c' stroke-width='.7' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");background-position:top right;background-size:64px 64px;background-repeat:no-repeat}
html.hw-on .hw-cw.hw-cwl{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Cdefs%3E%3CradialGradient id='wg' cx='90' cy='0' r='100' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23f4efe2'/%3E%3Cstop offset='.6' stop-color='%23e8e2d0' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23d8d0e8' stop-opacity='.35'/%3E%3C/radialGradient%3E%3CradialGradient id='dw'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.6' stop-color='%23dfe8ff' stop-opacity='.8'/%3E%3Cstop offset='1' stop-color='%23b9c4ff' stop-opacity='.2'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg transform='translate(90 0) scale(-1 1)'%3E%3Cg opacity='0.28'%3E%3Cpath d='M90 0L2.0 0.0M90 0L9.7 24.6M90 0L21.2 48.2M90 0L40.6 68.0M90 0L64.0 79.9M90 0L90.0 88.0M74.0 0.0Q77.2 1.9 74.7 4.7Q78.4 5.7 76.9 9.2Q80.8 9.1 80.6 12.9Q84.1 11.5 85.1 15.2Q88.0 12.8 90.0 16.0M60.0 0.0Q65.9 3.6 61.3 8.8Q68.2 10.7 65.4 17.2Q72.7 17.0 72.4 24.3Q79.0 21.6 80.7 28.5Q86.2 24.0 90.0 30.0M45.0 0.0Q53.9 5.4 47.0 13.2Q57.2 16.0 53.1 25.8Q64.0 25.5 63.5 36.4Q73.5 32.5 76.1 42.8Q84.3 36.0 90.0 45.0M29.0 0.0Q41.1 7.3 31.7 17.8Q45.6 21.7 40.0 35.0Q54.8 34.6 54.1 49.4Q67.6 44.0 71.1 58.0Q82.3 48.8 90.0 61.0M12.0 0.0Q27.4 9.4 15.4 22.8Q33.2 27.7 26.1 44.7Q45.0 44.2 44.2 63.1Q61.3 56.3 65.9 74.2Q80.1 62.4 90.0 78.0' fill='none' stroke='url(%23wg)' stroke-width='.65' stroke-linecap='round'/%3E%3Cpath d='M14.6 31.8q-3 6-1 13 1 4-1.6 7' fill='none' stroke='url(%23wg)' stroke-width='.45'/%3E%3Ccircle cx='54.1' cy='49.4' r='1.36' fill='url(%23dw)'/%3E%3Ccircle cx='53.7' cy='48.9' r='0.41' fill='%23fff'/%3E%3Ccircle cx='15.4' cy='22.8' r='1.25' fill='url(%23dw)'/%3E%3Ccircle cx='15.0' cy='22.4' r='0.38' fill='%23fff'/%3E%3Ccircle cx='72.4' cy='24.3' r='1.14' fill='url(%23dw)'/%3E%3Ccircle cx='72.0' cy='23.9' r='0.34' fill='%23fff'/%3E%3Ccircle cx='71.1' cy='58.0' r='1.42' fill='url(%23dw)'/%3E%3Ccircle cx='70.7' cy='57.6' r='0.42' fill='%23fff'/%3E%3Ccircle cx='53.1' cy='25.8' r='1.62' fill='url(%23dw)'/%3E%3Ccircle cx='52.7' cy='25.3' r='0.49' fill='%23fff'/%3E%3Ccircle cx='26.1' cy='44.7' r='1.58' fill='url(%23dw)'/%3E%3Ccircle cx='25.6' cy='44.3' r='0.47' fill='%23fff'/%3E%3Ccircle cx='47.0' cy='13.2' r='1.49' fill='url(%23dw)'/%3E%3Ccircle cx='46.5' cy='12.7' r='0.45' fill='%23fff'/%3E%3Cpath d='M62 0v22' stroke='%23e8e2d0' stroke-width='.5'/%3E%3Cg transform='translate(62 25)'%3E%3Cellipse rx='2.6' ry='3.2' fill='%2315110c'/%3E%3Ccircle cy='-3.6' r='1.8' fill='%2315110c'/%3E%3Cpath d='M-2 -1l-4-3M-2 1l-4.5 0M-2 2.5l-4 3.5M2 -1l4-3M2 1l4.5 0M2 2.5l4 3.5' stroke='%2315110c' stroke-width='.7' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");background-position:top left;background-size:56px 56px;background-repeat:no-repeat}
/* section headings: a thread of ember under them */
html.hw-on .app main h2{background:linear-gradient(90deg,rgba(255,138,31,.55),rgba(122,75,179,.25) 30%,transparent 60%) left bottom/100% 1px no-repeat}
/* a guide's video: candlelight round the frame */
html.hw-on .gd-video{box-shadow:0 0 0 1px rgba(255,138,31,.25),0 0 28px rgba(255,120,30,.16),0 18px 40px rgba(20,6,34,.6)}
/* cards you can pick: a little firelight on hover */
html.hw-on .poptop li:hover,html.hw-on .gd-buildgrid>*:hover{box-shadow:inset 0 0 0 1px rgba(255,138,31,.5),0 0 14px rgba(255,120,30,.14)}
/* What's new: a web in its corner */
html.hw-on #logDrawer .dhead{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 90'%3E%3Cdefs%3E%3CradialGradient id='wg' cx='90' cy='0' r='100' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23f4efe2'/%3E%3Cstop offset='.6' stop-color='%23e8e2d0' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23d8d0e8' stop-opacity='.35'/%3E%3C/radialGradient%3E%3CradialGradient id='dw'%3E%3Cstop offset='0' stop-color='%23fff'/%3E%3Cstop offset='.6' stop-color='%23dfe8ff' stop-opacity='.8'/%3E%3Cstop offset='1' stop-color='%23b9c4ff' stop-opacity='.2'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg%3E%3Cg opacity='0.36'%3E%3Cpath d='M90 0L2.0 0.0M90 0L9.7 24.6M90 0L21.2 48.2M90 0L40.6 68.0M90 0L64.0 79.9M90 0L90.0 88.0M74.0 0.0Q77.2 1.9 74.7 4.7Q78.4 5.7 76.9 9.2Q80.8 9.1 80.6 12.9Q84.1 11.5 85.1 15.2Q88.0 12.8 90.0 16.0M60.0 0.0Q65.9 3.6 61.3 8.8Q68.2 10.7 65.4 17.2Q72.7 17.0 72.4 24.3Q79.0 21.6 80.7 28.5Q86.2 24.0 90.0 30.0M45.0 0.0Q53.9 5.4 47.0 13.2Q57.2 16.0 53.1 25.8Q64.0 25.5 63.5 36.4Q73.5 32.5 76.1 42.8Q84.3 36.0 90.0 45.0M29.0 0.0Q41.1 7.3 31.7 17.8Q45.6 21.7 40.0 35.0Q54.8 34.6 54.1 49.4Q67.6 44.0 71.1 58.0Q82.3 48.8 90.0 61.0M12.0 0.0Q27.4 9.4 15.4 22.8Q33.2 27.7 26.1 44.7Q45.0 44.2 44.2 63.1Q61.3 56.3 65.9 74.2Q80.1 62.4 90.0 78.0' fill='none' stroke='url(%23wg)' stroke-width='.65' stroke-linecap='round'/%3E%3Cpath d='M14.6 31.8q-3 6-1 13 1 4-1.6 7' fill='none' stroke='url(%23wg)' stroke-width='.45'/%3E%3Ccircle cx='54.1' cy='49.4' r='1.40' fill='url(%23dw)'/%3E%3Ccircle cx='53.7' cy='48.9' r='0.42' fill='%23fff'/%3E%3Ccircle cx='61.3' cy='8.8' r='1.21' fill='url(%23dw)'/%3E%3Ccircle cx='60.9' cy='8.4' r='0.36' fill='%23fff'/%3E%3Ccircle cx='44.2' cy='63.1' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='43.8' cy='62.7' r='0.38' fill='%23fff'/%3E%3Ccircle cx='15.4' cy='22.8' r='1.49' fill='url(%23dw)'/%3E%3Ccircle cx='15.0' cy='22.4' r='0.45' fill='%23fff'/%3E%3Ccircle cx='47.0' cy='13.2' r='1.32' fill='url(%23dw)'/%3E%3Ccircle cx='46.6' cy='12.8' r='0.40' fill='%23fff'/%3E%3Ccircle cx='65.4' cy='17.2' r='1.26' fill='url(%23dw)'/%3E%3Ccircle cx='65.0' cy='16.8' r='0.38' fill='%23fff'/%3E%3Ccircle cx='26.1' cy='44.7' r='1.15' fill='url(%23dw)'/%3E%3Ccircle cx='25.8' cy='44.4' r='0.34' fill='%23fff'/%3E%3Cpath d='M62 0v22' stroke='%23e8e2d0' stroke-width='.5'/%3E%3Cg transform='translate(62 25)'%3E%3Cellipse rx='2.6' ry='3.2' fill='%2315110c'/%3E%3Ccircle cy='-3.6' r='1.8' fill='%2315110c'/%3E%3Cpath d='M-2 -1l-4-3M-2 1l-4.5 0M-2 2.5l-4 3.5M2 -1l4-3M2 1l4.5 0M2 2.5l4 3.5' stroke='%2315110c' stroke-width='.7' fill='none'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");background-position:top right;background-size:60px 60px;background-repeat:no-repeat}
/* the crow: perched on one panel's top edge, turning its head now and then, blinking */
.hw-crow{display:none}
html.hw-on .hw-crow:not([hidden]){display:block;position:absolute;z-index:3;width:40px;height:34px;pointer-events:none;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.hw-crow svg{display:block;width:100%;height:100%;overflow:visible}
.hw-crow .hd{transform-box:fill-box;transform-origin:30% 90%;animation:hw-crowhd 9s ease-in-out infinite}
.hw-crow .ey{animation:hw-blink 6s steps(1) infinite}
@keyframes hw-crowhd{0%,40%,100%{transform:none}44%,58%{transform:rotate(-16deg)}62%,78%{transform:rotate(8deg) translateY(1px)}84%{transform:none}}
@keyframes hw-blink{0%,96%{opacity:1}97%,99%{opacity:0}}
@media (max-width:640px){html.hw-on .hw-crow{width:32px;height:27px}}
/* a ghost peeking in from the side margin now and then, wide screens only */
.hw-peek{display:none}
html.hw-on .hw-peek{display:block;position:fixed;z-index:2;width:46px;height:54px;pointer-events:none;opacity:.85;animation:hw-peekl 4.4s ease-in-out forwards}
.hw-peek.l{left:0}
.hw-peek.r{right:0;animation-name:hw-peekr}
.hw-peek svg{width:100%;height:100%}
.hw-peek.r svg{transform:scaleX(-1)}
@keyframes hw-peekl{0%{transform:translateX(-110%) rotate(20deg)}25%,70%{transform:translateX(-30%) rotate(14deg)}40%{transform:translateX(-26%) rotate(10deg)}100%{transform:translateX(-110%) rotate(20deg)}}
@keyframes hw-peekr{0%{transform:translateX(110%) rotate(-20deg)}25%,70%{transform:translateX(30%) rotate(-14deg)}40%{transform:translateX(26%) rotate(-10deg)}100%{transform:translateX(110%) rotate(-20deg)}}
@media (prefers-reduced-motion:reduce){.hw-crow .hd,.hw-crow .ey{animation:none}.hw-peek{display:none!important}}
@media print{.hw-crow,.hw-peek{display:none!important}html.hw-on .hw-cw{background-image:none}}
/* the grey cards inside the panels in the same plum, each at its own lightness */
html.hw-on ul.hub>li,html.hw-on ol.poptop>li,html.hw-on details.legacy .prtoggle{background-color:#251e2c}
html.hw-on .bkctl .seg,html.hw-on .ltree table.bylv{background-color:#1d1823}
html.hw-on .lr-cards .lr-card{background-color:#1b1620}
html.hw-on .lab-abil .la-line,html.hw-on ul.lr-plates>li,html.hw-on .rh .lab-seg{background-color:#16121b}
html.hw-on .lf-chips>span,html.hw-on .lf-p .lf-press,html.hw-on .lf-me .lf-soc{background-color:#19141e}
/* wide screens: the switch says "Halloween", so the bucket drops its dots (they are in the bag) to keep the header on one line */
@media (min-width:1101px){.hw-chip .hw-dots{display:none}}
/* the costumes' flames, alive: a soft light over each one, flickering */
.hw-lt{display:none}
html.hw-on .hw-lt{display:block;position:absolute;z-index:1;border-radius:50%;pointer-events:none;mix-blend-mode:screen;background:radial-gradient(circle,rgba(255,190,90,.55),rgba(255,130,30,.18) 45%,transparent 70%);animation:hw-flicker 2.4s linear infinite}
html.hw-on .hw-lt.g{background:radial-gradient(circle,rgba(190,255,120,.55),rgba(90,220,40,.18) 45%,transparent 70%);animation-duration:3.1s}
@media (prefers-reduced-motion:reduce){.hw-lt{display:none!important}}
@media print{.hw-lt{display:none!important}}
/* ---------- the props: little things sitting on the site's ledges (the end of a section heading, the spellbook's margins, the class
   banner's floor), each with its own shadow and, lit, its light on the ledge; flames flicker ---------- */
.hw-prop{display:none}
html.hw-on .hw-prop{display:block;position:absolute;z-index:2;width:calc(var(--w) * var(--s,1) * 1px);height:calc(var(--h) * var(--s,1) * 1px);background-position:center bottom;background-size:100% 100%;background-repeat:no-repeat;pointer-events:none;margin-bottom:-5px}
.hw-prop::before,.hw-prop::after,.hw-prop i{content:"";display:none;position:absolute;border-radius:50%;mix-blend-mode:screen;animation:hw-flicker 2.6s linear infinite}
.hw-prop::after{animation-duration:3.3s;animation-delay:-1.2s}
.hw-prop i{animation-duration:2.1s;animation-delay:-.6s}
/* the cauldron and the potions bubble, the cat breathes */
.hw-prop.p-cauldron b,.hw-prop.p-potions b{position:absolute;bottom:58%;width:6%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#f4ffe0,#8dff4a 60%,transparent 70%);opacity:0;animation:hw-bubble 2.4s ease-out infinite}
.hw-prop.p-cauldron b:nth-of-type(1){left:38%}.hw-prop.p-cauldron b:nth-of-type(2){left:52%;animation-delay:-.9s;animation-duration:2.9s}.hw-prop.p-cauldron b:nth-of-type(3){left:44%;animation-delay:-1.7s;width:4%}
.hw-prop.p-potions b{bottom:52%;width:5%}.hw-prop.p-potions b:nth-of-type(1){left:36%}.hw-prop.p-potions b:nth-of-type(2){left:41%;animation-delay:-1.3s}.hw-prop.p-potions b:nth-of-type(3){display:none}
@keyframes hw-bubble{0%{opacity:0;transform:translateY(0) scale(.6)}20%{opacity:.9}100%{opacity:0;transform:translateY(-26px) scale(1.2)}}
.hw-prop.p-cat{transform-origin:50% 100%;animation:hw-breathe 3.6s ease-in-out infinite}
@keyframes hw-breathe{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.035)}}
/* the broom leaning in the page's right margin by the class banner */
.hw-prop.lean{transform:rotate(4deg);transform-origin:50% 100%}
@media (prefers-reduced-motion:reduce){.hw-prop::before,.hw-prop::after,.hw-prop i,.hw-prop.p-cat{animation:none}.hw-prop b{display:none}}
@media print{.hw-prop{display:none!important}}
/* ---------- the banner's pumpkins answer the class's magic (halloween.js REACT): the pieces they burst into, the arrow that sticks, the
   ice, the sheep, the shield, the claw marks, the flower; a click on them plays one of the class's effects ---------- */
html.hw-on .hw-prop{pointer-events:auto;cursor:pointer;-webkit-tap-highlight-color:transparent}
html.hw-on .hw-prop:hover{filter:brightness(1.14) drop-shadow(0 0 6px rgba(255,150,50,.45))}
.hw-prop.hw-out{filter:brightness(.6) saturate(.75)!important;transition:filter .2s}
.hw-prop.hw-out::before,.hw-prop.hw-out::after,.hw-prop.hw-out>i{opacity:0;animation:none}
.hw-wisp2{position:absolute;z-index:3;pointer-events:none;filter:drop-shadow(0 0 5px rgba(220,210,255,.7))}
.hw-wisp2 svg{display:block;width:100%;height:100%}
.hw-bfx,.hw-shard,.hw-scar,.hw-sheep{display:none}
html.hw-on .hw-bfx{display:block;position:absolute;left:0;top:0;z-index:4;pointer-events:none}
html.hw-on .hw-shard{display:block;position:absolute;z-index:3;pointer-events:none;background-position:center bottom;background-size:100% 100%;background-repeat:no-repeat;will-change:transform}
html.hw-on .hw-scar{display:block;position:absolute;z-index:2;pointer-events:none;border-radius:50%;background:radial-gradient(ellipse at 50% 55%,#fff3c0,#ffc040 30%,#e8701a 58%,#4a1402 78%,rgba(40,10,0,0) 82%);box-shadow:0 -6px 14px rgba(255,170,60,.45)}
.hw-arrow{position:absolute;z-index:3;pointer-events:none;transform-origin:100% 50%;filter:drop-shadow(0 1px 1px rgba(0,0,0,.55))}
.hw-arrow svg{display:block;width:100%;height:100%;overflow:visible}
.hw-ice{position:absolute;inset:-3% -3% 0;z-index:3;pointer-events:none;animation:hw-icein .22s ease-out both;filter:drop-shadow(0 0 5px rgba(170,225,255,.6))}
.hw-ice svg{display:block;width:100%;height:100%}
.hw-ice.melt{animation:hw-melt .85s ease-in forwards}
@keyframes hw-icein{from{clip-path:inset(100% 0 0 0);opacity:.4}to{clip-path:inset(0);opacity:1}}
@keyframes hw-melt{to{opacity:0;transform:translateY(4px) scaleY(.9);transform-origin:50% 100%}}
.hw-prop.hw-cold{filter:saturate(.45) brightness(1.06) hue-rotate(-16deg)}
.hw-prop.hw-cold::before,.hw-prop.hw-cold::after,.hw-prop.hw-cold>i{opacity:.12;animation-play-state:paused}
.hw-prop.hw-dark{filter:brightness(.36) saturate(.5)!important;transition:filter .3s}
.hw-prop.hw-dark::before,.hw-prop.hw-dark::after,.hw-prop.hw-dark>i{opacity:0;animation:none}
html.hw-on .hw-sheep{display:block;position:absolute;z-index:3;pointer-events:none;transform-origin:50% 100%;filter:drop-shadow(0 0 6px rgba(200,160,255,.55))}
.hw-sheep svg{display:block;width:100%;height:100%}
.hw-bub{position:absolute;left:-12%;top:-4%;width:124%;height:108%;z-index:3;pointer-events:none;border-radius:50%;background:radial-gradient(circle,rgba(var(--bc),0) 56%,rgba(var(--bc),.16) 72%,rgba(var(--bc),.7) 98%,rgba(var(--bc),0) 100%);box-shadow:0 0 12px rgba(var(--bc),.45);animation:hw-bubin .3s cubic-bezier(.2,1.5,.4,1) both,hw-bubbreathe 1.6s ease-in-out .3s infinite}
.hw-bub::after{content:"";position:absolute;left:20%;top:12%;width:22%;height:14%;border-radius:50%;border-top:2px solid rgba(255,255,255,.75);transform:rotate(-24deg)}
.hw-bub.out{animation:hw-bubout .45s ease-in forwards}
@keyframes hw-bubin{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes hw-bubbreathe{50%{transform:scale(1.03)}}
@keyframes hw-bubout{to{transform:scale(1.15);opacity:0}}
.hw-claw{position:absolute;inset:0;z-index:3;pointer-events:none;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-position:center bottom;mask-position:center bottom;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.hw-claw svg{display:block;width:100%;height:100%}
.hw-claw g{animation:hw-slash .16s ease-out both;transform-origin:70% 20%}
.hw-claw.out{opacity:0;transition:opacity .5s}
@keyframes hw-slash{from{transform:scale(.2);opacity:0}to{transform:scale(1);opacity:1}}
.hw-bloom{position:absolute;left:54%;top:4%;width:18%;aspect-ratio:1;z-index:3;pointer-events:none;animation:hw-bloomin .6s cubic-bezier(.2,1.6,.4,1) both;filter:drop-shadow(0 0 4px rgba(255,150,200,.6))}
.hw-bloom svg{display:block;width:100%;height:100%}
.hw-bloom.out{opacity:0;transition:opacity .5s}
@keyframes hw-bloomin{from{transform:scale(0) rotate(-90deg)}to{transform:scale(1) rotate(0)}}
.hw-leaves{position:absolute;inset:0;z-index:3;pointer-events:none;filter:drop-shadow(0 0 3px rgba(157,255,74,.45))}
.hw-leaves svg{display:block;width:100%;height:100%;overflow:visible}
.hw-leaves g{animation:hw-unfurl .75s cubic-bezier(.2,1.5,.4,1) both}
.hw-leaves g.b{animation-delay:.16s;animation-name:hw-unfurlb}
.hw-leaves.out{opacity:0;transition:opacity .6s}
@keyframes hw-unfurl{from{transform:scale(0) rotate(-50deg)}to{transform:scale(1) rotate(0)}}
@keyframes hw-unfurlb{from{transform:scale(0) rotate(50deg)}to{transform:scale(1) rotate(0)}}
@media (prefers-reduced-motion:reduce){.hw-bfx,.hw-shard,.hw-arrow,.hw-ice,.hw-sheep,.hw-bub,.hw-claw,.hw-bloom,.hw-wisp2,.hw-leaves{display:none!important}}
@media print{.hw-bfx,.hw-shard,.hw-arrow,.hw-ice,.hw-sheep,.hw-bub,.hw-claw,.hw-bloom,.hw-scar{display:none!important}}
/* the little shelf a heading's prop stands on: an ember line fading at both ends, a soft shadow under it */
.hw-shelf{display:none}
html.hw-on .hw-shelf{display:block;position:absolute;z-index:1;height:2px;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,150,60,.75) 22%,rgba(255,180,90,.9) 50%,rgba(255,150,60,.75) 78%,transparent);box-shadow:0 2px 6px rgba(0,0,0,.6),0 0 8px rgba(255,120,30,.25)}
@media print{.hw-shelf{display:none!important}}
/* ---------- the night's toys: the witch across the moon, the spider up its thread, the crow off and back, the lanterns and the Wickerman ---------- */
.hw-witch{position:absolute;z-index:1;pointer-events:none;filter:drop-shadow(0 0 1px rgba(184,154,232,.4))}
.hw-witch svg{display:block;width:100%;height:100%}
html.hw-on .hw-dangle{transition:height 3.2s cubic-bezier(.45,0,.3,1)}
html.hw-on .hw-dangle.up{height:34px;transition:height .32s cubic-bezier(.2,.9,.3,1)}
html.hw-on .hw-crow:not([hidden]){pointer-events:auto;cursor:pointer}
.hw-crow.away{animation:hw-crowoff .9s cubic-bezier(.4,0,.8,.6) forwards}
.hw-crow.back{animation:hw-crowoff .9s cubic-bezier(.2,.4,.6,1) reverse both}
/* it flies off toward the side with room (--cdir, set where it perches): flying right from a perch near the right edge laid a phone's
   page out 449 px wide for the few seconds of the wake (/guides at 390, 20 Oct 2026) */
@keyframes hw-crowoff{0%{transform:none;opacity:1}15%{transform:translateY(2px) scale(1.05,.9);opacity:1}100%{transform:translate(calc(var(--cdir,1) * 90px),-120px) rotate(calc(var(--cdir,1) * -14deg)) scale(.6);opacity:0}}
.hw-feather{position:absolute;z-index:3;width:7px;height:2px;border-radius:50%;background:#1a1226;box-shadow:0 0 1px rgba(168,138,216,.7);pointer-events:none;opacity:0;animation:hw-feather 3s ease-in forwards}
@keyframes hw-feather{0%{transform:translate(0,0) rotate(0);opacity:1}25%{transform:translate(8px,14px) rotate(40deg)}50%{transform:translate(-6px,30px) rotate(-30deg)}75%{transform:translate(6px,46px) rotate(30deg);opacity:.8}100%{transform:translate(0,62px) rotate(0);opacity:0}}
html.hw-on .hw-yard .hw-lan,html.hw-on .hw-wick{pointer-events:auto;cursor:pointer}
.hw-spark2{position:absolute;bottom:40%;width:3px;height:3px;border-radius:50%;background:#ffd27a;box-shadow:0 0 6px #ff8a1f;pointer-events:none;animation:hw-spark2 1.2s ease-out both}
@keyframes hw-spark2{from{transform:translate(0,0);opacity:1}to{transform:translate(var(--sx),-64px);opacity:0}}
@media (prefers-reduced-motion:reduce){.hw-witch,.hw-feather,.hw-spark2{display:none!important}html.hw-on .hw-dangle{transition:none}}
@media print{.hw-witch,.hw-feather,.hw-spark2{display:none!important}}
/* the bat that follows you from class tab to class tab; the gust of leaves on Reset build; the graveyard's ghosts */
.hw-flybat{position:fixed;left:0;top:0;z-index:70;width:24px;height:12px;pointer-events:none}
.hw-flybat b{position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 20'%3E%3Cdefs%3E%3ClinearGradient id='w' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%232c1f3e'/%3E%3Cstop offset='1' stop-color='%23120c1a'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M24 6.4L25.1 3.4L26 6.9Q26.9 7.6 27.6 8.3C31 5.4 37.4 3.2 46.8 4.2Q44.2 6.2 43.8 9.6Q41 8.4 38.2 10.6Q35.4 9.6 32.8 12.2Q30.2 11.4 27.8 13.2C27 15.2 25.4 16.6 24 16.8C22.6 16.6 21 15.2 20.2 13.2Q17.8 11.4 15.2 12.2Q12.6 9.6 9.8 10.6Q7 8.4 4.2 9.6Q3.8 6.2 1.2 4.2C10.6 3.2 17 5.4 20.4 8.3Q21.1 7.6 22 6.9L22.9 3.4L24 6.4z' fill='url(%23w)' stroke='%23a284d6' stroke-width='.4' stroke-opacity='.55'/%3E%3Cpath d='M27.4 8.6L46.8 4.2M27.4 8.6L43.8 9.6M27.4 8.6L38.2 10.6M27.4 8.6L32.8 12.2M20.6 8.6L1.2 4.2M20.6 8.6L4.2 9.6M20.6 8.6L9.8 10.6M20.6 8.6L15.2 12.2' stroke='%2307050a' stroke-width='.7' stroke-linecap='round' opacity='.9'/%3E%3Cellipse cx='24' cy='10.4' rx='2.6' ry='3.4' fill='%230c0810'/%3E%3Ccircle cx='23.1' cy='9.3' r='.62' fill='%23ffb066'/%3E%3Ccircle cx='24.9' cy='9.3' r='.62' fill='%23ffb066'/%3E%3C/svg%3E") center/contain no-repeat;animation:hw-flap .12s ease-in-out infinite alternate;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.hw-flybat.back b{animation-name:hw-flapb}
.hw-gust{position:fixed;left:0;top:0;width:100vw;height:100vh;z-index:60;pointer-events:none}
html.hw-on .hw-yard .hw-near{pointer-events:auto}
.hw-yghost{z-index:5}
.hw-postbat{width:34px;height:17px}
.hw-moonbat{position:absolute;z-index:auto}
.hw-moonbat b{filter:none;animation-duration:.16s}
.hw-postbat b{filter:drop-shadow(0 0 2.5px rgba(190,150,255,.75)) drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.hw-letter{position:fixed;left:0;top:0;z-index:69;width:13px;height:8px;pointer-events:none;border-radius:1.5px;background:linear-gradient(90deg,#b98a4a 0 14%,#f2e2b6 14% 86%,#b98a4a 86%);box-shadow:0 1px 2px rgba(0,0,0,.55)}
.hw-letter::after{content:"";position:absolute;left:5px;top:2.5px;width:3px;height:3px;border-radius:50%;background:#a8231a;box-shadow:0 0 0 .5px #6a120c}
@media (prefers-reduced-motion:reduce){.hw-flybat,.hw-gust,.hw-yghost,.hw-letter,.hw-yard .hw-eyes{display:none!important}}
@media print{.hw-flybat,.hw-gust{display:none!important}}
/* the graveyard's black cat: walks, sits and looks at you, arches and bolts when clicked */
.hw-cat{position:absolute;left:0;top:0;z-index:6;pointer-events:auto;cursor:pointer;filter:drop-shadow(0 0 2px rgba(168,138,216,.35))}
.hw-cat svg{display:block;width:100%;height:100%;overflow:visible}
.hw-cat.left svg{transform:scaleX(-1)}
.hw-cat .la,.hw-cat .lb{transform-box:fill-box;transform-origin:50% 0}
.hw-cat.walk .la{animation:hw-leg .44s ease-in-out infinite alternate}
.hw-cat.walk .lb{animation:hw-leg .44s ease-in-out infinite alternate-reverse}
.hw-cat.run .la,.hw-cat.run .lb{animation-duration:.13s}
@keyframes hw-leg{from{transform:rotate(18deg)}to{transform:rotate(-18deg)}}
.hw-cat .tl{transform-box:fill-box;transform-origin:100% 100%;animation:hw-tail 2.2s ease-in-out infinite alternate}
@keyframes hw-tail{from{transform:rotate(-9deg)}to{transform:rotate(11deg)}}
.hw-cat.sit .ey{animation:hw-catblink 4.2s steps(1) infinite}
@keyframes hw-catblink{0%,92%{opacity:1}93%,97%{opacity:0}98%{opacity:1}}
.hw-cat.arch svg{animation:hw-puff .6s ease-out}
.hw-cat.arch.left svg{animation-name:hw-puffl}
@keyframes hw-puff{0%{transform:scale(1)}30%{transform:scale(1.14,1.22)}100%{transform:scale(1.04)}}
@keyframes hw-puffl{0%{transform:scaleX(-1)}30%{transform:scale(-1.14,1.22)}100%{transform:scale(-1.04,1.04)}}
@media (prefers-reduced-motion:reduce){.hw-cat:not(.still){display:none!important}}
.hw-stillwitch{position:absolute;z-index:1;pointer-events:none;opacity:0;transition:opacity .8s;filter:drop-shadow(0 0 1px rgba(184,154,232,.4))}
.hw-stillwitch.on{opacity:1}
.hw-stillwitch svg{display:block;width:100%;height:auto;overflow:visible}

@media print{.hw-cat{display:none!important}}
/* a talent's last rank: embers off it */
.hw-emb{position:fixed;z-index:20;pointer-events:none}
@media (prefers-reduced-motion:reduce){.hw-emb{display:none!important}}
/* /guides: the costume's flames flare up under the pointer */
html.hw-on a.gd-upnow .hw-lt{transition:transform .35s ease,filter .35s ease}
html.hw-on a.gd-upnow:hover .hw-lt,html.hw-on a.gd-upnow:focus-visible .hw-lt{transform:scale(1.45);filter:brightness(1.6);animation-duration:.7s}
/* the night waking up when the reader switches it on */
html.hw-wake .hw-lights{animation:hw-lightson 1.3s steps(1) both}
@keyframes hw-lightson{0%{opacity:0}18%{opacity:.85}26%{opacity:.1}40%{opacity:.95}46%{opacity:.3}60%,100%{opacity:1}}
html.hw-wake .hw-moon{animation:hw-moonrise 1.8s cubic-bezier(.2,.7,.3,1) both}
@keyframes hw-moonrise{from{transform:translateY(46px);opacity:0}to{transform:none;opacity:1}}
html.hw-wake .hw-prop{animation:hw-propin .55s cubic-bezier(.2,1.6,.4,1) both;animation-delay:var(--pd,.3s);transform-origin:50% 100%}
@keyframes hw-propin{from{transform:scale(.1,.1);opacity:0}to{transform:none;opacity:1}}
html.hw-wake .hw-prop.lean{animation-name:hw-propinl}
@keyframes hw-propinl{from{transform:rotate(4deg) scale(.1);opacity:0}to{transform:rotate(4deg);opacity:1}}
html.hw-wake .hw-dangle{animation:hw-dropin 1.6s cubic-bezier(.3,1.3,.5,1) both}
@keyframes hw-dropin{from{transform:scaleY(.05)}to{transform:scaleY(1)}}
html.hw-wake .hw-crow{animation:hw-crowoff .9s cubic-bezier(.2,.4,.6,1) .6s reverse both}
html.hw-wake .hw-yard{animation:hw-yardup 1.4s ease-out both}
@keyframes hw-yardup{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){html.hw-wake *{animation:none!important}}
/* the bucket, under the pointer: it tips a little and a sweet and a candy corn peek over its rim */
.hw-chip .hw-ico{position:relative;isolation:isolate}
.hw-chip .hw-ico::before,.hw-chip .hw-ico::after{content:"";position:absolute;z-index:-1;pointer-events:none;opacity:0;background:center/contain no-repeat}
.hw-chip .hw-ico::before{left:2px;top:3px;width:13px;height:7px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 10'%3E%3Cpath d='M5.4 5L1 1.4v7.2zM14.6 5L19 1.4v7.2z' fill='%23e8457a'/%3E%3Cellipse cx='10' cy='5' rx='5.4' ry='3.7' fill='%23ff5a8a'/%3E%3Cpath d='M8 1.6l1.4 6.8M11.2 1.4l1.4 6.8' stroke='%23ffd6e4' stroke-width='.9'/%3E%3Cpath d='M6.8 3.4q3-1.2 5.8.2' stroke='%23fff' stroke-opacity='.75' stroke-width='.9' fill='none'/%3E%3C/svg%3E")}
.hw-chip .hw-ico::after{right:3px;top:3px;width:6px;height:8px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 12'%3E%3Cpath d='M1 10.6q4 1.6 8 0L7 5H3z' fill='%23f2c41a'/%3E%3Cpath d='M3 5h4L5.8 2H4.2z' fill='%23f0781a'/%3E%3Cpath d='M4.2 2h1.6L5 .4z' fill='%23fbf6ea'/%3E%3C/svg%3E")}
.hw-chip:hover .hw-ico svg,.hw-chip:focus-visible .hw-ico svg{transform:rotate(-7deg);transition:transform .25s cubic-bezier(.2,1.6,.4,1)}
.hw-chip:hover .hw-ico::before{animation:hw-peek .9s cubic-bezier(.2,1.3,.4,1) both}
.hw-chip:hover .hw-ico::after{animation:hw-peek2 .9s cubic-bezier(.2,1.3,.4,1) .12s both}
@keyframes hw-peek{0%{opacity:0;transform:translateY(6px) rotate(0)}35%{opacity:1;transform:translateY(-7px) rotate(-24deg)}70%{opacity:1;transform:translateY(-4px) rotate(-14deg)}100%{opacity:1;transform:translateY(-4px) rotate(-14deg)}}
@keyframes hw-peek2{0%{opacity:0;transform:translateY(6px) rotate(0)}35%{opacity:1;transform:translateY(-8px) rotate(20deg)}100%{opacity:1;transform:translateY(-5px) rotate(12deg)}}
@media (prefers-reduced-motion:reduce){.hw-chip:hover .hw-ico::before,.hw-chip:hover .hw-ico::after{animation:none;opacity:1;transform:translateY(-4px)}}
/* a leaf drifting down a side margin: falls, sways, turns; behind the page */
.hw-leaf{position:fixed;top:-24px;z-index:-1;width:calc(16px * var(--s,1));height:calc(17px * var(--s,1));pointer-events:none;animation:hw-leaffall var(--d,13s) linear forwards;opacity:.85}
.hw-leaf i{display:block;width:100%;height:100%;animation:hw-leafsway var(--sw,3s) ease-in-out infinite alternate}
.hw-leaf svg{display:block;width:100%;height:100%;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))}
@keyframes hw-leaffall{from{transform:translateY(0)}90%{opacity:.85}to{transform:translateY(calc(100vh + 40px));opacity:0}}
@keyframes hw-leafsway{from{transform:translateX(calc(var(--sx,20px) * -1)) rotate(-35deg) scaleX(.6)}to{transform:translateX(var(--sx,20px)) rotate(40deg) scaleX(1)}}
@media (prefers-reduced-motion:reduce){.hw-leaf{display:none!important}}
@media print{.hw-leaf{display:none!important}}
/* a tiny spider let down from an icon on its thread, swaying, and back up */
.hw-icospider{position:absolute;z-index:30;width:12px;height:0;pointer-events:none;animation:hw-icodrop 2.5s cubic-bezier(.3,.7,.4,1) forwards}
.hw-icospider i{position:absolute;left:50%;top:0;bottom:9px;width:1px;background:rgba(232,226,208,.55)}
.hw-icospider svg{position:absolute;left:0;bottom:-3px;width:12px;height:12px;filter:drop-shadow(0 0 1.5px rgba(232,226,208,.6));animation:hw-icosway .7s ease-in-out infinite alternate;transform-origin:50% -20px}
@keyframes hw-icodrop{0%{height:0}22%{height:26px}30%{height:22px}36%,72%{height:24px}100%{height:0}}
@keyframes hw-icosway{from{transform:rotate(-8deg)}to{transform:rotate(8deg)}}
.hw-icospider.web{animation:hw-webdrop 3.3s cubic-bezier(.3,.7,.4,1) forwards}
@keyframes hw-webdrop{0%{height:0}18%{height:46px}25%{height:39px}31%,40%{height:43px}48%{height:40px}56%,74%{height:42px}100%{height:0}}
@media (prefers-reduced-motion:reduce){.hw-icospider{display:none!important}}
/* review fixes (19 Oct): a crow that has flown takes no clicks; a click during the wake-up still sends it; the bucket's tilt rests with Reduce Motion */
.hw-crow.away{pointer-events:none!important}
html.hw-wake .hw-crow.away{animation:hw-crowoff .9s cubic-bezier(.4,0,.8,.6) forwards}
@media (prefers-reduced-motion:reduce){.hw-chip .hw-ico svg{transition:none!important;transform:none!important}}
/* a piece's cut edge: the rind's flesh, clipped to the pumpkin's body */
.hw-flesh{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
/* the ice's cracks, showing just before it bursts off */
.hw-ice .ck{opacity:0;stroke-dasharray:120;stroke-dashoffset:120}
.hw-ice.crack .ck{opacity:.95;stroke-dashoffset:0;transition:stroke-dashoffset .35s ease-out,opacity .05s}
/* a candle blown out: its flame masked away (the flames are part of the drawing), its flicker off; relit one by one */
.hw-prop.hw-unlit::before,.hw-prop.hw-unlit::after,.hw-prop.hw-unlit>i{opacity:0;animation:none}
.hw-prop.p-candles.hw-c123{-webkit-mask-image:radial-gradient(ellipse 6.5% 10.5% at 35% 17%,transparent 98%,#000 100%),radial-gradient(ellipse 6.5% 10.5% at 61.7% 35%,transparent 98%,#000 100%),radial-gradient(ellipse 6.5% 10.5% at 80% 50.5%,transparent 98%,#000 100%);mask-image:radial-gradient(ellipse 6.5% 10.5% at 35% 17%,transparent 98%,#000 100%),radial-gradient(ellipse 6.5% 10.5% at 61.7% 35%,transparent 98%,#000 100%),radial-gradient(ellipse 6.5% 10.5% at 80% 50.5%,transparent 98%,#000 100%);-webkit-mask-composite:source-in;mask-composite:intersect}
.hw-prop.p-candles.hw-c23{-webkit-mask-image:radial-gradient(ellipse 6.5% 10.5% at 61.7% 35%,transparent 98%,#000 100%),radial-gradient(ellipse 6.5% 10.5% at 80% 50.5%,transparent 98%,#000 100%);mask-image:radial-gradient(ellipse 6.5% 10.5% at 61.7% 35%,transparent 98%,#000 100%),radial-gradient(ellipse 6.5% 10.5% at 80% 50.5%,transparent 98%,#000 100%);-webkit-mask-composite:source-in;mask-composite:intersect}
.hw-prop.p-candles.hw-c3{-webkit-mask-image:radial-gradient(ellipse 6.5% 10.5% at 80% 50.5%,transparent 98%,#000 100%);mask-image:radial-gradient(ellipse 6.5% 10.5% at 80% 50.5%,transparent 98%,#000 100%);-webkit-mask-composite:source-in;mask-composite:intersect}
/* the sleeping cat's eyes, open a moment when it is woken */
.hw-cateyes{position:absolute;inset:0;pointer-events:none;animation:hw-cateyes 1.7s steps(1) both}
.hw-cateyes svg{display:block;width:100%;height:100%;filter:drop-shadow(0 0 2px rgba(255,200,60,.8))}
@keyframes hw-cateyes{0%{opacity:0}8%{opacity:1}50%{opacity:0}56%{opacity:1}90%,100%{opacity:0}}
/* nothing Hallow's End moves (a flying broom, a shaken banner, a passing cat) may ever widen the page: overflow past the window's edge is clipped,
   without making the page a scroll box (sticky bars keep working) */
html.hw-on,html.hw-on body{overflow-x:clip}
/* a guide's banner: the strip at the figure's feet where the class's magic plays, and its jack-o'-lantern */
.hw-gstage{display:none}
html.hw-on .hw-gstage:not([hidden]){display:block;position:absolute;z-index:2;pointer-events:none;overflow:visible}
.hw-gstage>canvas.lab-aura{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
@media (prefers-reduced-motion:reduce){.hw-gstage>canvas.lab-aura{display:none}}
@media print{.hw-gstage{display:none!important}}
/* the bat that comes to sit on the banner's jack-o'-lantern */
.hw-batvisit{position:absolute;left:0;top:0;z-index:3;width:24px;height:12px;pointer-events:none}
.hw-batvisit b{position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 20'%3E%3Cdefs%3E%3ClinearGradient id='w' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%232c1f3e'/%3E%3Cstop offset='1' stop-color='%23120c1a'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M24 6.4L25.1 3.4L26 6.9Q26.9 7.6 27.6 8.3C31 5.4 37.4 3.2 46.8 4.2Q44.2 6.2 43.8 9.6Q41 8.4 38.2 10.6Q35.4 9.6 32.8 12.2Q30.2 11.4 27.8 13.2C27 15.2 25.4 16.6 24 16.8C22.6 16.6 21 15.2 20.2 13.2Q17.8 11.4 15.2 12.2Q12.6 9.6 9.8 10.6Q7 8.4 4.2 9.6Q3.8 6.2 1.2 4.2C10.6 3.2 17 5.4 20.4 8.3Q21.1 7.6 22 6.9L22.9 3.4L24 6.4z' fill='url(%23w)' stroke='%23a284d6' stroke-width='.4' stroke-opacity='.55'/%3E%3Cpath d='M27.4 8.6L46.8 4.2M27.4 8.6L43.8 9.6M27.4 8.6L38.2 10.6M27.4 8.6L32.8 12.2M20.6 8.6L1.2 4.2M20.6 8.6L4.2 9.6M20.6 8.6L9.8 10.6M20.6 8.6L15.2 12.2' stroke='%2307050a' stroke-width='.7' stroke-linecap='round' opacity='.9'/%3E%3Cellipse cx='24' cy='10.4' rx='2.6' ry='3.4' fill='%230c0810'/%3E%3Ccircle cx='23.1' cy='9.3' r='.62' fill='%23ffb066'/%3E%3Ccircle cx='24.9' cy='9.3' r='.62' fill='%23ffb066'/%3E%3C/svg%3E") center/contain no-repeat;animation:hw-flap .13s ease-in-out infinite alternate;filter:drop-shadow(0 0 2px rgba(170,120,240,.6))}
.hw-batvisit.perch b{animation:hw-batrest 1.3s ease-in-out infinite;transform-origin:50% 100%}
@keyframes hw-batrest{0%,70%,100%{transform:scale(.46,.85) translateY(1px)}76%{transform:scale(1,.6) translateY(3px)}82%{transform:scale(.46,.85) translateY(1px)}}
@media (prefers-reduced-motion:reduce){.hw-batvisit{display:none!important}}
/* a wish's shooting star, from where the sky was clicked */
.hw-wish{position:fixed;z-index:0;width:110px;height:1.6px;margin:-1px 0 0 -110px;transform-origin:100% 50%;border-radius:2px;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,240,210,.5) 70%,#fffaf0);box-shadow:0 0 6px rgba(255,240,210,.7)}
@media (prefers-reduced-motion:reduce){.hw-wish{display:none!important}}

.hw-prop.p-pumpkins{--w:84;--h:80}
.hw-prop.p-pumpkins::before{display:block;left:21.43%;top:38.75%;width:57.14%;height:60.00%;background:radial-gradient(circle,rgba(255,170,70,.6),rgba(255,170,70,.18) 45%,transparent 70%)}
.hw-prop.p-pumpkins::after{display:block;left:23.81%;top:42.50%;width:23.81%;height:25.00%;background:radial-gradient(circle,rgba(255,170,70,.6),rgba(255,170,70,.18) 45%,transparent 70%)}
.hw-prop.p-pumpkins i{display:block;left:52.38%;top:42.50%;width:23.81%;height:25.00%;background:radial-gradient(circle,rgba(255,170,70,.6),rgba(255,170,70,.18) 45%,transparent 70%)}
.hw-prop.p-broom{--w:64;--h:156}
.hw-prop.p-candycorn{--w:70;--h:50}
.hw-prop.p-cauldron{--w:80;--h:72}
.hw-prop.p-cauldron::before{display:block;left:17.50%;top:4.17%;width:65.00%;height:72.22%;background:radial-gradient(circle,rgba(150,255,90,.6),rgba(150,255,90,.18) 45%,transparent 70%)}
.hw-prop.p-candles{--w:60;--h:78}
.hw-prop.p-candles::before{display:block;left:15.00%;top:5.13%;width:40.00%;height:30.77%;background:radial-gradient(circle,rgba(255,170,70,.6),rgba(255,170,70,.18) 45%,transparent 70%)}
.hw-prop.p-candles::after{display:block;left:43.33%;top:24.36%;width:36.67%;height:28.21%;background:radial-gradient(circle,rgba(255,170,70,.6),rgba(255,170,70,.18) 45%,transparent 70%)}
.hw-prop.p-candles i{display:block;left:65.00%;top:42.31%;width:30.00%;height:23.08%;background:radial-gradient(circle,rgba(255,170,70,.6),rgba(255,170,70,.18) 45%,transparent 70%)}
.hw-prop.p-skull{--w:56;--h:86}
.hw-prop.p-skull::before{display:block;left:26.79%;top:2.33%;width:46.43%;height:30.23%;background:radial-gradient(circle,rgba(255,170,70,.6),rgba(255,170,70,.18) 45%,transparent 70%)}
.hw-prop.p-books{--w:80;--h:64}
.hw-prop.p-books::before{display:block;left:45.00%;top:10.94%;width:30.00%;height:37.50%;background:radial-gradient(circle,rgba(190,130,255,.6),rgba(190,130,255,.18) 45%,transparent 70%)}
.hw-prop.p-potions{--w:72;--h:70}
.hw-prop.p-potions::before{display:block;left:19.44%;top:55.71%;width:38.89%;height:40.00%;background:radial-gradient(circle,rgba(150,255,90,.6),rgba(150,255,90,.18) 45%,transparent 70%)}
.hw-prop.p-crystal{--w:58;--h:74}
.hw-prop.p-crystal::before{display:block;left:12.07%;top:17.57%;width:75.86%;height:59.46%;background:radial-gradient(circle,rgba(190,130,255,.6),rgba(190,130,255,.18) 45%,transparent 70%)}
.hw-prop.p-pail{--w:66;--h:70}
.hw-prop.p-cat{--w:78;--h:46}
.hw-prop.p-tomb{--w:62;--h:78}
.hw-prop.p-tomb::before{display:block;left:59.68%;top:69.23%;width:25.81%;height:20.51%;background:radial-gradient(circle,rgba(255,170,70,.6),rgba(255,170,70,.18) 45%,transparent 70%)}