/* Single-stage VN: original Comfy cutouts over a continuous location. */
.hr-demo{position:relative;isolation:isolate;min-height:690px;display:flex;align-items:center;background:#101c21;color:#f6f1e6;overflow:hidden;padding:80px max(7vw,24px);scroll-margin-top:90px}
.hr-demo-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.8;z-index:-3}
.hr-demo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#08181eef 5%,#08181eac 38%,#08181e00 68%),linear-gradient(0deg,#101c21 0%,transparent 20%,transparent 80%,#101c2144);z-index:-1;pointer-events:none}
.hr-demo-teaser{position:absolute;right:0;bottom:-6%;height:110%;width:62%;object-fit:contain;object-position:bottom;mask-image:linear-gradient(0deg,transparent,#000 18%);z-index:-2;pointer-events:none}
.hr-demo-invite{max-width:550px}.hr-demo h2{font-family:Paperlogy,sans-serif;font-size:clamp(38px,4vw,66px);line-height:1.2;color:#fff;margin:16px 0 24px}.hr-demo-hook{font-size:clamp(22px,2.5vw,31px);line-height:1.5!important}.hr-demo p{line-height:1.85;color:#ddd9cf}.hr-demo small{display:block;margin-top:18px;color:#bec6c7;font-size:13px}.hr-demo .hr-button{margin-top:16px}.hr-demo-rule{max-width:400px;margin-top:24px;color:#c7d3d8;font-size:14px;line-height:1.7}.hr-demo-rule summary{cursor:pointer}.hr-demo-rule strong{display:block;margin-top:14px;white-space:pre-line}.hr-demo-rule p{white-space:pre-line}
.hv-dialog{--hv-gold:#e2cda6;--hv-paper:#faf5eb;box-sizing:border-box;position:fixed;inset:0;width:min(1200px,calc(100% - 40px));height:min(820px,calc(100dvh - 32px));max-width:none;max-height:none;padding:0;margin:auto;border:1px solid #a5886070;border-radius:8px;background:#0b1720;color:var(--hv-paper);box-shadow:0 32px 130px #000c;font-family:WantedSans,sans-serif;overflow:hidden}
.hv-dialog::backdrop{background:#030a11dc;backdrop-filter:blur(6px)}.hv-dialog *{box-sizing:border-box}.hv-dialog button,.hv-dialog a{font:inherit;color:inherit;cursor:pointer}.hv-dialog button:focus-visible,.hv-dialog a:focus-visible{outline:2px solid #d7efff;outline-offset:3px}.hv-game{height:100%;position:relative;isolation:isolate}.hv-top{position:absolute!important;inset:0 0 auto!important;z-index:7;display:flex;align-items:center;justify-content:space-between;padding:8px 22px;background:linear-gradient(#07131be0,#07131b20);height:60px;border:0}.hv-top>div{display:flex;align-items:center;gap:14px}.hv-top small{font-size:10px;letter-spacing:.18em;color:#dbc49b;margin:0}.hv-top strong{font-family:Paperlogy,sans-serif;font-size:17px;font-weight:500;letter-spacing:.02em}.hv-close,.hv-sheet header button{width:44px;height:44px;background:none;border:0;font-size:30px!important;color:#ded5c7!important}
.hv-hud{position:absolute;left:22px;right:22px;top:62px;z-index:7;display:flex;align-items:center;gap:16px;font-size:12px;min-width:0;text-shadow:0 2px 5px #000}.hv-act{color:#e9ddc5;white-space:nowrap}.hv-party{display:flex;gap:9px;flex:1;min-width:0}.hv-party b{font-size:12px;color:var(--companion);font-weight:600;white-space:nowrap}.hv-party b:before{content:'●';font-size:6px;margin-right:4px;vertical-align:middle}.hv-party .is-lost{text-decoration:line-through;opacity:.6}.hv-vitals{white-space:nowrap;color:#ffd6cb}.hv-vitals i{font-style:normal;margin-left:12px;color:#c6e4ea}
.hv-scene{position:absolute;inset:0;min-height:0;background:#101d24;overflow:hidden}.hv-visual{position:absolute;inset:0;isolation:isolate;overflow:hidden}.hv-landscape{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.8) saturate(.9)}.hv-scene-shade{position:absolute;inset:0;background:linear-gradient(0deg,#07131be0,transparent 48%),linear-gradient(90deg,#06131b70,transparent 65%);z-index:1;pointer-events:none}

.hv-place{position:absolute;left:34px;top:115px;z-index:3;max-width:32%;text-shadow:0 2px 14px #000}.hv-place small{font-size:10px;letter-spacing:.2em;color:#e2cda6;margin:0 0 9px}.hv-place span{display:block;font-family:Paperlogy,sans-serif;font-size:clamp(22px,2.5vw,33px);font-weight:400;line-height:1.45}
.hv-dialogue{position:absolute;left:28px;right:28px;bottom:46px;z-index:5;min-height:173px;padding:22px 34px 20px;border:32px solid transparent;border-image:url('/assets/hero-demo-v2/dialogue-frame.webp') 85 fill / 32px / 0 stretch;display:grid;grid-template-columns:1fr auto;gap:6px 20px;align-content:start;filter:drop-shadow(0 8px 18px #0006)}
.hv-speaker{grid-column:1/-1;color:var(--speaker);font-family:Paperlogy,sans-serif;font-size:19px;font-weight:600;display:flex;align-items:center;justify-content:space-between;gap:10px;text-shadow:0 2px 3px #000}.hv-speaker span{font-family:WantedSans,sans-serif;font-weight:400;color:#a6b4c1;font-size:11px}.hv-line{grid-column:1/-1;font-size:19px;line-height:1.8;min-height:3.6em;margin:4px 0 0!important;color:#fff6e8!important;word-break:keep-all;overflow-wrap:anywhere;text-shadow:0 1px 3px #000}
.hv-actions{display:flex;justify-content:flex-end;grid-column:1/-1;min-height:40px}.hv-actions.has-choices{position:absolute;right:auto;left:2%;bottom:calc(100% + 22px);width:min(480px,55%);display:grid;gap:10px;padding:0;transition:opacity .15s}
.hv-choice{position:relative;display:flex;align-items:center;gap:13px;text-align:left;line-height:1.45;background:none;border:15px solid transparent;border-image:url('/assets/hero-demo-v2/dialogue-frame.webp') 85 fill / 18px / 0 stretch;border-radius:0;min-height:54px;padding:3px 10px;text-decoration:none;transition:filter .14s,transform .14s;font-size:16px!important;filter:drop-shadow(0 3px 8px #0005)}.hv-choice em{font-style:normal;color:#bba580;font-size:12px}.hv-choice span{flex:1}.hv-choice b{margin-left:auto;color:#e2cda6;font-size:20px}.hv-choice:hover{filter:brightness(1.3) drop-shadow(0 0 8px #c6a86e44);transform:translateX(3px)}
.hv-next{justify-self:end;min-width:100px;min-height:36px;padding:2px 8px;background:none;border:0;color:#e2cda6!important;font-size:14px!important}.hv-next span{margin-left:12px}.hv-scene:not(.is-ready) .has-choices{opacity:.35}.hv-tools{position:absolute;z-index:6;bottom:0;left:0;right:0;height:44px;display:flex;align-items:center;justify-content:flex-end;gap:4px;padding:0 26px;background:linear-gradient(transparent,#07131be0);margin:0!important;letter-spacing:normal!important;text-transform:none!important}.hv-tools:after{content:none!important}.hv-tools button{min-height:40px;padding:0 13px;background:none;border:0;color:#d0d7d8;font-size:12px}.hv-tools button[aria-pressed=true]{color:#f1d39c}
.hv-boss-mark{position:absolute;left:34px;top:205px;z-index:3;display:flex;align-items:center;gap:10px;color:#f4c7bb;text-shadow:0 1px 6px #000}.hv-boss-mark>span{font-size:32px}.hv-boss-mark small{color:#d2b5b0;margin:0;font-size:12px}.is-battle .hv-landscape{filter:brightness(.6) saturate(.65)}.is-battle .hv-visual:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 120px #8f251744;z-index:4;pointer-events:none}
.hv-visual>.hv-leaving{position:absolute!important;inset:0!important;width:100%;height:100%;z-index:6;transition:opacity .3s ease;pointer-events:none;opacity:1}.hv-visual>.hv-leaving.is-fading{opacity:0}.hv-visual.is-art-ready>
.hv-result{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:100px 35px 54px;min-height:0;overflow:auto;overscroll-behavior:contain;background:linear-gradient(#0b1a22aa,#0b1a22e8),url('/assets/hero-demo-v1/gate.webp') center/cover}.hv-result>small{color:#e2cda6;font-size:12px;letter-spacing:.23em;margin:0 0 14px}.hv-result h3{font-family:Paperlogy,sans-serif;font-size:30px;line-height:1.4;margin:0 0 18px;color:#fff}.hv-result p{font-size:15px;line-height:1.8;margin:12px 0;color:#e4e6e7}.hv-kept{font-size:14px;line-height:1.8;color:#c8bfc1;margin:18px 0 24px}.hv-death{background:linear-gradient(#20151caa,#140f1be8),url('/assets/hero-demo-v1/bridge.webp') center/cover}.hv-death>small{color:#f2aeb4}.hv-primary{justify-content:center;min-width:min(100%,320px);color:#fff!important}.hv-finish-faces{display:flex;gap:16px;justify-content:center}.hv-finish-faces figure{margin:0}.hv-finish-faces img{width:80px;height:92px;object-fit:cover;object-position:50% 15%;mask-image:linear-gradient(#000 75%,transparent)}.hv-finish-faces figcaption{font-size:13px;color:#dad0bd;margin-top:4px}.hv-finish-faces figcaption b{display:block;font-size:11px;font-weight:400;margin-top:2px;color:#b6c7d1}.hv-finish-faces .is-lost img{filter:grayscale(1) brightness(.6)}.hv-finish-faces .is-unmet img{filter:grayscale(1);opacity:.3}.hv-finish-faces .is-lost figcaption b{color:#ecb3b6}.hv-summary{color:#e2cda6;font-size:12px}.hv-main-note{font-size:12px!important;color:#b9c7cf!important}.hv-replay{background:none;border:0;font-size:13px!important;min-height:40px;margin-top:8px;color:#d3dde2!important}
.hv-sheet{position:absolute;inset:60px 22px 46px;background:#101923fa;z-index:10;display:flex;flex-direction:column;padding:0 28px;border:1px solid #d2bb8d66}.hv-sheet[hidden]{display:none}.hv-sheet header{display:flex;align-items:center;justify-content:space-between;min-height:60px;border-bottom:1px solid #d2bb8d44}.hv-sheet [data-sheet-body]{overflow:auto;overscroll-behavior:contain;padding:16px 0 28px}.hv-sheet article{border-bottom:1px solid #ffffff17;padding:12px 0}.hv-sheet b{color:#e2cda6;font-size:14px}.hv-sheet p{font-size:16px;line-height:1.8;color:#e3e9ed}.hv-art-error{position:absolute;z-index:8;top:95px;right:24px;color:#fff!important;background:#182c38e8;padding:8px 12px!important;font-size:12px!important;max-width:220px}
body:has(.hv-dialog[open]){overflow:hidden}@keyframes hv-arrive{from{opacity:.1;transform:translateX(15px)}to{opacity:1;transform:translateX(0)}}
@media(max-width:700px){
.hr-demo{min-height:780px;padding:350px 24px 48px;align-items:flex-end}.hr-demo-teaser{height:670px;width:112%;right:-24%;top:-45px;bottom:auto;mask-image:linear-gradient(#000 45%,transparent 85%)}.hr-demo:after{background:linear-gradient(0deg,#101c21 5%,#101c21e8 32%,transparent 66%)}.hr-demo-invite{max-width:100%;padding-top:0}.hr-demo h2{font-size:38px;margin-bottom:16px}.hr-demo-hook{font-size:23px}.hr-demo-rule{display:none}
.hv-dialog{width:100vw;height:100dvh;border:0;border-radius:0;inset:0;margin:0;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}.hv-top{padding:4px 14px;height:50px}.hv-top strong{font-size:15px}.hv-top small{font-size:9px}.hv-top>div{gap:10px}.hv-hud{left:14px;right:14px;top:52px;gap:8px;font-size:11px}.hv-party{gap:5px;justify-content:flex-end}.hv-party b{font-size:11px}.hv-party b:before{display:none}.hv-vitals i{margin-left:5px}.hv-place{top:87px;left:18px;max-width:48%}.hv-place small{font-size:8px;margin-bottom:5px;letter-spacing:.1em}.hv-place span{font-size:19px}.hv-scene-shade{background:linear-gradient(0deg,#07131bf2 0%,#07131b55 40%,transparent 68%)}
.hv-dialogue{left:10px;right:10px;bottom:43px;padding:14px 17px 12px;border-width:20px;border-image-width:24px;min-height:0;gap:5px 8px}.hv-speaker{font-size:17px}.hv-speaker span{display:none}.hv-line{font-size:16px;line-height:1.7;min-height:5.1em;margin:2px 0!important}.hv-actions{min-height:32px}.hv-actions.has-choices{left:0;bottom:calc(100% + 16px);width:100%;gap:7px}.hv-choice{font-size:14px!important;min-height:48px;border-width:12px;padding:2px 8px;gap:9px}.hv-choice em{font-size:11px}.hv-next{min-height:32px;font-size:13px!important}.hv-tools{justify-content:space-between;padding:0 9px;height:42px}.hv-tools button{padding:0 9px;font-size:11px}.hv-boss-mark{left:18px;top:154px}.hv-boss-mark small{display:none}.hv-boss-mark>span{font-size:24px}.hv-boss-mark b{font-size:14px}.hv-sheet{inset:50px 10px 44px;padding:0 18px}.hv-result{padding:88px 20px 46px;justify-content:center}.hv-result h3{font-size:24px;margin-bottom:12px}.hv-result p{font-size:14px}.hv-finish-faces img{width:66px;height:80px}.hv-finish-faces{gap:12px}
}
@media(max-height:650px){.hv-top{height:44px;padding-top:0;padding-bottom:0}.hv-hud{top:44px}.hv-place{top:79px}.hv-dialogue{bottom:39px;padding:12px 24px;border-width:20px;min-height:0}.hv-line{font-size:16px;line-height:1.6;min-height:3.2em}.hv-speaker{font-size:16px}.hv-actions.has-choices{bottom:calc(100% + 12px);gap:6px}.hv-choice{min-height:44px;font-size:14px!important;border-width:11px;padding:1px 8px}.hv-tools{height:38px}.hv-tools button{min-height:36px}.hv-next{min-height:30px}.hv-result{padding-top:78px;padding-bottom:40px}.hv-result h3{font-size:23px;margin-bottom:8px}.hv-result>small{margin-bottom:8px;font-size:10px}.hv-result p{font-size:13px;line-height:1.6;margin:8px 0}.hv-finish-faces img{height:54px;width:48px}.hv-main-note{margin:4px 0!important}.hv-kept{margin:12px 0}.hv-sheet{inset:44px 12px 40px}}
@media(max-width:700px) and (max-height:650px){.hv-dialogue{left:8px;right:8px;padding:9px 13px;border-width:16px}.hv-line{font-size:14px;line-height:1.6;min-height:4.8em}.hv-place{top:75px}.hv-place span{font-size:16px}.hv-actions.has-choices{gap:5px;bottom:calc(100% + 10px)}.hv-speaker{font-size:15px}.hv-choice{font-size:13px!important;min-height:44px}.hv-result{justify-content:flex-start}.hv-finish-faces img{width:44px;height:48px}.hv-finish-faces figcaption{font-size:11px}}
@media(min-width:701px) and (max-height:500px){.hv-dialog{height:100dvh;width:100vw;border:0;border-radius:0}.hv-dialogue{left:22px;right:22px;bottom:38px;padding:10px 24px}.hv-line{font-size:14px;min-height:1.6em;line-height:1.5}.hv-speaker{font-size:14px}.hv-actions.has-choices{width:52%;gap:5px}.hv-choice{min-height:42px;font-size:13px!important}.hv-place{top:70px;left:30px}.hv-place span{font-size:18px}.hv-place small{display:none}.hv-boss-mark{top:110px}.hv-result{padding:75px 20px 42px;justify-content:flex-start}.hv-finish-faces{position:absolute;left:30px;top:115px;flex-direction:column}.hv-finish-faces img{height:40px;width:40px}.hv-clear{padding-left:150px;padding-right:80px}}
@media(prefers-reduced-motion:reduce){.hv-choice,.hv-visual>.hv-leaving{transition:none}.hv-visual.is-art-ready>}
.hv-actions.has-choices{grid-template-columns:1fr;justify-content:stretch}.hv-choice{width:100%}@media(max-width:700px){}
@media(max-width:700px){.hv-actions.has-choices{bottom:calc(100% + 24px)}}
.hr-demo-teaser{width:78%;height:auto;top:50%;bottom:auto;right:-8%;transform:translateY(-45%);object-position:center;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 93%,transparent),linear-gradient(0deg,transparent,#000 22%,#000 94%,transparent);mask-composite:intersect}@media(max-width:700px){.hr-demo{min-height:700px;padding-top:300px}.hr-demo-teaser{width:145%;height:auto;top:15px;right:-29%;bottom:auto;transform:none;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 94%,transparent),linear-gradient(0deg,transparent,#000 23%,#000 96%,transparent)}.hr-demo:after{background:linear-gradient(0deg,#101c21 5%,#101c21e8 26%,transparent 61%)}.hr-demo h2{font-size:34px}}
@media(max-width:700px){.hr-demo-teaser{width:130%;right:0}}
.hv-dialogue-location{display:none!important}@media(max-width:700px){.hv-place{display:none}.hv-speaker .hv-dialogue-location{display:block!important;font-family:WantedSans,sans-serif;font-size:10px;font-weight:400;color:#cabfa9;max-width:65%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}.hv-top{background:linear-gradient(#07131bd9,transparent)}
.hv-result>.hv-choice{width:min(100%,420px)}.hv-finish-faces img{width:96px;height:96px;border-radius:50%;object-position:50% 12%;mask-image:none;border:1px solid #c8ad7855;background:#1e303266}@media(max-width:700px){.hv-finish-faces img{width:64px;height:64px}}@media(max-height:650px){.hv-finish-faces img{width:48px;height:48px}}
@media(max-width:360px){.hv-hud{display:grid;grid-template-columns:1fr auto;row-gap:3px}.hv-act{grid-column:1;grid-row:1}.hv-vitals{grid-column:2;grid-row:1}.hv-party{grid-column:1/-1;grid-row:2;justify-content:flex-start}.hv-result{padding-top:95px}}

@media(max-width:700px){.hv-hud{display:grid;grid-template-columns:1fr auto;row-gap:3px}.hv-act{grid-column:1;grid-row:1}.hv-vitals{grid-column:2;grid-row:1}.hv-party{grid-column:1/-1;grid-row:2;justify-content:flex-start}}

/* The entire dialogue surface shares the next-line action. Choices remain explicit. */
.hv-scene:not(.is-ready) .hv-dialogue,.hv-dialogue:has([data-next]){cursor:pointer}

/* Hero side-story: short event cues. Dialogue/choices never move or lose input. */
.hv-fx-layer{position:absolute;inset:0;z-index:4;overflow:hidden;pointer-events:none;contain:paint}
.hv-fx{position:absolute;inset:0;color:var(--fx-color);pointer-events:none;animation:hv-fx-envelope 660ms ease-out both}
.hv-fx-art{position:absolute;left:0;top:4%;width:100%;height:76%;overflow:visible;opacity:.95;filter:drop-shadow(0 0 7px currentColor);animation:hv-fx-cut 600ms cubic-bezier(.12,.8,.18,1) both}
.hv-fx-wash{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 53% 37%,transparent 22%,color-mix(in srgb,var(--fx-color) 32%,transparent));animation:hv-fx-wash 450ms ease-out both}
.hv-fx-motes{position:absolute;left:52%;top:37%;width:1px;height:1px}
.hv-fx-motes i{position:absolute;width:3px;height:12px;background:var(--fx-color);border-radius:60%;box-shadow:0 0 8px currentColor;animation:hv-fx-mote 650ms ease-out both;animation-delay:calc(var(--i)*7ms)}
.hv-fx-arrow .hv-fx-art{animation-name:hv-fx-shot}.hv-fx-clash .hv-fx-art{animation-name:hv-fx-burst}
.hv-fx-impact .hv-fx-art,.hv-fx-hurt .hv-fx-art,.hv-fx-fire .hv-fx-art,.hv-fx-shatter .hv-fx-art{animation-name:hv-fx-burst}
.hv-fx-hurt .hv-fx-wash{background:radial-gradient(ellipse at 50% 35%,transparent 20%,#9e294bcc 100%);animation-duration:600ms}
.hv-fx-seal .hv-fx-art,.hv-fx-guard .hv-fx-art{animation:hv-fx-seal 650ms ease-out both}
.hv-fx-guard{color:#b9e6f9}.hv-fx-charge .hv-fx-art{animation:hv-fx-charge 650ms ease-out both;opacity:.55}
.hv-fx-draw .hv-fx-art{animation:hv-fx-aim 650ms ease-out both;opacity:.45}.hv-fx-draw .hv-fx-wash,.hv-fx-push .hv-fx-art{display:none}
.hv-fx-finisher{animation-duration:900ms}.hv-fx-finisher .hv-fx-art{animation:hv-fx-cut 850ms cubic-bezier(.12,.8,.18,1) both;filter:drop-shadow(0 0 12px #ffe4ad)}
.hv-fx-finisher .hv-fx-wash{background:radial-gradient(ellipse at 52% 37%,#fff1c45c,transparent 60%);animation-duration:700ms}
.hv-fx-death,.hv-fx-loss{animation-duration:1050ms}.hv-fx-death .hv-fx-art,.hv-fx-loss .hv-fx-art{animation:hv-fx-descend 1s ease-in both;opacity:.35}
.hv-fx-death .hv-fx-wash,.hv-fx-loss .hv-fx-wash{background:radial-gradient(ellipse,transparent 12%,#030812 90%);animation:hv-fx-dim 1s ease-out both}
.hv-fx-fall .hv-fx-art{animation:hv-fx-descend 650ms ease-in both}.hv-fx-rewind{animation-duration:1050ms}.hv-fx-rewind .hv-fx-art{animation:hv-fx-rewind 1s ease-out both;filter:drop-shadow(0 0 12px #88d9ec)}
.hv-fx-rewind .hv-fx-wash{background:radial-gradient(ellipse at 50% 35%,#beeef166,transparent 68%);animation-duration:900ms}
.hv-death-echo{position:absolute;inset:0;z-index:2;pointer-events:none;filter:grayscale(1);animation:hv-death-echo 900ms ease-out both}
.hv-death-echo .hv-place,.hv-death-echo .hv-boss-mark{display:none}
.hv-result>*{position:relative;z-index:5}
@keyframes hv-fx-envelope{0%{opacity:0}12%,55%{opacity:1}100%{opacity:0}}
@keyframes hv-fx-cut{0%{clip-path:inset(0 92% 0 0);transform:translate(-20px,10px)}28%{clip-path:inset(0 0 0 0);transform:translate(0,0)}65%{opacity:.9}100%{opacity:0;transform:translate(14px,-6px)}}
@keyframes hv-fx-shot{0%{transform:translateX(-25%);opacity:0}25%{transform:translateX(0);opacity:1}100%{transform:translateX(8%);opacity:0}}
@keyframes hv-fx-burst{0%{transform:scale(.68);opacity:0}20%{transform:scale(1);opacity:1}100%{transform:scale(1.28);opacity:0}}
@keyframes hv-fx-seal{0%{transform:scale(.65) rotate(-16deg);opacity:0}30%{opacity:1}100%{transform:scale(1.12) rotate(5deg);opacity:0}}
@keyframes hv-fx-charge{0%{transform:scale(1.2);opacity:0}55%{transform:scale(.65);opacity:.7}100%{transform:scale(.62);opacity:0}}
@keyframes hv-fx-aim{0%{transform:translateX(-8%);opacity:0}50%{opacity:.5}100%{transform:translateX(0);opacity:0}}
@keyframes hv-fx-mote{0%{transform:translate(0,0) rotate(0);opacity:0}15%{opacity:1}100%{transform:translate(var(--x),var(--y)) rotate(145deg);opacity:0}}
@keyframes hv-fx-wash{0%{opacity:0}20%{opacity:.7}100%{opacity:0}}
@keyframes hv-fx-dim{0%{opacity:0}50%{opacity:.9}100%{opacity:0}}
@keyframes hv-fx-descend{from{transform:translateY(-14px);opacity:.4}to{transform:translateY(55px);opacity:0}}
@keyframes hv-fx-rewind{0%{transform:scale(1.4) rotate(28deg);opacity:0}35%{opacity:.9}100%{transform:scale(.3) rotate(-42deg);opacity:0}}
@keyframes hv-death-echo{from{opacity:.6;transform:scale(1)}to{opacity:0;transform:scale(1.035) translateY(6px)}}
.hv-fx.is-quiet{animation:hv-fx-envelope 240ms ease-out both}.hv-fx.is-quiet .hv-fx-art{animation:none;opacity:.16;filter:none;transform:none;clip-path:none}.hv-fx.is-quiet .hv-fx-wash,.hv-fx.is-quiet .hv-fx-motes{display:none}
@media(prefers-reduced-motion:reduce){.hv-fx{animation:hv-fx-envelope 240ms ease-out both}.hv-fx .hv-fx-art{animation:none;opacity:.16;filter:none}.hv-fx-motes,.hv-fx-wash,.hv-death-echo{display:none}}

/* A single face scale and eye anchor per viewport, independent of source crop.
   FX animate the outer frame; the image's static translation is never replaced. */
.hv-game{container-type:size}
.hv-portrait-frame{position:absolute;inset:0;z-index:2;pointer-events:none;--hv-face-size:clamp(52px,12cqh,94px);--hv-face-x:69%;--hv-face-y:20%}
.hv-dialog .hv-portrait{position:absolute;left:var(--hv-face-x);top:var(--hv-face-y);width:calc(var(--hv-face-size)*var(--hv-art-width));max-width:none;height:auto;transform:translate(calc(-1*var(--hv-eye-x)),calc(-1*var(--hv-eye-y)));mask-image:linear-gradient(0deg,transparent,#000 23%,#000 94%,transparent);filter:drop-shadow(0 5px 10px #09131e44);pointer-events:none}
@media(max-width:700px){.hv-portrait-frame{--hv-face-size:clamp(48px,9cqh,74px);--hv-face-x:52%;--hv-face-y:19%}}