/* One motion scale: responsive controls, soft surfaces, and interruptible scenery. */
:root{--motion-ease:cubic-bezier(.22,.61,.36,1)}html{scroll-behavior:auto!important}
#artwork-stage{position:fixed;inset:0;z-index:0;overflow:hidden;isolation:isolate;pointer-events:none;background:#121c2d;contain:strict}
#artwork-stage .backdrop{position:absolute;inset:0;background-size:cover;background-repeat:no-repeat;background-color:#121c2d;animation:none;transition:none;transform:none;will-change:opacity}
.shade{z-index:1;pointer-events:none}.ambient-light{z-index:2;pointer-events:none}#app{position:relative;z-index:3}
.glass{backdrop-filter:none;-webkit-backdrop-filter:none;background:linear-gradient(125deg,#283142ed,#182131e8)}
.price-panel{background:linear-gradient(125deg,#353f51f5,#202a3af5)}.community,.insights{background:#121d2df0}
/* Scrolling never waits for sections to become visible. */
.reveal,.reveal.revealed{opacity:1;transform:none;transition:none}
button,a,.game-card,.primary,.outline{filter:none!important;transition:transform 360ms var(--motion-ease),opacity 300ms ease,color 240ms ease,border-color 300ms ease}
.primary,.primary:hover{box-shadow:0 5px 25px #c6ccef17}.compare-row i{transition:none}
.game-card img{transition:transform 450ms var(--motion-ease)}
.selection-line{left:10%;width:80%;transform:scaleX(0);transform-origin:center;transition:transform 480ms var(--motion-ease)}.selected .selection-line{width:80%;transform:scaleX(1)}
.game-card:hover,.outline:hover,.primary:hover,.insight-row:hover{transform:none}
@media(hover:hover) and (pointer:fine){.primary:hover,.outline:hover{transform:translate3d(0,-1px,0)}.game-card:hover{transform:translate3d(0,-2px,0)}.game-card:hover img{transform:scale(1.025)}.insight-row:hover{transform:translate3d(2px,0,0)}}
.game-card:active,.primary:active,.outline:active{transform:scale(.985)}
dialog{overscroll-behavior:contain;scroll-behavior:smooth}dialog::backdrop{backdrop-filter:none;background:#070e1bd9;animation:veil 320ms ease}dialog[open]{animation:dialog-enter 320ms var(--motion-ease)}
#toast{backdrop-filter:none;background:#29374b;transition:opacity 240ms ease,transform 360ms var(--motion-ease)}
.logo-strip button[data-game=wuwa] img{object-fit:contain;width:100%;height:100%;filter:brightness(0) invert(1)}
.hero-copy{min-width:0}.price-panel{flex-shrink:0;max-width:100%}.hero{min-width:0}.game-card strong{overflow-wrap:anywhere}html[lang=ko] .hero-copy{word-break:keep-all}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html,dialog{scroll-behavior:auto!important}}