/* ==========================================================================
   43c Halloween theme. Loaded after modern.css. Remove the <link> to go back.
   Colours come from the Halloween crest: midnight purple, pumpkin orange,
   bone white, candle amber and ghost green.
   ========================================================================== */
:root{
  --background:272 38% 5%;--foreground:38 48% 87%;--card:272 32% 9%;--card-foreground:38 48% 87%;
  --popover:272 32% 9%;--popover-foreground:38 48% 87%;
  --primary:24 90% 50%;--primary-foreground:30 100% 97%;
  --secondary:272 26% 13%;--secondary-foreground:38 48% 87%;
  --muted:272 22% 15%;--muted-foreground:34 22% 66%;
  --accent:24 90% 50%;--accent-foreground:30 100% 97%;
  --border:272 26% 19%;--input:272 26% 19%;--ring:24 90% 50%;
  --brand:24 92% 52%;--brand-deep:14 84% 38%;--gold:38 88% 62%;
  --surface-1:272 30% 9%;--surface-2:272 28% 12%;--line:272 26% 20%;
  --ghost:100 70% 62%;--label:30 95% 62%;
}
body{background:
  radial-gradient(520px 520px at 88% 6%,hsl(38 95% 70%/.10),transparent 62%),
  radial-gradient(1200px 640px at 8% -10%,hsl(272 60% 40%/.22),transparent 62%),
  radial-gradient(900px 600px at 50% 110%,hsl(var(--ghost)/.06),transparent 60%),
  hsl(var(--background))!important;background-attachment:fixed!important}
::selection{background:hsl(var(--brand)/.5);color:#fff}

/* headings: candle-lit */
#overview h1,main h1,.scope-line h2{background:linear-gradient(180deg,hsl(42 100% 82%) 0%,hsl(32 98% 64%) 55%,hsl(20 92% 50%) 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important}
#overview h1{filter:drop-shadow(0 0 22px hsl(25 100% 50%/.35))}
.text-primary{color:hsl(28 95% 58%)!important}

/* hero: night sky over the picture, a harvest moon, bats and drifting fog */
#overview>.absolute.inset-0 img{filter:saturate(.55) hue-rotate(235deg) brightness(.55) contrast(1.1)}
#overview>.absolute.inset-0::before{content:"";position:absolute;z-index:1;width:min(16vw,220px);aspect-ratio:1;right:21%;top:15%;border-radius:50%;
  background:radial-gradient(circle at 42% 40%,#ffe7b0,#ffcf7a 55%,#f0a64c 100%);
  box-shadow:0 0 80px 30px hsl(35 100% 60%/.28),0 0 260px 80px hsl(30 100% 50%/.14);opacity:.8}
#overview>.absolute.inset-0::after{content:"";position:absolute;inset:auto -12% 0 -12%;height:45%;z-index:2;pointer-events:none;
  background:radial-gradient(50% 80% at 26% 100%,hsl(var(--ghost)/.13),transparent 70%),radial-gradient(50% 80% at 74% 100%,hsl(270 60% 70%/.12),transparent 70%);
  animation:fog 14s ease-in-out infinite alternate}
@keyframes fog{from{transform:translateX(-3%)}to{transform:translateX(3%)}}
.hw-bats{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden}
.hw-bats i{position:absolute;width:46px;height:22px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 46'%3E%3Cpath fill='%23120818' d='M50 12c-3 0-4-6-6-7 0 3-1 6-2 7-8-1-14-8-15-12-6 7-16 9-27 7 8 4 13 11 13 18 6-3 11-1 14 3 3-4 8-5 12-3 2 4 4 9 7 13 3-4 5-9 7-13 4-2 9-1 12 3 3-4 8-6 14-3 0-7 5-14 13-18-11 2-21 0-27-7-1 4-7 11-15 12-1-1-2-4-2-7-2 1-3 7-6 7z'/%3E%3C/svg%3E");
  animation:flap .35s ease-in-out infinite alternate,fly linear infinite}
.hw-bats i:nth-child(1){top:18%;left:-5%;animation-duration:.3s,18s}
.hw-bats i:nth-child(2){top:30%;left:-8%;width:30px;animation-duration:.25s,24s;animation-delay:0s,-8s}
.hw-bats i:nth-child(3){top:12%;left:-6%;width:36px;animation-duration:.33s,21s;animation-delay:0s,-14s}
.hw-bats i:nth-child(4){top:42%;left:-6%;width:26px;animation-duration:.28s,28s;animation-delay:0s,-3s}
@keyframes flap{from{transform:scaleY(1)}to{transform:scaleY(.55)}}
@keyframes fly{0%{translate:0 0}25%{translate:30vw -4vh}50%{translate:60vw 3vh}75%{translate:90vw -3vh}100%{translate:115vw 0}}
@media (prefers-reduced-motion:reduce){.hw-bats,#overview>.absolute.inset-0::after{animation:none!important;display:none}}
#overview .march-in[alt*="crest"]{filter:drop-shadow(0 0 30px hsl(28 100% 50%/.45)) drop-shadow(0 0 70px hsl(var(--ghost)/.18))}

/* cobwebs hung in the top corners of the hero, under the header; click-through so they never block anything */
.hw-web{position:absolute;top:64px;z-index:4;pointer-events:none;width:clamp(120px,17vw,250px);aspect-ratio:240/220;opacity:.7;
  background:no-repeat top left/contain url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 240 220" fill="none" stroke="%23f1eaff" stroke-linecap="round"%3E%3Cpath stroke-width=".9" stroke-opacity=".75" d="M92,80L0.0,55.0M92,80L0.0,-0.0M92,80L60.0,0.0M92,80L135.0,0.0M92,80L205.0,0.0M92,80L240.0,26.0M92,80L232.0,120.0M92,80L178.0,190.0M92,80L96.0,220.0M92,80L20.0,205.0M92,80L0.0,130.0"/%3E%3Cpath stroke-width=".75" stroke-opacity=".6" d="M85.2,78.2Q86.9,77.3 86.6,75.3M86.6,75.3Q88.6,75.2 89.3,73.3M89.4,73.4Q92.3,74.2 95.4,73.7M95.2,74.0Q95.7,75.8 97.7,76.0M97.9,75.8Q97.2,77.3 98.6,77.6M98.7,77.5Q97.7,79.8 98.6,81.9M98.7,81.9Q96.7,83.2 96.2,85.4M96.3,85.5Q94.0,85.4 92.2,87.0M92.2,86.8Q90.6,85.4 88.6,86.0M88.6,86.0Q87.9,84.0 85.7,83.4M85.8,83.4Q86.3,80.7 85.4,78.2M78.3,76.3Q81.9,74.6 81.7,71.0M81.4,70.8Q85.4,70.7 86.9,67.3M87.0,67.4Q92.6,68.6 98.8,67.4M98.5,67.9Q99.5,71.6 103.2,72.1M103.7,71.7Q102.4,74.5 105.4,75.1M105.0,75.3Q103.5,79.6 105.8,83.9M105.5,83.8Q101.6,86.4 100.7,91.1M100.5,90.8Q95.9,90.8 92.4,94.3M92.4,94.1Q89.1,91.3 84.8,92.5M84.9,92.4Q83.7,88.1 79.9,86.6M79.8,86.6Q80.8,81.3 78.8,76.4M71.3,74.4Q76.5,71.7 75.9,66.0M75.6,65.8Q81.6,65.4 83.8,59.5M84.1,60.2Q93.0,62.2 102.5,60.5M102.3,60.9Q103.8,66.7 109.7,67.5M110.2,67.1Q108.1,71.6 112.6,72.5M112.4,72.6Q109.9,79.4 113.1,86.0M113.4,86.1Q106.8,90.0 105.2,96.8M105.9,97.8Q98.1,96.9 92.6,101.3M92.6,102.3Q87.5,97.8 80.8,99.4M81.4,98.5Q79.2,92.5 72.4,90.7M72.9,90.4Q74.2,82.1 70.7,74.2M63.0,72.1Q70.2,68.4 69.2,60.2M69.0,60.0Q77.2,59.2 80.2,50.4M80.7,51.7Q93.4,54.6 106.9,52.3M107.1,52.0Q109.3,60.5 118.0,61.6M117.1,62.3Q114.3,68.3 120.9,69.5M121.2,69.4Q117.6,79.1 122.3,88.7M121.1,88.3Q113.0,94.1 111.4,104.8M111.4,104.9Q100.8,104.4 92.9,111.7M92.9,110.1Q85.8,104.6 76.1,107.6M76.9,106.2Q74.1,97.5 65.0,94.7M64.6,94.9Q66.3,83.0 61.3,71.7M52.5,69.3Q61.9,63.9 60.0,52.2M60.7,52.8Q72.4,52.5 76.8,42.0M76.8,42.0Q93.9,46.7 111.2,44.3M111.1,44.5Q113.9,55.2 125.0,56.6M126.1,55.8Q122.6,63.9 132.0,65.4M130.1,66.1Q125.1,78.8 130.7,91.1M132.9,91.7Q120.6,99.2 117.5,112.6M117.3,112.4Q103.4,111.6 93.2,120.7M93.2,121.6Q83.6,113.3 71.0,116.5M71.4,115.7Q67.8,103.6 55.8,99.7M56.6,99.2Q58.4,83.9 51.1,68.9M42.2,66.5Q54.1,59.8 51.9,45.1M51.1,44.4Q66.8,44.5 72.7,31.8M72.0,30.0Q94.5,35.6 117.8,31.9M117.4,32.8Q121.2,46.9 136.1,48.8M134.3,50.0Q130.1,60.0 141.7,61.9M140.9,62.2Q135.5,78.4 144.2,94.9M142.5,94.4Q127.9,104.2 124.6,121.7M125.7,123.1Q107.2,122.0 93.5,134.2M93.6,134.6Q81.2,122.8 65.6,125.9M65.5,126.0Q60.6,110.6 44.7,105.7M45.4,105.3Q49.0,85.0 41.4,66.2M28.1,62.6Q44.5,54.6 42.8,37.2M42.1,36.6Q60.0,35.0 66.5,16.4M66.6,16.5Q95.1,24.5 123.8,20.9M123.5,21.4Q128.0,39.3 145.8,41.9M145.0,42.5Q139.4,55.1 153.7,57.5M155.6,56.8Q147.6,78.0 157.4,98.7M155.5,98.1Q137.5,110.6 133.7,133.4M133.7,133.3Q110.8,132.1 93.9,147.3M93.9,147.2Q78.5,133.6 58.3,138.6M59.0,137.2Q52.8,118.2 32.8,112.2M34.3,111.4Q38.2,86.3 27.8,62.6M11.7,58.2Q31.9,47.9 29.5,25.6M129.6,10.0Q135.9,30.4 159.0,32.5M157.8,33.4Q151.3,48.9 169.7,51.6M168.8,52.0Q159.7,77.6 172.2,102.9M171.4,102.7Q148.4,118.0 143.3,145.7M142.0,143.9Q114.8,143.2 94.4,162.6M94.4,163.0Q75.3,146.2 50.3,152.4M51.5,150.3Q43.7,127.2 18.6,119.9M18.4,120.0Q24.2,87.9 12.1,58.3M174.0,21.9Q165.1,41.7 186.6,45.5M186.6,45.5Q173.2,77.1 185.7,106.8M189.1,107.8Q160.3,126.0 153.5,158.7M153.8,159.1Q119.7,156.8 94.8,178.9M94.9,180.1Q71.8,160.0 41.6,167.5M186.7,12.9Q176.5,35.7 201.6,40.0M202.8,39.6Q188.3,76.6 204.5,112.1M204.6,112.2Q171.2,133.4 163.4,171.3M165.3,173.8Q125.0,171.6 95.4,198.4M95.4,200.0Q67.9,175.4 32.1,183.9"/%3E%3Cg fill="%23fff6dc" stroke="none" fill-opacity=".9"%3E%3Ccircle cx="77.4" cy="105.4" r="1.3"/%3E%3Ccircle cx="74.4" cy="89.6" r="1.3"/%3E%3Ccircle cx="56.3" cy="49.0" r="1.3"/%3E%3Ccircle cx="54.4" cy="145.3" r="1.3"/%3E%3Ccircle cx="178.1" cy="48.6" r="1.3"/%3E%3Ccircle cx="62.8" cy="130.8" r="1.3"/%3E%3Ccircle cx="208.7" cy="113.3" r="1.3"/%3E%3Ccircle cx="122.0" cy="118.4" r="1.3"/%3E%3Ccircle cx="149.5" cy="96.4" r="1.3"/%3E%3C/g%3E%3C/svg%3E');filter:drop-shadow(0 0 3px hsl(270 80% 85%/.25))}
.hw-web.l{left:0}
.hw-web.r{right:0;transform:scaleX(-1)}
.hw-spider{position:absolute;z-index:4;pointer-events:none;top:64px;right:clamp(46px,6.4vw,94px);width:2px;height:clamp(50px,7vw,90px);
  background:linear-gradient(hsl(270 60% 92%/.7),hsl(270 60% 92%/.5));transform-origin:top;animation:dangle 5s ease-in-out infinite}
.hw-spider::after{content:"";position:absolute;left:50%;bottom:-14px;width:22px;height:20px;translate:-50% 0;filter:drop-shadow(0 0 2px hsl(270 70% 85%/.8)) drop-shadow(0 0 8px hsl(28 100% 55%/.5));
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 40' fill='none' stroke='%23120818' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M22 18L10 6 4 9M22 20L8 14 2 18M22 22L8 24 3 31M22 24L11 31 9 38M22 18L34 6 40 9M22 20L36 14 42 18M22 22L36 24 41 31M22 24L33 31 35 38'/%3E%3Cellipse cx='22' cy='25' rx='6' ry='7.5' fill='%23120818'/%3E%3Ccircle cx='22' cy='15' r='4' fill='%23120818'/%3E%3C/svg%3E")}
@keyframes dangle{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.18)}}
@media (max-width:640px){
  .hw-web{width:110px;opacity:.55}
  .hw-spider{display:none}
  #overview>.absolute.inset-0::before{display:none}            /* no moon on phones: it crowds the crest */
}
@media (prefers-reduced-motion:reduce){.hw-spider{animation:none}}

/* buttons: glowing pumpkin */
a.bg-primary,button.bg-primary,.join-submit,.jr-write,.srv-join,.join-dlg-btn,.live-join{
  background:linear-gradient(135deg,hsl(32 100% 55%),hsl(18 90% 44%))!important;box-shadow:0 0 0 1px hsl(30 100% 60%/.4),0 10px 40px -10px hsl(25 100% 50%/.7)!important}
.btn-ghost-hero{border-color:hsl(var(--ghost)/.45)!important;color:hsl(var(--foreground))!important}
.btn-ghost-hero:hover{background:hsl(var(--ghost)/.12)!important;box-shadow:0 0 24px -4px hsl(var(--ghost)/.5)}

/* cards and panels pick up a faint purple-to-orange rim */
.explore-card:hover,.hero-count:hover{border-color:hsl(28 95% 55%)!important;box-shadow:0 0 30px -8px hsl(28 100% 50%/.5)!important}
.hero-count{border-color:hsl(28 90% 50%/.5)!important;background:hsl(272 35% 8%/.72)!important}
.hero-count .hc-clock b{color:hsl(32 100% 62%)!important;text-shadow:0 0 14px hsl(28 100% 50%/.6)}
.hero-count .hc-lbl{color:hsl(var(--ghost))!important}

/* footer: a row of jack-o'-lanterns */
footer{position:relative}
footer::before{content:"🎃  🦇  🎃  🕸️  🎃";display:block;text-align:center;letter-spacing:.6em;font-size:1.3rem;padding:1.2rem 0 .2rem;opacity:.85}
