/* v0.3: generous first-layer objects, balanced second-layer controls. */
.game-journey{--intro-height:max(850px,calc(100svh - 182px));--stage-height:clamp(460px,52svh,640px)}
.showcase-track .showcase{width:min(760px,65vw);height:var(--stage-height);max-width:none;top:calc(50svh - var(--stage-height)/2 + 40px);scale:var(--journey-scale,1.18)}
.showcase-track .wheel-tilt{width:min(520px,44vw,46svh);height:auto;aspect-ratio:1}
.showcase-track .ladder-svg{width:100%;max-height:calc(var(--stage-height) - 30px)}
.setup-layer{grid-template-columns:1fr minmax(360px,44%);padding:90px 2%;min-height:max(820px,100svh)}
.setup-panel{max-width:490px;width:100%;justify-self:end}
/* Keep the second layer's geometry for parallax while its content waits offscreen. */
.setup-panel[data-reveal=waiting]{visibility:hidden;pointer-events:none}
.showcase-track .side-label{opacity:calc(1 - var(--intro-opacity,1))}
.showcase-track .stage-bottom{bottom:0;left:18%;right:18%;font-size:12px}
.stage-word{font-size:clamp(100px,12vw,180px);letter-spacing:-.06em;top:47%;color:#c5b3db06;-webkit-text-stroke:1px #c9acde25}
.showcase-track .stage-word{font-size:clamp(140px,18vw,250px)}
.stage-word[data-word=coin]{font-size:clamp(42px,5vw,78px);letter-spacing:-.04em}
.scene-margins{position:absolute;inset:0;pointer-events:none;opacity:var(--intro-opacity,1);translate:0 var(--aside-drift,0px)}
.scene-aside{position:absolute;top:45%;width:185px;pointer-events:none}.scene-aside-left{left:1.5%}.scene-aside-right{right:2%;top:48%;width:160px;text-align:center}
.aside-rule{display:block;width:40px;height:1px;background:linear-gradient(90deg,var(--purple),transparent);margin-bottom:22px}
.aside-english{font:italic 25px/1.3 Georgia,serif;color:#dfcfba;letter-spacing:-.5px;margin:0 0 18px}.aside-note{font-size:14px;line-height:1.85;color:var(--muted);margin:0 0 25px}.aside-caption{font:9px/1.7 Arial,sans-serif;letter-spacing:1.7px;color:#b5a48e99}
.keepsake-stamp{width:136px;height:162px;margin:0 auto 18px;pointer-events:auto;cursor:default}
.stamp-float{height:100%;border:1px solid #c8aad84d;outline:1px dashed #c8aad829;outline-offset:7px;border-radius:65px 65px 8px 8px;background:radial-gradient(ellipse at top,#b296c417,transparent 75%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;rotate:9deg;animation:stamp-drift 7s ease-in-out infinite}
.stamp-float>span{width:29px;color:var(--purple)}.stamp-float b{font:11px/1.8 Arial,sans-serif;letter-spacing:2px;font-weight:400;color:#c8b5d2}.stamp-float>i{font-style:normal;color:var(--purple);font-size:20px}
.scene-satellite{position:absolute;pointer-events:auto;display:block;color:var(--purple)}.scene-satellite>i{display:block;width:100%;height:100%;animation:satellite-drift 6s ease-in-out infinite}.scene-satellite svg{width:100%;height:100%}
.satellite-one{width:36px;height:36px;left:25%;top:34%;rotate:-15deg}.satellite-two{width:20px;height:20px;right:27%;top:79%}.satellite-three{width:17px;height:17px;left:13%;top:78%}.satellite-two>i{animation-delay:-3s}.satellite-three>i{animation-delay:-1.6s}
.satellite-pearl{border-radius:50%;background:radial-gradient(circle at 30% 25%,#f7e6cd,#b59fcb 50%,#5d446e);box-shadow:3px 5px 15px #0005}
@keyframes stamp-drift{50%{transform:translateY(-14px) rotate(-6deg)}}
@keyframes satellite-drift{50%{transform:translate(5px,-17px) rotate(35deg)}}
/* Pointer transforms stay on the hit object, never on the whole scene. */
.parallax-layer{transform:none!important;transition:none}
.interactive-part{translate:var(--hover-x,0px) var(--hover-y,0px);rotate:var(--hover-turn,0deg);transition:translate .45s var(--ease),rotate .6s var(--ease)}
.keepsake-stamp.is-near .stamp-float{border-color:#dbc0efaa;background-color:#bea0df0a}.scene-satellite.is-near{filter:drop-shadow(0 0 12px #c9a3ec88)}
.reveal-letter{display:inline-block;font:inherit;font-style:normal;white-space:pre}
/* Preserve unanimated static styles after each Web Animation completes. */
.ladder-column{transform-origin:center;transform-box:fill-box}
/* Result lettering sits behind the one existing coin, one character on each side. */
.coin-result-letters{display:none}
.coin-story .result-main{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 320px auto auto auto;width:min(820px,100%);isolation:isolate}
.coin-story .result-main>.eyebrow{grid-area:1/1;margin-bottom:10px}
.coin-story .result-art{grid-area:2/1;width:min(440px,100%);height:300px;margin:0 auto;align-self:center;z-index:2}
.coin-story .coin-result-letters{grid-area:2/1;display:flex;align-items:center;justify-content:space-between;justify-self:center;width:min(660px,96%);font-size:clamp(110px,15vw,190px);line-height:1;font-weight:800;color:#e8d7bc8c;z-index:1;pointer-events:none;letter-spacing:-10px;text-shadow:0 4px 40px #bea0df16}
.coin-story .coin-result-letters span{transition:opacity .85s,transform 1.2s var(--ease)}
.coin-story:not(.revealed) .coin-result-letters span{opacity:0}.coin-story:not(.revealed) .coin-result-letters span:first-child{transform:translateX(45px)}.coin-story:not(.revealed) .coin-result-letters span:last-child{transform:translateX(-45px)}
.coin-story #draw-status{grid-area:3/1}.coin-story #result-title{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;pointer-events:none}
.coin-story .result-actions{grid-area:4/1;margin-top:28px}.coin-story .return-hint{grid-area:5/1}.coin-story .result-kicker{margin:0 0 12px}.coin-story .result-detail{margin:0;font-size:15px;letter-spacing:3px}
@media(max-width:1100px) and (min-width:761px){.scene-aside-left{width:145px;left:0}.aside-english{font-size:21px}.aside-note{font-size:12px}.scene-aside-right{right:0;width:130px}.keepsake-stamp{width:106px;height:137px}.stamp-float b{font-size:9px}.scene-aside .aside-caption{font-size:8px}.satellite-one{left:22%;top:33%}.satellite-three{left:12%;top:80%}.setup-layer{grid-template-columns:1fr 43%;padding-inline:0}.setup-panel>h2{font-size:30px}}
@media(max-width:760px){
 .game-journey{--intro-height:max(680px,calc(100svh - 170px));--stage-height:320px}
 .showcase-track{height:calc(var(--intro-height) + 330px)}.showcase-track .showcase{width:100%;max-width:440px;height:320px;top:360px;scale:var(--journey-scale,1.07)}
 .showcase-track .wheel-tilt{width:min(295px,77vw);height:auto}.showcase-track .ladder-svg{max-height:310px}.showcase-track .stage-word{font-size:110px}.stage-word[data-word=coin]{font-size:43px}
 .showcase-track .stage-bottom{left:4%;right:4%;font-size:11px}.setup-layer{display:block;padding:390px 0 80px;min-height:0}.setup-panel{width:100%;max-width:480px}
 .scene-aside-left{display:none}.scene-aside-right{top:76%;right:8%;width:auto}.keepsake-stamp{display:none}.scene-aside-right>.aside-caption{font-size:8px;letter-spacing:1.5px}.satellite-one{left:7%;top:34%;width:22px;height:22px}.satellite-two{right:6%;top:65%;width:13px;height:13px}.satellite-three{display:none}.journey-index{top:210px;left:4%}
 .coin-story .result-main{grid-template-rows:auto 260px auto auto auto;width:100%}.coin-story .result-art{height:260px;width:100%;max-width:310px}.coin-story .coin-result-letters{width:100%;font-size:92px;letter-spacing:-5px}.coin-story .result-detail{font-size:13px;letter-spacing:2px}
}
@media(max-width:360px){.scene-intro h1{font-size:30px}.coin-story .coin-result-letters{font-size:80px}}