/* Play Free page */
.mm-play { max-width: 900px; margin: 0 auto; text-align: center; }
.mm-stage { position: relative; margin: 1.2rem auto 0; width: 100%; max-width: min(100%, calc(78vh * 9 / 16)); max-height: 78vh; border-radius: 18px; overflow: hidden; background: #12051f; box-shadow: 0 0 0 3px rgba(255,255,255,.08), 0 18px 40px rgba(0,0,0,.45); }
.mm-stage[style*="16 / 9"] { max-width: 100%; }
.mm-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.mm-cover { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 14px; padding: 24px; background: radial-gradient(circle at 50% 35%, #3b1468, #12051f 70%); }
.mm-cover h2 { margin: 0; }
.mm-cover p { margin: 0; opacity: .85; max-width: 32ch; }
.mm-progress { width: min(260px, 80%); height: 10px; border-radius: 99px; background: rgba(255,255,255,.12); overflow: hidden; }
.mm-progress span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #e8362b, #ffd23f, #1fa84f); transition: width .2s; }
.is-running .mm-cover { display: none; }
.mm-left { margin: .8rem 0 0; font-weight: 600; opacity: .85; min-height: 1.4em; }
.mm-toast { position: absolute; left: 50%; top: 12px; transform: translateX(-50%); padding: 8px 14px; border-radius: 99px; background: rgba(18,5,31,.88); color: #ffd23f; font-weight: 600; font-size: .9rem; z-index: 2; pointer-events: none; }
.mm-panel { position: absolute; inset: 0; z-index: 3; display: grid; place-items: center; align-content: center; gap: 14px; padding: 24px; background: rgba(18,5,31,.94); }
.mm-panel h2 { margin: 0; }
.mm-panel p { margin: 0; max-width: 34ch; opacity: .9; }
.mm-btns { display: grid; gap: 10px; width: min(340px, 100%); }
.mm-btns .btn { display: block; text-align: center; }
.mm-btns small { display: block; font-weight: 400; opacity: .8; font-size: .8em; }
.mm-missing { position: absolute; inset: 0; z-index: 3; display: grid; place-items: center; align-content: center; gap: 12px; padding: 24px; background: #12051f; }
.mm-keep { margin: 2rem auto 0; }
.mm-keep .mm-btns { margin: 1rem auto 0; }
[hidden] { display: none !important; }
.mm-panel .mm-again { font-size: .9rem; opacity: .85; max-width: 34ch; }
.mm-panel .mm-again a { color: #2fd8ff; }
