.content-main:has(.player-layout){max-width:1440px;padding:20px 28px}.preview-label{font-size:14px;color:#644d7d}.player-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:20px}.player-stage{position:relative;min-height:490px;background:#251239;border-radius:24px;overflow:hidden;color:white;display:grid;place-items:center}.player-cover{position:absolute;inset:0;opacity:.25;filter:blur(3px)}.player-cover img,.player-cover .rich-thumb{width:100%;height:100%;object-fit:cover;display:block}.player-launch{position:relative;text-align:center;padding:40px;max-width:640px}.player-launch h1{color:white;font-size:46px;margin:18px 0}.player-launch p{font-size:16px}.player-pill{background:#ffffff20;border:1px solid #ffffff50;border-radius:30px;padding:8px 14px;font-size:12px;letter-spacing:2px}.player-launch .play{display:inline-block;background:#ff8c9d;color:#29103e;padding:16px 30px;margin:12px;border-radius:18px;font-weight:800}.player-toolbar{display:flex;align-items:center;gap:18px;background:white;padding:18px;border-radius:0 0 18px 18px}.player-toolbar strong{margin-right:auto}.player-toolbar button{background:#eee5ff;border:0;border-radius:12px;padding:12px;color:#51218a;font:inherit;cursor:pointer}.player-copy{background:#fff;border-radius:22px;padding:28px;margin:22px 0;font-size:16px;line-height:1.7}.player-neighbors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-content:start}.player-card{display:block;min-width:0;text-decoration:none;color:#321445}.player-card img,.player-card .rich-thumb{display:block;width:100%;aspect-ratio:1.4;border-radius:16px;object-fit:cover}.player-card strong{display:block;font-size:15px;margin-top:7px}.player-card small{font-size:12px;color:#6b577b}.player-more{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}.player-stage:fullscreen{border-radius:0;min-height:100vh}.player-stage:focus-visible{outline:4px solid #ff8c9d}a:focus-visible,button:focus-visible{outline:3px solid #7433cd;outline-offset:4px}@media(max-width:800px){.content-main:has(.player-layout){padding:12px}.player-layout{display:block}.player-stage{min-height:380px}.player-launch{padding:25px 18px}.player-launch h1{font-size:32px}.player-toolbar{flex-wrap:wrap;gap:12px;font-size:14px}.player-copy{padding:20px}.player-neighbors,.player-more{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.player-neighbors{margin-bottom:24px}}
.player-card .rich-thumb{height:auto}.player-card{align-self:start}
.player-exit{position:absolute;top:16px;right:16px;z-index:5;min-height:44px;padding:12px 18px;border:0;border-radius:12px;background:white;color:#321445;font:inherit;cursor:pointer}.player-exit[hidden]{display:none}

.player-stage iframe{width:100%;height:100%;min-height:490px;border:0;background:#251239}.player-launch[hidden]{display:none}.player-stage:has(iframe) .player-cover{display:none}#player-start,#player-retry{min-height:44px;padding:12px 20px;border-radius:12px;background:#ff8c9d;color:#29103e;border:0;font:inherit;cursor:pointer}.player-stage:fullscreen iframe{height:100vh}@media(max-width:800px){.player-stage iframe{min-height:380px}.player-toolbar a{min-height:44px;display:flex;align-items:center}}

.player-feedback{position:absolute;bottom:12px;left:12px;right:12px;z-index:5}.player-feedback p:not(:empty){background:#fff;color:#321447;padding:8px;border-radius:8px}.player-feedback button{padding:12px;border-radius:12px}

.player-copy{grid-column:1 / -1}.player-card small{display:block;font-size:14px;line-height:1.4;color:#493354}.player-launch small{font-size:14px;color:#fff}.player-neighbors{margin-top:0}

.player-stage.remote-active{display:flex;flex-direction:column;padding-top:64px;overflow:auto}.remote-active .player-feedback{position:static;order:2;padding:8px;color:#fff}.remote-active iframe{flex:none;height:550px;min-height:550px;width:100%}.remote-active .player-exit{top:8px}.player-stage[data-embed]{min-width:320px}.player-stage[data-embed] .player-launch a:not(.play){color:white;text-decoration:underline}

/* The provider scales its 2:3 canvas from frame height; reserve the exit bar. */
.player-stage.remote-active:fullscreen{container-type:inline-size;height:100dvh;min-height:0;box-sizing:border-box}
.player-stage.remote-active:fullscreen iframe{width:max(320px,min(100cqw,calc((100dvh - 64px) * 2 / 3)));height:max(480px,min(150cqw,calc(100dvh - 64px)));min-height:480px;min-width:320px}
