/* Finishing effects run on interaction; idle pages stay still. */
.wallet{gap:9px}.wallet>span{display:flex;align-items:center}.wallet b{line-height:1.2}
.primary-action,.secondary-action,.icon-button,.shop-switch>button{transition:background .18s,border-color .18s,box-shadow .18s,transform .18s}
button:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.primary-action:active:not(:disabled),.secondary-action:active:not(:disabled),.icon-button:active:not(:disabled){transform:scale(.97)}
.progress-track>span{transition:width .45s ease-out}
.shop-layout .shop-price{font-size:clamp(22px,2.1vw,30px)}
.shop-price .currency-amount{gap:.2em}
.app-toast{animation:toast-arrive .24s ease-out}
@keyframes toast-arrive{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}

.market-card{--reveal-color:#94cfc8;--flip-duration:620ms;position:relative;isolation:isolate;transition:border-color .25s,box-shadow .25s}
.market-card[data-quality=rare]{--reveal-color:#edc574;--flip-duration:850ms}
.market-card[data-quality=ultra]{--reveal-color:#c6a3ff;--flip-duration:1100ms}
.market-inspect{flex:none;gap:12px}
.market-art{display:block;position:relative;width:100%;aspect-ratio:744/1040;perspective:1100px}
.market-flipper{position:absolute;inset:0;display:block;transform-style:preserve-3d;transition:transform var(--flip-duration) cubic-bezier(.2,.65,.2,1)}
.is-revealed .market-flipper{transform:rotateY(180deg)}
.market-back,.market-front{position:absolute;inset:0;display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:8px;overflow:hidden;background:#071322}
.market-front{transform:rotateY(180deg)}
.market-card:not(.is-revealed) .market-front{visibility:hidden}
.market-art .market-back img,.market-art .market-front img{display:block;width:100%;height:100%;padding:0;border:0;object-fit:contain;border-radius:8px}
.market-card.purchased .market-front img{opacity:.7}
.market-identity{display:flex;flex-direction:column;justify-content:center;gap:4px;min-height:46px;width:100%}
.market-identity b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.market-identity>span{color:var(--muted);font-size:9px}
.market-reveal-hint{position:absolute;left:50%;bottom:12px;translate:-50% 0;white-space:nowrap;border:1px solid #edc57466;border-radius:20px;padding:7px 12px;background:#091726ed;color:var(--gold)!important;font-size:11px!important;transition:opacity .18s,translate .18s;box-shadow:0 4px 18px #0006}
.market-inspect:hover .market-reveal-hint{translate:-50% -3px}
.is-revealed .market-reveal-hint{opacity:0;pointer-events:none}
.market-art:before,.market-art:after{content:'';position:absolute;inset:-3px;pointer-events:none;opacity:0;border-radius:10px;z-index:-1}
.market-art:before{background:radial-gradient(ellipse,var(--reveal-color),transparent 72%)}
.market-art:after{border:1px solid var(--reveal-color)}
.is-revealing .market-art:before{animation:market-bloom 1.5s ease-out both}
.is-revealing.is-revealed .market-art:after{animation:market-ring 1s ease-out both}
.market-card.is-revealing{border-color:var(--reveal-color);box-shadow:0 0 22px color-mix(in srgb,var(--reveal-color) 20%,transparent)}
.market-card.is-revealing[data-quality=ultra] .market-art:before{animation-duration:1.85s}
.market-card.is-revealing .market-identity{opacity:.45}
.market-card.is-revealed:not(.is-revealing) .market-identity{animation:market-name .28s ease-out}
.market-sparkles{position:absolute;inset:0;pointer-events:none;overflow:visible}
.market-sparkles i{position:absolute;top:50%;left:50%;height:3px;width:3px;border-radius:50%;background:var(--reveal-color);box-shadow:0 0 8px var(--reveal-color);opacity:0}
.is-revealing.is-revealed[data-quality=rare] .market-sparkles i,.is-revealing.is-revealed[data-quality=ultra] .market-sparkles i{animation:market-spark .8s calc(180ms + var(--spark-delay)) ease-out both}
.is-revealing[data-quality=ultra] .market-sparkles i{width:5px;height:5px}
@keyframes market-bloom{0%{opacity:0;transform:scale(.8)}35%{opacity:.6;transform:scale(1.25)}100%{opacity:0;transform:scale(1.4)}}
@keyframes market-ring{from{opacity:.8;transform:scale(.98)}to{opacity:0;transform:scale(1.15)}}
@keyframes market-spark{0%{opacity:0;transform:rotate(var(--angle)) translateY(0) scale(.3)}20%{opacity:1}100%{opacity:0;transform:rotate(var(--angle)) translateY(-80px) scale(.2)}}
@keyframes market-name{from{opacity:0;translate:0 4px}to{opacity:1;translate:0 0}}
@media(hover:hover){.market-card:not(.is-revealing):hover{border-color:#edc57470}.display-pack:not(:disabled):hover{filter:drop-shadow(0 5px 10px #edc57444)}}

.card-viewer[data-reveal]:before{animation:none}
.card-viewer.reveal-animating[data-reveal=rare]:before{animation:rare-bloom 1.2s both}
.card-viewer.reveal-animating[data-reveal=ultra]:before{animation:rare-bloom 1.5s both}

html[data-motion=reduced] *,html[data-motion=reduced] *:before,html[data-motion=reduced] *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
html[data-motion=reduced] .market-sparkles{display:none}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.market-sparkles{display:none}}