/* R8: four feature-specific completion moments and one consistent card motion. */
.r8-success{position:absolute;inset:0;z-index:30;display:grid;place-items:center;padding:24px;background:linear-gradient(120deg,#f5f8fb99,#f8faff66);backdrop-filter:blur(2px);color:var(--game-accent);animation:r8-success-in .24s ease-out both;pointer-events:auto}
.r8-success-content{width:min(410px,100%);padding:24px 26px 30px;text-align:center;background:#fffffff0;border:1px solid #fff;border-radius:28px;box-shadow:0 18px 60px #26335418}
.r8-success-kicker{display:block;font-size:10px;letter-spacing:.16em;color:#64758a;font-weight:600}
.success-art{display:block;width:220px;max-width:85%;height:auto;margin:14px auto 8px;overflow:visible}
.r8-success-content h3{font-size:clamp(20px,2vw,27px);font-weight:650;line-height:1.4;letter-spacing:-.03em;color:#302a45;margin:0 0 10px;text-wrap:balance}
.r8-success-content p{font-size:13px;line-height:1.65;color:#727384;margin:0;text-wrap:balance}
.success-seal circle{fill:var(--success-feature);stroke:none}.success-check{stroke:#fff;stroke-width:3.5;stroke-dasharray:1;stroke-dashoffset:1;animation:r8-check .32s .42s ease-out forwards}
.success-screen{stroke:var(--success-feature);stroke-width:5}.success-link{stroke-dasharray:90;stroke-dashoffset:90;animation:r8-connect .6s .1s ease-out forwards}
.success-product{transform-box:fill-box;transform-origin:center;animation:r8-product .55s ease-out both}
.success-laptop{animation:r8-fade .3s both}.success-swatch{stroke:var(--success-feature);stroke-width:5}
.success-color-left{animation:r8-align-left .6s ease-out both}.success-color-right{animation:r8-align-right .6s ease-out both}
.success-sun{transform-origin:110px 75px;animation:r8-sun .65s ease-in-out both}.success-key{fill:var(--success-feature);animation:r8-key .65s ease-in-out both}.success-key+path{fill:none}
.success-height{animation:r8-height .65s ease-in-out both}.success-eyeline{stroke:var(--success-feature);stroke-width:1.5;stroke-dasharray:4 5;animation:r8-fade .4s .25s both}.success-height-arrow{stroke-width:1.5;opacity:.55}
.success-sparks{stroke:var(--success-feature);transform-origin:center;animation:r8-sparks .65s .3s both}
.has-success .scene-interface{opacity:.15;pointer-events:none}.has-success .scene-notice{visibility:hidden}
.a #feature-dialog.r8-card-enter{animation:r8-card-drop .62s cubic-bezier(.22,.72,.24,1) both;will-change:transform,opacity}
.a #feature-dialog.r8-card-exit{animation:r8-card-rise .42s cubic-bezier(.55,.05,.75,.25) both;pointer-events:none;will-change:transform,opacity}
.a #feature-dialog[data-motion="entry"] #continue-feature,.a #feature-dialog[data-motion="exit"] #continue-feature{cursor:default;filter:none;opacity:1}
.a #feature-dialog[data-motion="entry"]::backdrop{animation:r8-backdrop-in .35s ease-out both}
.a #feature-dialog[data-motion="exit"]::backdrop{animation:r8-backdrop-out .42s ease-in both}
@keyframes r8-card-drop{0%{transform:translateY(-110vh) rotate(-1.5deg);opacity:0}65%{opacity:1}84%{transform:translateY(7px) rotate(.25deg)}100%{transform:translateY(0) rotate(0);opacity:1}}
@keyframes r8-card-rise{0%{transform:translateY(0);opacity:1}100%{transform:translateY(-110vh);opacity:0}}
@keyframes r8-backdrop-in{from{opacity:0}to{opacity:1}}@keyframes r8-backdrop-out{from{opacity:1}to{opacity:0}}
@keyframes r8-success-in{from{opacity:0}to{opacity:1}}@keyframes r8-check{to{stroke-dashoffset:0}}@keyframes r8-connect{to{stroke-dashoffset:0}}
@keyframes r8-product{from{transform:translateY(-14px);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes r8-fade{from{opacity:0}to{opacity:1}}
@keyframes r8-align-left{from{transform:translateY(-12px);filter:hue-rotate(-55deg)}to{transform:none;filter:none}}
@keyframes r8-align-right{from{transform:translateY(12px);filter:hue-rotate(40deg)}to{transform:none;filter:none}}
@keyframes r8-sun{0%{opacity:.4}40%{opacity:1}65%{opacity:.6}100%{opacity:1}}
@keyframes r8-key{0%,100%{transform:translateY(0)}40%{transform:translateY(3px)}}
@keyframes r8-height{0%{transform:translateY(-13px)}65%{transform:translateY(3px)}100%{transform:none}}
@keyframes r8-sparks{from{transform:scale(.75);opacity:0}70%{opacity:1}to{transform:scale(1);opacity:.7}}
@media(max-width:820px){.r8-success{padding:20px}.r8-success-content{padding:22px 16px 26px;border-radius:24px;max-width:330px}.success-art{width:190px;margin:14px auto 9px}.r8-success-content h3{font-size:22px}.r8-success-content p{font-size:12px}}
@media(max-width:350px){.r8-success{padding:15px}.r8-success-content{padding:19px 12px 23px}.r8-success-content h3{font-size:19px}.success-art{width:175px}.r8-success-content p{font-size:11px}}
@media(prefers-reduced-motion:reduce){.r8-success,.success-art *{animation:none!important;transform:none!important}.success-check,.success-link{stroke-dashoffset:0}.a #feature-dialog.r8-card-enter{animation:r8-fade .1s linear both}.a #feature-dialog.r8-card-exit{animation:r8-backdrop-out .1s linear both}.a #feature-dialog[data-motion]::backdrop{animation:none!important}}
