.modal.action-animation-modal{width:min(620px,calc(100vw - 36px));max-width:620px;max-height:calc(100dvh - 28px);padding:0;overflow:hidden;background:#eff3e8;border:3px solid #47657f;border-radius:8px;box-shadow:0 6px 0 #2a3e5660,0 20px 70px #101d4050}
.action-animation{--action-accent:#8fb29b;--action-duration:3000ms;display:grid;grid-template-rows:70px minmax(0,1fr) 96px;max-height:calc(100dvh - 34px);overflow:hidden;color:#405974}
.action-animation-heading{display:flex;align-items:center;gap:13px;padding:7px 22px;background:linear-gradient(#f9fcf5,#dce8e9);border-bottom:3px solid #6c8ca0;min-height:70px;position:relative;z-index:1}
.action-animation-heading>div{flex:1;min-width:0}.action-animation-heading>div>span{font:9px var(--font);color:#7e95a3;letter-spacing:2px}.action-animation-heading h2{font:21px var(--pixel);line-height:1.3;margin:3px 0 0;color:#365a77;white-space:nowrap}.action-animation-star{font-size:34px;color:var(--action-accent);-webkit-text-stroke:1px #7f91a1;text-shadow:1px 2px #fff}.action-animation-tag{font:10px var(--font);color:#fff9ed;background:var(--action-accent);border:1px solid #8096a0;border-radius:4px;padding:5px 9px;flex-shrink:0}
.action-animation-avatar{display:flex;align-items:center;justify-content:center;width:51px;height:54px;overflow:hidden;border:2px solid #adc4c7;border-radius:7px;background:#fbfbef;flex-shrink:0}.action-animation-avatar>.atlas-character{width:51px!important;max-width:none;flex-shrink:0}.action-animation-avatar .custom-avatar{--frame-ratio:397/407!important}
.action-animation-screen{position:relative;isolation:isolate;container-type:size;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:0;height:min(52dvh,385px);background:radial-gradient(ellipse at 50% 70%,#fffdf1 0 27%,#e3eee7 75%);border-bottom:1px solid #b9cdd0}.action-animation-screen::before{content:'';position:absolute;inset:10px;border:1px solid #ffffffb0;border-radius:3px;pointer-events:none}.action-animation-glow{position:absolute;width:70%;height:20%;bottom:8%;border-radius:50%;background:var(--action-accent);opacity:.12;filter:blur(17px)}.action-animation-frame{position:relative;z-index:1;display:block;width:min(100cqw,100cqh);height:min(100cqw,100cqh);overflow:hidden;flex-shrink:0;isolation:isolate}.action-animation-image{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;opacity:1;transition:none;animation:none;transform:none}.action-animation.animation-unavailable .action-animation-frame::after{content:"✦";position:absolute;inset:0;display:grid;place-items:center;font-size:100px;color:var(--action-accent);text-shadow:0 3px #fff8}
.action-animation-footer{padding:12px 25px 10px;background:#f6f4e8;text-align:center;height:96px}.action-animation-footer>p{font:13px var(--font);line-height:1.5;color:#52687b;margin:0 0 9px}.action-animation-progress{height:10px;overflow:hidden;border:1px solid #8ba2a7;border-radius:3px;background:#cbd9d7;box-shadow:inset 0 1px 2px #52657520}.action-animation-progress>i{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left;background:repeating-linear-gradient(120deg,#ffffff50 0 9px,transparent 9px 18px),var(--action-accent)}.action-animation.is-playing .action-animation-progress>i{animation:action-animation-fill var(--action-duration) linear forwards}.action-animation-status{display:block;font:8px var(--font);color:#8b9c9b;margin-top:7px;letter-spacing:1px}
@keyframes action-animation-fill{to{transform:scaleX(1)}}

@media(max-width:600px){.modal.action-animation-modal{width:calc(100vw - 24px)}.action-animation{grid-template-rows:66px minmax(0,1fr) 92px}.action-animation-heading{min-height:66px;padding:7px 13px;gap:9px}.action-animation-heading h2{font-size:18px}.action-animation-heading>div>span{font-size:8px}.action-animation-tag{font-size:8px;padding:5px 6px}.action-animation-footer{height:92px;padding:11px 17px 8px}.action-animation-footer>p{font-size:11px}.action-animation-screen{height:min(51dvh,360px)}.action-animation-avatar{width:43px;height:47px}.action-animation-avatar>.atlas-character{width:45px!important}}
@media(max-height:540px) and (min-width:601px){.action-animation{grid-template-rows:54px minmax(0,1fr) 79px}.action-animation-heading{min-height:54px;padding-block:3px}.action-animation-heading h2{font-size:18px}.action-animation-heading>div>span{font-size:8px}.action-animation-avatar{width:41px;height:43px}.action-animation-avatar>.atlas-character{width:43px!important}.action-animation-screen{height:calc(100dvh - 168px)}.action-animation-footer{height:79px;padding-block:8px}.action-animation-footer>p{font-size:11px;margin-bottom:6px}.action-animation-status{font-size:7px;margin-top:5px}}
@media(prefers-reduced-motion:reduce){.action-animation.is-playing .action-animation-progress>i{animation:none;transform:scaleX(1)}}