.hero-name-row{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);align-items:center;gap:clamp(15px,3vw,45px);width:100%;margin:20px 0 28px}
.hero-scene .hero-name-row h1{font-size:clamp(80px,12vw,190px);margin:0;min-width:0}
.hero-doll{position:relative;isolation:isolate;justify-self:center;display:flex;justify-content:center;align-items:center;width:clamp(190px,23vw,330px);height:clamp(320px,46svh,450px);max-width:100%;padding:0;border:0;border-radius:0;background:transparent;color:#ecece6;appearance:none;cursor:pointer}
.hero-doll::before{content:"";position:absolute;inset:5% -12% 3%;z-index:-1;background:radial-gradient(ellipse,#d0d0bd25 0%,#b9c2a716 40%,transparent 72%);pointer-events:none}
.hero-doll:focus-visible{outline:1px solid #c6cdb7;outline-offset:12px}
.hero-doll-image{position:relative;z-index:2;display:block;width:auto;height:100%;max-width:100%;object-fit:contain;filter:drop-shadow(0 16px 20px #0005);transition:transform .65s cubic-bezier(.19,1,.22,1);pointer-events:none}
.hero-doll:hover .hero-doll-image{transform:translateY(-5px) rotate(-2deg)}
.doll-hint{position:absolute;bottom:-18px;left:0;right:0;z-index:3;font:10px Arial,Helvetica,sans-serif;letter-spacing:.13em;text-transform:uppercase;text-align:center;color:#ecece6b3}
.doll-pop{position:absolute;left:calc(50% - 16px);top:calc(43% - 16px);width:32px;height:32px;z-index:1;pointer-events:none;transform:translate(var(--pop-x),var(--pop-y)) rotate(var(--pop-r,0deg));opacity:.85}
.doll-pop-star{background:#bcc9a2;clip-path:polygon(50% 0%,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0% 50%,39% 39%)}
.doll-pop-ring{border:1px solid #e5e5da;border-radius:50%;width:36px;height:36px}
.doll-pop-heart{font:42px/1 Georgia,serif;color:#e5e5da;text-align:center}
.pop-one{--pop-x:-115px;--pop-y:-115px;--pop-r:12deg;--pop-delay:0ms;width:44px;height:44px}
.pop-two{--pop-x:110px;--pop-y:-60px;--pop-r:35deg;--pop-delay:80ms;width:28px;height:28px;background:#e5e5da}
.pop-three{--pop-x:-125px;--pop-y:55px;--pop-delay:140ms}
.pop-four{--pop-x:100px;--pop-y:105px;--pop-r:-12deg;--pop-delay:40ms}
.pop-five{--pop-x:65px;--pop-y:-170px;--pop-r:25deg;--pop-delay:180ms;width:20px;height:20px}
.hero-doll.is-popping .doll-pop{animation:dollAccentPop 1.35s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--pop-delay)}
@keyframes dollAccentPop{0%{transform:translate(0,15px) rotate(-30deg) scale(.12);opacity:0}65%{transform:translate(var(--pop-x),var(--pop-y)) rotate(var(--pop-r,0deg)) scale(1.2);opacity:1}100%{transform:translate(var(--pop-x),var(--pop-y)) rotate(var(--pop-r,0deg)) scale(1);opacity:.85}}
@media(max-width:760px){.hero-name-row{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:10px;margin:40px 0}.hero-scene .hero-name-row h1{font-size:clamp(42px,13vw,94px);margin:0}.hero-doll{width:clamp(105px,30vw,210px);height:clamp(205px,45vw,335px)}.doll-pop{width:20px;height:20px}.pop-one{--pop-x:-55px;--pop-y:-70px;width:28px;height:28px}.pop-two{--pop-x:50px;--pop-y:-30px;width:20px;height:20px}.pop-three{--pop-x:-55px;--pop-y:35px;width:22px;height:22px}.pop-four{--pop-x:45px;--pop-y:65px;font-size:28px}.pop-five{--pop-x:30px;--pop-y:-100px;width:15px;height:15px}.doll-hint{font-size:8px;letter-spacing:.08em;bottom:-15px}}
@media(prefers-reduced-motion:reduce){.hero-doll-image{transition:none}.hero-doll:hover .hero-doll-image{transform:none}.hero-doll.is-popping .doll-pop{animation:none}}
