/* Cinematic event player · Campbell Studios */
.action-moment-dialog{--gold:#f2c76b;--ink:#0d1f2a;padding:0;width:min(980px,96vw);max-width:980px;max-height:94dvh;border:0;border-radius:22px;overflow:hidden;background:#0d1f2a;color:#fff3d6;box-shadow:0 0 0 1px #ffffff1f,0 40px 120px #000c;display:flex;flex-direction:column}
.action-moment-dialog[open]{animation:sceneIn .45s cubic-bezier(.2,.9,.3,1.2)}
.action-moment-dialog::backdrop{background:radial-gradient(circle at 50% 40%,#0b2a3acc,#02070cf2);backdrop-filter:blur(8px)}
@keyframes sceneIn{from{opacity:0;transform:scale(.92) translateY(18px)}to{opacity:1;transform:none}}
.action-scene-stage{position:relative;flex:1 1 auto;min-height:0;background:#21465a}
.action-moment-dialog canvas{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#21465a;cursor:pointer}
.action-scene-toolbar{position:absolute;inset:0 0 auto 0;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:max(12px,env(safe-area-inset-top)) 14px 22px;background:linear-gradient(#000a,#0000);pointer-events:none}
.action-scene-toolbar>span{font:800 11px/1.2 RepublicText,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#fff7e0;text-shadow:0 1px 3px #000a;padding:7px 11px;border-radius:99px;background:#0006;backdrop-filter:blur(6px)}
.action-scene-toolbar>div{display:flex;gap:8px;flex:none;pointer-events:auto}
.action-scene-toolbar button{min-height:40px;min-width:44px;padding:8px 14px;border:1px solid #ffffff40;border-radius:99px;background:#0d1f2a99;backdrop-filter:blur(6px);color:#fff7e0;font:700 13px RepublicText,Arial,sans-serif;cursor:pointer}
.action-scene-toolbar button:active{transform:scale(.94)}
.action-moment-dialog progress{position:absolute;left:0;right:0;bottom:0;display:block;width:100%;height:4px;border:0;margin:0;appearance:none;background:#0004}
.action-moment-dialog progress::-webkit-progress-bar{background:#0004}
.action-moment-dialog progress::-webkit-progress-value{background:linear-gradient(90deg,#f2c76b,#ffe9a8);box-shadow:0 0 10px #f2c76b}
.action-moment-dialog progress::-moz-progress-bar{background:#f2c76b}
.action-scene-caption{position:relative;padding:22px 26px 24px;background:linear-gradient(#11293a,#0b1c27);border-top:1px solid #ffffff14}
.action-scene-caption h2{font:800 clamp(24px,4.4vw,36px)/1.08 RepublicDisplay,Arial,sans-serif;color:#ffe3a0;margin:0 0 8px;letter-spacing:-.01em;text-wrap:balance}
.action-scene-caption p{font:15px/1.5 RepublicText,Arial,sans-serif;color:#d7e3dc;margin:0 0 14px;max-width:720px}
.action-scene-stats{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 16px}
.action-scene-stats span{font:700 13px/1 RepublicText,Arial,sans-serif;padding:9px 12px;border-radius:12px;background:#ffffff12;border:1px solid #ffffff1c;color:#eaf1ea;opacity:0;transform:translateY(10px) scale(.85)}
.action-scene-stats span.up{background:#2f8a5a33;border-color:#5fd39a66}.action-scene-stats span.up b{color:#7ff0b4}
.action-scene-stats span.down{background:#c2443833;border-color:#ff8a7a66}.action-scene-stats span.down b{color:#ffab9e}
.action-scene-stats b{color:var(--gold);margin-left:3px}
.action-moment-dialog.revealed .action-scene-stats span{animation:chipPop .42s cubic-bezier(.2,1.4,.4,1) forwards;animation-delay:calc(var(--i) * 90ms)}
@keyframes chipPop{to{opacity:1;transform:none}}
.action-scene-caption .primary{width:100%;min-height:52px;border:0;border-radius:14px;background:linear-gradient(#ffd98a,#e7b558);color:#2a1d08;font:800 16px RepublicText,Arial,sans-serif;box-shadow:0 4px 0 #a97a2a,0 10px 24px #e7b5583d;cursor:pointer;transition:transform .08s}
.action-scene-caption .primary:active{transform:translateY(3px);box-shadow:0 1px 0 #a97a2a}
.action-moment-dialog.revealed .action-scene-caption .primary{animation:ctaPulse 1.8s ease-in-out 1.2s infinite}
@keyframes ctaPulse{50%{box-shadow:0 4px 0 #a97a2a,0 0 0 6px #ffd98a33,0 10px 30px #e7b55866}}
/* Battle panel */
.action-battle-scene{position:relative;border:0;border-radius:18px;overflow:hidden;background:#163b4d;box-shadow:0 0 0 1px #ffffff1a,0 12px 30px #0006}
.action-battle-scene canvas{display:block;width:100%;height:auto;max-height:380px;aspect-ratio:16/9}
.action-battle-scene>div{padding:12px 16px;background:linear-gradient(#173c4a,#102a36);display:grid;gap:4px}
.action-battle-scene b{font:800 16px RepublicDisplay,Arial,sans-serif;letter-spacing:.04em;color:#ffd98a}
.action-battle-scene span{font:13px/1.4 RepublicText,Arial,sans-serif;color:#d6e7de}
.action-gallery{display:grid;grid-template-columns:1fr 1fr;gap:9px}.action-gallery button{text-align:left;font-size:14px;min-height:54px}.action-gallery-button{margin-top:14px;width:100%}
/* Phones: full-screen, tall scene, caption as a sheet */
@media(max-width:640px) and (orientation:portrait){
 .action-moment-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;margin:0;inset:0}
 .action-moment-dialog[open]{animation:sceneInMobile .4s ease-out}
 @keyframes sceneInMobile{from{opacity:0}to{opacity:1}}
 .action-scene-stage{flex:1 1 auto}
 .action-moment-dialog canvas{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
 .action-scene-caption{flex:none;margin-top:-26px;border-radius:24px 24px 0 0;padding:20px 18px max(18px,env(safe-area-inset-bottom));box-shadow:0 -18px 40px #0007}
 .action-scene-caption h2{font-size:26px}
 .action-scene-caption p{font-size:14px;margin-bottom:10px}
 .action-scene-toolbar>span{font-size:10px;max-width:46vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media(max-height:550px) and (orientation:landscape){.action-moment-dialog{flex-direction:row;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0}.action-scene-stage{flex:1 1 62%}.action-moment-dialog canvas{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}.action-scene-caption{flex:0 0 38%;overflow:auto;padding:16px}.action-scene-caption h2{font-size:22px}.action-scene-caption p{font-size:13px}}
@media(prefers-reduced-motion:reduce){.action-moment-dialog[open],.action-moment-dialog.revealed .action-scene-stats span,.action-moment-dialog.revealed .action-scene-caption .primary{animation:none}.action-scene-stats span{opacity:1;transform:none}.action-scene-caption{transition:none}}