/* Seasonal overlay. Restore the original pages from backups to disable it. */
:root {
  --bg: #100b18;
  --panel: #1c1328;
  --panel-2: #281b36;
  --bg-2: #1c1328;
  --card: #25182f;
  --card-2: #1c1328;
  --text: #fff8ee;
  --muted: #c9bdd5;
  --muted-2: #a695b5;
  --pink: #ff923d;
  --purple: #a66cff;
  --cyan: #ffc56e;
  --line: rgba(255, 174, 91, .2);
  --glass: rgba(255, 170, 80, .055);
  --glass-2: rgba(255, 170, 80, .1);
  --grad: linear-gradient(135deg, #ff923d, #ffbf69 48%, #a66cff);
  --grad-soft: linear-gradient(135deg, rgba(255,146,61,.9), rgba(166,108,255,.75));
}
body {
  background: radial-gradient(ellipse at 8% 0%, rgba(255,123,35,.22), transparent 38%),
    radial-gradient(ellipse at 95% 35%, rgba(135,65,210,.24), transparent 38%),
    linear-gradient(160deg, #1b1025, #100b18 60%, #21122c);
  background-attachment: scroll;
}
::selection { background: #ff923d; color: #100b18; }
.hero-video-wrap, #preloader { background: #100b18; }
.hero-video { filter: sepia(.45) saturate(.8) contrast(1.08); }
.hero-scrim {
  background: linear-gradient(100deg, rgba(16,11,24,.95), rgba(30,12,29,.66) 55%, rgba(16,11,24,.72)),
    linear-gradient(0deg, #100b18, transparent 45%);
}
.topbar, header.nav, .dropdown, .scan-card, .chip-tag {
  background: rgba(28,19,40,.94);
  border-color: var(--line);
}
.btn-primary, .nav-cta { background: var(--grad); color: #211028; }
.gradient-text { background-image: var(--grad); }
.visual-frame { border-color: rgba(255,174,91,.4); box-shadow: 0 24px 80px rgba(0,0,0,.4), 0 0 65px rgba(255,123,35,.12); }
.visual-frame::after {
  content: "🎃";
  position: absolute;
  top: 18px;
  right: 20px;
  font-size: clamp(38px, 5vw, 66px);
  line-height: 1.2;
  filter: drop-shadow(0 6px 18px rgba(255,123,35,.4));
  pointer-events: none;
  z-index: 4;
}
.halloween-greeting {
  color: #ffc56e;
  font-size: clamp(12px, 1.2vw, 15px);
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: 16px;
}
.eyebrow { border-color: rgba(255,174,91,.4); color: #fff0db; }
.bg-grid { opacity: .45; }
.hero-video-wrap {
  background: #100b18 url('/images/halloween-hero.webp') center center / cover no-repeat;
}
.hero-video-fade { display: none; }
.hero-scrim {
  background: linear-gradient(90deg, rgba(16,11,24,.92), rgba(16,11,24,.5) 48%, rgba(16,11,24,.12)),
    linear-gradient(0deg, #100b18, transparent 35%);
}
.visual-frame, .hero-image { border-radius: 32px; }
.visual-frame { height: clamp(390px, 58vh, 620px); }
.hero-image { object-position: center 40%; }
.visual-frame { width: min(430px, 100%); border-radius: 120px 120px 32px 32px; }
.hero-image { border-radius: inherit; }
body.halloween-public-pet {
  background: linear-gradient(90deg, rgba(16,11,24,.76), rgba(16,11,24,.4)),
    url('/images/halloween-hero.webp') center / cover no-repeat fixed;
}
.halloween-public-pet::before { opacity: .12; }
.halloween-public-pet::after { background: rgba(255,146,61,.16); }
.halloween-public-pet .profile-card {
  background: linear-gradient(180deg, rgba(28,19,40,.94), rgba(16,11,24,.97));
}
.halloween-public-pet .visual {
  background: linear-gradient(180deg, rgba(255,146,61,.08), rgba(166,108,255,.1));
}
.visual-shape, .visual-frame::after, .scan-ring { display: none; }
.halloween-greeting { font-size: clamp(15px, 1.5vw, 20px); color: #ffc56e; }
.hero-title { text-shadow: 0 4px 30px rgba(0,0,0,.5); }
@media (max-width: 1180px) {
  .hero-scrim { background: linear-gradient(180deg, rgba(16,11,24,.78), rgba(16,11,24,.6) 55%, #100b18); }
}
.cursor-glow { background: radial-gradient(circle, rgba(255,146,61,.18), rgba(166,108,255,.08) 45%, transparent 68%); }
@media (max-width: 600px) {
  .halloween-greeting { letter-spacing: .06em; }
  .visual-frame::after { top: 12px; right: 12px; }
}

/* Moonlit atmosphere on every public page. */
html.halloween-active body {
  background: linear-gradient(110deg, rgba(16,11,24,.92), rgba(27,13,35,.72)),
    url('/images/halloween-hero.webp') center / cover fixed;
}
html.halloween-active body.halloween-public-pet {
  background: linear-gradient(90deg, rgba(16,11,24,.76), rgba(16,11,24,.4)),
    url('/images/halloween-hero.webp') center / cover fixed;
}
html.halloween-active body > :is(.page, .shell, .box, .card, .success-card) { position: relative; z-index: 1; }
html.halloween-active .auth-visual {
  background: linear-gradient(180deg, #29163399, #100b18dc), url('/images/halloween-hero.webp') 75% center / cover;
}
html.halloween-active .auth-shell { background: #1c1328; border-color: #ffc56e40; }
html.halloween-active .auth-panel { background: #fff8ee; color: #2c173b; }
html.halloween-active .visual-image { background: #a66cff18; border-color: #ffc56e40; }
.hw-sky {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
}
.hw-sky svg { display: block; width: 100%; height: 100%; overflow: visible; }
.hw-web { position: absolute; top: 0; width: clamp(105px, 13vw, 200px); opacity: .6; }
.hw-web-left { left: 0; }
.hw-web-right { right: 0; transform: scaleX(-1); }
.hw-hanging {
  position: absolute;
  top: 0;
  width: 42px;
  transform-origin: top center;
  animation: hw-spider-sway 8s ease-in-out infinite;
}
.hw-hanging-left { left: 3%; --drop: 155px; }
.hw-hanging-right { right: 3%; --drop: 240px; animation-delay: -4s; }
.hw-thread { display: block; width: 1px; height: var(--drop); margin: auto; background: linear-gradient(#e7d0ee80, #e7d0ee30); }
.hw-hanging .hw-spider-art { width: 42px; height: 40px; filter: drop-shadow(0 0 8px #a66cff55); }
.hw-flight { position: absolute; left: -180px; will-change: transform; }
.hw-flight > svg { animation: hw-bob 4s ease-in-out infinite; }
.hw-witch {
  top: 16%; width: 130px; height: 94px;
  animation: hw-cross 34s linear -7s infinite;
  filter: drop-shadow(0 0 10px #a66cff80);
  opacity: .9;
}
.hw-ghost { width: 52px; height: 64px; filter: drop-shadow(0 0 18px #e5c9ff80); opacity: .65; }
.hw-ghost-one { top: 66%; animation: hw-cross 44s linear -23s infinite; }
.hw-ghost-two { top: 37%; width: 38px; height: 47px; animation: hw-cross-reverse 53s linear -9s infinite; opacity: .45; }
.hw-ghost-two > svg { animation-delay: -2s; }
.hw-bat { width: 44px; height: 30px; opacity: .75; }
.hw-bat-one { top: 9%; animation: hw-cross-reverse 24s linear -13s infinite; }
.hw-bat-two { top: 83%; width: 34px; animation: hw-cross 29s linear -17s infinite; }
.hw-bat-wing { transform-box: fill-box; transform-origin: center; animation: hw-flap .65s ease-in-out infinite alternate; }
.hw-ember {
  position: absolute; left: var(--x); bottom: -16px; width: 3px; height: 3px;
  border-radius: 50%; background: #ffc56e; box-shadow: 0 0 12px 3px #ff923d60;
  animation: hw-ember-rise var(--time) linear var(--delay) infinite;
}
.hw-mist {
  position: absolute; bottom: -90px; left: -20%; width: 140%; height: 230px;
  background: radial-gradient(ellipse at 30% 100%, #a66cff20, transparent 55%), radial-gradient(ellipse at 70% 100%, #ff923d18, transparent 50%);
  animation: hw-mist-drift 18s ease-in-out infinite alternate;
}
.hw-motion-toggle {
  position: fixed; left: max(14px, env(safe-area-inset-left)); bottom: max(14px, env(safe-area-inset-bottom));
  z-index: 9997; min-height: 34px; padding: 7px 13px;
  border: 1px solid #ffc56e50; border-radius: 20px; background: #1c1328e8;
  color: #ffe2ba; font: 600 11px system-ui, sans-serif; cursor: pointer;
  backdrop-filter: blur(10px);
}
.hw-motion-toggle:hover { background: #39223f; border-color: #ffc56e; }
.hw-motion-toggle:focus-visible { outline: 2px solid #ffc56e; outline-offset: 3px; }
@keyframes hw-cross {
  0% { transform: translate3d(-10vw, 0, 0) rotate(-5deg); }
  50% { transform: translate3d(60vw, -25px, 0) rotate(4deg); }
  100% { transform: translate3d(calc(100vw + 360px), 15px, 0) rotate(-5deg); }
}
@keyframes hw-cross-reverse {
  0% { transform: translate3d(calc(100vw + 360px), 0, 0) scaleX(-1); }
  50% { transform: translate3d(60vw, 35px, 0) scaleX(-1); }
  100% { transform: translate3d(-10vw, -15px, 0) scaleX(-1); }
}
@keyframes hw-bob { 0%,100% { translate: 0 0; } 50% { translate: 0 -14px; } }
@keyframes hw-flap { from { scale: 1 1; } to { scale: 1 .3; } }
@keyframes hw-spider-sway { 0%,100% { rotate: -5deg; translate: 0 -20px; } 50% { rotate: 5deg; translate: 0 20px; } }
@keyframes hw-ember-rise { 0% { transform: translate3d(0,0,0); opacity: 0; } 15% { opacity: .65; } 85% { opacity: .35; } 100% { transform: translate3d(45px,-100vh,0); opacity: 0; } }
@keyframes hw-mist-drift { from { transform: translateX(-4%); } to { transform: translateX(4%); } }

/* Spider launcher and a bubbling potion above the existing conversation. */
html.halloween-active :is(.chat-launcher, .chat-box, .chat-pop, .chat-image-viewer) {
  --cw-pink: #ff923d;
  --cw-purple: #a66cff;
  --cw-cyan: #ffc56e;
  --cw-ink: #fff8ee;
  --cw-dim: #cfc1dc;
  --cw-line: #ffc56e30;
  --cw-grad: linear-gradient(135deg, #ff923d, #a66cff);
}
html .chat-launcher.hw-chat-launcher {
  width: 78px; height: 78px; background: radial-gradient(circle, #50305a90, transparent 70%);
  box-shadow: none; overflow: visible;
  animation: none;
}
html .chat-launcher.hw-chat-launcher::before {
  inset: 12px; background: radial-gradient(circle, #ff923d55, transparent 72%);
  animation: hw-spider-glow 4s ease-in-out infinite; border-radius: 50%;
}
html .chat-launcher.hw-chat-launcher::after {
  inset: auto; right: 50%; bottom: 74px; width: 1px; height: 72px;
  background: linear-gradient(transparent, #d7c1e570); border-radius: 0; animation: none;
}
.hw-launcher-spider { position: absolute; inset: 0; pointer-events: none; transition: transform .4s, opacity .25s; animation: hw-launcher-idle 5s ease-in-out infinite; }
.hw-launcher-spider svg { width: 100%; height: 100%; filter: drop-shadow(0 5px 12px #ff923d50); }
.hw-launcher-spider .hw-spider-legs { transform-origin: center; animation: hw-leg-wiggle 3s ease-in-out infinite; }
html .hw-chat-launcher .cw-icons { position: absolute; }
html .hw-chat-launcher:hover .hw-launcher-spider { transform: rotate(-12deg) scale(1.12); }
html body.chat-widget-open .hw-launcher-spider { transform: rotate(180deg) scale(.4); opacity: 0; animation: none; }
html body.chat-widget-open .hw-chat-launcher { background: #2c173b; border: 1px solid #ffc56e60; }
html body.chat-widget-open .hw-chat-launcher::after { opacity: 0; }
html .hw-chat-launcher .chat-badge { top: 0; right: 0; }
html .chat-box.hw-chat-box { background: linear-gradient(165deg, #291633f7, #100b18fc); border-color: #ffc56e40; }
html .hw-chat-box.open { animation: hw-chat-arrive .65s cubic-bezier(.22,1,.36,1) both; }
html .hw-chat-box .chat-head { background: linear-gradient(120deg, #ff923d25, #a66cff25); }
html .hw-chat-box .chat-head-icon { background: linear-gradient(135deg, #ff923d, #a66cff); }
html .hw-chat-box .chat-form { background: #1c1328; }
html .hw-chat-box .chat-intro-fields :is(input, textarea),
html .hw-chat-box .chat-form input { background: #ffffff09; border-color: #ffc56e30; }
html .hw-chat-box #chatStartBtn,
html .hw-chat-box .chat-form button[type="submit"] { background: var(--cw-grad); color: #1c1328; }
.hw-brew {
  position: relative; display: flex; align-items: center; gap: 9px;
  flex: 0 0 116px; padding: 0 18px 0 8px; overflow: hidden;
  background: radial-gradient(ellipse at 20% 80%, #bbff821c, transparent 55%), #160d21;
  border-bottom: 1px solid #ffc56e26; pointer-events: none;
  font-family: system-ui, sans-serif;
}
.hw-brew-scene { position: relative; width: 165px; height: 112px; flex-shrink: 0; }
.hw-cauldron-art { position: absolute; left: 17px; bottom: 2px; width: 128px; height: 104px; }
.hw-brew-copy strong { display: block; color: #ffe2ba; font-size: 12px; line-height: 1.5; }
.hw-brew-copy span { display: block; margin-top: 4px; font-size: 10px; line-height: 1.6; color: #cfc1dc; }
.hw-bottle { position: absolute; width: 25px; height: 44px; bottom: 5px; }
.hw-bottle svg { width: 100%; height: 100%; }
.hw-bottle-purple { left: 0; color: #c386ff; transform: rotate(-10deg); }
.hw-bottle-orange { right: 0; color: #ffb452; transform: rotate(10deg); }
.hw-bubble {
  position: absolute; left: 80px; bottom: 57px; width: 9px; height: 9px;
  border: 1px solid #dbffb6; background: #bbff8260; border-radius: 50%; opacity: 0;
}
.hw-bubble-two { left: 65px; width: 6px; height: 6px; }
.hw-bubble-three { left: 101px; width: 12px; height: 12px; }
.hw-steam { position: absolute; bottom: 60px; width: 15px; height: 38px; border-radius: 50%; border-left: 2px solid #ceffaf50; opacity: 0; }
.hw-steam-one { left: 65px; }
.hw-steam-two { left: 98px; }
.hw-chat-box.open .hw-bubble { animation: hw-bubble 2.6s ease-out infinite; }
.hw-chat-box.open .hw-bubble-two { animation-delay: .8s; }
.hw-chat-box.open .hw-bubble-three { animation-delay: 1.5s; }
.hw-chat-box.open .hw-steam { animation: hw-steam 3.8s ease-out infinite; }
.hw-chat-box.open .hw-steam-two { animation-delay: 1.8s; }
.hw-chat-box.open .hw-potion-liquid { animation: hw-liquid 2.3s ease-in-out infinite; transform-origin: center; }
.hw-chat-box.open .hw-brew-fire { animation: hw-fire .7s ease-in-out infinite alternate; transform-origin: bottom center; }
.hw-chat-box.open .hw-brew-scene { animation: hw-cauldron-arrive .9s cubic-bezier(.34,1.56,.64,1) both; }
@keyframes hw-bubble { 0% { transform: translateY(0) scale(.3); opacity: 0; } 20% { opacity: .9; } 100% { transform: translateY(-57px) translateX(12px) scale(1.2); opacity: 0; } }
@keyframes hw-steam { 0% { transform: translateY(0) rotate(-15deg); opacity: 0; } 30% { opacity: .5; } 100% { transform: translateY(-30px) rotate(25deg); opacity: 0; } }
@keyframes hw-liquid { 0%,100% { scale: 1 1; opacity: .7; } 50% { scale: 1 1.2; opacity: 1; } }
@keyframes hw-fire { from { scale: 1 .7; opacity: .6; } to { scale: 1.06 1; opacity: 1; } }
@keyframes hw-leg-wiggle { 0%,100% { transform: scaleX(1); } 50% { transform: scaleX(.9); } }
@keyframes hw-launcher-idle { 0%,100% { translate: 0 0; } 50% { translate: 0 -4px; } }
@keyframes hw-spider-glow { 0%,100% { scale: 1; opacity: .4; } 50% { scale: 1.3; opacity: 1; } }
@keyframes hw-chat-arrive { from { opacity: 0; transform: translateY(25px) scale(.85) rotate(-3deg); } to { opacity: 1; transform: none; } }
@keyframes hw-cauldron-arrive { from { opacity: 0; transform: translateY(50px) rotate(-18deg) scale(.6); } to { opacity: 1; transform: none; } }

html.hw-paused .hw-sky *, html.hw-paused .hw-chat-launcher,
html.hw-paused .hw-chat-launcher *, html.hw-paused .hw-chat-launcher::before,
html.hw-paused .hw-chat-box, html.hw-paused .hw-brew *,
html.hw-asleep .hw-sky *, html.hw-asleep .hw-chat-launcher,
html.hw-asleep .hw-chat-launcher *, html.hw-asleep .hw-chat-launcher::before,
html.hw-asleep .hw-brew * { animation-play-state: paused !important; }
html.hw-paused .hw-chat-box.open { animation: none; }
html.hw-paused .hw-chat-box.open .hw-brew-scene { animation: none; }
@media (max-width: 600px) {
  .hw-web { width: 90px; }
  .hw-hanging { width: 26px; }
  .hw-hanging .hw-spider-art { width: 26px; height: 26px; }
  .hw-hanging-left { --drop: 125px; left: 1%; }
  .hw-hanging-right { display: none; }
  .hw-witch { width: 88px; height: 64px; }
  .hw-ghost-one { width: 34px; height: 42px; }
  .hw-ghost-two, .hw-bat-two, .hw-ember:nth-last-child(-n+6) { display: none; }
  .hw-motion-toggle { font-size: 10px; min-height: 32px; padding: 6px 10px; }
  html .chat-launcher.hw-chat-launcher { width: 70px; height: 70px; }
  html .chat-box.hw-chat-box { min-height: min(420px, var(--chat-mobile-height)); }
  .hw-brew { flex-basis: 94px; padding-right: 12px; }
  .hw-brew-scene { width: 145px; height: 92px; }
  .hw-cauldron-art { width: 105px; height: 86px; }
  .hw-bubble { bottom: 47px; left: 69px; }
  .hw-bubble-two { left: 55px; }
  .hw-bubble-three { left: 86px; }
  .hw-steam { bottom: 50px; }
}
@media (prefers-reduced-motion: reduce) {
  .hw-flight, .hw-ember, .hw-mist, .hw-motion-toggle { display: none; }
  .hw-sky *, html .hw-chat-launcher, html .hw-chat-launcher *,
  html .hw-chat-launcher::before, html .hw-chat-launcher::after,
  html .hw-chat-box.open, html .hw-brew * { animation: none !important; }
  html .hw-chat-launcher, html .hw-launcher-spider { transition: none; }
}

/* Shared seasonal headers and surfaces across the public site. */
.hw-season-strip {
  position: relative; display: flex; align-items: center; justify-content: space-between;
  gap: 20px; min-height: 145px; margin: 0 0 22px; padding: 25px 32px;
  border: 1px solid #ffba6950; border-radius: 28px; overflow: hidden; isolation: isolate;
  background: linear-gradient(100deg, #2c173bf5, #201329dc 62%, #21122970),
    url('/images/halloween-hero.webp') right 24% / cover;
  box-shadow: 0 14px 45px #00000030, inset 0 1px 0 #ffffff0a;
}
.hw-season-copy { position: relative; z-index: 1; min-width: 0; }
.hw-season-label { display: block; color: #ffc56e; font: 800 10px Arial, sans-serif; letter-spacing: .17em; }
.hw-season-copy h2 { margin: 10px 0 7px; color: #fff4e5; font-size: clamp(20px, 2.3vw, 30px); line-height: 1.2; letter-spacing: -.025em; }
.hw-season-copy p { margin: 0; max-width: 580px; color: #d2c3dc; font-size: 13px; line-height: 1.65; }
.hw-season-art { position: relative; width: 130px; height: 100px; flex: 0 0 130px; pointer-events: none; }
.hw-season-art svg { position: absolute; width: 90px; height: 90px; bottom: -2px; left: 0; filter: drop-shadow(0 0 18px #ff923d40); }
.hw-season-art svg + svg { width: 50px; height: 61px; left: 74px; bottom: 18px; opacity: .85; animation: hw-bob 5s ease-in-out infinite; }
.hw-season-badge {
  display: block; width: fit-content; margin: 0 0 20px; padding: 8px 12px;
  border: 1px solid #ffc56e45; border-radius: 999px; background: #ff923d0d;
  color: #ffd6a2; font: 700 10px Arial, sans-serif; line-height: 1.4; letter-spacing: .07em;
}
body.halloween-public:not([data-halloween-page="index"]) :is(.panel, .card, .hero-card, .search-card, .faq-item, .quick-card, .success-card, .order-box, .profile-card, .loader-card) {
  background: linear-gradient(155deg, #291a35f5, #17101ff5);
  border-color: #ffc56e30;
  box-shadow: 0 12px 40px #00000030;
}
body.halloween-public:not([data-halloween-page="index"]) :is(.hero, .faq-shell > .hero, .tabs-wrap) {
  background: radial-gradient(ellipse at top right, #a66cff22, transparent 60%), linear-gradient(135deg, #2d1939ee, #1a1125f5);
  border-color: #ffc56e35;
}
body.halloween-public :is(.auth-shell, .profile-card, .success-card, .order-box) { border-color: #ffc56e40; }
body.halloween-public :is(.visual, .auth-visual) {
  background: linear-gradient(180deg, #28133699, #100b18e0), url('/images/halloween-hero.webp') 75% center / cover;
}
body.halloween-public[data-halloween-page="profile"] .content,
body.halloween-public :is(.auth-panel, .box) { background: #21152e; color: #fff4e5; }
body.halloween-public :is(.auth-panel, .box) :is(p, .back-link, .divider) { color: #c9bdd5; }
body.halloween-public :is(.auth-panel, .box) :is(.secondary-btn, .forgot-link button) { color: #ffc56e; border-color: #ffc56e45; }
body.halloween-public .terms-box { color: #c9bdd5; }
body.halloween-public :is(.terms-link, .auth-panel .forgot-link button, .box .back-link) { color: #ffc56e; }
body.halloween-public :is(.auth-panel, .box, .content, .panel, .search-card, .card) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea) {
  background: #120d1bd9; color: #fff4e5; border-color: #a98cbe55; accent-color: #ff923d;
}
body.halloween-public input::placeholder, body.halloween-public textarea::placeholder { color: #b7a9c4; }
body.halloween-public :is(input, select, textarea):focus-visible { outline: 2px solid #ffb65f; outline-offset: 2px; }
body.halloween-public :is(.primary-btn, .save-btn, .primary, .apply, .checkout) {
  background: linear-gradient(135deg, #ffb45d, #ff923d 45%, #b782eb); color: #211028;
  box-shadow: 0 9px 25px #ff923d20;
}
body.halloween-public :is(.faq-item.open, .tab-btn.active, .filter-btn.active, .chip.active) {
  border-color: #ffc56e80; background: #ff923d15;
}
body.halloween-public :is(.product-card, .pet-card, .quick-card, .faq-item) { transition: border-color .25s, box-shadow .25s, translate .25s; }
@media (hover: hover) {
  body.halloween-public :is(.product-card, .pet-card, .quick-card, .faq-item):hover { border-color: #ffb65f99; box-shadow: 0 12px 35px #ff923d15; translate: 0 -3px; }
}
body.halloween-public[data-halloween-page="shop"] .hero-visual { height: 440px; min-height: 0; padding: 10px; border-radius: 28px; background: linear-gradient(135deg, #ff923d80, #a66cff80); box-shadow: 0 18px 50px #00000040; }
body.halloween-public[data-halloween-page="shop"] .hero-visual img { height: 100%; min-height: 0; object-position: center 32%; }
body.halloween-public[data-halloween-page="shop"] .hero h1 span { color: #ffc56e; }
body.halloween-public[data-halloween-page="shop"] .hero-actions .main { background: linear-gradient(135deg, #ffb45d, #b782eb); color: #211028; }
body.halloween-public[data-halloween-page="shop"] .hero-visual::before { background: linear-gradient(135deg, #ff923d40, #a66cff40); }
body.halloween-public .checkout-steps .step.active span { background: #ffb45d; color: #211028; }
body.halloween-public .progress-fill { background: linear-gradient(90deg, #ff923d, #b782eb); }
body.halloween-public .detail-card { background: #24182ff2; border-color: #ffc56e30; }
body.halloween-public[data-halloween-page="pet"] :is(.toolbar, .dash-head, .edit-card, .privacy-card) { border-color: #ffc56e40; }

/* Admin: warm surfaces, clear active navigation and readable work areas. */
html.halloween-active body.halloween-admin {
  background: linear-gradient(110deg, #100b18f5, #1b1027ed), url('/images/halloween-hero.webp') center / cover fixed;
}
body.halloween-admin > .app { position: relative; z-index: 1; }
body.halloween-admin .main {
  min-width: 0;
  background: radial-gradient(ellipse at 100% 0, #ff923d10, transparent 42%), linear-gradient(165deg, #24172ff5, #130d1df7);
  border-color: #ffc56e35;
  box-shadow: 0 28px 75px #00000050;
}
body.halloween-admin .sidebar {
  position: sticky; top: 28px; height: calc(100vh - 56px); align-self: start;
  display: flex; flex-direction: column; overflow-y: auto;
  background: linear-gradient(165deg, #382040f7, #1c1227fc 55%);
  border-color: #ffc56e40;
  box-shadow: 0 20px 60px #00000045;
}
body.halloween-admin .sidebar > * { flex-shrink: 0; }
body.halloween-admin .sidebar-footer { margin-top: auto; padding-top: 20px; }
body.halloween-admin .menu-toggle { display: none; position: fixed; top: 14px; left: 14px; z-index: 10001; width: 46px; height: 46px; border: 1px solid #ffc56e50; border-radius: 14px; cursor: pointer; font-size: 24px; }
body.halloween-admin .sidebar-overlay { display: none; position: fixed; inset: 0; z-index: 9998; background: #100b1899; backdrop-filter: blur(5px); }
body.halloween-admin .sidebar .brand { padding-bottom: 15px; }
body.halloween-admin .sidebar .hw-season-badge { margin: 0 8px 20px; font-size: 9px; }
body.halloween-admin .nav-title { color: #bc9fc8; letter-spacing: .12em; }
body.halloween-admin .nav-item { color: #e8ddef; transition: background .2s, border-color .2s; }
body.halloween-admin .nav-item:hover { background: #ffc56e12; }
body.halloween-admin .nav-item.active {
  background: linear-gradient(90deg, #ff923d28, #a66cff17);
  color: #ffe1b8; border-color: #ffc56e40; box-shadow: inset 3px 0 #ffad53;
}
body.halloween-admin .nav-icon { color: #ffd09a; background: #ff923d12; }
body.halloween-admin .topbar { background: transparent; border-color: #ffc56e30; }
body.halloween-admin .headline h1 { color: #fff1de; letter-spacing: -.035em; }
body.halloween-admin .headline p { color: #c9bdd5; }
body.halloween-admin[data-halloween-page="admin"] .main button:not(.ghost-btn):not(.secondary) { color: #211028; }
body.halloween-admin[data-halloween-page="admin-chat-reviews"] .hw-season-badge { margin: 0 24px 20px; }
body.halloween-admin .hw-season-strip { min-height: 112px; padding: 20px 24px; margin-bottom: 24px; border-radius: 22px; }
body.halloween-admin .hw-season-copy h2 { font-size: clamp(20px, 1.8vw, 26px); }
body.halloween-admin .hw-season-art { width: 110px; height: 74px; flex-basis: 110px; }
body.halloween-admin .hw-season-art .hw-pumpkin { width: 70px; height: 70px; }
body.halloween-admin .hw-season-art svg + svg { left: 62px; width: 40px; height: 49px; }
body.halloween-admin :is(.panel, .stat-card, .stat, .order-card, .user-card, .invite-item, .promo-item, .kanban-column, .todo-item, .img-card, .review, .session-status-card) {
  background: linear-gradient(150deg, #2b1d36, #1a1324);
  border-color: #a98cbe40;
  box-shadow: 0 9px 26px #00000020;
}
body.halloween-admin :is(.stat-card, .stat) { position: relative; border-top: 2px solid #ffad5380; }
body.halloween-admin :is(.stat-value, .stat strong) { color: #ffe1b8; }
body.halloween-admin .stat-card:nth-child(2n) { border-top-color: #b782eb99; }
body.halloween-admin :is(.profile-card, .profile-trigger, .dropdown, .admin-modal-box, .delete-modal-box, .drawer-content, .listing-builder, .mega-menu, .shortcut-panel) {
  background: #21162ef7; border-color: #bfa0cf45;
}
body.halloween-admin :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea) {
  background: #110c19; color: #fff4e5; border-color: #bfa0cf45; accent-color: #ffb45d;
}
body.halloween-admin :is(input, textarea)::placeholder { color: #ad9dbb; }
body.halloween-admin :is(input, select, textarea):focus-visible { outline: 2px solid #ffb65f; outline-offset: 2px; }
body.halloween-admin :is(.primary-btn, .save-btn, .primary, .menu-toggle) { background: linear-gradient(135deg, #ffb45d, #ff923d 50%, #b782eb); color: #211028; }
body.halloween-admin :is(.secondary, .ghost-btn, .small-btn:not(.delete-btn), .filter-btn, .mega-trigger) { background: #a66cff15; border-color: #bfa0cf45; color: #e8ddef; }
body.halloween-admin :is(.filter-btn.active, .tab.active, .listing-tabs .active) { background: #ff923d20; color: #ffd09a; border-color: #ffb45d70; }
body.halloween-admin .panel-header { border-color: #a98cbe35; }
body.halloween-admin table { border-color: #a98cbe40; }
body.halloween-admin th { background: #2e1d3b; color: #ffdcad; }
body.halloween-admin td { border-color: #a98cbe30; }
body.halloween-admin tbody tr:hover { background: #ffc56e08; }
body.halloween-admin .app { gap: 18px; }
body.halloween-admin .app :is(.head, .reply-wrap) { background: #291933; border-color: #ffc56e30; }
body.halloween-admin .sessions .hw-season-badge { margin: 12px 0 0; }
body.halloween-admin .session-item { border-color: #bfa0cf30; background: #21172d; }
body.halloween-admin .session-item.active { background: #ff923d15; border-color: #ffb45d70; }
body.halloween-admin .messages { background: radial-gradient(ellipse at top right, #a66cff0c, transparent 65%); }
body.halloween-admin .reply button { background: linear-gradient(135deg, #ff923d, #b782eb); color: #211028; }
body.halloween-admin .hw-sky { opacity: .45; }
body.halloween-admin .hw-flight { opacity: .3; }
body.halloween-admin .hw-motion-toggle { opacity: .85; }
html.hw-paused .hw-season-art *, html.hw-asleep .hw-season-art * { animation-play-state: paused !important; }
@media (max-width: 1180px) {
  body.halloween-admin .page:has(> .sidebar) { display: block !important; padding: 76px 14px 20px !important; }
  body.halloween-admin .page > .sidebar {
    position: fixed !important; top: 0 !important; left: 0; bottom: 0;
    width: min(82vw, 320px); height: 100dvh !important; margin: 0 !important;
    z-index: 9999; border-radius: 0 26px 26px 0 !important;
    padding-top: 76px;
    transform: translateX(-105%); transition: transform .25s ease;
  }
  body.halloween-admin .menu-toggle { display: grid; place-items: center; }
  body.halloween-admin.sidebar-open { overflow: hidden; }
  body.halloween-admin.sidebar-open .page > .sidebar { transform: translateX(0); }
  body.halloween-admin.sidebar-open .sidebar-overlay { display: block; }
  body.halloween-admin.sidebar-open .hw-motion-toggle { visibility: hidden; }
  body.halloween-admin .main { width: 100%; padding: 20px !important; }
  body.halloween-admin .dashboard-grid { grid-template-columns: minmax(0, 1fr); }
  body.halloween-admin .main > .topbar { flex-wrap: wrap; }
}
@media (max-width: 700px) {
  .hw-season-strip { min-height: 120px; padding: 19px 20px; gap: 12px; border-radius: 22px; }
  .hw-season-art { width: 70px; height: 75px; flex-basis: 70px; }
  .hw-season-art .hw-pumpkin { width: 65px; height: 65px; }
  .hw-season-art svg + svg { left: 36px; bottom: 30px; width: 34px; height: 42px; }
  .hw-season-label { font-size: 8px; letter-spacing: .1em; }
  .hw-season-copy h2 { font-size: 19px; }
  .hw-season-copy p { font-size: 11px; }
  body.halloween-admin .hw-season-strip { padding: 16px; min-height: 100px; }
  body.halloween-admin .hw-season-art { display: none; }
  body.halloween-admin .hw-season-copy h2 { font-size: 20px; }
  body.halloween-admin .hw-season-badge { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .hw-season-art svg + svg { animation: none; }
  body.halloween-public :is(.product-card, .pet-card, .quick-card, .faq-item) { transition: none; translate: none; }
}

/* A shared, bounded intro: no simulated percentages or waiting for support APIs. */
.hw-page-preloader {
  position: fixed; inset: 0; z-index: 20000;
  display: grid; place-items: center; overflow: hidden;
  width: 100%; height: 100dvh; margin: 0; padding: 24px; border: 0;
  background: radial-gradient(ellipse at 50% 48%, #49265366, transparent 44%),
    radial-gradient(ellipse at 12% 90%, #ff923d15, transparent 40%), #100b18;
  color: #fff4e5; font-family: Arial, sans-serif;
  transition: opacity .4s ease, visibility .4s ease;
  animation: hw-loader-failsafe 0s 2.3s forwards;
}
.hw-page-preloader.done { opacity: 0; visibility: hidden; pointer-events: none; animation: none; }
.hw-loader-landscape { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.hw-loader-landscape svg { width: 100%; height: 100%; }
.hw-loader-landscape .hw-witch { top: 18%; opacity: .6; }
.hw-loader-moon {
  position: absolute; top: 10%; right: 13%; width: clamp(70px, 10vw, 130px); aspect-ratio: 1;
  border-radius: 50%; opacity: .65;
  background: radial-gradient(circle at 32% 40%, #a896c025 0 9%, transparent 10%),
    radial-gradient(circle at 66% 68%, #9c8da322 0 15%, transparent 16%),
    radial-gradient(circle at 40% 38%, #fff3d5, #ddc2f1 80%);
  box-shadow: 0 0 65px #d6b6ed25, 0 0 130px #a66cff15;
}
.hw-loader-inner { position: relative; z-index: 1; display: grid; justify-items: center; gap: 12px; width: min(560px, 100%); text-align: center; }
.hw-loader-label { color: #ffc56e; font-size: 10px; font-weight: 800; letter-spacing: .23em; }
.hw-loader-stage { position: relative; width: min(420px, 85vw); height: 280px; margin: 12px 0 4px; }
.hw-loader-stage::after {
  content: ''; position: absolute; left: 14%; right: 14%; bottom: 6px; height: 45px; z-index: -1;
  background: radial-gradient(ellipse, #ff923d40, transparent 70%);
  animation: hw-loader-glow 3s ease-in-out infinite;
}
.hw-loader-runes {
  position: absolute; inset: 0 60px; display: grid; place-items: center; border: 1px dashed #a66cff50;
  border-radius: 50%; color: #ffc56e70; font-size: 22px; letter-spacing: .3em;
  animation: hw-rune-turn 25s linear infinite;
}
.hw-loader-runes::before { content: ''; position: absolute; inset: 18px; border: 1px solid #ff923d20; border-radius: 50%; }
.hw-loader-cauldron { position: absolute; left: 50%; bottom: 5px; width: 260px; height: 215px; transform: translateX(-50%); }
.hw-loader-cauldron > .hw-cauldron-art { position: static; width: 100%; height: 100%; filter: drop-shadow(0 0 30px #baff7f20); }
.hw-loader-cauldron:empty { background: url('/images/halloween-cauldron.svg') center / contain no-repeat; }
.hw-loader-cauldron .hw-potion-liquid { animation: hw-liquid 2.3s ease-in-out infinite; transform-origin: center; }
.hw-loader-cauldron .hw-brew-fire { animation: hw-fire .7s ease-in-out infinite alternate; transform-origin: bottom center; }
.hw-loader-companion { position: absolute; display: block; }
.hw-loader-companion svg, .hw-loader-vial svg { width: 100%; height: 100%; }
.hw-loader-ghost { width: 72px; height: 88px; top: 8px; right: 48px; filter: drop-shadow(0 0 20px #e5c9ff60); animation: hw-ghost-curious 5s ease-in-out infinite; }
.hw-loader-pumpkin { width: 85px; height: 85px; left: 15px; bottom: 0; filter: drop-shadow(0 0 24px #ff923d50); animation: hw-loader-glow 3.3s ease-in-out infinite; }
.hw-loader-vial { position: absolute; width: 40px; height: 65px; bottom: 6px; }
.hw-loader-vial-left { left: 91px; color: #c386ff; rotate: -12deg; }
.hw-loader-vial-right { right: 31px; color: #ffb452; rotate: 12deg; animation: hw-vial-wobble 4s ease-in-out infinite; }
.hw-load-bubble { position: absolute; left: 49%; bottom: 131px; width: 14px; height: 14px; border: 1px solid #e5ffbb; background: #bbff8270; border-radius: 50%; opacity: 0; box-shadow: 0 0 12px #bbff8225; animation: hw-loading-bubble 2.8s ease-out infinite; }
.hw-load-bubble-two { left: 41%; width: 9px; height: 9px; animation-delay: .8s; }
.hw-load-bubble-three { left: 59%; width: 18px; height: 18px; animation-delay: 1.6s; }
.hw-load-steam { position: absolute; bottom: 135px; left: 42%; width: 25px; height: 65px; border-left: 2px solid #dbffbb65; border-radius: 50%; opacity: 0; animation: hw-steam 4s ease-out infinite; }
.hw-load-steam-two { left: 56%; animation-delay: 2s; }
.hw-loader-heading { margin: 0; color: #fff4e5; font-size: clamp(23px, 3vw, 36px); font-weight: 800; line-height: 1.15; letter-spacing: -.025em; }
.hw-loader-message { margin: 0; color: #d7c6e3; font-size: 13px; line-height: 1.5; }
.hw-page-preloader .hw-loader-track { position: relative; width: min(280px, 72vw); height: 5px; margin: 8px 0; border-radius: 999px; background: #e8ddef15; overflow: hidden; }
.hw-page-preloader .hw-loader-meter { display: block; width: 45%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ffb65f, #b782eb); animation: hw-loader-sweep 1.6s ease-in-out infinite; }
.hw-loader-steps { display: flex; gap: 16px; color: #9b86ad; font-size: 9px; line-height: 1.5; }
.hw-loader-steps span::before { content: '✧'; margin-right: 5px; }
.hw-page-preloader[data-phase="assets"] :is(.hw-step-page, .hw-step-assets),
.hw-page-preloader[data-phase="ready"] .hw-loader-steps span { color: #ffd299; }
.hw-loader-tip { margin-top: 10px; font-size: 10px; color: #b7a3c7; line-height: 1.5; }
.hw-page-preloader .hw-loader-skip {
  position: absolute; bottom: max(24px, env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%);
  min-height: 40px; padding: 10px 20px; border: 1px solid #ffb65f45; border-radius: 999px;
  background: #24182f; color: #ffe1b8; font: 600 12px Arial, sans-serif; cursor: pointer;
  z-index: 2; box-shadow: none;
}
.hw-loader-skip:hover { border-color: #ffc56e; background: #39223f; }
.hw-loader-skip:focus-visible, .hw-intro-replay:focus-visible { outline: 2px solid #ffc56e; outline-offset: 4px; }
body .hw-intro-replay {
  position: fixed; left: 125px; bottom: max(14px, env(safe-area-inset-bottom)); z-index: 9997;
  min-height: 34px; padding: 7px 12px; border: 1px solid #b782eb50; border-radius: 20px;
  background: #1c1328e8; color: #ddc0f1; font: 600 11px Arial, sans-serif; cursor: pointer;
  backdrop-filter: blur(10px); box-shadow: none;
}
body .hw-intro-replay:hover { transform: none; border-color: #b782eb; background: #39223f; }
.hw-intro-preview { max-width: none; max-height: none; animation: none; }
.hw-intro-preview::backdrop { background: #100b18; }
body.sidebar-open .hw-intro-replay { visibility: hidden; }

/* Compact potions for real requests and dynamically replaced loading cards. */
html.halloween-active .loader {
  width: 80px; height: 70px; border: 0; border-radius: 0;
  background: url('/images/halloween-cauldron.svg') center / contain no-repeat;
  animation: hw-pot-bob 2.4s ease-in-out infinite; filter: drop-shadow(0 0 12px #bbff8220);
}
.hw-loading-state {
  position: relative; border: 1px solid #b782eb35; border-radius: 22px;
  background: radial-gradient(ellipse at 50% 0, #a66cff12, transparent 65%), #21152e;
  color: #e8ddef; padding: 22px; text-align: center;
}
.hw-loading-state:not(:has(.loader))::before { content: ''; display: block; width: 70px; height: 64px; margin: 0 auto 10px; background: url('/images/halloween-cauldron.svg') center / contain no-repeat; animation: hw-pot-bob 2.4s ease-in-out infinite; }
.hw-loading-state::after { content: '✦  ·  ✦'; display: block; margin: 8px auto 0; color: #ffc56e; font-size: 12px; letter-spacing: .5em; animation: hw-loading-dots 1.7s ease-in-out infinite; }
html.halloween-active button.loading::after { border: 0; border-radius: 0; width: 25px; height: 22px; background: url('/images/halloween-cauldron.svg') center / contain no-repeat; animation: hw-pot-bob 1.5s ease-in-out infinite; }
@keyframes hw-loader-failsafe { to { opacity: 0; visibility: hidden; pointer-events: none; } }
@keyframes hw-loader-sweep { 0% { transform: translateX(-110%); } 100% { transform: translateX(325%); } }
@keyframes hw-loading-bubble { 0% { transform: translateY(0) scale(.4); opacity: 0; } 20% { opacity: .9; } 100% { transform: translateY(-85px) translateX(16px) scale(1.2); opacity: 0; } }
@keyframes hw-rune-turn { to { transform: rotate(360deg); } }
@keyframes hw-loader-glow { 0%,100% { opacity: .7; } 50% { opacity: 1; } }
@keyframes hw-ghost-curious { 0%,100% { transform: translateY(0) rotate(5deg); } 50% { transform: translateY(-12px) rotate(-8deg); } }
@keyframes hw-vial-wobble { 0%,100% { rotate: 12deg; } 50% { rotate: -2deg; } }
@keyframes hw-pot-bob { 0%,100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-4px) rotate(3deg); } }
@keyframes hw-loading-dots { 0%,100% { opacity: .3; } 50% { opacity: 1; } }
html.hw-paused :is(.hw-loader-stage, .hw-loader-landscape) *,
html.hw-asleep :is(.hw-loader-stage, .hw-loader-landscape) *,
html.hw-paused :is(.hw-loader-meter, .loader), html.hw-asleep :is(.hw-loader-meter, .loader),
html.hw-paused .hw-loading-state::before, html.hw-paused .hw-loading-state::after,
html.hw-asleep .hw-loading-state::before, html.hw-asleep .hw-loading-state::after,
html.hw-paused .hw-loader-stage::after, html.hw-asleep .hw-loader-stage::after { animation-play-state: paused !important; }
@media (max-width: 600px) {
  .hw-page-preloader { padding: 18px; }
  .hw-loader-moon { top: 7%; right: 7%; width: 70px; opacity: .4; }
  .hw-loader-label { font-size: 8px; letter-spacing: .17em; }
  .hw-loader-stage { width: 330px; max-width: 94vw; height: 250px; }
  .hw-loader-cauldron { width: 235px; height: 190px; }
  .hw-loader-ghost { right: 21px; width: 56px; height: 70px; }
  .hw-loader-pumpkin { width: 66px; height: 66px; left: 0; }
  .hw-loader-vial-left { left: 58px; }
  .hw-loader-vial-right { right: 6px; }
  .hw-load-bubble { bottom: 118px; }
  .hw-load-steam { bottom: 124px; }
  .hw-loader-steps { gap: 10px; font-size: 8px; }
  .hw-loader-message { font-size: 12px; }
  body .hw-intro-replay { left: 118px; font-size: 10px; padding: 6px 10px; min-height: 32px; }
}
@media (max-height: 640px) {
  .hw-loader-inner { gap: 6px; }
  .hw-loader-stage { width: 320px; height: 195px; margin: 0; }
  .hw-loader-cauldron { width: 210px; height: 175px; }
  .hw-loader-ghost { top: 0; width: 48px; height: 58px; }
  .hw-load-bubble { bottom: 110px; }
  .hw-loader-tip, .hw-loader-steps { display: none; }
  .hw-page-preloader .hw-loader-skip { bottom: 12px; min-height: 32px; padding: 6px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .hw-loader-stage *, .hw-loader-stage::after, .hw-loader-landscape *, .hw-loader-meter,
  html.halloween-active .loader, .hw-loading-state::before, .hw-loading-state::after,
  html.halloween-active button.loading::after { animation: none !important; }
  .hw-load-bubble, .hw-load-steam { display: none; }
  .hw-page-preloader { transition: none; }
  .hw-loader-meter { width: 100%; }
}

/* The supplied artwork stays intact in every brand position. */
body .brand-mark {
  display: grid; place-items: center; position: relative; flex: 0 0 52px;
  width: 52px !important; height: 52px !important; min-width: 52px; padding: 2px;
  overflow: hidden; border-radius: 15px !important; box-sizing: border-box;
  background: #faf9f5 !important; border: 1px solid #c6a0ff80;
  box-shadow: 0 0 22px #a66cff25;
}
body .brand-mark::after { content: none; }
body .brand-mark img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 12px; }
body .hw-brand-home { display: flex; align-items: center; gap: 12px; width: fit-content; margin: 0 0 20px; color: #fff4e5; text-decoration: none; }
.hw-brand-home strong { display: block; font: 800 13px Arial, sans-serif; letter-spacing: .1em; }
.hw-brand-home small { display: block; margin-top: 5px; color: #c9bdd5; font: 500 11px Arial, sans-serif; }
body[data-halloween-page="admin-chat-reviews"] .hw-brand-home { margin: 24px 24px 8px; }
.hw-loader-brand { display: block; width: 64px; height: 64px; object-fit: contain; border: 2px solid #c6a0ff65; border-radius: 18px; background: #faf9f5; box-shadow: 0 0 30px #a66cff30; }
body .chat-head-icon { overflow: hidden; background: #faf9f5; padding: 2px; }
.chat-head-icon img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: inherit; }

/* Pumpkin clock: floating companions, glowing tiles and changing digits. */
.hw-countdown {
  position: relative; isolation: isolate; display: grid; grid-template-columns: 76px minmax(0, 1fr);
  column-gap: 12px; row-gap: 12px; flex: none; width: 360px; max-width: 100%;
  margin: 0; padding: 16px 18px; border: 1px solid #ffc56e50; border-radius: 23px;
  background: radial-gradient(ellipse at 10% 20%, #ff923d19, transparent 60%), linear-gradient(120deg, #2c183af5, #181022f5);
  box-shadow: inset 0 1px 0 #ffffff09, 0 8px 35px #00000025;
  animation: hw-clock-glow 5s ease-in-out infinite;
}
.hw-clock-scene { position: relative; grid-row: span 2; width: 76px; align-self: stretch; pointer-events: none; }
.hw-season-strip > .hw-countdown { flex: 0 0 360px; }
.hw-clock-scene .hw-pumpkin { position: absolute; width: 75px; height: 75px; left: -10px; bottom: -5px; animation: hw-pot-bob 4s ease-in-out infinite; filter: drop-shadow(0 0 10px #ff923d35); }
.hw-clock-scene svg + svg { position: absolute; width: 34px; height: 44px; top: -4px; right: -1px; animation: hw-ghost-curious 3.4s ease-in-out infinite; filter: drop-shadow(0 0 8px #c6a0ff40); }
.hw-clock-scene i { position: absolute; top: 10px; left: 2px; color: #ffc56e; font-size: 15px; font-style: normal; animation: hw-clock-star 2.2s ease-in-out infinite; }
.hw-clock-scene i + i { top: auto; bottom: 8px; left: auto; right: -2px; color: #c6a0ff; animation-delay: 1.1s; }
.hw-clock-copy { align-self: center; min-width: 0; }
.hw-clock-title { display: block; color: #fff4e5; font: 800 13px Arial, sans-serif; line-height: 1.4; }
.hw-clock-date { display: block; margin-top: 3px; color: #c9b9d5; font: 500 9px Arial, sans-serif; }
.hw-countdown-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; min-width: 0; }
.hw-countdown-unit { min-width: 0; display: grid; justify-items: center; gap: 5px; padding: 8px 3px 6px; border: 1px solid #c6a0ff24; border-radius: 10px; background: #ffffff04; perspective: 120px; }
.hw-countdown-number { display: block; color: #ffc56e; font: 800 24px/1 monospace; font-variant-numeric: tabular-nums; text-shadow: 0 0 15px #ff923d45; }
.hw-countdown-unit span { color: #e6d7ee; font: 500 8px Arial, sans-serif; }
.hw-countdown-unit:last-child { border-color: #c6a0ff70; background: #a66cff12; }
.hw-countdown-unit:last-child .hw-countdown-number { color: #d4b5ff; }
.hero-copy > .hw-countdown { width: 410px; grid-template-columns: 76px minmax(0, 1fr); margin: 0 0 24px; }
.hero-copy > .hw-countdown .hw-countdown-number { font-size: 28px; }
.hw-season-badge + .hw-countdown { width: 100%; margin-bottom: 20px; }
body.halloween-admin .sessions .hw-countdown { margin-top: 12px; }
body[data-halloween-page="admin-chat-reviews"] .hw-countdown { width: calc(100% - 48px); max-width: 420px; margin: 0 24px 20px; }
.hw-halloween-today { border-color: #ffbd68; background: radial-gradient(ellipse at center, #ff923d25, transparent), #2c183a; }
@keyframes hw-clock-glow { 0%,100% { box-shadow: inset 0 1px 0 #ffffff09, 0 0 18px #a66cff12; } 50% { box-shadow: inset 0 1px 0 #ffffff09, 0 0 25px #ff923d30; } }
@keyframes hw-clock-star { 0%,100% { transform: rotate(0) scale(.6); opacity: .3; } 50% { transform: rotate(90deg) scale(1.15); opacity: 1; } }
html.hw-paused .hw-countdown, html.hw-paused .hw-countdown *,
html.hw-asleep .hw-countdown, html.hw-asleep .hw-countdown * { animation-play-state: paused !important; }

/* Fine pointers get custom artwork; text editing and touch keep native behavior. */
@media (hover: hover) and (pointer: fine) {
  html.halloween-active, html.halloween-active body { cursor: url('/images/halloween-cursor.svg') 3 3, auto; }
  html.halloween-active :is(a, button, summary, select, label[for], [role="button"], .brand, .nav-item, .profile-menu) { cursor: url('/images/halloween-pointer.svg') 3 3, pointer !important; }
  html.halloween-active :is(input, textarea, [contenteditable="true"]) { cursor: text; }
  html.halloween-active :is(input[type="checkbox"], input[type="radio"], input[type="range"], input[type="file"], input[type="submit"]) { cursor: url('/images/halloween-pointer.svg') 3 3, pointer; }
  html.halloween-active :is(button:disabled, input:disabled, select:disabled, [aria-disabled="true"]) { cursor: not-allowed !important; }
}
.hw-cursor-spark { position: fixed; z-index: 21000; width: 16px; height: 16px; margin: -8px 0 0 -8px; color: #ffc56e; font: normal 14px/16px Arial, sans-serif; pointer-events: none; text-shadow: 0 0 8px #ff923d80; animation: hw-cursor-fade .65s ease-out forwards; }
.hw-cursor-burst { color: #ddc6ff; font-size: 24px; animation: hw-cursor-click .65s ease-out forwards; }
@keyframes hw-cursor-fade { from { transform: translate(0, 0) rotate(0) scale(1); opacity: .8; } to { transform: translate(-8px, 14px) rotate(90deg) scale(.2); opacity: 0; } }
@keyframes hw-cursor-click { from { transform: scale(.4); opacity: 1; } to { transform: scale(2.5) rotate(90deg); opacity: 0; } }
@media (max-width: 900px) {
  .hw-season-strip:has(.hw-countdown) { flex-wrap: wrap; }
  .hw-season-strip > .hw-countdown { flex-basis: 100%; width: 100%; grid-template-columns: 76px minmax(0, 1fr); }
}
@media (max-width: 600px) {
  body .brand-mark { flex-basis: 44px; width: 44px !important; height: 44px !important; min-width: 44px; border-radius: 13px !important; }
  .hw-loader-brand { width: 52px; height: 52px; border-radius: 15px; }
  .hw-countdown { padding: 14px 12px; column-gap: 7px; grid-template-columns: 62px minmax(0, 1fr); }
  .hw-clock-scene { width: 62px; }
  .hw-clock-scene .hw-pumpkin { width: 62px; height: 62px; left: -7px; bottom: 0; }
  .hw-clock-scene svg + svg { width: 27px; height: 35px; }
  .hw-countdown-number, .hero-copy > .hw-countdown .hw-countdown-number { font-size: 24px; }
  .hero-copy > .hw-countdown { grid-template-columns: 62px minmax(0, 1fr); }
  .hw-countdown-unit span { font-size: 7px; }
  .hw-clock-title { font-size: 12px; }
}
@media (max-height: 640px) { .hw-loader-brand { width: 40px; height: 40px; border-radius: 11px; } }
@media (prefers-reduced-motion: reduce) {
  .hw-countdown, .hw-countdown * { animation: none !important; }
  .hw-cursor-spark { display: none; }
}

/* Natural photo dimensions size the frame; decorations follow the same box. */
body.halloween-public-pet .pet-photo-wrap.hw-ghost-photo {
  width: min(400px, 100%); height: auto; aspect-ratio: auto; padding: 30px; box-sizing: border-box;
  border: 1px solid #e7d7ff95; border-radius: 40px; overflow: visible; margin-bottom: 48px;
  background: linear-gradient(145deg, #63374b, #33203f 45%, #634531);
  box-shadow: 0 12px 45px #100b1870, 0 0 36px #cfb4ef40, inset 0 0 0 10px #140c2065;
  animation: none;
}
body.halloween-public-pet .hw-ghost-photo::before,
body.halloween-public-pet .hw-ghost-photo::after { content: none; }
body.halloween-public-pet .hw-ghost-photo .pet-photo {
  position: relative; inset: auto; display: block; width: 100%; height: auto;
  border-radius: 0; clip-path: none; mask-image: none; object-fit: contain; object-position: center;
  background: #21142f; box-shadow: none; transform: none;
}
.hw-photo-ghost { position: absolute; z-index: 3; width: 54px; height: 65px; pointer-events: none; filter: drop-shadow(0 0 12px #e7d7ff60); animation: hw-photo-ghost-bob 4s ease-in-out infinite; }
.hw-photo-ghost svg { display: block; width: 100%; height: 100%; }
.hw-photo-ghost-one { left: -24px; bottom: 8px; }
.hw-photo-ghost-two { right: -24px; top: -19px; animation-delay: -2s; }
.hw-photo-skirt { position: absolute; left: 30px; right: 30px; bottom: -9px; height: 13px; background: linear-gradient(90deg, #d5c3e6, #ffca7b, #d5c3e6); opacity: .7; pointer-events: none; clip-path: polygon(0 0, 100% 0, 100% 40%, 90% 100%, 80% 40%, 70% 100%, 60% 40%, 50% 100%, 40% 40%, 30% 100%, 20% 40%, 10% 100%, 0 40%); }
body.halloween-public-pet.lost-mode .hw-ghost-photo { border-color: #ff8c9e; box-shadow: 0 12px 45px #100b1870, 0 0 30px #ff5f7840; }
@keyframes hw-photo-ghost-bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
html.hw-paused .hw-photo-ghost, html.hw-asleep .hw-photo-ghost { animation-play-state: paused !important; }

/* The busy haunted scene is confined to the rim and space outside the photo. */
.hw-frame-effects { position: absolute; inset: 0; pointer-events: none; }
.hw-frame-effects > span { display: block; }
.hw-frame-border { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.hw-frame-border rect { width: calc(100% - var(--rim-inset) * 2); height: calc(100% - var(--rim-inset) * 2); }
.hw-frame-border .hw-rim-outer { --rim-inset: 6px; }
.hw-frame-border :is(.hw-rim-middle, .hw-frame-runner) { --rim-inset: 15px; }
.hw-frame-border .hw-rim-inner { --rim-inset: 24px; }
.hw-frame-runner { animation: hw-frame-orbit 12s linear infinite; }
.hw-frame-moon { position: absolute; width: 32px; height: 32px; left: calc(50% - 16px); top: -19px; border-radius: 50%; background: radial-gradient(circle at 36% 32%, #fff2c8, #ffd083 65%, #bd836d); box-shadow: 0 0 22px #ffcf8370; animation: hw-frame-moonlight 4s ease-in-out infinite; }
.hw-frame-moon::after { content: ''; position: absolute; width: 7px; height: 7px; top: 8px; right: 7px; border-radius: 50%; background: #8d667c25; box-shadow: -11px 10px 0 2px #8d667c25; }
.hw-photo-web { position: absolute; width: 56px; height: 56px; top: -29px; opacity: .85; }
.hw-photo-web svg { width: 100%; height: 100%; }
.hw-photo-web-left { left: 6px; }
.hw-photo-web-right { right: 8px; transform: scaleX(-1); }
.hw-photo-bat { position: absolute; width: 50px; height: 27px; filter: drop-shadow(0 0 5px #c4a1f150); animation: hw-frame-bat-float 3s ease-in-out infinite; }
.hw-photo-bat svg { display: block; width: 100%; height: 100%; }
.hw-photo-bat-one { left: 61px; top: -28px; }
.hw-photo-bat-two { right: 72px; top: -26px; width: 38px; height: 23px; animation-delay: -1.6s; }
.hw-photo-spider { position: absolute; width: 32px; height: 32px; left: -12px; top: 55px; transform-origin: 50% -30px; animation: hw-frame-spider-swing 4s ease-in-out infinite; }
.hw-photo-spider svg { display: block; width: 100%; height: 100%; }
.hw-frame-thread { position: absolute; width: 1px; height: 34px; left: 50%; top: -33px; background: #e7d7ff85; }
.hw-photo-spider .hw-spider-legs { transform-origin: center; animation: hw-leg-wiggle 3s ease-in-out infinite; }
.hw-frame-candle { position: absolute; width: 19px; height: 57px; top: 43%; filter: drop-shadow(0 0 8px #ffb85a35); }
.hw-frame-candle svg { display: block; width: 100%; height: 100%; }
.hw-frame-candle-left { left: -7px; }
.hw-frame-candle-right { right: -7px; }
.hw-frame-flame { transform-origin: 50% 100%; transform-box: fill-box; animation: hw-fire .7s ease-in-out infinite alternate; }
.hw-frame-candle-right .hw-frame-flame { animation-delay: -.3s; }
.hw-frame-vial { position: absolute; width: 22px; height: 37px; bottom: -19px; animation: hw-frame-vial-wiggle 4s ease-in-out infinite; }
.hw-frame-vial svg { display: block; width: 100%; height: 100%; }
.hw-frame-vial-one { left: 27%; color: #b8ffb2; }
.hw-frame-vial-two { left: 43%; color: #c386ff; animation-delay: -2s; }
.hw-frame-brew { position: absolute; right: -10px; bottom: -30px; width: 70px; height: 57px; filter: drop-shadow(0 0 12px #b8ffb225); }
.hw-frame-brew .hw-cauldron-art { display: block; position: static; width: 100%; height: 100%; }
.hw-frame-brew .hw-brew-fire { transform-origin: 50% 100%; transform-box: fill-box; animation: hw-fire .8s ease-in-out infinite alternate; }
.hw-frame-brew .hw-potion-liquid { animation: hw-liquid 2.3s ease-in-out infinite; transform-origin: center; }
.hw-frame-bubble { position: absolute; left: 12px; bottom: 22px; width: 5px; height: 5px; border: 1px solid #d8ffb9; border-radius: 50%; background: #b8ffb260; opacity: 0; animation: hw-frame-bubble-rise 3s ease-out infinite; }
.hw-frame-bubble-two { left: 16px; bottom: 46px; width: 8px; height: 8px; animation-delay: -1s; }
.hw-frame-bubble-three { left: auto; right: 10px; bottom: 20px; animation-delay: -2s; }
.hw-frame-spark { position: absolute; width: 8px; height: 8px; margin: -4px 0 0 -4px; font: normal 10px/8px Arial, sans-serif; color: #ffd493; text-shadow: 0 0 9px #ffd493; animation: hw-frame-twinkle 3s ease-in-out infinite; animation-delay: var(--delay); }
.hw-photo-ghost ellipse:nth-of-type(-n+2) { transform-box: fill-box; transform-origin: center; animation: hw-frame-blink 6s infinite; }
.hw-photo-ghost-two ellipse:nth-of-type(-n+2) { animation-delay: -3s; }
.hw-haunted-frame:hover .hw-frame-runner { animation-duration: 5s; }
@keyframes hw-frame-orbit { to { stroke-dashoffset: -1440; } }
@keyframes hw-frame-moonlight { 0%,100% { opacity: .7; } 50% { opacity: 1; } }
@keyframes hw-frame-bat-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes hw-frame-spider-swing { 0%,100% { transform: rotate(-4deg); } 50% { transform: rotate(5deg); } }
@keyframes hw-frame-vial-wiggle { 0%,100% { transform: rotate(-9deg); } 50% { transform: rotate(9deg); } }
@keyframes hw-frame-bubble-rise { 0% { opacity: 0; transform: translateY(0) scale(.5); } 20% { opacity: .8; } 100% { opacity: 0; transform: translateY(-65px) scale(1.1); } }
@keyframes hw-frame-twinkle { 0%,100% { opacity: .25; transform: scale(.6); } 50% { opacity: 1; transform: scale(1.25); } }
@keyframes hw-frame-blink { 0%,43%,47%,100% { transform: scaleY(1); } 45% { transform: scaleY(.1); } }
html.hw-paused .hw-frame-effects *, html.hw-asleep .hw-frame-effects * { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) {
  .hw-frame-effects * { animation: none !important; }
  .hw-frame-bubble { display: none; }
}

/* A persistent caption makes the themed launcher recognisable as support. */
html .hw-chat-label {
  position: absolute; right: calc(100% + 10px); top: 50%; transform: translateY(-50%);
  display: grid; gap: 4px; width: max-content; padding: 11px 15px;
  border: 1px solid #ffc56e65; border-radius: 16px; background: #281934f5;
  box-shadow: 0 6px 25px #00000040, 0 0 18px #a66cff18; color: #fff4e5; text-align: left;
  transition: opacity .2s; backdrop-filter: blur(10px);
}
.hw-chat-label strong { font: 800 12px Arial, sans-serif; }
.hw-chat-label span { color: #dfc7ef; font: 500 10px Arial, sans-serif; }
.hw-chat-label::after { content: ''; position: absolute; width: 8px; height: 8px; right: -5px; top: calc(50% - 4px); background: #281934; border-right: 1px solid #ffc56e65; border-top: 1px solid #ffc56e65; transform: rotate(45deg); }
html body.chat-widget-open .hw-chat-label { visibility: hidden; opacity: 0; }
@media (max-width: 600px) {
  html .hw-chat-label { right: 0; top: auto; bottom: calc(100% + 10px); transform: none; padding: 9px 12px; border-radius: 13px; }
  .hw-chat-label::after { right: 27px; top: auto; bottom: -5px; transform: rotate(135deg); }
}
@media (prefers-reduced-motion: reduce) {
  .hw-photo-ghost { animation: none !important; }
  .hw-chat-label { transition: none; }
}

/* A ghostly delivery receipt, with the successful send kept unmistakable. */
html .hw-chat-box .chat-email-confirmation.show {
  position: relative; isolation: isolate; overflow: hidden; gap: 18px;
  border-color: #ffc56e80; border-radius: 24px;
  background: radial-gradient(ellipse at 95% 0%, #a66cff35, transparent 58%),
    radial-gradient(ellipse at 0% 100%, #ff923d22, transparent 55%), linear-gradient(145deg, #34203f, #1b1329);
  animation: hw-email-arrive .7s cubic-bezier(.22,1,.36,1) both, hw-email-glow 4s ease-in-out .7s infinite;
}
html .hw-chat-box .chat-email-confirmation > :not(.hw-email-magic) { position: relative; z-index: 1; }
html .hw-chat-box .chat-email-confirmation:focus { outline-color: #ffc56e; }
html .hw-chat-box .chat-email-confirmation-icon {
  color: #153426; background: linear-gradient(135deg, #c5ffb5, #62e9a6);
  box-shadow: 0 0 0 7px #bbff8212, 0 0 28px #bbff8230;
  animation: hw-email-seal .65s cubic-bezier(.34,1.56,.64,1) .15s both;
}
.hw-email-eyebrow { display: block; margin: 17px 0 7px; color: #ffc56e; font-size: 9px; font-weight: 800; line-height: 1.5; letter-spacing: .09em; text-transform: uppercase; }
html .hw-chat-box .chat-email-confirmation strong { display: block; margin-bottom: 9px; color: #baffbe; font-size: 21px; }
html .hw-chat-box .chat-email-confirmation p { color: #efe2f4; }
html .hw-chat-box .chat-email-confirmation button {
  background: linear-gradient(115deg, #ffc56e, #ff9a58); color: #2a1734;
  border-color: #ffd18a; box-shadow: 0 5px 18px #ff923d20;
  transition: transform .2s, box-shadow .2s;
}
html .hw-chat-box .chat-email-confirmation button:hover { transform: translateY(-2px); box-shadow: 0 8px 24px #ff923d40; }
.hw-email-magic { position: absolute; inset: 0; z-index: 0; pointer-events: none; user-select: none; }
.hw-email-magic svg { display: block; width: 100%; height: 100%; }
.hw-email-moon { position: absolute; right: 18px; top: 15px; width: 64px; height: 64px; border-radius: 50%; background: #ffc56e12; border: 1px solid #ffc56e30; box-shadow: 0 0 30px #a66cff22; }
.hw-email-ghost { position: absolute; right: 20px; top: 19px; width: 51px; height: 60px; filter: drop-shadow(0 0 10px #d7b7ff70); animation: hw-email-float 4s ease-in-out infinite; }
.hw-email-envelope { position: absolute; right: 60px; top: 53px; width: 33px; height: 25px; filter: drop-shadow(0 4px 7px #00000040); animation: hw-email-letter 4s ease-in-out infinite; }
.hw-email-pumpkin { position: absolute; left: 80px; top: 27px; width: 42px; height: 42px; filter: drop-shadow(0 0 12px #ff923d45); animation: hw-email-float 5s ease-in-out -2s infinite; }
.hw-email-spark { position: absolute; color: #ffc56e; font-size: 10px; font-style: normal; animation: hw-email-twinkle 3s ease-in-out var(--delay) infinite; }
.hw-brew-ghost { position: absolute; right: 8px; top: 8px; width: 24px; height: 30px; opacity: .5; animation: hw-email-float 4.5s ease-in-out infinite; }
.hw-brew-ghost svg { width: 100%; height: 100%; }
html .hw-chat-box .chat-offline-card { border-color: #ffb66e50; background: linear-gradient(140deg, #ff923d18, #a66cff12); }
html .hw-chat-box.chat-email-sent .hw-brew { flex-basis: 74px; }
html .hw-chat-box.chat-email-sent .hw-brew-scene { height: 70px; width: 118px; }
html .hw-chat-box.chat-email-sent .hw-cauldron-art { width: 85px; height: 69px; }
html .hw-chat-box.chat-email-sent .hw-bottle { width: 18px; height: 32px; }
html .hw-chat-box.chat-email-sent .hw-bubble, html .hw-chat-box.chat-email-sent .hw-steam { bottom: 36px; }
html .hw-chat-box.chat-email-sent .hw-bubble { left: 60px; }
@keyframes hw-email-arrive { from { opacity: 0; transform: translateY(18px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes hw-email-seal { from { transform: scale(.3) rotate(-35deg); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes hw-email-glow { 0%,100% { box-shadow: 0 0 18px #ff923d10, inset 0 1px #ffffff08; } 50% { box-shadow: 0 0 28px #a66cff28, inset 0 1px #ffffff12; } }
@keyframes hw-email-float { 0%,100% { transform: translateY(0) rotate(-5deg); } 50% { transform: translateY(-7px) rotate(5deg); } }
@keyframes hw-email-letter { 0%,100% { transform: translate(0,0) rotate(-12deg); } 50% { transform: translate(-8px,-5px) rotate(5deg); } }
@keyframes hw-email-twinkle { 0%,100% { opacity: .25; transform: scale(.6) rotate(0); } 50% { opacity: .9; transform: scale(1.15) rotate(30deg); } }
html.hw-paused .hw-chat-box :is(.chat-email-confirmation, .chat-email-confirmation-icon, .hw-email-magic *, .hw-brew-ghost),
html.hw-asleep .hw-chat-box :is(.chat-email-confirmation, .chat-email-confirmation-icon, .hw-email-magic *, .hw-brew-ghost) { animation-play-state: paused !important; }
html.hw-paused .hw-chat-box .chat-email-confirmation.show,
html.hw-paused .hw-chat-box .chat-email-confirmation-icon { animation: none !important; }
@media (prefers-reduced-motion: reduce) {
  html .hw-chat-box :is(.chat-email-confirmation.show, .chat-email-confirmation-icon, .hw-email-magic *, .hw-brew-ghost) { animation: none !important; }
  html .hw-chat-box .chat-email-confirmation button { transition: none; }
}

/* Public status and owner information share the haunted frame's palette. */
body.halloween-public-pet .content { justify-content: flex-start; padding: 32px; }
.hw-pet-status {
  --status-color: #8ee8b4; --status-edge: #8ee8b465; --status-tint: #8ee8b411;
  position: relative; isolation: isolate; overflow: hidden; min-width: 0;
  padding: 22px; border: 1px solid var(--status-edge); border-radius: 28px; text-align: center;
  background: radial-gradient(ellipse at 50% 30%, var(--status-tint), transparent 65%), linear-gradient(145deg, #302039, #1a1225);
  box-shadow: inset 0 1px 0 #ffffff10, 0 14px 40px #00000025;
}
.hw-pet-status::before { content: ''; position: absolute; z-index: -1; width: 240px; height: 240px; top: -130px; right: -100px; border-radius: 50%; border: 1px solid #ffc56e30; box-shadow: 0 0 0 20px #ffc56e06, 0 0 0 40px #a66cff06; }
.hw-status-lost { --status-color: #ff9baa; --status-edge: #ff8c9e80; --status-tint: #ff5f781a; }
.hw-status-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hw-status-pill { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 8px 11px; border: 1px solid var(--status-edge); border-radius: 999px; color: var(--status-color); background: var(--status-tint); font: 800 9px/1.4 Arial, sans-serif; letter-spacing: .08em; text-align: left; }
.hw-status-pill i { width: 7px; height: 7px; flex-shrink: 0; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px currentColor; animation: hw-status-beacon 4s ease-in-out infinite; }
.hw-status-brand { display: block; width: 34px; height: 34px; flex: 0 0 34px; object-fit: contain; border-radius: 10px; background: #faf9f5; border: 1px solid #c6a0ff65; }
.hw-status-scene { position: relative; width: 270px; aspect-ratio: 1; max-width: 100%; margin: 10px auto 4px; color: var(--status-color); }
.hw-status-scene svg { display: block; width: 100%; height: 100%; overflow: visible; }
.hw-status-scene > svg:first-child { position: absolute; inset: 0; }
.hw-status-orbit { transform-box: view-box; transform-origin: 50% 50%; animation: hw-status-orbit 24s linear infinite; }
.hw-status-art { position: absolute; inset: 10px; width: calc(100% - 20px); height: calc(100% - 20px); object-fit: contain; filter: drop-shadow(0 10px 15px #140d1c80); animation: hw-status-art-float 5s ease-in-out infinite; }
.hw-status-scene .hw-status-medal { position: absolute; right: 0; bottom: 5px; width: 46px; height: 46px; filter: drop-shadow(0 4px 8px #00000040); }
.hw-status-stars { animation: hw-loader-glow 3s ease-in-out infinite; }
body.halloween-public-pet .hw-pet-status h2 { margin: 8px 0 0; color: #fff5e8; font-size: clamp(25px, 2.5vw, 34px); line-height: 1.18; letter-spacing: -.025em; overflow-wrap: anywhere; }
.hw-status-description { margin: 10px auto 0; max-width: 450px; color: #d8c9e1; font-size: 13px; line-height: 1.7; }
.hw-status-note { display: flex; align-items: center; gap: 11px; margin-top: 20px; padding: 12px 14px; border: 1px solid #c6a0ff30; border-radius: 15px; background: #140d1c70; color: #d8c9e1; font-size: 11px; line-height: 1.65; text-align: left; }
.hw-detail-icon { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; border: 1px solid #ffc56e35; border-radius: 12px; background: linear-gradient(135deg, #ff923d18, #a66cff18); color: #ffd095; }
.hw-detail-icon svg { display: block; width: 20px; height: 20px; }
.hw-status-note .hw-detail-icon { flex-basis: 30px; width: 30px; height: 30px; border-radius: 9px; border-color: #c6a0ff40; color: #d7b7ff; }
.hw-status-note .hw-detail-icon svg { width: 17px; height: 17px; }
body.halloween-public-pet .hw-owner-head { margin: 28px 0 17px; animation: none; }
.hw-owner-heading { display: flex; align-items: center; gap: 12px; }
body.halloween-public-pet .hw-owner-heading span:not(.hw-detail-icon) { display: block; margin-bottom: 5px; color: #ffd095; opacity: 1; font: 800 8px/1.4 Arial, sans-serif; letter-spacing: .15em; }
body.halloween-public-pet .hw-owner-heading h2 { margin: 0; color: #fff5e8; font-size: 23px; line-height: 1.25; }
body.halloween-public-pet .hw-owner-head p { margin-top: 10px; color: #bfaecb; font-size: 12px; line-height: 1.65; }
body.halloween-public-pet .detail-card.hw-pet-detail { display: flex; align-items: center; gap: 14px; padding: 18px; min-width: 0; border-radius: 18px; border-color: #c6a0ff35; background: linear-gradient(125deg, #36213d, #201529); animation: hw-detail-arrive .45s ease-out both; }
.hw-detail-copy { flex: 1; min-width: 0; }
body.halloween-public-pet .hw-detail-copy strong { margin-bottom: 6px; color: #bea7ce; font-size: 9px; line-height: 1.5; letter-spacing: .12em; }
body.halloween-public-pet .hw-detail-copy :is(span, a) { font-size: 17px; color: #fff5e8; overflow-wrap: anywhere; word-break: normal; }
body.halloween-public-pet .hw-detail-copy a { text-decoration: underline; text-decoration-color: #ffc56e70; text-underline-offset: 4px; }
body.halloween-public-pet .hw-pet-detail:hover { transform: translateY(-2px); border-color: #ffc56e80; box-shadow: 0 10px 25px #00000025; }
body.halloween-public-pet .cta:not(:has(a)) { display: none; }
body.halloween-public-pet .cta { gap: 10px; margin-top: 18px; }
body.halloween-public-pet .cta .secondary { background: #a66cff14; border-color: #c6a0ff50; color: #fff0db; }
@keyframes hw-status-orbit { to { transform: rotate(360deg); } }
@keyframes hw-status-art-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes hw-status-beacon { 0%,100% { opacity: .55; } 50% { opacity: 1; } }
@keyframes hw-detail-arrive { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
html.hw-paused :is(.hw-pet-status, .hw-pet-detail) *, html.hw-asleep :is(.hw-pet-status, .hw-pet-detail) *,
html.hw-paused .hw-pet-detail, html.hw-asleep .hw-pet-detail { animation-play-state: paused !important; }
@media (max-width: 600px) {
  body.halloween-public-pet .content { padding: 24px 20px; }
  .hw-pet-status { padding: 18px; border-radius: 23px; }
  .hw-status-scene { width: 230px; margin-top: 12px; }
  .hw-status-pill { font-size: 8px; padding: 7px 9px; letter-spacing: .04em; }
  .hw-status-note { padding: 10px; gap: 9px; font-size: 10px; }
  body.halloween-public-pet .hw-owner-heading h2 { font-size: 21px; }
  body.halloween-public-pet .detail-card.hw-pet-detail { padding: 15px 13px; gap: 11px; }
  body.halloween-public-pet .hw-detail-copy :is(span, a) { font-size: 16px; }
  body.halloween-public-pet .detail-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .hw-pet-status *, body.halloween-public-pet .hw-pet-detail { animation: none !important; }
  body.halloween-public-pet .hw-pet-detail { transition: none; }
}

/* Keep the seasonal theme while reducing mobile paint and hidden-tab work. */
html.hw-asleep .chat-launcher, html.hw-asleep .chat-launcher *,
html.hw-asleep .chat-launcher::before, html.hw-asleep .chat-launcher::after,
html.hw-asleep .chat-box * { animation-play-state:paused!important; }
body[data-halloween-page="index"] .section { content-visibility:auto; contain-intrinsic-size:auto 600px; }
@media (max-width: 768px), (pointer: coarse) {
  body { background-attachment:scroll; }
  .hw-mist { display:none; }
  .hw-flight, .hw-ember { filter:none; }
  .hw-bat-wing { animation:none; }
  .cw-aurora { display:none; }
  .chat-box { backdrop-filter:none!important; -webkit-backdrop-filter:none!important; }
}

/* Keep the artwork, without repainting glass blur and moving scenery on scroll. */
html.hw-scrolling :is(.hw-sky, .hw-season-art, .hw-frame-effects, .hw-countdown) *,
html.hw-scrolling :is(.hw-countdown, .hw-photo-ghost, .hw-chat-launcher) {animation-play-state:paused!important}
html.hw-scrolling :is(.visual-frame,.visual-frame::before,.visual-frame::after,.ticker-track,.slider-track,.hero-video,.grid-lines,.orb,.float-card,.chip-tag){animation-play-state:paused!important}
.hw-offscreen,.hw-offscreen *, .hw-offscreen::before,.hw-offscreen::after{animation-play-state:paused!important}
:is(.nav, .navbar, .topbar, .chat-box, .chat-launcher, .hw-chat-box, .hw-countdown, .hw-motion-toggle){backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#fxCanvas, #cursorGlow {display:none!important}

/* Blur still costs GPU work when animations are paused. Keep solid panels
   and the existing artwork instead of filtering the entire page beneath them. */
html.halloween-active *, html.halloween-active *::before, html.halloween-active *::after {
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html.halloween-active body {background-attachment:scroll!important}
html.halloween-active :is(.orb,.cw-aurora) {display:none!important}
.chat-box:not(.open), .chat-box:not(.open) *,
.chat-box:not(.open)::before,.chat-box:not(.open)::after,
.chat-box:not(.open) *::before,.chat-box:not(.open) *::after {animation-play-state:paused!important}

/* Mascot climbs out through the web, then looks around and breathes. */
html .chat-launcher.hw-chat-launcher { width: 118px; height: 162px; background: none; border: 0; }
html .hw-chat-launcher::before, html .hw-chat-launcher::after { display: none; }
.hw-launcher-web { position: absolute; inset: -8px -5px 24px; pointer-events: none; opacity: .65; z-index: 2; animation: hw-web-open 2.8s cubic-bezier(.22,1,.36,1) both; transform-origin: 50% 35%; }
.hw-launcher-web svg { width: 100%; height: 100%; }
.hw-launcher-pet { position: absolute; inset: 0; pointer-events: none; z-index: 1; transform-origin: 50% 28%; animation: hw-pet-emerge 2.8s cubic-bezier(.22,1,.36,1) both; transition: opacity .2s; }
.hw-pet-alive { position: absolute; inset: 0; transform-origin: 50% 95%; animation: hw-pet-breathe 4.8s 2.8s ease-in-out infinite; }
.hw-pet-facing-left { position: absolute; inset: 0; transform: scaleX(-1); }
.hw-pet-portrait { position: absolute; height: 100%; width: auto; aspect-ratio: 2 / 3; left: 50%; transform: translateX(-50%); }
.hw-launcher-pet .hw-pet-portrait img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
/* Reuse the same tiny asset for the independent ear layers; one network request. */
.hw-pet-body { clip-path: polygon(0 35%, 100% 35%, 100% 38%, 65% 38%, 65% 56%, 100% 56%, 100% 100%, 0 100%); }
.hw-pet-wave { clip-path: polygon(65% 38%, 96% 38%, 96% 56%, 65% 56%); transform-origin: 64% 50%; animation: hw-avee-wave 8s 2s ease-in-out infinite; }
.hw-pet-portrait { transition: rotate .35s ease; }
html .hw-chat-launcher:hover .hw-pet-portrait { rotate: -3deg; }
html .hw-chat-launcher:hover .hw-pet-wave { animation-duration: 4s; }
.hw-pet-ear-left { clip-path: polygon(24% 8%, 43% 8%, 46% 15%, 35% 19%, 28% 22%, 24% 17%); transform-origin: 36% 18%; animation: hw-ear-listen 7.6s 3.1s ease-in-out infinite; }
.hw-pet-ear-right { clip-path: polygon(56% 8%, 76% 8%, 79% 23%, 66% 25%, 63% 18%, 53% 16%); transform-origin: 63% 18%; animation: hw-ear-listen 7.6s 3.4s ease-in-out infinite reverse; }
.hw-pet-face { position: absolute; inset: 0; clip-path: polygon(0 16%, 30% 16%, 39% 12.8%, 58% 12.8%, 72% 16%, 100% 16%, 100% 36%, 0 36%); transform-origin: 48% 34%; animation: hw-avee-face 8s 2.8s ease-in-out infinite; }
.hw-pet-eyes { position: absolute; inset: 0; width: 100%; height: 100%; }
.hw-eye-blink { transform-origin: 123px 96px; animation: hw-avee-blink 5.2s 2.8s ease-in-out infinite; }
.hw-eye-look { animation: hw-avee-look 8s 2.8s ease-in-out infinite; }
@keyframes hw-avee-blink {
  0%,5%,9%,47%,51%,75%,79%,82%,86%,100% { transform: scaleY(1); }
  7%,49%,77%,84% { transform: scaleY(.08); }
}
@keyframes hw-avee-look {
  0%,25%,75%,100% { transform: translateX(0); }
  35%,48% { transform: translateX(-2px); }
  58%,66% { transform: translateX(2px); }
}
.hw-pet-tail { position: absolute; width: 43%; height: 36%; left: 1%; top: 37%; transform-origin: 87.5% 82.5%; animation: hw-tail-flicker 2.6s ease-in-out infinite; }
/* Every silhouette retains the same root point, tucked behind the rear hip. */
.hw-avee-flame { transform-origin: 105px 132px; animation: hw-avee-fire-flow .88s ease-in-out infinite; }
.hw-flame-gold { transform: scale(.77,.85); animation-duration: .94s; animation-delay: -.18s; }
.hw-flame-heart { transform: scale(.46,.6); animation-duration: .79s; animation-delay: -.31s; }
.hw-fire-drop { transform-origin: 48px 29px; opacity: 0; animation: hw-avee-fire-rise .95s linear infinite; }
.hw-fire-drop-two { animation-delay: -.48s; animation-duration: 1.12s; }
html .hw-chat-launcher .cw-ring { display: none; }
html .hw-chat-launcher .hw-chat-label { animation: hw-pet-hello .65s 2.2s cubic-bezier(.22,1,.36,1) both; backdrop-filter: none; min-width: 160px; padding: 13px 16px; gap: 5px; }
html body.chat-widget-open .hw-launcher-pet, html body.chat-widget-open .hw-launcher-web { visibility: hidden; opacity: 0; }
html body.chat-widget-open .hw-chat-launcher { border-radius: 24px; height: 64px; width: 64px; }
html body.chat-widget-open .hw-launcher-pet * { animation-play-state: paused !important; }
html.hw-scrolling .hw-launcher-pet *, html.hw-asleep .hw-launcher-pet *, html.hw-paused .hw-launcher-pet * { animation-play-state: paused !important; }
@keyframes hw-pet-emerge {
  0%,10% { opacity: 0; clip-path: circle(0% at 50% 28%); transform: translateY(-26px) scale(.55); z-index: 1; }
  26% { opacity: 1; clip-path: circle(24% at 50% 28%); transform: translateY(-20px) scale(.65) rotate(-5deg); }
  48% { opacity: 1; clip-path: circle(45% at 50% 28%); transform: translateY(-10px) scale(.85) rotate(3deg); z-index: 1; }
  68% { clip-path: circle(100% at 50% 28%); transform: translateY(3px) scale(1.025) rotate(-1deg); z-index: 3; }
  84% { transform: translateY(-1px) scale(.995); }
  100% { opacity: 1; clip-path: circle(110% at 50% 28%); transform: none; z-index: 3; }
}
@keyframes hw-web-open { 0%,10% { opacity: .9; transform: scale(1); } 38% { opacity: .8; transform: scale(1.1) rotate(-2deg); } 64% { opacity: .4; transform: scale(1.025) rotate(1deg); } 82% { transform: scale(.99); } 100% { opacity: .22; transform: none; } }
@keyframes hw-pet-breathe { 0%,100% { transform: translateY(0) rotate(-.6deg); } 50% { transform: translateY(-2px) rotate(.6deg) scaleY(1.012); } }
@keyframes hw-avee-wave { 0%,28%,100% { transform: rotate(0); } 5%,15%,25% { transform: rotate(-17deg); } 10%,20% { transform: rotate(10deg); } }
@keyframes hw-ear-listen { 0%,36%,58%,100% { transform: rotate(0); } 42% { transform: rotate(-7deg); } 48% { transform: rotate(4deg); } 53% { transform: rotate(-2deg); } }
@keyframes hw-avee-face { 0%,35%,75%,100% { transform: rotate(0); } 45%,58% { transform: rotate(3deg) translateY(-.5px); } 65% { transform: rotate(-1deg); } }
@keyframes hw-pet-hello { from { opacity: 0; translate: 0 8px; scale: .96; } to { opacity: 1; translate: 0 0; scale: 1; } }
@keyframes hw-tail-flicker { 0%,100% { transform: rotate(-2deg) skewY(-1deg); } 30% { transform: rotate(2.5deg) skewY(1deg); } 65% { transform: rotate(-.5deg) skewY(-.5deg); } }
html .hw-chat-label strong { font-size: 14px; color: #fff4e5; }
html .hw-chat-label .hw-avee-chat-cta { margin-top: 2px; color: #ffd18a; font-weight: 700; }
@media (max-width: 600px) { html .chat-launcher.hw-chat-launcher { width: 104px; height: 146px; } }
@media (prefers-reduced-motion: reduce) { html .hw-launcher-pet, html .hw-launcher-pet *, html .hw-launcher-web, html .hw-chat-launcher .hw-chat-label { animation: none !important; transition: none; } }
html.hw-paused .hw-launcher-pet, html.hw-paused .hw-launcher-web, html.hw-paused .hw-chat-launcher .hw-chat-label { animation: none; }

/* Avee's motion is independent of the remembered scenery pause setting. */
html:not(.hw-asleep):not(.hw-avee-paused) .hw-chat-launcher,
html:not(.hw-asleep):not(.hw-avee-paused) .hw-chat-launcher * { animation-play-state: running !important; }
html:not(.hw-asleep):not(.hw-avee-paused) .hw-launcher-pet { animation: hw-pet-emerge 2.8s cubic-bezier(.22,1,.36,1) both; }
html:not(.hw-asleep):not(.hw-avee-paused) .hw-launcher-web { animation: hw-web-open 2.8s cubic-bezier(.22,1,.36,1) both; }
html:not(.hw-asleep):not(.hw-avee-paused) .hw-chat-launcher .hw-chat-label { animation: hw-pet-hello .65s 2.2s cubic-bezier(.22,1,.36,1) both; }
html.hw-avee-paused .hw-chat-launcher * { animation-play-state: paused !important; }
html.hw-avee-paused .hw-launcher-pet, html.hw-avee-paused .hw-launcher-web,
html.hw-avee-paused .hw-chat-launcher .hw-chat-label { animation: none !important; }
.hw-avee-motion-toggle { position: fixed; right: 24px; bottom: 5px; z-index: 9998; min-width: 104px; min-height: 32px; border: 1px solid #b68ed65c; border-radius: 16px; background: #21152eee; color: #e8d4fa; font: 600 10px Arial,sans-serif; cursor: pointer; }
.hw-avee-motion-toggle:focus-visible { outline: 2px solid #ffd18a; outline-offset: 3px; }
html .chat-launcher.hw-chat-launcher { bottom: 40px; }
body.chat-widget-open .hw-avee-motion-toggle { display: none; }
html body.chat-widget-open .hw-chat-launcher { bottom: 24px; }
html body.chat-widget-open .hw-chat-launcher .hw-launcher-pet * { animation-play-state: paused !important; }
@media (max-width: 600px) { .hw-avee-motion-toggle { right: 16px; } }
/* A click on Animate Avee explicitly opts this mascot into motion. */
@media (prefers-reduced-motion: reduce) {
  html.hw-avee-motion .hw-launcher-pet { animation: hw-pet-emerge 2.8s cubic-bezier(.22,1,.36,1) both !important; }
  html.hw-avee-motion .hw-launcher-web { animation: hw-web-open 2.8s ease-out both !important; }
  html.hw-avee-motion .hw-chat-launcher .hw-chat-label { animation: hw-pet-hello .65s 2.2s both !important; }
  html.hw-avee-motion .hw-pet-alive { animation: hw-pet-breathe 4.8s 2.8s ease-in-out infinite !important; }
  html.hw-avee-motion .hw-pet-wave { animation: hw-avee-wave 8s 2s ease-in-out infinite !important; }
  html.hw-avee-motion .hw-pet-face { animation: hw-avee-face 8s 2.8s ease-in-out infinite !important; }
  html.hw-avee-motion .hw-eye-blink { animation: hw-avee-blink 5.2s 2.8s ease-in-out infinite !important; }
  html.hw-avee-motion .hw-eye-look { animation: hw-avee-look 8s 2.8s ease-in-out infinite !important; }
  html.hw-avee-motion .hw-pet-ear-left { animation: hw-ear-listen 7.6s 3.1s ease-in-out infinite !important; }
  html.hw-avee-motion .hw-pet-ear-right { animation: hw-ear-listen 7.6s 3.4s ease-in-out infinite reverse !important; }
  html.hw-avee-motion .hw-pet-tail { animation: hw-tail-flicker 2.6s ease-in-out infinite !important; }
}


@keyframes hw-avee-fire-flow {
  0%,100% { d: path('M105 132C80 144 55 147 35 131C18 117 20 102 29 84C37 69 31 57 30 47C45 51 45 69 48 70C57 57 46 42 43 25C66 45 57 64 64 75C74 93 58 108 64 118C75 129 89 127 105 132Z'); }
  30% { d: path('M105 132C81 141 53 147 34 128C20 115 24 97 32 82C40 68 38 61 35 56C48 60 49 76 51 71C61 57 51 35 54 14C71 36 60 59 67 75C72 90 57 108 65 118C76 128 90 127 105 132Z'); }
  65% { d: path('M105 132C80 145 55 148 36 133C18 120 18 102 28 88C39 72 29 60 28 42C47 50 45 73 49 70C55 55 39 41 41 21C63 36 61 61 64 75C77 94 57 110 64 119C77 130 90 127 105 132Z'); }
}
@keyframes hw-avee-fire-rise { 0% { opacity: 0; transform: translate(0,16px) scale(.7); } 18% { opacity: 1; transform: translate(1px,7px) scale(1); } 65% { opacity: .8; transform: translate(-3px,-7px) scale(.65); } 100% { opacity: 0; transform: translate(2px,-19px) scale(.15); } }
@media (prefers-reduced-motion: reduce) {
  html.hw-avee-motion .hw-avee-flame { animation: hw-avee-fire-flow .88s ease-in-out infinite !important; }
  html.hw-avee-motion .hw-flame-gold { animation: hw-avee-fire-flow .94s -.18s ease-in-out infinite !important; }
  html.hw-avee-motion .hw-flame-heart { animation: hw-avee-fire-flow .79s -.31s ease-in-out infinite !important; }
  html.hw-avee-motion .hw-fire-drop { animation: hw-avee-fire-rise .95s linear infinite !important; }
}