/* Embed mode of the spectator page (/m/:id?embed=1 -> html.embed, PLATFORM-DESIGN.md 3.3): only the HUD, the canvas
   and the ticker remain, filling the iframe. Everything else of the page chrome is hidden. */
html.embed, html.embed body { height: 100%; overflow: hidden; background: #0b0908; }
html.embed body { background: #0b0908; }
html.embed .container { max-width: none; padding: 6px 8px 4px; height: 100%; display: flex; flex-direction: column; gap: 4px; }
html.embed [data-nav], html.embed [data-footer], html.embed header.site, html.embed footer.site,
html.embed .legend, html.embed .controls, html.embed .status-line, html.embed .match-meta,
html.embed [data-seats], html.embed [data-share], html.embed [data-comments], html.embed .pg-seats, html.embed .pg-share,
html.embed .not-human, html.embed .robot-veil, html.embed .toast, html.embed .match-title { display: none !important; }
html.embed .hud { margin-bottom: 4px; }
html.embed .hud .clock { font-size: 1.3rem; }
html.embed .hud .player .name { font-size: 0.95rem; }
html.embed .hud .player .sub { display: none; }
html.embed .stage { flex: 1 1 auto; min-height: 0; aspect-ratio: auto; border-radius: 8px; }
html.embed .ticker { margin-top: 2px; font-size: 0.8rem; }
html.embed .overlay .box { padding: 12px 16px; }
html.embed .overlay table.result { display: none; }
@media (max-height: 360px) {
  html.embed .hud { display: none; }
}
/* Bottom bar back to the match page (SEO checklist S02): 28 px, below the ticker, never over the HUD. */
html.embed .pg-embed-bar { display: flex; align-items: center; justify-content: center; flex: none; height: 28px; line-height: 28px; margin: 0 -8px -4px; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--muted); background: rgba(0, 0, 0, 0.35); text-decoration: none; }
html.embed .pg-embed-bar:hover { color: var(--accent); }
html:not(.embed) .pg-embed-bar { display: none; }
/* The match page's one h1 ("A vs B — GAME", filled by spectator-core.js): a compact line above the HUD. */
.match-title { margin: 0 0 8px; font-size: 1.05rem; font-weight: 700; letter-spacing: 0.02em; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* The match page outside embed mode (the only lane P stylesheet of /m/:id): the comments "Sign in" link and the seat
   links reach 40 px on phones, and the h1 wraps instead of cutting the names with an ellipsis (UX-final-fixes 11). */
@media (max-width: 760px) {
  html:not(.embed) .pgc-signin a, html:not(.embed) .pg-seats .seat > a { display: inline-flex; align-items: center; min-height: 40px; }
  html:not(.embed) .match-title { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.3; }
}