/* Halloween Urban House: seasonal storefront theme. */
:root,:root[data-theme="dark"]{--accent:#ff983e;--accent-hover:#ffb46b;--accent-ink:#251006;--accent-text:#ffad68;--bg:#100c12;--bg-2:#19111b;--surface:#211824;--raise:#2e2230;--line:#463047;--line-2:#654368;--text:#faf2eb;--muted:#c4b3c3}
:root[data-theme="light"]{--bg:#fff5e9;--bg-2:#f7e9dd;--surface:#fffaf4;--raise:#f0dfd0;--line:#dac2b0;--line-2:#b69076;--text:#29182b;--muted:#71576b;--accent-text:#9d4208}
body{background-image:radial-gradient(ellipse at 100% 18%,#7c2d8214,transparent 45%),radial-gradient(ellipse at 0 70%,#ff842014,transparent 45%)}
.halloween-banner{display:flex;align-items:center;justify-content:center;gap:16px;padding:12px 18px;background:#1b101e;color:#ffbd81;border-bottom:1px solid #ff983e55;font:600 12px/1.5 var(--f-body);letter-spacing:.19em;text-transform:uppercase;text-align:center}
.halloween-banner svg{width:26px;height:26px;flex-shrink:0;color:#ff983e}
.halloween-banner strong{color:#fff3e5}
.halloween-web{position:absolute;top:0;width:clamp(70px,13vw,170px);height:auto;color:#ffbd8160;pointer-events:none;z-index:3}
.halloween-web--right{right:0;transform:scaleX(-1)}.halloween-web--left{left:0}
.hero{border-bottom:1px solid #ff983e66}
.hero .hero__title{color:#ffb46b;text-shadow:0 2px 22px #000}
.marquee{background:linear-gradient(100deg,#ff983e,#ffc17e,#ff983e)}
.cat-head{position:relative;border-bottom:1px solid var(--line);margin-bottom:24px}
.shelf__title:before{content:"✦";color:var(--accent-text);margin-right:12px;font-size:.7em}
.pcard__frame{border:1px solid var(--line)}
.btn--primary{background:var(--accent);color:var(--accent-ink);box-shadow:0 5px 22px #f777171c}
.chip[aria-pressed="true"]{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}
.credit{border-block:1px solid var(--line);background:linear-gradient(130deg,var(--bg-2),var(--surface))}
#site-bottom{border-top:1px solid #ff983e66}
@media(max-width:600px){.halloween-banner{font-size:10px;letter-spacing:.1em;gap:9px;padding:10px}.halloween-web{width:75px}}
@media(prefers-reduced-motion:no-preference){.halloween-banner svg{animation:pumpkin-glow 4s ease-in-out infinite}@keyframes pumpkin-glow{50%{filter:drop-shadow(0 0 7px #ff983e99)}}}

/* Hanging spiders, confined to the hero (not pinned to the viewport, so they never drift over other sections/pages). */
.halloween-spiders{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:hidden}
.halloween-spider{position:absolute;top:0;width:34px;color:#d79664;opacity:.7;transform-origin:50% 0}
.halloween-spider svg{display:block;width:100%;height:auto;overflow:visible}
.halloween-spider--left{left:14px;transform:translateY(10px)}
.halloween-spider--right{right:14px;transform:translateY(28px)}
@media(prefers-reduced-motion:no-preference){
 .halloween-spider--left{animation:spider-descend 19s ease-in-out infinite}
 .halloween-spider--right{animation:spider-descend 23s ease-in-out -11s infinite}
 @keyframes spider-descend{0%,100%{transform:translateY(6px) rotate(-3deg)}45%,65%{transform:translateY(52px) rotate(3deg)}}
}
.halloween-spiders.is-paused *{animation-play-state:paused}
@media(max-width:700px){.halloween-spider{width:21px;opacity:.55}.halloween-spider--left{left:8px}.halloween-spider--right{right:8px}}
@media(prefers-reduced-motion:reduce){.halloween-spider{animation:none;transform:translateY(16px)}}
@media print{.halloween-spiders,.halloween-web{display:none}}