/* halloween.css — generated by tools/halloween-css-port.mjs. DO NOT EDIT BY HAND
   until Phase 1 is signed off; after that this file becomes the source of truth.

   BUILD RULE: do NOT minify, merge, dedupe or reorder declarations in this file.
   Correctness depends on absolute source order (plan §4.2):
     - PART 2 repeats four rules byte-identically from PART 1 purely to outrank
       PART 1's trailing 28px heading rules. Deduping them collapses every
       desktop heading from 60px to 28px.
     - PART 3 wins !important-vs-!important duels against PART 1 by source order
       alone (add-button 24->30px, subscribe form 52->60px).
   Sources: style.css, desktop-pc-reference.css, desktop-pc-fixes.css
   Scope:   every page class is prefixed .hw-* ; header/footer chrome removed (C3);
            fonts come from the theme's Inter + Google CDN (F1-F5);
            images arrive as --hw-img-* custom properties set by Liquid (C1). */


/* ---------- PART 0: registered custom properties (illegal inside @media) ---------- */
@property --hw-wipe-radius{syntax:"<length>";inherits:false;initial-value:60px}
@property --hw-wipe-edge{syntax:"<length>";inherits:false;initial-value:140px}


/* ---------- PART 0b: scoped reset, replaces the deleted Tailwind preflight (§4.5) ---------- */
body:has(.hw-page){background:var(--hw-charcoal);overflow-x:clip}
/* Explicit LTR island: the theme flips <html dir> to rtl for ar/he/fa/ur/ku via
   snippets/direction.liquid, but this page's artwork, torch geometry and every
   hard-coded percentage are baked LTR. Deliberate, not an oversight. */
.hw-page{font-family:var(--hw-font-inter);letter-spacing:0;color:#fff;direction:ltr;text-align:start}
/* These are element-level RESETS lifted out of the deleted Tailwind preflight,
   where they were bare selectors like button{font:inherit} at specificity
   (0,0,1) — deliberately weak, so every authored .class rule outranks them.
   Scoping them as .hw-page button would raise them to (0,1,1) and INVERT
   that: font:inherit then beat .hw-pixel-action{font-size:24px}, and every
   <button> styled by a class silently collapsed to the inherited 16px/400
   while the <span>/<a> variants of the same control stayed correct.
   :where() contributes zero specificity, so these keep the original (0,0,1)
   while still being confined to the page. They still beat theme.css's own
   (0,0,1) element rules on source order, since halloween.css loads later. */
:where(.hw-page) a{color:inherit;text-decoration:none}
:where(.hw-page) :is(button,input){font:inherit;border-radius:0}
:where(.hw-page) :is(h1,h2,h3,h4,h5,h6){font-family:inherit;font-size:inherit;font-weight:inherit;font-style:inherit;letter-spacing:inherit;text-transform:none;overflow-wrap:normal;margin:0}
:where(.hw-page) :is(ul,ol,menu){margin-inline-start:0;padding:0;list-style:none}


/* ---------- PART 5: Shopify section wrappers (§8.5 z-index budget) ---------- */
.hw-section--halloween-hero{position:static}
.hw-section--halloween-rich-text,
.hw-section--halloween-countdown{position:relative;z-index:3;overflow-x:clip}
.hw-section--halloween-scroll-story,
.hw-section--halloween-featured-products,
.hw-section--halloween-spirit-carousel,
.hw-section--halloween-image-banner,
.hw-section--halloween-newsletter{position:relative;z-index:1;overflow-x:clip}


/* ---------- PART 6: reversible hero restore (user-requested) ---------- */
.hw-hero-panel.hw-is-restoring .hw-hero-leaves-left{animation:.82s cubic-bezier(.2,.78,.18,1) reverse both hw-hero-leaves-left-exit}
.hw-hero-panel.hw-is-restoring .hw-hero-leaves-right{animation:.82s cubic-bezier(.2,.78,.18,1) reverse both hw-hero-leaves-right-exit}
.hw-hero-panel.hw-is-restoring .hw-hero-person{animation:1.2s linear reverse both hw-hero-person-left-exit}
.hw-hero-panel.hw-is-restoring .hw-hero-title-stack{animation:.7s linear reverse both hw-hero-title-exit}
@media (max-width:760px){
.hw-hero-panel.hw-is-restoring .hw-hero-person{animation-name:hw-hero-person-mobile-left-exit}
}
@media (prefers-reduced-motion:reduce){
.hw-hero-panel.hw-is-restoring :is(.hw-hero-leaves-left,.hw-hero-leaves-right,.hw-hero-person,.hw-hero-title-stack){animation:none}
}


/* ---------- PART 1: style.css author rules, original order ---------- */
:root{--hw-paper:#fff;--hw-ink:#fff;--hw-charcoal:#070d14;--hw-panel:#121b22;--hw-muted:#b7c1c9;--hw-soft:#6f7a7f;--hw-orange:#f77331;--hw-red:#bd3028;--hw-button-idle:#6b7072}
:where(.hw-page) button{cursor:pointer}
.hw-event-page{background:var(--hw-charcoal);min-height:100vh;position:relative;overflow:clip}
.hw-event-page>:not(.hw-floating-stars){z-index:1;position:relative}
.hw-floating-stars{z-index:3;pointer-events:none;position:fixed;inset:0;overflow:hidden}
.hw-star{will-change:transform, opacity;border-radius:999px;display:block;position:absolute;transform:translate(0)}
.hw-star-glow{background:radial-gradient(circle,#d1fafffa 0 22%,#aceef75c 48%,#aceef700 76%);animation-name:hw-star-glow-drift;animation-timing-function:ease-in-out;animation-iteration-count:infinite;box-shadow:0 0 10px 5px #abf6ff38,0 0 24px 12px #92e8f01c}
.hw-hero-panel{z-index:2;isolation:isolate;background:var(--hw-charcoal);height:max(548px,38.0208vw);min-height:548px;position:relative;overflow:visible}
.hw-hero-bg{z-index:1;object-fit:cover;object-position:center top;opacity:.78;transform-origin:50%;will-change:transform;width:100%;height:100%;position:absolute;inset:0;transform:scale(1)}
.hw-hero-bg-picture{z-index:1;width:100%;height:100%;display:block;position:absolute;inset:0}
.hw-hero-mask-shell{--hw-wipe-radius:125px;--hw-wipe-edge:205px;z-index:1;width:100%;height:100%;position:relative;overflow:hidden}
.hw-hero-banner-frame{position:absolute;inset:0;overflow:hidden}
.hw-hero-mask-shell .hw-section-mask{z-index:10;background:#070d14cc}
.hw-hero-mask-shell.hw-is-locked:not(.hw-is-dissolving) .hw-section-mask{-webkit-mask-image:none;mask-image:none}
.hw-hero-mask-shell .hw-ignite-cursor{z-index:60}
.hw-hero-floating-stars{z-index:48;pointer-events:none;position:absolute;inset:0;overflow:hidden}
.hw-hero-leaves,.hw-hero-person,.hw-hero-title-stack,.hw-hero-entry-add{position:absolute}
.hw-hero-title-clip{z-index:50;pointer-events:none;position:absolute;inset:0;overflow:hidden}
.hw-hero-leaves,.hw-hero-person,.hw-hero-title-stack{pointer-events:none}
.hw-hero-leaves{z-index:42;object-fit:contain;height:108%;top:0}
.hw-hero-leaves-left{object-position:left top;width:37%;left:0}
.hw-hero-leaves-right{object-position:right top;width:35%;right:0}
.hw-hero-person{z-index:45;transform-origin:58% 42%;-webkit-backface-visibility:hidden;backface-visibility:hidden;will-change:transform, opacity, filter;width:20%;height:auto;top:calc(38.5% + 20px);left:21.24%}
.hw-hero-title-stack{z-index:35;width:69.9%;color:var(--hw-orange);text-align:center;text-transform:uppercase;will-change:transform, opacity, filter;top:15.1%;left:50%;transform:translate(-50%)}
.hw-hero-title-stack p{letter-spacing:0;text-shadow:0 0 10px #ff280bbf;width:min(840px,62.5%);margin:0 auto 13px;font-family:var(--hw-font-inter);font-size:1.5625vw;font-weight:500;line-height:36px}
.hw-mobile-title-break,.hw-mobile-reward-break{display:none}
.hw-hero-title-stack :is(h1,.hw-hero-title-line){letter-spacing:-.1em;text-shadow:0 0 15px #ff280bbf;margin:0;font-family:"Silkscreen", var(--hw-font-inter), sans-serif;font-size:10.68vw;font-weight:400;line-height:.82}
.hw-hero-title-stack strong{letter-spacing:0;text-transform:none;text-shadow:0 0 15px #ff280bbf;margin:-9px 0 0;font-family:"Mr Dafoe", cursive;font-size:7.29vw;font-weight:400;line-height:1.2;display:block}
.hw-hero-title-stack span{letter-spacing:-.05em;text-shadow:0 0 10px #ff280bbf;margin-top:-5px;font-family:"Silkscreen", var(--hw-font-inter), sans-serif;font-size:1.0417vw;font-weight:400;line-height:24px;display:block}
.hw-hotspot{border:0;width:30px;height:30px;position:absolute;transform:translate(-50%,-50%)}
.hw-add-button{--hw-plus-bg:var(--hw-button-idle);background:0 0;border:0;flex:none;place-items:center;padding:0;line-height:0;transition:transform .16s;display:inline-grid}
.hw-hotspot.hw-add-button{border-radius:0}
.hw-product-card:hover .hw-add-button{--hw-plus-bg:var(--hw-orange)}
.hw-add-button:hover{--hw-plus-bg:var(--hw-orange);transform:scale(1.06)}
.hw-plus-icon{width:100%;height:100%;display:block}
.hw-plus-icon-bg{fill:var(--hw-plus-bg);transition:fill .16s}
.hw-plus-icon-mark{fill:#071016}
.hw-curse-intro{z-index:50;text-align:center;width:min(1440px,100%);margin:0 auto;padding:98px 0 190px;position:relative}
.hw-curse-intro h1,.hw-product-story h2,.hw-curse-began h2{color:var(--hw-orange);letter-spacing:-.1em;text-transform:uppercase;margin:0;font-family:"Silkscreen", var(--hw-font-inter), sans-serif;font-weight:400;line-height:60px}
.hw-curse-intro h1{font-size:60px}
.hw-curse-intro p{color:#8f9499;margin:28px auto 17px;font-size:20px;font-weight:400;line-height:24px}
.hw-curse-intro strong{color:#fff;font-size:20px;font-weight:400;line-height:24px}
.hw-reward-row-anchor{min-height:100px;margin-top:54px}
.hw-reward-row-anchor.hw-is-docked{visibility:visible}
.hw-reward-row{z-index:1;clip-path:inset(0 -100vmax);background:#070d14;grid-template-columns:1fr auto 1fr;justify-content:stretch;align-items:center;gap:0;width:min(1440px,100%);max-width:1440px;min-height:100px;margin-top:0;margin-left:auto;margin-right:auto;display:grid;position:relative;box-shadow:0 0 0 100vmax #070d14}
.hw-reward-dock{background:0 0;width:100%;height:100px;position:relative}
.hw-reward-dock.hw-is-visible{z-index:100000;opacity:1;isolation:isolate;border:0;width:auto;transform:none;box-shadow:0 8px 24px #00000042;background:#151b21!important;position:fixed!important;inset:0 0 auto!important}
.hw-reward-dock.hw-is-visible:before{z-index:-1;content:"";background:#151b21;width:100vw;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}
.hw-reward-dock.hw-is-visible .hw-reward-row{height:100px;min-height:100px;box-shadow:none;clip-path:none;background:0 0;border:0;padding:0}
.hw-progress-meter{justify-content:flex-start;justify-self:start;align-items:center;gap:20px;display:flex}
.hw-progress-meter.hw-reverse{justify-content:flex-start;justify-self:end}
.hw-meter-rail{align-items:center;width:370px;height:74px;display:flex;position:relative}
.hw-track{border:2px solid var(--hw-orange);background:0 0;border-radius:999px;width:100%;height:21px;position:relative;overflow:hidden}
.hw-track span{border-radius:inherit;background:var(--hw-orange);width:0;height:100%;transition:width .26s;display:block}
.hw-meter-rail img{left:clamp(0px, calc(var(--hw-progress) * 100% - 37px), calc(100% - 74px));object-fit:contain;filter:drop-shadow(0 2px #00000059);width:74px;height:74px;transition:left .26s;position:absolute;top:50%;right:auto;transform:translateY(-50%)}
.hw-progress-meter.hw-reverse .hw-meter-rail img{left:clamp(0px, calc(var(--hw-progress) * 100% - 37px), calc(100% - 74px));right:auto}
.hw-progress-meter.hw-reverse .hw-track span{margin-left:0}
.hw-progress-meter.hw-reverse .hw-meter-rail{order:1}
.hw-progress-meter.hw-reverse strong{order:2}
.hw-progress-meter img{object-fit:contain}
.hw-progress-meter strong{color:var(--hw-orange);font-size:30px;font-weight:700;line-height:1}
.hw-countdown{justify-content:center;justify-self:center;align-items:flex-start;gap:24px;width:100%;min-width:400px;font-family:var(--hw-font-inter);display:flex}
.hw-mobile-reward-countdown{display:none}
.hw-countdown span{color:#8f9499;text-align:center;min-width:86px;font-size:20px;font-weight:400;line-height:24px}
.hw-countdown i{color:#fff;font-size:50px;font-style:normal;font-weight:700;line-height:60px}
.hw-countdown b{color:#fff;font-size:50px;font-weight:700;line-height:60px;display:block}
.hw-product-story{isolation:isolate;grid-template-columns:778px 566px;align-items:center;gap:94px;width:min(1440px,100%);margin:0 auto 190px;display:grid;position:relative}
.hw-workshop-sequence{height:max(1700px,200vh);margin:0 auto 190px;position:relative}
.hw-gallery-sequence{margin-top:190px}
.hw-workshop-sequence-stage{z-index:2;width:100%;height:623px;position:sticky;top:202px}
.hw-workshop-sequence .hw-workshop-slide{opacity:0;pointer-events:none;width:min(1440px,100%);height:623px;margin:0 auto;transition:opacity .42s,transform .68s cubic-bezier(.22,.68,.18,1);position:absolute;inset:0;transform:translateY(92px)}
.hw-workshop-sequence .hw-workshop-slide.hw-is-exiting{transform:translateY(-92px)}
.hw-workshop-sequence .hw-workshop-slide.hw-is-active{z-index:2;opacity:1;pointer-events:auto;transform:translate(0)}
.hw-workshop-sequence .hw-workshop-slide>.hw-story-floating-stars,.hw-workshop-sequence .hw-workshop-slide>.hw-haunt-line{pointer-events:none}
.hw-masked-reveal{--hw-mask-x:50%;--hw-mask-y:50%;--hw-wipe-radius:60px;--hw-wipe-edge:140px;--hw-wipe-softness:40px;position:relative;overflow:visible}
.hw-feature-mask-shell{border-radius:8px;justify-self:center;width:566px;height:623px;overflow:visible}
.hw-feature-mask-shell .hw-section-mask{border-radius:8px;width:auto;height:auto;inset:-52px -42px -64px}
.hw-feature-mask-shell .hw-ignite-cursor{z-index:60}
.hw-workshop-zone .hw-feature-mask-shell{transform:translate(70px)}
.hw-gallery-zone .hw-feature-mask-shell{transform:translate(-68px)}
.hw-tv-mask-shell{width:min(1920px,100vw);height:550px;margin:0 auto}
.hw-section-mask{z-index:20;cursor:none;width:100%;height:100%;-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #00000073 calc(var(--hw-wipe-radius) + var(--hw-wipe-softness)), #000 var(--hw-wipe-edge));-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #00000073 calc(var(--hw-wipe-radius) + var(--hw-wipe-softness)), #000 var(--hw-wipe-edge));-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #00000073 calc(var(--hw-wipe-radius) + var(--hw-wipe-softness)), #000 var(--hw-wipe-edge));-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #00000073 calc(var(--hw-wipe-radius) + var(--hw-wipe-softness)), #000 var(--hw-wipe-edge));mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #00000073 calc(var(--hw-wipe-radius) + var(--hw-wipe-softness)), #000 var(--hw-wipe-edge));background:#070d14cc;border:0;padding:0;display:block;position:absolute;inset:0}
.hw-masked-reveal.hw-is-dissolving .hw-section-mask{pointer-events:none;animation:.76s cubic-bezier(.2,.72,.22,1) forwards hw-mask-bloom}
.hw-feature-mask-shell.hw-is-dissolving .hw-section-mask{animation-duration:2.6s}
.hw-hero-mask-shell.hw-is-dissolving .hw-section-mask{animation:1.12s cubic-bezier(.2,.76,.22,1) forwards hw-hero-mask-bloom}
.hw-hero-mask-shell.hw-is-dissolving .hw-hero-bg{animation:1.1s cubic-bezier(.16,.78,.18,1) .12s forwards hw-hero-scene-push}
.hw-hero-panel.hw-is-dissolving .hw-hero-leaves-left{animation:.82s cubic-bezier(.2,.78,.18,1) forwards hw-hero-leaves-left-exit}
.hw-hero-panel.hw-is-dissolving .hw-hero-leaves-right{animation:.82s cubic-bezier(.2,.78,.18,1) forwards hw-hero-leaves-right-exit}
.hw-hero-panel.hw-is-dissolving .hw-hero-person{-webkit-backface-visibility:hidden;backface-visibility:hidden;transform-style:preserve-3d;will-change:transform, opacity;animation:1.2s linear forwards hw-hero-person-left-exit}
.hw-hero-panel.hw-is-dissolving .hw-hero-title-stack{animation:.7s linear forwards hw-hero-title-exit}
:is(.hw-hero-panel.hw-is-revealed .hw-hero-title-stack,.hw-hero-panel.hw-is-revealed .hw-hero-leaves,.hw-hero-panel.hw-is-revealed .hw-hero-person){opacity:0;visibility:hidden}
.hw-hero-mask-shell.hw-is-revealed .hw-hero-bg{transform:scale(1.1)}
.hw-hero-hotspot-layer{z-index:55;opacity:0;pointer-events:none;transition:opacity .18s;position:absolute;inset:0}
.hw-hero-mask-shell.hw-is-revealed .hw-hero-hotspot-layer{opacity:1;pointer-events:auto}
.hw-hero-hotspot{position:absolute}
.hw-hero-hotspot-area{cursor:pointer;background:0 0;border:0;width:100%;height:100%;padding:0;position:absolute;inset:0}
.hw-hero-hotspot-add{--hw-plus-bg:var(--hw-orange);opacity:0;pointer-events:auto;z-index:2;width:30px;height:30px;transition:opacity .16s,transform .18s cubic-bezier(.2,.78,.18,1);position:absolute;transform:translate(-50%,-50%)scale(.82)}
.hw-hero-hotspot:hover .hw-hero-hotspot-add{--hw-plus-bg:var(--hw-orange);opacity:1;transform:translate(-50%,-50%)scale(1)}
.hw-hero-hotspot .hw-hero-hotspot-add:hover{--hw-plus-bg:var(--hw-orange);opacity:1;transform:translate(-50%,-50%)scale(1.1)}
.hw-masked-reveal.hw-is-dissolving .hw-ignite-cursor{opacity:0;transform:translate(62px,34px)scale(.94)}
.hw-hero-mask-shell.hw-is-dissolving .hw-ignite-cursor{animation:1.12s linear forwards hw-hero-cursor-exit}
.hw-ignite-cursor{left:var(--hw-mask-x);top:var(--hw-mask-y);z-index:30;color:var(--hw-orange);letter-spacing:-.1em;text-transform:uppercase;opacity:0;pointer-events:none;align-items:center;gap:10px;font-family:"Silkscreen", var(--hw-font-inter), sans-serif;font-size:20px;font-weight:400;line-height:24px;transition:opacity .12s;display:flex;position:absolute;transform:translate(62px,34px)}
.hw-ignite-cursor:before{z-index:0;content:"";filter:blur(8px);mix-blend-mode:screen;pointer-events:none;background:radial-gradient(circle,#ff913d57 0,#f7733133 22%,#f7733114 45%,#f7733100 72%);border-radius:50%;width:320px;height:320px;animation:.82s ease-in-out infinite alternate hw-torch-glow-flicker;position:absolute;top:-138px;left:-138px}
.hw-masked-reveal.hw-is-active .hw-ignite-cursor{opacity:1}
.hw-ignite-cursor img{z-index:1;object-fit:contain;filter:drop-shadow(0 0 7px #ff6f24f2);width:96px;height:96px;display:block;position:relative;transform:rotate(-10deg)}
.hw-ignite-cursor b{z-index:1;color:#ff381d;white-space:nowrap;font-weight:400;display:block;position:relative}
.hw-mobile-ignite-break{display:none}
.hw-gallery-zone{grid-template-columns:566px 778px;margin-top:190px}
.hw-story-copy{z-index:2;align-self:end;position:relative}
.hw-product-story .hw-feature-mask-shell{z-index:2;align-self:end}
.hw-feature-mask-shell.hw-is-locked .hw-feature-card img{animation:1.5s ease-in-out infinite hw-feature-product-glow}
.hw-feature-mask-shell.hw-is-dissolving .hw-feature-card img,.hw-feature-mask-shell.hw-is-revealed .hw-feature-card img{filter:none;animation:none}
.hw-story-floating-stars{z-index:4;pointer-events:none;width:min(1440px,100vw);height:100%;position:absolute;top:0;left:50%;overflow:visible;transform:translate(-50%)}
.hw-product-story h2,.hw-curse-began h2{font-size:60px}
.hw-product-story p,.hw-curse-began p,.hw-tv-section p{color:#8f9499;max-width:690px;margin:24px 0 0;font-size:20px;font-weight:400;line-height:24px}
.hw-product-strip{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;display:grid}
.hw-product-strip.hw-compact{grid-template-columns:repeat(3,272px);gap:24px;margin-top:20px}
.hw-compact-product-area{margin-top:29px}
.hw-view-all-link{color:var(--hw-orange);font-family:var(--hw-font-inter);font-size:20px;font-weight:400;line-height:24px;text-decoration:none;display:inline-block}
.hw-product-card{min-width:0}
.hw-product-card.hw-is-placeholder{width:272px}
.hw-product-card img{aspect-ratio:1;object-fit:cover;clip-path:inset(1px);background:0 0;border:0;outline:0;width:100%;display:block}
.hw-product-placeholder{background:#151b21;border-radius:15px;width:272px;height:272px;position:relative;overflow:hidden}
.hw-product-card .hw-product-placeholder-image{aspect-ratio:auto;object-fit:contain;clip-path:none;pointer-events:none;background:0 0;width:auto;max-width:212px;height:auto;max-height:212px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.hw-product-card .hw-product-placeholder-image.hw-is-wide{max-width:226px;max-height:178px}
.hw-product-card h3{color:#fff;text-overflow:ellipsis;white-space:nowrap;min-height:19px;margin:14px 0 5px;font-size:16px;font-weight:400;line-height:19px;overflow:hidden}
.hw-product-card.hw-is-placeholder h3{min-height:19px;margin:20px 0 10px}
.hw-product-card .hw-product-meta{justify-content:space-between;align-items:center;gap:8px;display:flex}
.hw-product-card span{color:#fff;font-size:18px;font-weight:500;line-height:16.09px}
.hw-product-card .hw-add-button{width:30px;height:30px}
.hw-product-placeholder .hw-add-button{position:absolute;bottom:20px;right:20px}
.hw-feature-card{isolation:isolate;background:0 0;flex-direction:column;justify-content:center;justify-self:center;align-items:center;gap:60px;width:566px;height:623px;min-height:623px;padding:0;display:flex;position:relative}
.hw-feature-card img{z-index:1;object-fit:contain;width:auto;height:500px;position:relative}
.hw-feature-card .hw-pixel-action{z-index:1;align-self:center;margin-left:0;position:relative}
.hw-subscribe-band button{background:var(--hw-orange);color:#060b10;border:0;border-radius:11px;min-height:38px;padding:0 30px;font-size:13px;font-weight:900}
.hw-pixel-action{color:#060b10;text-align:center;background-color:#0000;background-image:var(--hw-img-pixel-button);background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border:0;place-items:center;width:271px;height:60px;padding:0 28px;font-size:24px;font-weight:600;line-height:28.8px;text-decoration:none;display:inline-grid}
.hw-view-all-button{margin:60px auto 0;display:grid}
.hw-haunt-line{z-index:0;opacity:.5;pointer-events:none;max-width:none;position:absolute}
.hw-haunt-left{width:auto;height:1500px;top:-134px;left:calc(min(1440px,100vw)/2 - 50vw)}
.hw-haunt-right{width:auto;height:1400px;top:-168px;right:calc(min(1440px,100vw)/2 - 50vw)}
.hw-carousel-row{width:min(1440px,100%);margin:0 auto;position:relative}
.hw-carousel-intro{text-align:center;width:min(820px,100% - 48px);margin:0 auto 46px}
.hw-carousel-intro h2{color:var(--hw-orange);letter-spacing:-.1em;text-transform:none;margin:0;font-family:"Silkscreen", var(--hw-font-inter), sans-serif;font-size:clamp(38px,4.2vw,64px);font-weight:400;line-height:1.14}
.hw-carousel-intro p{color:#92989e;max-width:760px;margin:22px auto 0;font-size:18px;line-height:28px}
.hw-wide-products .hw-product-strip{grid-template-columns:repeat(5,272px);gap:20px}
.hw-carousel-window{perspective:1200px;width:1440px;max-width:100%;margin:0 auto;overflow:hidden}
.hw-carousel-track.hw-product-strip{grid-template-columns:repeat(5,272px);gap:20px}
.hw-arrow{z-index:2;background:0 0;border:0;place-items:center;width:58.56px;height:58.56px;padding:0;line-height:1;transition:transform .18s;display:grid;position:absolute;top:38%}
.hw-arrow img{width:100%;height:100%;display:block}
.hw-arrow:hover{transform:scale(1.06)}
.hw-arrow.hw-prev{left:0}
.hw-arrow.hw-next{right:0}
.hw-curse-began{text-align:center;width:min(1440px,100%);margin:190px auto 0;position:relative}
.hw-curse-began p{margin:18px auto 54px}
.hw-spirit-products{width:min(1440px,100%)}
.hw-spirit-products .hw-carousel-window{perspective:1600px;perspective-origin:50%;width:1440px;max-width:100%;height:450px;overflow:visible}
.hw-spirit-stage{position:relative}
.hw-spirit-products .hw-arrow{top:calc(50% - 29px)}
.hw-spirit-dots{display:none}
.hw-spirit-card{background:var(--hw-panel);text-align:center;transform-origin:50%;width:360px;height:450px;min-height:450px;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;will-change:transform;visibility:visible;border-radius:15px;justify-items:center;padding:30px 30px 26px;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .18s ease-out,filter .18s ease-out;display:grid;position:absolute;top:0;left:0;overflow:visible}
.hw-spirit-card.hw-is-far-left{opacity:0;filter:none;z-index:0;pointer-events:none;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .14s ease-out,filter linear;transform:translate3d(-140px,0,-160px)rotateY(-30deg)scale(.78)}
.hw-spirit-card.hw-is-left{opacity:1;filter:none;z-index:1;transform-origin:50%;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .18s ease-out,filter linear;transform:translate3d(110px,0,-110px)rotateY(-30deg)scale(.78)}
.hw-spirit-card.hw-is-left:hover{transform:translate3d(110px,0,-110px)rotateY(-30deg)scale(.858)}
.hw-spirit-card.hw-is-center{opacity:1;filter:none;z-index:2;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .18s ease-out,filter linear;transform:translate(540px)rotateY(0)}
.hw-spirit-card.hw-is-center:hover{transform:translate(540px)rotateY(0)scale(1.1)}
.hw-spirit-card.hw-is-right{opacity:1;filter:none;z-index:1;transform-origin:50%;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .18s ease-out,filter linear;transform:translate3d(970px,0,-110px)rotateY(30deg)scale(.78)}
.hw-spirit-card.hw-is-right:hover{transform:translate3d(970px,0,-110px)rotateY(30deg)scale(.858)}
.hw-spirit-card:hover .hw-add-button{--hw-plus-bg:var(--hw-orange)}
.hw-spirit-card.hw-is-far-right{opacity:0;filter:none;z-index:0;pointer-events:none;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .14s ease-out,filter linear;transform:translate3d(1220px,0,-160px)rotateY(30deg)scale(.78)}
.hw-spirit-card.hw-is-hidden{opacity:0;visibility:hidden;filter:none;z-index:0;pointer-events:none;transition:none;transform:translate3d(540px,0,-180px)scale(.78)}
.hw-spirit-content{z-index:1;justify-items:center;width:100%;display:grid;position:relative;transform:none}
.hw-spirit-card img{object-fit:contain;width:250px;height:250px}
.hw-spirit-card h3{color:#fff;letter-spacing:-.035em;white-space:nowrap;margin:28px 0 3px;font-size:20px;font-weight:500;line-height:24px}
.hw-spirit-card p{color:#fff;letter-spacing:-.036em;white-space:nowrap;margin:0 0 3px;font-size:16px;font-weight:400;line-height:20px}
.hw-spirit-card small{color:#7e8a91;letter-spacing:-.036em;width:300px;max-width:300px;margin:0;font-size:14px;font-weight:400;line-height:16.8px}
.hw-spirit-card small span{white-space:nowrap;display:block}
.hw-spirit-card .hw-add-button{width:30px;height:30px;position:absolute;top:18px;right:18px}
.hw-tv-section{isolation:isolate;text-align:center;width:min(1920px,100%);margin:190px auto 0;position:relative}
.hw-tv-section .hw-story-floating-stars{width:min(1920px,100vw);height:100%;top:0}
.hw-tv-section p{z-index:2;margin:0 auto 70px;position:relative}
.hw-tv-scene{z-index:2;aspect-ratio:4977/1644;width:min(1920px,100vw);margin:0 auto;position:relative}
.hw-tv-mask-shell .hw-tv-scene{aspect-ratio:auto;width:100%;height:100%}
.hw-tv-scene-image{object-fit:contain;width:100%;height:100%;display:block}
.hw-tv-scene-picture{width:100%;height:100%;display:block}
.hw-tv-word{z-index:2;color:#fff;letter-spacing:-.05em;white-space:nowrap;font-family:var(--hw-font-inter);font-size:20px;font-weight:500;line-height:24px;position:absolute;transform:translate(-50%,-50%)}
.hw-subscribe-band{grid-template-columns:repeat(2,minmax(0,1fr));gap:60px;width:min(1440px,100% - 90px);margin:100px auto 278px;display:grid}
.hw-subscribe-band>div:last-child{text-align:right;flex-direction:column;align-items:flex-end;display:flex}
.hw-subscribe-band h3{color:var(--hw-orange);letter-spacing:-.1em;margin:0 0 18px;font-family:var(--hw-font-inter);font-size:40px;font-weight:400;line-height:50px}
.hw-subscribe-band form{width:499px;max-width:100%;height:60px;display:flex}
.hw-subscribe-band input{color:#0b1115;background-color:#0000;background-image:var(--hw-img-subscribe-input);background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border:0;outline:0;flex:0 0 305px;min-width:0;height:60px;min-height:60px;padding:0 24px}
.hw-subscribe-band form button{color:#060b10;background-color:#0000;background-image:var(--hw-img-subscribe-submit);background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border:0;border-radius:0;width:194px;height:60px;min-height:60px;padding:0 24px;font-size:24px;font-weight:600;line-height:28.8px}
.hw-subscribe-band .hw-share-button{color:#060b10;background-color:#0000;background-image:var(--hw-img-pixel-button);background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border:0;border-radius:0;width:271px;height:60px;min-height:60px;padding:0 24px;font-size:24px;font-weight:600;line-height:28.8px}
@media (max-width:1180px){
.hw-product-story,.hw-gallery-zone{grid-template-columns:1fr;gap:64px;width:min(820px,100% - 44px)}
.hw-workshop-sequence-stage{top:200px}
.hw-feature-card{order:2;width:min(620px,100%)}
.hw-product-strip,.hw-wide-products .hw-product-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
.hw-wide-products .hw-product-card:nth-child(4){display:none}
}
@media (max-width:760px){
.hw-workshop-sequence{height:max(1900px,230vh)}
.hw-workshop-sequence-stage{height:1200px;top:232px}
.hw-workshop-sequence .hw-workshop-slide{height:1200px;min-height:1200px}
.hw-hero-bg{object-position:center top}
.hw-hero-person{width:22.6%;bottom:-20%;left:27%}
.hw-hero-title-stack{width:min(720px,92vw);top:19%}
.hw-hero-title-stack p{width:100%;font-size:17px;line-height:22px}
.hw-hero-title-stack :is(h1,.hw-hero-title-line){font-size:76px;line-height:.88}
.hw-hero-title-stack strong{margin-top:-2px;font-size:56px}
.hw-hero-title-stack span{font-size:13px;line-height:18px}
.hw-hotspot{width:30px;height:30px}
.hw-curse-intro{padding:86px 0 82px}
.hw-curse-intro h1,.hw-product-story h2,.hw-curse-began h2{font-size:36px;line-height:60px}
.hw-curse-intro p,.hw-curse-intro strong,.hw-product-story p,.hw-curse-began p,.hw-tv-section p{font-size:16px;line-height:22px}
.hw-reward-row{min-height:auto;box-shadow:none;clip-path:none;background:0 0;grid-template-columns:max-content max-content;justify-content:center;gap:0 10px;position:static}
.hw-reward-dock{height:auto}
.hw-reward-dock.hw-is-visible .hw-reward-row{grid-template-columns:max-content max-content;justify-content:center;height:100px;min-height:100px}
.hw-progress-meter,.hw-progress-meter.hw-reverse{justify-content:center;gap:7px;min-width:0}
.hw-progress-meter{order:1}
.hw-progress-meter.hw-reverse{order:2}
.hw-meter-rail{width:clamp(118px,32vw,210px);height:38px}
.hw-meter-rail img{width:32px;height:32px;left:clamp(0px, calc(var(--hw-progress) * 100% - 16px), calc(100% - 32px));right:auto}
.hw-track{border-width:2px;height:14px}
.hw-progress-meter strong{font-size:20px}
.hw-countdown{order:3;grid-column:1/-1;gap:11px;min-width:0}
.hw-countdown span{min-width:54px;font-size:14px;line-height:18px}
.hw-countdown b,.hw-countdown i{font-size:48px;line-height:52px}
.hw-reward-row .hw-countdown{display:none}
.hw-mobile-reward-countdown{margin-top:14px;display:flex}
.hw-product-strip,.hw-product-strip.hw-compact,.hw-wide-products .hw-product-strip{grid-template-columns:1fr}
.hw-carousel-row,.hw-spirit-products{width:min(410px,100% - 92px)}
.hw-haunt-left,.hw-haunt-right{opacity:.5}
.hw-feature-card{gap:38px;min-height:560px;padding:58px 34px 48px}
.hw-feature-card img{height:360px}
.hw-pixel-action,.hw-subscribe-band button,.hw-subscribe-band .hw-share-button{width:220px;height:52px;min-height:52px;font-size:20px;line-height:24px}
.hw-tv-section{margin-top:82px}
.hw-tv-section p{margin-bottom:42px}
.hw-tv-scene{width:100%}
.hw-tv-word{font-size:11px;line-height:14px}
.hw-subscribe-band{grid-template-columns:1fr}
.hw-subscribe-band{text-align:left;width:min(430px,100% - 44px);margin:90px auto}
.hw-subscribe-band>div:last-child{text-align:left;align-items:flex-start}
.hw-subscribe-band h3{font-size:30px;line-height:38px}
.hw-subscribe-band form{grid-template-columns:1fr;gap:12px;display:grid}
.hw-event-page{overflow-x:clip}
.hw-hero-panel{height:clamp(510px,142vw,650px);min-height:510px}
.hw-hero-bg{object-position:50% center;opacity:1}
.hw-hero-leaves{opacity:1;height:100%}
.hw-hero-leaves-left{width:54%;left:-12%}
.hw-hero-leaves-right{width:56%;right:-13%}
.hw-hero-person{opacity:1;z-index:90;width:58%;top:auto;bottom:-7%;left:calc(50% - 30px);transform:translate(-50%)}
.hw-hero-title-stack{z-index:80;width:calc(100% - 40px);top:14%}
.hw-hero-title-clip{z-index:80}
.hw-hero-title-stack p{width:100%;margin-bottom:18px;font-size:16px;line-height:22px}
.hw-mobile-title-break,.hw-mobile-reward-break{display:block}
.hw-hero-title-stack :is(h1,.hw-hero-title-line){letter-spacing:-.08em;font-size:clamp(50px,14.5vw,72px);line-height:.9}
.hw-hero-title-stack strong{margin-top:-3px;font-size:clamp(62px,18vw,86px);line-height:1.08}
.hw-hero-title-stack span{margin-top:8px;font-size:12px;line-height:18px}
.hw-hero-floating-stars{opacity:.72}
.hw-hero-mask-shell .hw-section-mask{--hw-wipe-radius:30px;--hw-wipe-edge:70px;--hw-wipe-softness:20px;--hw-wipe-start-radius:30px;--hw-wipe-start-edge:70px;cursor:pointer;touch-action:manipulation;-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #0000007a calc(var(--hw-wipe-radius) + var(--hw-wipe-softness)), #000 var(--hw-wipe-edge));-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #0000007a calc(var(--hw-wipe-radius) + var(--hw-wipe-softness)), #000 var(--hw-wipe-edge));-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #0000007a calc(var(--hw-wipe-radius) + var(--hw-wipe-softness)), #000 var(--hw-wipe-edge));-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #0000007a calc(var(--hw-wipe-radius) + var(--hw-wipe-softness)), #000 var(--hw-wipe-edge));mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #0000007a calc(var(--hw-wipe-radius) + var(--hw-wipe-softness)), #000 var(--hw-wipe-edge));background:#070d1494}
.hw-hero-mask-shell.hw-is-dissolving .hw-section-mask{animation:1.12s cubic-bezier(.2,.76,.22,1) forwards hw-mobile-hero-mask-bloom}
.hw-ignite-cursor{display:none}
.hw-feature-mask-shell .hw-ignite-cursor{opacity:1;gap:2px;display:flex;transform:translate(40px,10px)}
.hw-feature-mask-shell .hw-ignite-cursor:before{width:180px;height:180px;top:-78px;left:-78px}
.hw-feature-mask-shell .hw-ignite-cursor img{width:48px;height:48px}
.hw-feature-mask-shell .hw-ignite-cursor b{text-align:left;white-space:normal;max-width:76px;font-size:14px;line-height:18px;transform:translate(-8px,-8px)}
.hw-feature-mask-shell .hw-mobile-ignite-break{display:inline}
.hw-feature-mask-shell{--hw-wipe-radius:20px;--hw-wipe-edge:30px;--hw-wipe-softness:5px;--hw-wipe-start-radius:20px;--hw-wipe-start-edge:30px}
.hw-hero-hotspot{pointer-events:none;width:100%!important;height:100%!important;inset:0!important}
.hw-hero-hotspot-area{display:none}
.hw-hero-hotspot-add{--hw-plus-bg:var(--hw-orange);opacity:0;width:20px;height:20px;transform:translate(-50%,-50%)scale(.9)}
.hw-hero-hotspot .hw-hero-hotspot-add{top:var(--hw-my-m,50%)!important;left:var(--hw-mx-m,50%)!important}
.hw-hero-mask-shell.hw-is-revealed .hw-hero-hotspot-add{opacity:1;transform:translate(-50%,-50%)scale(1)}
.hw-curse-intro{width:100%;padding:64px 18px 84px}
.hw-curse-intro h1,.hw-product-story h2,.hw-curse-began h2{letter-spacing:-.1em;font-size:clamp(29px,8.2vw,38px);line-height:1.14}
.hw-curse-intro p,.hw-curse-intro strong,.hw-product-story p,.hw-curse-began>p,.hw-tv-section p{font-size:15px;line-height:22px}
.hw-curse-intro p{margin:20px auto 14px}
.hw-curse-intro strong{display:block}
.hw-reward-row-anchor{min-height:0;margin-top:38px}
.hw-reward-row-anchor.hw-is-docked{min-height:78px}
.hw-reward-dock.hw-is-visible{z-index:100000;border:0;width:auto;transform:none;box-shadow:0 8px 24px #00000042;background:#151b21!important;height:auto!important;position:fixed!important;inset:0 0 auto!important}
.hw-reward-dock.hw-is-visible:before{display:block}
.hw-reward-dock.hw-is-visible .hw-reward-row{height:auto;min-height:78px;box-shadow:none;clip-path:none;background:0 0;grid-template-columns:max-content max-content;justify-content:center;gap:0 10px;padding:10px 16px}
.hw-reward-dock.hw-is-visible .hw-progress-meter,.hw-reward-dock.hw-is-visible .hw-progress-meter.hw-reverse{justify-content:center;gap:5px}
.hw-reward-dock.hw-is-visible .hw-meter-rail{width:clamp(118px,32vw,210px);height:32px}
.hw-reward-dock.hw-is-visible .hw-meter-rail img{width:27px;height:27px;left:clamp(0px, calc(var(--hw-progress) * 100% - 13.5px), calc(100% - 27px))}
.hw-reward-dock.hw-is-visible .hw-track{border-width:1px;height:8px}
.hw-reward-dock.hw-is-visible .hw-progress-meter strong{font-size:16px}
.hw-reward-dock.hw-is-visible .hw-reward-row .hw-countdown{display:none}
.hw-workshop-sequence,.hw-gallery-sequence{height:auto;margin:0 auto 96px}
.hw-gallery-sequence{margin-top:88px}
.hw-gallery-zone{margin-top:0}
.hw-workshop-sequence-stage{gap:90px;height:auto;padding:0 18px;display:grid;position:relative;top:auto}
.hw-workshop-sequence .hw-workshop-slide{opacity:1;pointer-events:auto;flex-direction:column;gap:26px;width:100%;height:auto;min-height:0;margin:0;display:flex;position:relative;inset:auto;transform:none}
.hw-workshop-sequence .hw-workshop-slide.hw-is-exiting,.hw-workshop-sequence .hw-workshop-slide.hw-is-entering,.hw-workshop-sequence .hw-workshop-slide.hw-is-active{opacity:1;transform:none}
.hw-story-copy{align-self:stretch;width:100%;display:contents}
.hw-product-story .hw-story-copy>h2{z-index:40;order:1;width:100%;position:relative}
.hw-product-story .hw-story-copy>p{z-index:40;order:2;width:100%;position:relative}
.hw-product-story p{max-width:none;margin-top:18px}
.hw-product-story .hw-feature-mask-shell{border-radius:12px;order:3;align-self:stretch;width:100%;height:clamp(380px,112vw,480px);min-height:0;margin:0;transform:none}
.hw-feature-mask-shell .hw-section-mask{border-radius:12px;inset:0}
.hw-feature-card{border-radius:12px;gap:24px;width:100%;height:100%;min-height:0;padding:20px 14px 26px}
.hw-feature-card img{width:100%;height:clamp(230px,70vw,320px)}
.hw-feature-card .hw-pixel-action{width:min(220px,100%);height:52px;font-size:18px;line-height:24px}
.hw-compact-product-area{order:4;width:100%;margin-top:28px}
.hw-view-all-link{text-align:right;font-size:16px;line-height:20px;display:block}
.hw-carousel-intro{text-align:left;width:100%;margin-bottom:28px}
.hw-carousel-intro h2{letter-spacing:-.1em;font-size:clamp(30px,8.4vw,42px);line-height:1.15}
.hw-carousel-intro p{margin-top:16px;font-size:15px;line-height:22px}
.hw-product-strip,.hw-product-strip.hw-compact,.hw-wide-products .hw-product-strip,.hw-carousel-track.hw-product-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.hw-product-strip.hw-compact{overscroll-behavior-x:contain;scrollbar-width:none;scroll-snap-type:x proximity;touch-action:pan-x;grid-template-columns:none;grid-auto-columns:minmax(42%,1fr);grid-auto-flow:column;gap:16px;margin-top:14px;display:grid;overflow-x:auto}
.hw-product-strip.hw-compact::-webkit-scrollbar{display:none}
.hw-product-strip.hw-compact .hw-product-card{scroll-snap-align:start;width:100%}
.hw-product-card,.hw-product-card.hw-is-placeholder{width:auto}
.hw-product-placeholder{aspect-ratio:1;border-radius:11px;width:100%;height:auto}
.hw-product-card .hw-product-placeholder-image{max-width:76%;max-height:76%}
.hw-product-card .hw-product-placeholder-image.hw-is-wide{max-width:84%;max-height:60%}
.hw-product-card.hw-is-placeholder h3{min-height:18px;margin:12px 0 6px;font-size:13px;font-weight:500;line-height:18px}
.hw-product-card span{font-size:15px;line-height:19px}
.hw-product-placeholder .hw-add-button{width:20px;height:20px;bottom:10px;right:10px}
.hw-carousel-row,.hw-spirit-products{width:calc(100% - 36px);margin-left:auto;margin-right:auto}
.hw-carousel-window{width:100%;max-width:none;overflow:visible}
.hw-carousel-track.hw-product-strip{gap:16px}
.hw-view-all-button{width:220px;height:52px;margin:60px auto 0;font-size:20px}
.hw-haunt-line{display:none}
.hw-curse-began{width:calc(100% - 36px);margin:96px auto 0}
.hw-curse-began>p{margin:18px 0 40px}
.hw-spirit-products .hw-carousel-window{perspective:none;width:100%;height:340px;overflow:visible}
.hw-spirit-products{touch-action:pan-y}
.hw-spirit-products>.hw-arrow{z-index:5;width:44px;height:44px;display:grid;top:calc(50% - 22px)}
.hw-spirit-products .hw-arrow.hw-prev{left:-4px}
.hw-spirit-products .hw-arrow.hw-next{right:-4px}
.hw-spirit-card,.hw-spirit-card.hw-is-left,.hw-spirit-card.hw-is-right,.hw-spirit-card.hw-is-far-left,.hw-spirit-card.hw-is-far-right,.hw-spirit-card.hw-is-hidden,.hw-spirit-card.hw-is-center{opacity:0;border-radius:12px;width:min(270px,100vw - 128px);height:340px;min-height:340px;padding:14px 12px 12px;left:50%;transform:translate(-50%)!important}
.hw-spirit-card.hw-is-left,.hw-spirit-card.hw-is-right{opacity:0;z-index:0;pointer-events:none}
.hw-spirit-card.hw-is-left{transform:translate(calc(-50% - clamp(118px,31vw,135px)))!important}
.hw-spirit-card.hw-is-right{transform:translate(calc(-50% + clamp(118px,31vw,135px)))!important}
.hw-spirit-card.hw-is-center{opacity:1;z-index:3;transform:translate(-50%)!important}
.hw-spirit-card img{width:190px;height:190px;transform:translateY(10px)}
.hw-spirit-card h3{margin:18px 0 2px;font-size:18px;line-height:20px}
.hw-spirit-card p{margin:0 0 5px;font-size:14px;line-height:16px}
.hw-spirit-card small{width:auto;max-width:100%;font-size:12px;line-height:14px}
.hw-spirit-card small span{white-space:normal}
.hw-spirit-card .hw-add-button{width:20px;height:20px;top:14px;right:14px}
.hw-spirit-dots{justify-content:center;align-items:center;gap:8px;margin-top:10px;display:flex}
.hw-spirit-dot{background:#62686c;border-radius:50%;width:6px;height:6px;transition:background-color .18s,transform .18s;display:block}
.hw-spirit-dot.hw-is-active{background:var(--hw-orange);transform:scale(1.15)}
.hw-tv-section{width:calc(100% - 36px);margin:96px auto 0}
.hw-tv-section p{margin:0 auto 36px}
.hw-tv-section p br{display:none}
.hw-tv-scene{aspect-ratio:2464/1885;width:100%}
.hw-subscribe-band{gap:52px;width:calc(100% - 36px);margin:88px auto 150px}
.hw-subscribe-band h3{letter-spacing:-.02em;font-size:28px;line-height:34px}
.hw-subscribe-band form{gap:10px;width:100%;height:auto}
.hw-subscribe-band input,.hw-subscribe-band form button{width:100%;height:52px;min-height:52px}
.hw-subscribe-band input{flex-basis:auto;font-size:16px}
.hw-subscribe-band form button,.hw-subscribe-band .hw-share-button{font-size:18px}
.hw-subscribe-band .hw-share-button{width:220px;height:52px;min-height:52px}
}
@media (max-width:420px){
.hw-hero-panel{height:520px}
.hw-hero-title-stack{top:12%}
.hw-hero-title-stack p{font-size:15px;line-height:21px}
.hw-hero-title-stack :is(h1,.hw-hero-title-line){font-size:48px}
.hw-hero-title-stack strong{font-size:58px}
.hw-hero-title-stack span{font-size:11px}
.hw-meter-rail{width:clamp(108px,31vw,132px);height:36px}
.hw-meter-rail img{width:30px;height:30px;left:clamp(0px, calc(var(--hw-progress) * 100% - 15px), calc(100% - 30px))}
.hw-progress-meter strong{font-size:18px}
.hw-countdown b,.hw-countdown i{font-size:40px;line-height:44px}
.hw-curse-intro,.hw-workshop-sequence-stage{padding-left:16px;padding-right:16px}
.hw-product-story h2,.hw-curse-began h2{font-size:28px}
.hw-product-story p,.hw-curse-began>p,.hw-tv-section p{font-size:14px;line-height:21px}
.hw-carousel-row,.hw-spirit-products,.hw-curse-began,.hw-tv-section,.hw-subscribe-band{width:calc(100% - 32px)}
.hw-product-strip,.hw-product-strip.hw-compact,.hw-wide-products .hw-product-strip,.hw-carousel-track.hw-product-strip{gap:12px}
.hw-product-card.hw-is-placeholder h3{font-size:12px;line-height:17px}
.hw-product-card span{font-size:14px}
.hw-product-card .hw-product-meta>span{transform:translateY(-5px)}
.hw-spirit-card,.hw-spirit-card.hw-is-left,.hw-spirit-card.hw-is-right,.hw-spirit-card.hw-is-far-left,.hw-spirit-card.hw-is-far-right,.hw-spirit-card.hw-is-hidden,.hw-spirit-card.hw-is-center{width:min(294px,100vw - 76px)}
}
.hw-curse-intro h1,.hw-product-story h2,.hw-curse-began h2,.hw-carousel-intro h2,.hw-subscribe-band h3{letter-spacing:-.15em;font-size:28px}
.hw-curse-intro p,.hw-product-story p,.hw-curse-began p,.hw-tv-section p,.hw-carousel-intro p{letter-spacing:-.05em}
.hw-subscribe-band h3{letter-spacing:-.1em}
@media (max-width:760px){
.hw-floating-stars .hw-star:nth-child(2n),.hw-hero-floating-stars .hw-star:nth-child(2n),.hw-story-floating-stars .hw-star:nth-child(2n){display:none}
.hw-curse-intro{margin-top:-80px}
.hw-hero-panel.hw-is-dissolving .hw-hero-person{animation-name:hw-hero-person-mobile-left-exit}
.hw-countdown span{font-size:12px;line-height:16px}
.hw-curse-intro p,.hw-product-story p,.hw-curse-began>p,.hw-carousel-intro p{letter-spacing:-.03em;margin-top:8px;font-size:14px}
.hw-tv-section p{letter-spacing:-.03em;font-size:14px}
.hw-curse-began>p{margin-top:15px;margin-bottom:25px}
.hw-product-story .hw-story-copy{flex-direction:column;gap:0;display:flex}
.hw-product-story p{margin-top:10px}
.hw-subscribe-band h3{letter-spacing:-.03em}
.hw-workshop-zone.hw-workshop-slide{gap:0}
.hw-workshop-zone .hw-story-copy{display:contents}
.hw-workshop-zone .hw-feature-mask-shell{margin-top:26px}
.hw-gallery-zone .hw-story-copy{display:contents}
.hw-gallery-zone.hw-workshop-slide{gap:0}
.hw-gallery-zone .hw-feature-mask-shell{margin-top:26px}
.hw-spirit-products{width:calc(100% + 32px);margin-left:-16px;margin-right:-16px}
.hw-spirit-card.hw-is-left,.hw-spirit-card.hw-is-right{opacity:1;z-index:1;pointer-events:none}
.hw-spirit-card,.hw-spirit-card.hw-is-left,.hw-spirit-card.hw-is-right,.hw-spirit-card.hw-is-center{--hw-spirit-card-width:min(270px, calc(100vw - 128px));width:var(--hw-spirit-card-width)}
.hw-spirit-card.hw-is-left{transform:translateX(calc(-50% - var(--hw-spirit-card-width) - 10px))!important}
.hw-spirit-card.hw-is-right{left:50%;right:auto;transform:translateX(calc(-50% + var(--hw-spirit-card-width) + 10px))!important}
.hw-tv-section p{margin-bottom:18px}
.hw-tv-mask-shell{aspect-ratio:2464/1885;width:100%;height:auto;margin-bottom:-30px;transform:translateY(-30px)}
.hw-tv-mask-shell .hw-section-mask{--hw-wipe-radius:30px;--hw-wipe-edge:70px;--hw-wipe-softness:20px;--hw-wipe-start-radius:30px;--hw-wipe-start-edge:70px}
.hw-tv-mask-shell .hw-ignite-cursor{opacity:1;gap:2px;display:flex;transform:translate(13px,-18px)}
.hw-tv-mask-shell .hw-ignite-cursor:before{width:144px;height:144px;top:-62px;left:-62px}
.hw-tv-mask-shell .hw-ignite-cursor img{width:48px;height:48px}
.hw-tv-mask-shell .hw-ignite-cursor b{text-align:left;white-space:normal;max-width:76px;font-size:14px;line-height:18px;display:block;transform:translate(-8px,-8px)}
.hw-curse-began>p,.hw-tv-section p{width:300px;max-width:calc(100% - 32px);margin-left:auto;margin-right:auto}
.hw-curse-began .hw-spirit-card p{letter-spacing:-.036em;width:auto;max-width:100%;margin:0 0 5px;font-size:14px;line-height:16px}
.hw-subscribe-band form{background-image:var(--hw-img-subscribe-form-mobile);background-position:50%;background-repeat:no-repeat;background-size:100% 100%;align-items:stretch;gap:0;width:min(100% - 20px,376px);height:52px;display:flex}
.hw-subscribe-band input,.hw-subscribe-band form button{box-sizing:border-box;background-color:#0000;background-image:none;border:0;align-self:center;margin:0;padding-top:0;padding-bottom:0;height:52px!important;min-height:52px!important}
.hw-subscribe-band input{flex:auto;width:auto}
.hw-subscribe-band form button{flex:0 0 35.78%;width:35.78%;padding-left:12px;padding-right:12px}
}
@media (max-width:1180px){
.hw-subscribe-band form{align-items:flex-start;height:52px}
.hw-subscribe-band input,.hw-subscribe-band form button{box-sizing:border-box;background-position:0 0;background-size:100% 52px;align-self:flex-start;margin:0;padding-top:0;padding-bottom:0;display:block;height:52px!important;min-height:52px!important;max-height:52px!important}
}
@media (max-width:760px){
.hw-spirit-products{--hw-spirit-card-width:min(270px, calc(100vw - 128px));--hw-spirit-card-gap:24px}
.hw-spirit-products>.hw-arrow.hw-prev{left:calc(50% - var(--hw-spirit-card-width) / 2 - 30px)!important}
.hw-spirit-products>.hw-arrow.hw-next{right:calc(50% - var(--hw-spirit-card-width) / 2 - 30px)!important}
.hw-spirit-card{transform-style:flat;-webkit-backface-visibility:visible;backface-visibility:visible;transition:transform .76s cubic-bezier(.22,1,.36,1),opacity .3s ease-out!important}
.hw-spirit-card.hw-is-left{z-index:1;pointer-events:none;opacity:0!important;transform:translateX(calc(-50% - var(--hw-spirit-card-width) - var(--hw-spirit-card-gap)))!important}
.hw-spirit-card.hw-is-right{z-index:1;pointer-events:none;opacity:0!important;transform:translateX(calc(-50% + var(--hw-spirit-card-width) + var(--hw-spirit-card-gap)))!important}
.hw-spirit-card.hw-is-center{z-index:3;opacity:1!important;transform:translate(-50%)!important}
.hw-spirit-card.hw-is-far-left{z-index:0;pointer-events:none;opacity:0!important;transform:translateX(calc(-50% - var(--hw-spirit-card-width) - var(--hw-spirit-card-width) - var(--hw-spirit-card-gap) - var(--hw-spirit-card-gap)))!important}
.hw-spirit-card.hw-is-far-right{z-index:0;pointer-events:none;opacity:0!important;transform:translateX(calc(-50% + var(--hw-spirit-card-width) + var(--hw-spirit-card-width) + var(--hw-spirit-card-gap) + var(--hw-spirit-card-gap)))!important}
.hw-spirit-card.hw-is-hidden{z-index:0;visibility:hidden;pointer-events:none;opacity:0!important;transition:none!important}
.hw-wide-products .hw-carousel-window{transform:translateY(24px)}
.hw-workshop-zone .hw-feature-mask-shell,.hw-gallery-zone .hw-feature-mask-shell{--hw-wipe-radius:30px;--hw-wipe-edge:70px;--hw-wipe-softness:20px;--hw-wipe-start-radius:30px;--hw-wipe-start-edge:70px;margin-top:-4px}
.hw-workshop-zone .hw-feature-mask-shell .hw-section-mask,.hw-gallery-zone .hw-feature-mask-shell .hw-section-mask{--hw-wipe-radius:30px;--hw-wipe-edge:70px;--hw-wipe-softness:20px;--hw-wipe-start-radius:30px;--hw-wipe-start-edge:70px}
.hw-workshop-zone .hw-compact-product-area,.hw-gallery-zone .hw-compact-product-area{margin-top:-2px}
}
.hw-add-button,.hw-hero-hotspot-add,.hw-product-card .hw-add-button,.hw-product-placeholder .hw-add-button,.hw-spirit-card .hw-add-button{width:24px!important;height:24px!important}
.hw-subscribe-band form{align-items:stretch;display:flex;height:52px!important}
.hw-subscribe-band input,.hw-subscribe-band form button{box-sizing:border-box;-webkit-appearance:none;appearance:none;background-position:0 0;background-size:100% 52px;border:0;align-self:stretch;margin:0;padding-top:0;padding-bottom:0;height:52px!important;min-height:52px!important;max-height:52px!important}

/* ---------- PART 2: desktop-pc-reference.css, gated >=761px ---------- */
@media (min-width: 761px){
:root{--hw-paper:#fff;--hw-ink:#fff;--hw-charcoal:#070d14;--hw-panel:#121b22;--hw-muted:#b7c1c9;--hw-soft:#6f7a7f;--hw-orange:#f77331;--hw-red:#bd3028;--hw-button-idle:#6b7072}
:where(.hw-page) button{cursor:pointer}
.hw-event-page{background:var(--hw-charcoal);min-height:100vh;position:relative;overflow:clip}
.hw-event-page>:not(.hw-floating-stars){z-index:1;position:relative}
.hw-floating-stars{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}
.hw-star{will-change:transform, opacity;border-radius:999px;display:block;position:absolute;transform:translate(0)}
.hw-star-glow{background:radial-gradient(circle,#d1fafffa 0 22%,#aceef75c 48%,#aceef700 76%);animation-name:hw-star-glow-drift;animation-timing-function:ease-in-out;animation-iteration-count:infinite;box-shadow:0 0 10px 5px #abf6ff38,0 0 24px 12px #92e8f01c}
.hw-hero-panel{z-index:2;isolation:isolate;background:var(--hw-charcoal);height:max(548px,38.0208vw);min-height:548px;position:relative;overflow:visible}
.hw-hero-bg{z-index:1;object-fit:cover;object-position:center top;opacity:.78;transform-origin:50%;will-change:transform;width:100%;height:100%;position:absolute;inset:0;transform:scale(1)}
.hw-hero-mask-shell{--hw-wipe-radius:125px;--hw-wipe-edge:205px;z-index:1;width:100%;height:100%;position:relative;overflow:hidden}
.hw-hero-banner-frame{position:absolute;inset:0;overflow:hidden}
.hw-hero-mask-shell .hw-section-mask{z-index:10;background:#070d14cc}
.hw-hero-mask-shell .hw-ignite-cursor{z-index:60}
.hw-hero-floating-stars{z-index:48;pointer-events:none;position:absolute;inset:0;overflow:hidden}
.hw-hero-leaves,.hw-hero-person,.hw-hero-title-stack,.hw-hero-entry-add{position:absolute}
.hw-hero-leaves,.hw-hero-person,.hw-hero-title-stack{pointer-events:none}
.hw-hero-leaves{z-index:42;object-fit:contain;height:108%;top:0}
.hw-hero-leaves-left{object-position:left top;width:37%;left:0}
.hw-hero-leaves-right{object-position:right top;width:35%;right:0}
.hw-hero-person{z-index:45;transform-origin:58% 42%;backface-visibility:hidden;will-change:transform, opacity, filter;width:20%;height:auto;top:calc(38.5% + 20px);left:21.24%}
.hw-hero-title-stack{z-index:35;width:69.9%;color:var(--hw-orange);text-align:center;text-transform:uppercase;will-change:transform, opacity, filter;top:15.1%;left:50%;transform:translate(-50%)}
.hw-hero-title-stack p{letter-spacing:0;text-shadow:0 0 10px #ff280bbf;width:min(840px,62.5%);margin:0 auto 13px;font-family:var(--hw-font-inter);font-size:1.5625vw;font-weight:500;line-height:36px}
.hw-hero-title-stack :is(h1,.hw-hero-title-line){letter-spacing:-.1em;text-shadow:0 0 15px #ff280bbf;margin:0;font-family:"Silkscreen", var(--hw-font-inter), sans-serif;font-size:10.68vw;font-weight:400;line-height:.82}
.hw-hero-title-stack strong{letter-spacing:0;text-transform:none;text-shadow:0 0 15px #ff280bbf;margin:-9px 0 0;font-family:"Mr Dafoe", cursive;font-size:7.29vw;font-weight:400;line-height:1.2;display:block}
.hw-hero-title-stack span{letter-spacing:-.05em;text-shadow:0 0 10px #ff280bbf;margin-top:-5px;font-family:"Silkscreen", var(--hw-font-inter), sans-serif;font-size:1.0417vw;font-weight:400;line-height:24px;display:block}
.hw-hotspot{border:0;width:30px;height:30px;position:absolute;transform:translate(-50%,-50%)}
.hw-add-button{--hw-plus-bg:var(--hw-button-idle);background:0 0;border:0;flex:none;place-items:center;padding:0;line-height:0;transition:transform .16s;display:inline-grid}
.hw-hotspot.hw-add-button{border-radius:0}
.hw-product-card:hover .hw-add-button{--hw-plus-bg:var(--hw-orange)}
.hw-add-button:hover{--hw-plus-bg:var(--hw-orange);transform:scale(1.06)}
.hw-plus-icon{width:100%;height:100%;display:block}
.hw-plus-icon-bg{fill:var(--hw-plus-bg);transition:fill .16s}
.hw-plus-icon-mark{fill:#071016}
.hw-curse-intro{z-index:50;text-align:center;width:min(1440px,100%);margin:0 auto;padding:98px 0 190px;position:relative}
.hw-curse-intro h1,.hw-product-story h2,.hw-curse-began h2{color:var(--hw-orange);letter-spacing:-.1em;text-transform:uppercase;margin:0;font-family:"Silkscreen", var(--hw-font-inter), sans-serif;font-weight:400;line-height:60px}
.hw-curse-intro h1{font-size:60px}
.hw-curse-intro p{color:#8f9499;margin:28px auto 17px;font-size:20px;font-weight:400;line-height:24px}
.hw-curse-intro strong{color:#fff;font-size:20px;font-weight:400;line-height:24px}
.hw-reward-row-anchor{min-height:100px;margin-top:54px}
.hw-reward-row-anchor.hw-is-docked{visibility:visible}
.hw-reward-row{z-index:1;clip-path:inset(0 -100vmax);background:#070d14;grid-template-columns:1fr auto 1fr;justify-content:stretch;align-items:center;gap:0;width:min(1440px,100%);max-width:1440px;min-height:100px;margin-top:0;margin-left:auto;margin-right:auto;display:grid;position:relative;box-shadow:0 0 0 100vmax #070d14}
.hw-reward-dock{background:0 0;width:100%;height:100px;position:relative}
.hw-reward-dock.hw-is-visible{z-index:100000;opacity:1;isolation:isolate;border:0;width:auto;transform:none;box-shadow:0 8px 24px #00000042;background:#151b21!important;position:fixed!important;inset:0 0 auto!important}
.hw-reward-dock.hw-is-visible:before{z-index:-1;content:"";background:#151b21;width:100vw;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}
.hw-reward-dock.hw-is-visible .hw-reward-row{height:100px;min-height:100px;box-shadow:none;clip-path:none;background:0 0;border:0;padding:0}
.hw-progress-meter{justify-content:flex-start;justify-self:start;align-items:center;gap:20px;display:flex}
.hw-progress-meter.hw-reverse{justify-content:flex-start;justify-self:end}
.hw-meter-rail{align-items:center;width:370px;height:74px;display:flex;position:relative}
.hw-track{border:2px solid var(--hw-orange);background:0 0;border-radius:999px;width:100%;height:21px;position:relative;overflow:hidden}
.hw-track span{border-radius:inherit;background:var(--hw-orange);width:0;height:100%;transition:width .26s;display:block}
.hw-meter-rail img{left:clamp(0px, calc(var(--hw-progress) * 100% - 37px), calc(100% - 74px));object-fit:contain;filter:drop-shadow(0 2px #00000059);width:74px;height:74px;transition:left .26s;position:absolute;top:50%;right:auto;transform:translateY(-50%)}
.hw-progress-meter.hw-reverse .hw-meter-rail img{left:clamp(0px, calc(var(--hw-progress) * 100% - 37px), calc(100% - 74px));right:auto}
.hw-progress-meter.hw-reverse .hw-track span{margin-left:0}
.hw-progress-meter.hw-reverse .hw-meter-rail{order:1}
.hw-progress-meter.hw-reverse strong{order:2}
.hw-progress-meter img{object-fit:contain}
.hw-progress-meter strong{color:var(--hw-orange);font-size:30px;font-weight:700;line-height:1}
.hw-countdown{justify-content:center;justify-self:center;align-items:center;gap:24px;width:100%;min-width:400px;font-family:var(--hw-font-inter);display:flex}
.hw-countdown span{color:#8f9499;text-align:center;min-width:86px;font-size:20px;font-weight:400;line-height:24px}
.hw-countdown i{color:#fff;font-size:50px;font-style:normal;font-weight:700;line-height:60px}
.hw-countdown b{color:#fff;font-size:50px;font-weight:700;line-height:60px;display:block}
.hw-product-story{isolation:isolate;grid-template-columns:778px 566px;align-items:center;gap:94px;width:min(1440px,100%);margin:0 auto 190px;display:grid;position:relative}
.hw-workshop-sequence{height:max(1700px,200vh);margin:0 auto 190px;position:relative}
.hw-gallery-sequence{margin-top:190px}
.hw-workshop-sequence-stage{z-index:2;width:100%;height:623px;position:sticky;top:202px}
.hw-workshop-sequence .hw-workshop-slide{opacity:0;pointer-events:none;width:min(1440px,100%);height:623px;margin:0 auto;transition:opacity .42s,transform .68s cubic-bezier(.22,.68,.18,1);position:absolute;inset:0;transform:translateY(92px)}
.hw-workshop-sequence .hw-workshop-slide.hw-is-exiting{transform:translateY(-92px)}
.hw-workshop-sequence .hw-workshop-slide.hw-is-active{z-index:2;opacity:1;pointer-events:auto;transform:translate(0)}
.hw-workshop-sequence .hw-workshop-slide>.hw-story-floating-stars,.hw-workshop-sequence .hw-workshop-slide>.hw-haunt-line{pointer-events:none}
.hw-masked-reveal{--hw-mask-x:50%;--hw-mask-y:50%;--hw-wipe-radius:60px;--hw-wipe-edge:140px;position:relative;overflow:visible}
.hw-feature-mask-shell{border-radius:8px;justify-self:center;width:566px;height:623px;overflow:visible}
.hw-feature-mask-shell .hw-section-mask{border-radius:8px;width:auto;height:auto;inset:-52px -42px -64px}
.hw-feature-mask-shell .hw-ignite-cursor{z-index:60}
.hw-workshop-zone .hw-feature-mask-shell{transform:translate(70px)}
.hw-gallery-zone .hw-feature-mask-shell{transform:translate(-68px)}
.hw-tv-mask-shell{width:min(1920px,100vw);height:550px;margin:0 auto}
.hw-section-mask{z-index:20;cursor:none;width:100%;height:100%;-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #00000073 calc(var(--hw-wipe-radius) + 40px), #000 var(--hw-wipe-edge));-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #00000073 calc(var(--hw-wipe-radius) + 40px), #000 var(--hw-wipe-edge));-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #00000073 calc(var(--hw-wipe-radius) + 40px), #000 var(--hw-wipe-edge));-webkit-mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #00000073 calc(var(--hw-wipe-radius) + 40px), #000 var(--hw-wipe-edge));mask-image:radial-gradient(circle at var(--hw-mask-x) var(--hw-mask-y), transparent 0 var(--hw-wipe-radius), #00000073 calc(var(--hw-wipe-radius) + 40px), #000 var(--hw-wipe-edge));background:#070d14cc;border:0;padding:0;display:block;position:absolute;inset:0}
.hw-masked-reveal.hw-is-dissolving .hw-section-mask{pointer-events:none;animation:.76s cubic-bezier(.2,.72,.22,1) forwards hw-mask-bloom}
.hw-feature-mask-shell.hw-is-dissolving .hw-section-mask{animation-duration:1.5s}
.hw-hero-mask-shell.hw-is-dissolving .hw-section-mask{animation:1.12s cubic-bezier(.2,.76,.22,1) forwards hw-hero-mask-bloom}
.hw-hero-mask-shell.hw-is-dissolving .hw-hero-bg{animation:1.1s cubic-bezier(.16,.78,.18,1) .12s forwards hw-hero-scene-push}
.hw-hero-panel.hw-is-dissolving .hw-hero-leaves-left{animation:.82s cubic-bezier(.2,.78,.18,1) forwards hw-hero-leaves-left-exit}
.hw-hero-panel.hw-is-dissolving .hw-hero-leaves-right{animation:.82s cubic-bezier(.2,.78,.18,1) forwards hw-hero-leaves-right-exit}
.hw-hero-panel.hw-is-dissolving .hw-hero-person{backface-visibility:hidden;transform-style:preserve-3d;will-change:transform, opacity;animation:1.2s linear forwards hw-hero-person-left-exit}
.hw-hero-mask-shell.hw-is-dissolving .hw-hero-title-stack{animation:.7s linear forwards hw-hero-title-exit}
.hw-hero-mask-shell.hw-is-revealed .hw-hero-title-stack{opacity:0;visibility:hidden}
.hw-hero-panel.hw-is-revealed .hw-hero-leaves{opacity:0;visibility:hidden}
.hw-hero-panel.hw-is-revealed .hw-hero-person{opacity:0;visibility:hidden}
.hw-hero-mask-shell.hw-is-revealed .hw-hero-bg{transform:scale(1.1)}
.hw-hero-hotspot-layer{z-index:55;opacity:0;pointer-events:none;transition:opacity .18s;position:absolute;inset:0}
.hw-hero-mask-shell.hw-is-revealed .hw-hero-hotspot-layer{opacity:1;pointer-events:auto}
.hw-hero-hotspot{position:absolute}
.hw-hero-hotspot-area{cursor:pointer;background:0 0;border:0;width:100%;height:100%;padding:0;position:absolute;inset:0}
.hw-hero-hotspot-add{--hw-plus-bg:var(--hw-orange);opacity:0;pointer-events:auto;z-index:2;width:30px;height:30px;transition:opacity .16s,transform .18s cubic-bezier(.2,.78,.18,1);position:absolute;transform:translate(-50%,-50%)scale(.82)}
.hw-hero-hotspot:hover .hw-hero-hotspot-add{--hw-plus-bg:var(--hw-orange);opacity:1;transform:translate(-50%,-50%)scale(1)}
.hw-hero-hotspot .hw-hero-hotspot-add:hover{--hw-plus-bg:var(--hw-orange);opacity:1;transform:translate(-50%,-50%)scale(1.1)}
.hw-masked-reveal.hw-is-dissolving .hw-ignite-cursor{opacity:0;transform:translate(62px,34px)scale(.94)}
.hw-hero-mask-shell.hw-is-dissolving .hw-ignite-cursor{animation:1.12s linear forwards hw-hero-cursor-exit}
.hw-ignite-cursor{left:var(--hw-mask-x);top:var(--hw-mask-y);z-index:30;color:var(--hw-orange);letter-spacing:-.1em;text-transform:uppercase;opacity:0;pointer-events:none;align-items:center;gap:10px;font-family:"Silkscreen", var(--hw-font-inter), sans-serif;font-size:20px;font-weight:400;line-height:24px;transition:opacity .12s;display:flex;position:absolute;transform:translate(62px,34px)}
.hw-ignite-cursor:before{z-index:0;content:"";filter:blur(8px);mix-blend-mode:screen;pointer-events:none;background:radial-gradient(circle,#ff913d57 0,#f7733133 22%,#f7733114 45%,#f7733100 72%);border-radius:50%;width:320px;height:320px;animation:.82s ease-in-out infinite alternate hw-torch-glow-flicker;position:absolute;top:-138px;left:-138px}
.hw-masked-reveal.hw-is-active .hw-ignite-cursor{opacity:1}
.hw-ignite-cursor img{z-index:1;object-fit:contain;filter:drop-shadow(0 0 7px #ff6f24f2);width:96px;height:96px;display:block;position:relative;transform:rotate(-10deg)}
.hw-ignite-cursor b{z-index:1;color:#ff381d;white-space:nowrap;font-weight:400;display:block;position:relative}
.hw-gallery-zone{grid-template-columns:566px 778px;margin-top:190px}
.hw-story-copy{z-index:2;align-self:end;position:relative}
.hw-product-story .hw-feature-mask-shell{z-index:2;align-self:end}
.hw-feature-mask-shell.hw-is-locked .hw-feature-card img{animation:1.5s ease-in-out infinite hw-feature-product-glow}
.hw-feature-mask-shell.hw-is-dissolving .hw-feature-card img,.hw-feature-mask-shell.hw-is-revealed .hw-feature-card img{filter:none;animation:none}
.hw-story-floating-stars{z-index:4;pointer-events:none;width:min(1440px,100vw);height:100%;position:absolute;top:0;left:50%;overflow:visible;transform:translate(-50%)}
.hw-product-story h2,.hw-curse-began h2{font-size:60px}
.hw-product-story p,.hw-curse-began p,.hw-tv-section p{color:#8f9499;max-width:690px;margin:24px 0 0;font-size:20px;font-weight:400;line-height:24px}
.hw-product-strip{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;display:grid}
.hw-product-strip.hw-compact{grid-template-columns:repeat(3,272px);gap:24px;margin-top:20px}
.hw-compact-product-area{margin-top:29px}
.hw-view-all-link{color:var(--hw-orange);font-family:var(--hw-font-inter);font-size:20px;font-weight:400;line-height:24px;text-decoration:none;display:inline-block}
.hw-product-card{min-width:0}
.hw-product-card.hw-is-placeholder{width:272px}
.hw-product-card img{aspect-ratio:1;object-fit:cover;clip-path:inset(1px);background:0 0;border:0;outline:0;width:100%;display:block}
.hw-product-placeholder{background:#151b21;border-radius:15px;width:272px;height:272px;position:relative;overflow:hidden}
.hw-product-card .hw-product-placeholder-image{aspect-ratio:auto;object-fit:contain;clip-path:none;pointer-events:none;background:0 0;width:auto;max-width:212px;height:auto;max-height:212px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.hw-product-card .hw-product-placeholder-image.hw-is-wide{max-width:226px;max-height:178px}
.hw-product-card h3{color:#fff;min-height:38px;margin:14px 0 5px;font-size:16px;font-weight:400;line-height:19px}
.hw-product-card.hw-is-placeholder h3{min-height:0;margin:20px 0 10px}
.hw-product-card .hw-product-meta{justify-content:space-between;align-items:center;gap:8px;display:flex}
.hw-product-card span{color:#fff;font-size:18px;font-weight:500;line-height:16.09px}
.hw-product-card .hw-add-button{width:30px;height:30px}
.hw-product-placeholder .hw-add-button{position:absolute;bottom:20px;right:20px}
.hw-feature-card{isolation:isolate;background:0 0;flex-direction:column;justify-content:center;justify-self:center;align-items:center;gap:60px;width:566px;height:623px;min-height:623px;padding:0;display:flex;position:relative}
.hw-feature-card img{z-index:1;object-fit:contain;width:auto;height:500px;position:relative}
.hw-feature-card .hw-pixel-action{z-index:1;align-self:center;margin-left:0;position:relative}
.hw-subscribe-band button{background:var(--hw-orange);color:#060b10;border:0;border-radius:11px;min-height:38px;padding:0 30px;font-size:13px;font-weight:900}
.hw-pixel-action{color:#060b10;text-align:center;background-color:#0000;background-image:var(--hw-img-pixel-button);background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border:0;place-items:center;width:271px;height:60px;padding:0 28px;font-size:24px;font-weight:600;line-height:28.8px;text-decoration:none;display:inline-grid}
.hw-view-all-button{margin:60px auto 0;display:grid}
.hw-haunt-line{z-index:0;opacity:.5;pointer-events:none;max-width:none;position:absolute}
.hw-haunt-left{width:auto;height:1500px;top:-134px;left:calc(min(1440px,100vw)/2 - 50vw)}
.hw-haunt-right{width:auto;height:1400px;top:-168px;right:calc(min(1440px,100vw)/2 - 50vw)}
.hw-carousel-row{width:min(1440px,100%);margin:0 auto;position:relative}
.hw-wide-products .hw-product-strip{grid-template-columns:repeat(5,272px);gap:20px}
.hw-carousel-window{perspective:1200px;width:1440px;max-width:100%;margin:0 auto;overflow:hidden}
.hw-carousel-track.hw-product-strip{grid-template-columns:repeat(5,272px);gap:20px}
.hw-arrow{z-index:2;background:0 0;border:0;place-items:center;width:58.56px;height:58.56px;padding:0;line-height:1;transition:transform .18s;display:grid;position:absolute;top:38%}
.hw-arrow img{width:100%;height:100%;display:block}
.hw-arrow:hover{transform:scale(1.06)}
.hw-arrow.hw-prev{left:0}
.hw-arrow.hw-next{right:0}
.hw-curse-began{text-align:center;width:min(1440px,100%);margin:190px auto 0;position:relative}
.hw-curse-began p{margin:18px auto 54px}
.hw-spirit-products{width:min(1440px,100%)}
.hw-spirit-products .hw-carousel-window{perspective:1600px;perspective-origin:50%;width:1440px;max-width:100%;height:450px;overflow:visible}
.hw-spirit-stage{position:relative}
.hw-spirit-products .hw-arrow{top:calc(50% - 29px)}
.hw-spirit-card{background:var(--hw-panel);text-align:center;transform-origin:50%;width:360px;height:450px;min-height:450px;transform-style:preserve-3d;backface-visibility:hidden;will-change:transform;visibility:visible;border-radius:15px;justify-items:center;padding:30px 30px 26px;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .18s ease-out,filter .18s ease-out;display:grid;position:absolute;top:0;left:0;overflow:visible}
.hw-spirit-card.hw-is-far-left{opacity:0;filter:none;z-index:0;pointer-events:none;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .14s ease-out,filter linear;transform:translate3d(-140px,0,-160px)rotateY(-30deg)scale(.78)}
.hw-spirit-card.hw-is-left{opacity:1;filter:none;z-index:1;transform-origin:50%;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .18s ease-out,filter linear;transform:translate3d(110px,0,-110px)rotateY(-30deg)scale(.78)}
.hw-spirit-card.hw-is-left:hover{transform:translate3d(110px,0,-110px)rotateY(-30deg)scale(.858)}
.hw-spirit-card.hw-is-center{opacity:1;filter:none;z-index:2;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .18s ease-out,filter linear;transform:translate(540px)rotateY(0)}
.hw-spirit-card.hw-is-center:hover{transform:translate(540px)rotateY(0)scale(1.1)}
.hw-spirit-card.hw-is-right{opacity:1;filter:none;z-index:1;transform-origin:50%;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .18s ease-out,filter linear;transform:translate3d(970px,0,-110px)rotateY(30deg)scale(.78)}
.hw-spirit-card.hw-is-right:hover{transform:translate3d(970px,0,-110px)rotateY(30deg)scale(.858)}
.hw-spirit-card:hover .hw-add-button{--hw-plus-bg:var(--hw-orange)}
.hw-spirit-card.hw-is-far-right{opacity:0;filter:none;z-index:0;pointer-events:none;transition:transform .62s cubic-bezier(.22,1,.36,1),opacity .14s ease-out,filter linear;transform:translate3d(1220px,0,-160px)rotateY(30deg)scale(.78)}
.hw-spirit-card.hw-is-hidden{opacity:0;visibility:hidden;filter:none;z-index:0;pointer-events:none;transition:none;transform:translate3d(540px,0,-180px)scale(.78)}
.hw-spirit-content{z-index:1;justify-items:center;width:100%;display:grid;position:relative;transform:none}
.hw-spirit-card img{object-fit:contain;width:250px;height:250px}
.hw-spirit-card h3{color:#fff;letter-spacing:-.035em;white-space:nowrap;margin:28px 0 3px;font-size:20px;font-weight:500;line-height:24px}
.hw-spirit-card p{color:#fff;letter-spacing:-.036em;white-space:nowrap;margin:0 0 3px;font-size:16px;font-weight:400;line-height:20px}
.hw-spirit-card small{color:#7e8a91;letter-spacing:-.036em;width:300px;max-width:300px;margin:0;font-size:14px;font-weight:400;line-height:16.8px}
.hw-spirit-card small span{white-space:nowrap;display:block}
.hw-spirit-card .hw-add-button{width:30px;height:30px;position:absolute;top:18px;right:18px}
.hw-tv-section{isolation:isolate;text-align:center;width:min(1920px,100%);margin:190px auto 0;position:relative}
.hw-tv-section .hw-story-floating-stars{width:min(1920px,100vw);height:100%;top:0}
.hw-tv-section p{z-index:2;margin:0 auto 70px;position:relative}
.hw-tv-scene{z-index:2;aspect-ratio:4977/1644;width:min(1920px,100vw);margin:0 auto;position:relative}
.hw-tv-mask-shell .hw-tv-scene{aspect-ratio:auto;width:100%;height:100%}
.hw-tv-scene-image{object-fit:contain;width:100%;height:100%;display:block}
.hw-tv-word{z-index:2;color:#fff;letter-spacing:-.05em;white-space:nowrap;font-family:var(--hw-font-inter);font-size:20px;font-weight:500;line-height:24px;position:absolute;transform:translate(-50%,-50%)}
.hw-subscribe-band{grid-template-columns:repeat(2,minmax(0,1fr));gap:60px;width:min(1440px,100% - 90px);margin:100px auto 278px;display:grid}
.hw-subscribe-band>div:last-child{text-align:right;flex-direction:column;align-items:flex-end;display:flex}
.hw-subscribe-band h3{color:var(--hw-orange);letter-spacing:-.025em;margin:0 0 18px;font-family:var(--hw-font-inter);font-size:40px;font-weight:400;line-height:50px}
.hw-subscribe-band form{width:499px;max-width:100%;height:60px;display:flex}
.hw-subscribe-band input{color:#0b1115;background-color:#0000;background-image:var(--hw-img-subscribe-input);background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border:0;outline:0;flex:0 0 305px;min-width:0;height:60px;min-height:60px;padding:0 24px}
.hw-subscribe-band form button{color:#060b10;background-color:#0000;background-image:var(--hw-img-subscribe-submit);background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border:0;border-radius:0;width:194px;height:60px;min-height:60px;padding:0 24px;font-size:24px;font-weight:600;line-height:28.8px}
.hw-subscribe-band .hw-share-button{color:#060b10;background-color:#0000;background-image:var(--hw-img-pixel-button);background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border:0;border-radius:0;width:271px;height:60px;min-height:60px;padding:0 24px;font-size:24px;font-weight:600;line-height:28.8px}
@media (max-width:1180px){
.hw-product-story,.hw-gallery-zone{grid-template-columns:1fr;gap:64px;width:min(820px,100% - 44px)}
.hw-workshop-sequence-stage{top:200px}
.hw-feature-card{order:2;width:min(620px,100%)}
.hw-product-strip,.hw-wide-products .hw-product-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
.hw-wide-products .hw-product-card:nth-child(4){display:none}
}
}

/* ---------- PART 3: desktop-pc-fixes.css, gated >=761px, AFTER part 2 ---------- */
@media (min-width: 761px){
.hw-add-button,.hw-hero-hotspot-add,.hw-product-card .hw-add-button,.hw-product-placeholder .hw-add-button,.hw-spirit-card .hw-add-button{width: 30px !important;
  height: 30px !important;}
.hw-mobile-reward-countdown{display: none !important;}
.hw-hero-mask-shell{z-index: auto;}
.hw-hero-title-clip{z-index: 50;}
.hw-hero-person{z-index: 55;}
.hw-hero-mask-shell.hw-is-locked:not(.hw-is-dissolving) .hw-section-mask{-webkit-mask-image: radial-gradient(
    circle at var(--hw-mask-x) var(--hw-mask-y),
    transparent 0 125px,
    rgba(0, 0, 0, 0.45) 165px,
    #000 205px
  );
  mask-image: radial-gradient(
    circle at var(--hw-mask-x) var(--hw-mask-y),
    transparent 0 125px,
    rgba(0, 0, 0, 0.45) 165px,
    #000 205px
  );}
.hw-feature-mask-shell .hw-section-mask{--hw-wipe-radius: 60px;
  --hw-wipe-edge: 140px;
  -webkit-mask-image: radial-gradient(
    circle at var(--hw-mask-x) var(--hw-mask-y),
    transparent 0 var(--hw-wipe-radius),
    rgba(0, 0, 0, 0.45) calc(var(--hw-wipe-radius) + 40px),
    #000 var(--hw-wipe-edge)
  );
  mask-image: radial-gradient(
    circle at var(--hw-mask-x) var(--hw-mask-y),
    transparent 0 var(--hw-wipe-radius),
    rgba(0, 0, 0, 0.45) calc(var(--hw-wipe-radius) + 40px),
    #000 var(--hw-wipe-edge)
  );}
.hw-feature-mask-shell.hw-is-dissolving .hw-section-mask{animation: hw-desktop-feature-mask-bloom 1500ms cubic-bezier(0.2, 0.72, 0.22, 1) forwards !important;}
.hw-carousel-intro{width: min(1100px, calc(100% - 80px));}
.hw-carousel-intro h2{font-family: ""Silkscreen"", "var(--hw-font-inter)", sans-serif;
  font-size: 60px;
  font-weight: 400;
  line-height: 60px;
  letter-spacing: -0.1em;
  text-transform: uppercase;}
.hw-carousel-intro p{max-width: 1100px;
  margin-top: 24px;
  font-size: 20px;
  line-height: 24px;
  letter-spacing: 0;}
.hw-subscribe-band form{width: 499px;
  height: 60px !important;}
.hw-subscribe-band input{flex: 0 0 305px;
  width: 305px;
  height: 60px !important;
  min-height: 60px !important;
  max-height: 60px !important;
  padding: 0 24px;
  background-image: var(--hw-img-subscribe-input) !important;
  background-position: center;
  background-size: 100% 100%;}
.hw-subscribe-band form button{flex: 0 0 194px;
  width: 194px;
  height: 60px !important;
  min-height: 60px !important;
  max-height: 60px !important;
  padding: 0 24px;
  background-image: var(--hw-img-subscribe-submit) !important;
  background-position: center;
  background-size: 100% 100%;}
}

/* ---------- PART 7: curse-intro split across two sections (§4.7) ----------
   MUST stay after PART 2/3; see the note in tools/halloween-css-port.mjs. */
.hw-curse-intro--copy{padding-block-end:0}
.hw-curse-intro--reward{padding-block-start:0}
@media (max-width:1180px){
.hw-curse-intro--copy{padding-block-end:0}
.hw-curse-intro--reward{padding-block-start:0;padding-block-end:82px}
}
@media (max-width:760px){
.hw-curse-intro--reward{margin-top:0;padding-block-start:0;padding-block-end:84px}
}

/* Sticky reward bar: sit BELOW the theme header, not on top of it.
   The source pins it with `inset:0 0 auto!important` (top:0), which was right
   for the standalone page — it had no theme chrome above it. Here the theme
   publishes its own measured offset on <html>:
     --announcement-bar-height / --header-height, combined by
     snippets/css-variables.liquid into --sticky-area-height, which already
     folds in whether each one is sticky and whether the header is currently
     visible. So this tracks a hide-on-scroll header automatically: the bar
     rides at 0 when the header is hidden and drops to its height when it
     returns — no JS, no hard-coded number.
   !important is required to beat the source's own !important inset shorthand,
   and this must stay in the last part so it wins on source order too. */
.hw-reward-dock.hw-is-visible{top:var(--hw-header-offset, 0px)!important}

/* Theme-editor-only placeholder for an add button with no product bound yet.
   Dimmed and non-interactive so it reads as "slot still empty" rather than as a
   broken control. Never rendered on the storefront — the Liquid gates it behind
   request.design_mode. */
.hw-add-button.hw-is-unbound{opacity:.35;cursor:not-allowed;pointer-events:none}

/* "Share Yours" centring. The source styles .share-button with a width, a
   height and a background image but never sets text-align or any centring —
   it relied entirely on <button>'s UA defaults (text-align:center plus the
   anonymous content box being centred vertically). This port renders it as an
   <a> when a link is set (correct semantics for something that navigates), so
   those defaults are gone and the label sat top-right. Centre it explicitly,
   the same way .hw-pixel-action already does. */
.hw-subscribe-band .hw-share-button{display:inline-grid;place-items:center;text-align:center}

/* Threshold captions under each reward bar.
   Hidden in the static state — the offer line is already spelled out in the
   copy block directly above, and repeating it there would just be noise. They
   appear once the bar sticks to the top, which is exactly when the shopper has
   scrolled past that copy and no longer has the context on screen.
   flex-basis:100% forces a wrap onto its own line without disturbing the
   existing [rail][value] row; the left bar's caption aligns left, the right
   bar's (.hw-reverse) aligns right, so they hug the outer edges of the bar. */
/* order:3 is required, not cosmetic. .hw-reverse assigns order:1 to the rail
   and order:2 to the value, so a caption left at the default order:0 sorts
   ahead of both and lands on the TOP line of the right-hand meter. */
.hw-meter-caption{display:none;order:3}
/* Docked: push the two meters to the outer edges.
   The docked row is a 1fr/auto/1fr grid whose outer columns already reach the
   full width, but both meters pack their contents with justify-content:
   flex-start — so the right-hand one left-aligned inside its own column and
   left ~60px of dead space against the right edge. Sending the reverse meter
   to flex-end makes the pair sit hard against both ends. */
.hw-reward-dock.hw-is-visible .hw-progress-meter{flex-wrap:wrap;row-gap:2px;justify-content:flex-start}
.hw-reward-dock.hw-is-visible .hw-progress-meter.hw-reverse{justify-content:flex-end}
.hw-reward-dock.hw-is-visible .hw-meter-caption{
  display:block;flex-basis:100%;color:var(--hw-muted);
  font-size:15px;line-height:1.25;white-space:nowrap;text-align:left}
.hw-reward-dock.hw-is-visible .hw-progress-meter.hw-reverse .hw-meter-caption{text-align:right}

/* Hero hotspots must stay completely inert until the torch reveal finishes.
   The layer already carries opacity:0 + pointer-events:none, but
   .hw-hero-hotspot-add sets pointer-events:auto on ITSELF — and per spec a
   descendant that opts back in becomes a hit target again even though its
   ancestor opted out. So the add buttons stayed hoverable and clickable
   through the mask, and :hover flipped them visible.
   Specificity: .hw-hero-mask-shell:not(.hw-is-revealed) .hw-hero-hotspot-add
   is (0,3,0), which outranks the (0,2,0) hover rule. */
.hw-hero-mask-shell:not(.hw-is-revealed) .hw-hero-hotspot-layer,
.hw-hero-mask-shell:not(.hw-is-revealed) .hw-hero-hotspot,
.hw-hero-mask-shell:not(.hw-is-revealed) .hw-hero-hotspot-area,
.hw-hero-mask-shell:not(.hw-is-revealed) .hw-hero-hotspot-add{
  pointer-events:none!important}
.hw-hero-mask-shell:not(.hw-is-revealed) .hw-hero-hotspot-add{
  opacity:0!important;transform:translate(-50%,-50%)scale(.82)!important}

/* #new products: the plus grows into a pill reading "New in +".
   width:auto must be !important — PART 1 pins every add button to 24px and
   PART 3 to 30px, both with !important, so only a later !important wins.

   The pixel icon is left completely untouched: an earlier attempt painted the
   pill in --hw-plus-bg and blanked the icon's background polygon so the two
   would merge, which effectively deleted the pixel artwork. Instead the pill is
   a dark capsule outlined in the same variable the icon uses, so border, label
   and icon all shift together on hover and the pixel mark stays legible on top. */
.hw-add-button.hw-is-new{
  width:auto!important;min-width:0;
  grid-auto-flow:column;align-items:center;gap:7px;
  padding:0 9px 0 12px;border-radius:999px;
  background:#071016;border:1.5px solid var(--hw-plus-bg);
  transition:border-color .16s,transform .16s}
.hw-add-button.hw-is-new .hw-add-label{
  color:var(--hw-plus-bg);font-size:15px;font-weight:600;line-height:1;
  white-space:nowrap;transition:color .16s}
.hw-add-button.hw-is-new .hw-plus-icon{width:18px;height:18px;flex:none}
.hw-hero-hotspot-add.hw-is-new{height:32px!important}
@media (max-width:760px){
.hw-add-button.hw-is-new{height:26px!important;padding:0 7px 0 10px;gap:5px}
.hw-add-button.hw-is-new .hw-add-label{font-size:12px}
.hw-add-button.hw-is-new .hw-plus-icon{width:15px;height:15px}
}

/* Product badges — the theme's own product-badges snippet, restyled.
   The theme paints them as filled pills using the heading font; here they are
   plain text in the page's body colour, stacked at the top-left of the artwork.
   Everything the theme's .badge sets (padding, background, border, radius,
   heading font) is neutralised on the descendants rather than by forking the
   snippet, so the badge LOGIC stays in one place.
   pointer-events:none keeps them from stealing clicks from the image link
   underneath, and z-index puts them over the artwork but under the add button. */
.hw-product-badges{
  position:absolute;top:10px;left:10px;z-index:1;pointer-events:none;
  display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.hw-product-badges .card__badges{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.hw-product-badges .card__badge{
  background:none!important;border:0!important;border-radius:0!important;
  padding:0!important;box-shadow:none!important;
  color:rgb(143,148,153);font-family:inherit;font-weight:500;
  font-size:14px;line-height:1;letter-spacing:0;text-transform:none;
  width:auto;display:block}
@media (max-width:760px){
.hw-product-badges{top:7px;left:7px}
.hw-product-badges .card__badge{font-size:12px}
}

/* Product links wrapping media/titles. display:block keeps the anchor from
   adding an inline baseline gap under the image, and stops it shrink-wrapping
   narrower than the media it contains. Colour/underline already come from
   PART 0b's .hw-page a rule. */
.hw-product-link{display:block}
.hw-spirit-card h3 .hw-product-link,
.hw-product-card h3 .hw-product-link{display:inline}

/* The product card's artwork is position:absolute AND pointer-events:none in
   the source, so simply wrapping it in an <a> produced a zero-height anchor
   with no clickable area at all — the link existed in the HTML but could never
   be clicked. Stretch the anchor over the whole tile instead. The image stays
   absolutely centred (the anchor is inset:0 of the same box, so it becomes an
   identical containing block and nothing moves), and the add button is lifted
   above it so the "+" still takes its own clicks.
   Only .hw-product-placeholder-image needs this — the spirit and feature
   images are in normal flow, so their anchors size themselves. */
.hw-product-placeholder > .hw-product-link{position:absolute;inset:0;z-index:0}
.hw-product-placeholder .hw-add-button{z-index:1}

/* Offer fine print under the rich-text offer lines ("new arrivals excluded").
   Deliberately quieter than the offer itself: the body copy's own grey
   (#8f9499, from .hw-curse-intro p — --hw-muted would be BRIGHTER than the body
   on this dark ground), smaller type and regular weight, so it reads as a
   condition rather than a second headline. */
.hw-offer-note{
  display:block;margin:14px auto 0;max-width:640px;
  color:#8f9499;font-size:15px;font-weight:400;line-height:1.45;
  letter-spacing:0;text-transform:none}
@media (max-width:760px){
.hw-offer-note{margin-top:10px;font-size:12px}
}

/* Spirit carousel intro: no bottom margin on mobile (was 28px), so the
   carousel sits directly under the intro copy. Desktop keeps its 46px. */
@media (max-width:760px){
.hw-carousel-intro{margin-bottom:0}
}

/* Full-screen hero ("cover", chosen over letterboxing). The hero used to be
   sized by WIDTH only — max(548px, 38.02vw) on desktop, 510-650px on mobile —
   so on any screen taller than that ratio the next section showed in the first
   screen (103-359px of it, measured).
   --hw-hero-base restates those original heights so the stage can keep them;
   the panel grows to fill the screen below the header, and the stage scales
   uniformly to match (--hw-hero-k, from halloween.js / the section's inline
   script). Sides are clipped with overflow-x:CLIP, not hidden: hidden would
   force overflow-y to auto and cut off the leaves and figure, which are meant
   to overhang the bottom edge. The 100vh line is the fallback for browsers
   without svh; svh (not dvh) keeps the height steady while a phone's URL bar
   shows and hides. */
.hw-hero-panel{--hw-hero-base:max(548px,38.0208vw)}
@media (max-width:760px){.hw-hero-panel{--hw-hero-base:clamp(510px,142vw,650px)}}
@media (max-width:420px){.hw-hero-panel{--hw-hero-base:520px}}
.hw-hero-panel{
  height:max(var(--hw-hero-base), calc(100vh - var(--hw-hero-top, 0px)));
  height:max(var(--hw-hero-base), calc(100svh - var(--hw-hero-top, 0px)));
  min-height:var(--hw-hero-base);
  overflow-x:clip}
/* The copy block after the hero is pulled up 80px on mobile by the original
   page CSS (.hw-curse-intro{margin-top:-80px}), to tuck its heading under the
   old, shorter hero. With the hero now filling the screen, that pull-up put
   the top of "HELP! SPOOKITON IS CURSED!" inside the first screen (measured:
   heading at 828px on an 844px screen). Only the copy variant follows the
   hero, so only it is reset. Desktop never had the negative margin. */
@media (max-width:760px){
.hw-curse-intro--copy{margin-top:0}
}
.hw-hero-stage{
  position:absolute;top:0;left:0;width:100%;height:var(--hw-hero-base);
  transform-origin:var(--hw-hero-focus, 50%) 0;
  transform:scale(var(--hw-hero-k, 1))}

/* Mobile sticky reward bar, slimmer (docked only). Measured before: 88px =
   10 padding + 52 rail + 2 gap + 14 sentence + 10 padding, 13% of a 667px
   screen. The rail is sized for labels ABOVE the track and centres the track,
   which left 11px of unused room below it; here the track sits 9px off the
   rail's bottom instead, so the "$10 OFF" labels keep their space above.
   Rider 32 -> 26px so it still fits. Result is ~64px. The in-page (not stuck)
   bar keeps its original size. All selectors are (0,3,0) so they outrank the
   base and <=400px rules for the same properties. */
@media (max-width:760px){
.hw-reward-dock.hw-is-visible .hw-reward-row{padding-block:6px;min-height:0}
.hw-reward-dock.hw-is-visible .hw-unlock-rail{height:38px;align-items:flex-end;padding-bottom:9px}
.hw-reward-dock.hw-is-visible .hw-unlock-rider{width:26px;height:26px}
.hw-reward-dock.hw-is-visible .hw-unlock-legend{margin-top:0}
}

/* Mobile hero add buttons: never past the screen edge. The full-screen hero
   scales the stage by --hw-hero-k and crops both sides, so only
   [--hw-hero-vis-l, --hw-hero-vis-r] of its width is on screen (about
   15.4%-84.6% at 390x844, 4.8%-95.2% at 375x667). The original mobile positions
   (35.4% / 69.6% / 90.4%, the button's centre) put the third button's right half
   off screen. Each button is clamped to stay 56px inside the visible part —
   half the "New in" pill at full size (96px / 2) plus 8px — so it only moves
   when it would otherwise be cut, and only as far as needed. Same selectors
   and !important as the original rules; later in the file, so these win. */
@media (max-width:760px){
.hw-hero-hotspot .hw-hero-hotspot-add{left:clamp(calc(var(--hw-hero-vis-l, 0%) + 56px), var(--hw-mx-m, 50%), calc(var(--hw-hero-vis-r, 100%) - 56px))!important}
}

/* Scroll-story feature badges — the pixel-plate treatment, not the small grey
   text used on the product cards. These sit on a 500px-tall hero shot, so they
   take the page's own button language: the orange stepped-corner plate and the
   near-black label of .hw-pixel-action.

   The plate is a clip-path rather than the halloween-pixel-button.svg those
   buttons use. That asset is a fixed 271x60 painted at background-size:100% 100%
   — stretching it down to a ~90x28 badge would squash its corner steps into
   thin slivers and lose exactly the pixel look we are after. The clip-path
   reproduces the SAME staircase (three treads per corner, from the SVG's
   0 / 6.52 / 13.04 offsets) at a step size chosen for badge scale, so every
   step stays square no matter how long the label is.

   .hw-feature-media shrink-wraps the artwork so the badges land on the IMAGE's
   top-right corner, not the card's — the image is width:auto in a centred
   column, so those are not the same point. */
.hw-feature-media{
  position:relative;display:flex;justify-content:center;align-items:center}
.hw-feature-badges{
  position:absolute;top:12px;right:12px;left:auto;z-index:2;pointer-events:none;
  display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.hw-feature-badges .card__badges{
  display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.hw-feature-badges .card__badge{
  --hw-px-step:4px;
  background:var(--hw-orange)!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;padding:6px 16px!important;
  clip-path:polygon(
    calc(var(--hw-px-step) * 2) 0,
    calc(100% - var(--hw-px-step) * 2) 0,
    calc(100% - var(--hw-px-step) * 2) var(--hw-px-step),
    calc(100% - var(--hw-px-step)) var(--hw-px-step),
    calc(100% - var(--hw-px-step)) calc(var(--hw-px-step) * 2),
    100% calc(var(--hw-px-step) * 2),
    100% calc(100% - var(--hw-px-step) * 2),
    calc(100% - var(--hw-px-step)) calc(100% - var(--hw-px-step) * 2),
    calc(100% - var(--hw-px-step)) calc(100% - var(--hw-px-step)),
    calc(100% - var(--hw-px-step) * 2) calc(100% - var(--hw-px-step)),
    calc(100% - var(--hw-px-step) * 2) 100%,
    calc(var(--hw-px-step) * 2) 100%,
    calc(var(--hw-px-step) * 2) calc(100% - var(--hw-px-step)),
    var(--hw-px-step) calc(100% - var(--hw-px-step)),
    var(--hw-px-step) calc(100% - var(--hw-px-step) * 2),
    0 calc(100% - var(--hw-px-step) * 2),
    0 calc(var(--hw-px-step) * 2),
    var(--hw-px-step) calc(var(--hw-px-step) * 2),
    var(--hw-px-step) var(--hw-px-step),
    calc(var(--hw-px-step) * 2) var(--hw-px-step));
  color:#060b10;font-family:inherit;font-weight:600;
  font-size:18px;line-height:1.2;letter-spacing:0;text-transform:none;
  width:auto;display:block}
@media (max-width:760px){
.hw-feature-badges{top:8px;right:8px;left:auto;gap:6px}
.hw-feature-badges .card__badges{gap:6px}
.hw-feature-badges .card__badge{
  --hw-px-step:3px;padding:4px 12px!important;font-size:15px}
}

/* Desktop dock: once the row is stuck to the top the meters are the only
   thing in it, and the 74px markers they carry inline crowd the shorter bar.
   55px wide with height:auto, so each SVG keeps its own aspect ratio rather
   than being squared off. The left clamp has to track the new width: it
   offsets by half the marker to centre it on the progress point, and stops a
   full marker short of the end so it never overhangs the rail. */
@media (min-width:761px){
.hw-reward-dock.hw-is-visible .hw-meter-rail img,
.hw-reward-dock.hw-is-visible .hw-progress-meter.hw-reverse .hw-meter-rail img{
  width:55px;height:auto;
  left:clamp(0px, calc(var(--hw-progress) * 100% - 27.5px), calc(100% - 55px))}
/* 74px -> 50px rail. The track sits centred in the rail, so the 74px box left
   ~26px of empty rail under the track before the caption began. 50px still
   clears the 55x49-50 markers (they are absolutely centred and may overhang
   a pixel or two) and pulls the caption up under its bar. */
.hw-reward-dock.hw-is-visible .hw-meter-rail{height:50px}
/* The row was a fixed 100px with padding:0, which left the content 2.6px from
   both edges. Let it size to its content and add equal padding above and
   below; align-items:center on the grid keeps the meters, and the countdown
   between them, on one centre line. The anchor keeps its own min-height:100px,
   so resizing the stuck bar never shifts the page underneath it. */
.hw-reward-dock.hw-is-visible{height:auto}
.hw-reward-dock.hw-is-visible .hw-reward-row{height:auto;min-height:0;padding:14px 0}
}

/* ---- mobile: one unified unlock bar instead of two narrow meters ---- */
.hw-unlock{display:none}
@media (max-width:760px){
.hw-reward-row .hw-progress-meter{display:none}
.hw-reward-row{grid-template-columns:1fr!important;justify-content:stretch!important;gap:0!important}
/* min-width:0 is load-bearing. A grid item's automatic minimum size is its
   content, so the nowrap legend inside used to force this column wider than
   its 1fr track and push the whole dock past the viewport. */
.hw-unlock{display:block;box-sizing:border-box;width:100%;min-width:0;max-width:100%;padding:0}

/* The rail reserves half a rider's width at each end, so the pumpkin — which
   rides the leading edge of the fill from 0% to 100% — is never clipped and
   never overhangs the section. The track therefore starts and ends inside the
   rail rather than spanning it edge to edge. */
.hw-unlock-rail{
  box-sizing:border-box;position:relative;height:52px;
  display:flex;align-items:center;padding:0 18px}
.hw-unlock-track{
  box-sizing:border-box;border:2px solid var(--hw-orange);background:0 0;
  border-radius:999px;width:100%;height:10px;position:relative}
.hw-unlock-fill{
  background:var(--hw-orange);border-radius:999px;height:100%;display:block;
  max-width:100%;transition:width .26s}
/* Two milestone nodes, replacing the two marker artworks. Solid orange dots,
   16px on a 10px track so they stand proud of the bar above and below. A dark
   check mark appears inside a node once its tier is reached (.hw-is-unlocked,
   toggled by <halloween-reward-bar>); that, not the dot's colour, is what says
   "unlocked". The check is an inline SVG drawn in currentColor, so its colour
   is set here rather than baked into the markup. */
.hw-unlock-node{
  box-sizing:border-box;position:absolute;top:50%;left:0;
  width:16px;height:16px;border-radius:50%;transform:translate(-50%,-50%);
  border:0;background:var(--hw-orange);
  display:grid;place-items:center;
  pointer-events:none;z-index:1}
.hw-unlock-check{
  display:block;width:11px;height:11px;color:#071016;
  opacity:0;transform:scale(.6);transition:opacity .2s,transform .2s}
.hw-unlock-node.hw-is-unlocked .hw-unlock-check{opacity:1;transform:none}
/* left:100% centres the node ON the track's right edge, so half of it hung
   outside. A flat -100% pulls it back by exactly its own width, so its right
   edge sits flush against the inner edge of the track. The first node needs no
   such correction. */
.hw-unlock-node--last{transform:translate(-100%,-50%)}
/* "Save $10" above each node. It is a real text node, not a ::after with
   attr(), so the currency app can convert it like every other price on the
   page. The first label centres on its node; the last one is right-aligned to
   the node's right edge, which is flush with the track's end, so it can never
   hang past the bar. Grey while locked, orange once reached — the same state
   as the node itself. The rider passes over the labels on its way, which is
   exactly the "collecting it" moment. */
.hw-unlock-amount{
  position:absolute;bottom:calc(100% + 5px);left:50%;transform:translateX(-50%);
  color:var(--hw-orange);font-size:11px;font-weight:600;line-height:1;
  white-space:nowrap;font-style:normal}
.hw-unlock-node--last .hw-unlock-amount{left:auto;right:0;transform:none}

/* One rider instead of one marker per milestone: the pumpkin starts at 0 and
   travels with the fill, passing over each node as it collects it. */
.hw-unlock-rider{
  position:absolute;top:50%;left:0;width:36px;height:36px;
  transform:translate(-50%,-50%);object-fit:contain;
  filter:drop-shadow(0 2px #00000059);
  transition:left .26s;pointer-events:none;z-index:2}

/* One centred sentence. It was two labelled spans in a flex row so each half
   could light up on its own; the nodes carry that state now, so this is plain
   centred text that wraps naturally instead of a layout to keep in line. */
.hw-unlock-legend{
  margin:2px 0 0;padding:0 6px;text-align:center;
  color:var(--hw-soft);line-height:1.4;transition:color .2s;
  /* The line has to survive 320px without breaking, and the width available
     to it scales with the viewport, so the type does too. Tuned for the
     57-character code line ("Code: Halloween10, Save $10 · Code: Halloween20,
     Save $20"): 2.6vw with an 8.5px floor keeps it on one line from 320px up,
     and the 12px ceiling stops it growing past the widest phones. */
  font-size:clamp(8.5px, 2.6vw, 12px)}
}
@media (max-width:400px){
.hw-unlock-rail{padding:0 16px}
.hw-unlock-rider{width:32px;height:32px}
}


/* ---------- PART 4: keyframes hoisted to top level ---------- */
@keyframes hw-star-glow-drift{0%,to{opacity:.12;transform:translate(0)}50%{opacity:.58;transform:translate(10px,-16px)}}
@keyframes hw-mask-bloom{0%{--hw-wipe-radius:var(--hw-wipe-start-radius,60px);--hw-wipe-edge:var(--hw-wipe-start-edge,140px);opacity:1}72%{opacity:1}to{--hw-wipe-radius:980px;--hw-wipe-edge:1060px;opacity:0}}
@keyframes hw-hero-mask-bloom{0%{--hw-wipe-radius:125px;--hw-wipe-edge:205px;opacity:1}62%{--hw-wipe-radius:58vw;--hw-wipe-edge:66vw;opacity:1}88%{opacity:1}to{--hw-wipe-radius:142vw;--hw-wipe-edge:150vw;opacity:0}}
@keyframes hw-hero-scene-push{0%{transform:scale(1)}to{transform:scale(1.1)}}
@keyframes hw-hero-leaves-left-exit{0%{opacity:1;transform:translate(0)}42%{opacity:1}to{opacity:0;transform:translate(-42%)}}
@keyframes hw-hero-leaves-right-exit{0%{opacity:1;transform:translate(0)}42%{opacity:1}to{opacity:0;transform:translate(42%)}}
@keyframes hw-hero-person-left-exit{0%{opacity:1;transform:translate(0)scale(1)}to{opacity:1;transform:translate(-270%,18%)scale(2.35)}}
@keyframes hw-hero-title-exit{0%{opacity:1;filter:blur();transform:translate(-50%)scale(1)}to{opacity:1;filter:blur();transform:translate(-50%,-165%)scale(1)}}
@keyframes hw-hero-cursor-exit{0%{opacity:1;transform:translate(0)scale(1)}92%{opacity:1;transform:translate(0)scale(1)}to{opacity:0;transform:translate(24px,-16px)scale(.82)}}
@keyframes hw-torch-glow-flicker{0%{opacity:.66;transform:scale(.92)}to{opacity:.96;transform:scale(1.08)}}
@keyframes hw-feature-product-glow{0%,to{filter:drop-shadow(0 0 1px #ff381dad)drop-shadow(0 0 5px #f7733142)}50%{filter:drop-shadow(0 0 2px #ff381ddb)drop-shadow(0 0 8px #f7733166)drop-shadow(0 0 14px #f773312e)}}
@keyframes hw-hero-person-mobile-left-exit{0%{opacity:1;transform:translate(-50%)scale(1)}to{opacity:1;transform:translate(-320%,18%)scale(2.35)}}
@keyframes hw-mobile-hero-mask-bloom{0%{--hw-wipe-radius:30px;--hw-wipe-edge:70px;opacity:1}62%{--hw-wipe-radius:58vw;--hw-wipe-edge:66vw;opacity:1}88%{opacity:1}to{--hw-wipe-radius:142vw;--hw-wipe-edge:150vw;opacity:0}}
@keyframes hw-desktop-feature-mask-bloom{0% {
    --hw-wipe-radius: 60px;
    --hw-wipe-edge: 140px;
    opacity: 1;
  }

  72% {
    opacity: 1;
  }

  100% {
    --hw-wipe-radius: 980px;
    --hw-wipe-edge: 1060px;
    opacity: 0;
  }}


/* ---------- SHOPLINE adapter (appended by the port script) ---------- */
:root{--hw-font-inter:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
/* screen-reader-only text inside the Halloween controls */
.hw-page .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* The theme's <theme-product-form> and its <form> must not add boxes: the
   hero markers are positioned against .hw-hero-hotspot, exactly as on Shopify
   where the wrapper was an unpositioned inline element. */
.hw-page theme-product-form,.hw-page theme-product-form>form{display:contents}
/* The theme's product/form.js sets aria-busy on the submit button while it
   adds; the theme's icons/loading spinner is shown only then. */
.hw-page .button__spinner{display:none;position:absolute;inset:0;margin:auto;width:18px;height:18px;pointer-events:none}
.hw-page [aria-busy="true"] .button__spinner{display:block}
.hw-page :is(.hw-add-button,.hw-pixel-action)[aria-busy="true"]>*:not(.button__spinner){visibility:hidden}
.hw-page .form__error-message{display:none}
/* Theme badge internals take the Halloween badge styling. */
.hw-product-badges .product-card-status-badges,.hw-feature-badges .product-card-status-badges{position:static;display:flex;flex-direction:column;gap:inherit;margin:0;padding:0;inset:auto}
.hw-product-badges .product-card-status-badges{align-items:flex-start}
.hw-feature-badges .product-card-status-badges{align-items:flex-end}
.hw-product-badges .product-card-status-badge,.hw-feature-badges .product-card-status-badge{font:inherit;color:inherit;background:none;padding:0;border:0;letter-spacing:inherit;text-transform:inherit}
/* The badge component prints nothing when no badge applies. */
.hw-product-badges:not(:has(.product-card-status-badge)),.hw-feature-badges:not(:has(.product-card-status-badge)){display:none}

/* Mobile hero add buttons are placed per hotspot block: "Add button X/Y
   (mobile)" is written to --hw-mx-m / --hw-my-m on each hotspot, as a
   percentage of the whole banner (below 761px every hotspot covers it). */

/* Single-slide scroll story: with one slide there is nothing to swap, so the
   pinned 200vh scroll track would only add empty scrolling. The section
   renders as a plain static block instead; halloween.js skips it too. */
@media (min-width:761px){
.hw-workshop-sequence.hw-is-single{height:auto}
.hw-workshop-sequence.hw-is-single .hw-workshop-sequence-stage{position:relative;top:auto}
.hw-workshop-sequence.hw-is-single .hw-workshop-slide{opacity:1;pointer-events:auto;position:relative;inset:auto;transform:none}
}

/* Workshop layout: the strip under the copy (3 x 272px + 2 x 24px = 864px) is
   wider than the 778px copy column, and the feature card's torch mask reaches
   42px past the card (inset:-52px -42px -64px). Keep the copy column above the
   mask so the locked mask never darkens the third strip card. */
@media (min-width:761px){
.hw-workshop-zone .hw-story-copy{z-index:3}
}

/* 1181-1639px: the scroll-story slide is drawn for a 1440px box, but the
   feature card is offset +/-70px past it and the gallery strip (864px)
   overruns its 778px column, so the slide really needs ~1592px. Below that the
   card or strip was cut off at the screen edge. Scale the slide as a whole
   (keeps the mockup's proportions; reflowing would crowd the 60px headings).
   Steps keep >=12px clear on both sides across each range. */
@media (min-width:1181px) and (max-width:1639px){
.hw-product-story{zoom:.92}
.hw-workshop-sequence.hw-is-single .hw-workshop-sequence-stage{height:auto}
}
@media (min-width:1181px) and (max-width:1499px){
.hw-product-story{zoom:.83}
}
@media (min-width:1181px) and (max-width:1359px){
.hw-product-story{zoom:.72}
}

/* Mobile hero title: the stage is scaled by --hw-hero-k around
   (--hw-hero-focus, 0) to cover the screen, and the title stack lives inside
   it, so on a tall phone "WELCOME TO" was enlarged ~1.3x and cut off at both
   edges. Scale the title layer back by 1/k around the same origin: the scene
   still covers, the title renders at its designed size (width 100% - 40px). */
@media (max-width:760px){
.hw-hero-title-clip{transform:scale(calc(1 / var(--hw-hero-k, 1)));transform-origin:var(--hw-hero-focus, 50%) 0}
}

/* Countdown with seconds (4 units). Measured before: bar 1440px, countdown
   400px, meters 449/461px in 520px sides. Four units at the old 24px gap need
   ~530px and would push the $139 meter into the clock, so the gap drops to
   14px (~470px) and, where the bar is narrower than 1440px, the meter rail
   shrinks with the screen: rail = (screen - countdown) / 2 - 121px (label +
   gap + ~20px breathing room), never wider than the original 370px. */
@media (min-width:761px){
.hw-countdown{gap:14px}
.hw-meter-rail{width:clamp(100px, calc(50vw - 356px), 370px)}
}
@media (min-width:761px) and (max-width:1180px){
.hw-countdown{gap:8px;min-width:0}
.hw-countdown span{min-width:62px;font-size:16px;line-height:20px}
.hw-countdown b,.hw-countdown i{font-size:40px;line-height:48px}
.hw-meter-rail{width:clamp(100px, calc(50vw - 286px), 370px)}
}
@media (max-width:400px){
.hw-countdown{gap:6px}
.hw-countdown span{min-width:48px}
}

/* Reward captions: the discount code ("Code: Halloween10") in the docked
   desktop captions and the mobile legend is bold and orange. */
.hw-meter-caption .hw-code,.hw-unlock-legend .hw-code{color:var(--hw-orange);font-weight:700}

/* ---------- OS 3.0 (Fruva) adapter ---------- */
/* Fruva's base CSS paints every <section> with the colour-scheme background
   (section{background-color:rgba(var(--color-background))}). The Halloween
   sections draw their own backgrounds; :where keeps this at tag specificity so
   every .hw-* class rule still wins. */
:where(.hw-page) section{background-color:transparent}

/* Product row on phones: a 2-up grid, so an odd number of cards leaves one
   alone on the last row. Hide that last card. OS 3.0 wraps every block in its
   own div, so the cards are not the track's direct children (this is also why
   the 761-1180px ".hw-product-card:nth-child(4)" rule never matches here);
   count the track's children instead. */
@media (max-width:760px){
.hw-wide-products .hw-carousel-track > :last-child:nth-child(odd){display:none}
}
