#player-dialog{display:flex;flex-direction:column;max-height:100dvh;box-sizing:border-box}#player-dialog:not([open]){display:none}
#player-dialog .player-top{height:auto;min-height:72px;flex-shrink:0;flex-wrap:wrap;padding:12px 18px;gap:10px;box-sizing:border-box}
#player-dialog .player-top>div:first-child{flex:1 1 160px}#player-dialog .player-actions{flex:1 1 auto;justify-content:flex-end;flex-wrap:wrap;gap:8px}
#player-dialog .player-actions button{white-space:nowrap;padding:7px 12px;font-size:20px;min-height:40px}#player-dialog .disc-picker select{max-width:200px;width:auto}
#player-surface{position:relative;flex:1;min-height:0;outline-offset:-6px;cursor:default}#player-surface #player-frame{display:block;width:100%;height:100%;border:0}
#player-dialog[data-controls=true] #player-surface{cursor:pointer}#player-dialog[data-controls=true] #player-frame{pointer-events:none}
#player-dialog #player-surface.controller-focus{outline-offset:-6px!important;box-shadow:inset 0 0 0 7px var(--shadow)!important}
#player-dialog:fullscreen,#player-dialog[data-expanded=true]{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;margin:0;inset:0;border:0}
.player-panel{width:min(1300px,96vw);max-height:94dvh;box-sizing:border-box;padding:20px;background:var(--bg);overflow:auto}.player-panel::backdrop{background:#11121ce8}
.player-panel-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:20px}.player-panel-heading h2{font:24px Jersey,monospace;margin:0}
.player-panel-body{min-width:0}.player-panel .controller-preview-panel{position:static}.site-controller-settings{margin-top:24px;border-top:1px solid var(--line);padding-top:20px}.site-controller-settings.mapping-row{display:block}
@media(max-width:620px){#player-dialog .player-top{padding:8px;gap:6px}#player-dialog .player-top>div:first-child{flex-basis:100%}#player-dialog .player-actions{justify-content:flex-start}#player-dialog .player-actions button{font-size:18px;padding:6px 9px;min-height:36px}.player-panel{padding:14px}.player-panel-heading{flex-wrap:wrap}}

/* Only the game surface enters native fullscreen; the banner stays outside. */
#player-surface:fullscreen{display:block;width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#000;outline:none;cursor:default}
#player-surface:fullscreen #player-frame{display:block;width:100%;height:100%;border:0}

/* Compact banner: Save & Exit stays at the top-right on every viewport. */
#player-dialog .player-top{display:grid;grid-template-columns:minmax(120px,1fr) auto auto;min-height:56px;padding:8px 14px;gap:8px 12px}
#player-dialog .player-top>div:first-child{grid-column:1;grid-row:1;min-width:0}
#player-dialog .player-actions{grid-column:2;grid-row:1;min-width:0;justify-content:flex-end}
#player-dialog #exit-player{grid-column:3;grid-row:1;justify-self:end;white-space:nowrap;padding:7px 12px;font-size:20px;min-height:40px}
@media(max-width:1000px){
 #player-dialog .player-top{grid-template-columns:minmax(0,1fr) auto}
 #player-dialog .player-actions{grid-column:1/-1;grid-row:2;justify-content:flex-start}
 #player-dialog #exit-player{grid-column:2}
}
@media(max-width:620px){
 #player-dialog .player-top{padding:8px;gap:6px}
 #player-dialog #exit-player{font-size:18px;padding:6px 9px;min-height:36px}
}