.banner-nav { position:relative; display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:16px; border-bottom:1px solid #8eb8ff33; margin-bottom:24px; }
.banner-nav .brand { text-shadow:2px 2px #050a18; }
.banner-nav #logout,.banner-nav a.tesla-link { flex-shrink:0; min-height:48px; }
.lobby-banner { padding-top:16px; }
.intro>.brand { margin-bottom:30px; }
.choice-field { min-width:0; border:0; padding:0; margin:0; }
.choice-field legend { font-size:.8rem; font-weight:650; margin-bottom:8px; padding:0; color:var(--muted); }
.choice-buttons { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.choice-buttons[data-count="3"],.choice-buttons[data-count="6"] { grid-template-columns:repeat(3,minmax(0,1fr)); }
.choice-buttons[data-count="4"] { grid-template-columns:repeat(4,minmax(0,1fr)); }
.choice-buttons button { min-width:0; min-height:48px; padding:8px 4px; font-size:.78rem; position:relative; touch-action:manipulation; }
.choice-buttons button[aria-checked=true] { background:#1a3d43; border-color:var(--accent); box-shadow:inset 0 -3px var(--accent),3px 3px #050a18; color:#d6ffef; }
.codec-field .choice-buttons button { display:grid; justify-items:center; align-content:center; gap:4px; padding:12px 4px; }
.codec-field strong { font:600 1.55rem/1.1 Jersey,monospace; }
.codec-field small { font-size:.65rem; font-weight:400; color:var(--muted); }
.codec-field img { image-rendering:pixelated; }
.lobby-grid .settings-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.lobby-grid [data-choice-for=resolution-profile],.lobby-grid [data-choice-for=bitrate] { grid-column:1/-1; }
#player { display:grid; grid-template-columns:minmax(0,1fr) 360px; grid-template-rows:auto auto auto auto auto 1fr; grid-template-areas:'heading sidebar' 'video sidebar' 'stats sidebar' 'input sidebar' 'controls sidebar' 'help sidebar'; gap:0 24px; align-items:start; }
#player>* { min-width:0; }
.player-bar { grid-area:heading; flex-direction:row; align-items:center; flex-wrap:nowrap; min-height:60px; margin-bottom:14px; gap:12px; }
.player-bar>.session-title { display:flex; align-items:center; min-width:0; gap:12px; }
.session-title>img { flex-shrink:0; image-rendering:pixelated; }
.session-title>div { min-width:0; }
.player-bar strong { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin:0; font:600 1.55rem/1.2 Jersey,monospace; }
.player-actions { flex-wrap:nowrap; flex-shrink:0; gap:8px; }
.player-actions button { display:flex; align-items:center; justify-content:center; gap:8px; min-height:48px; white-space:nowrap; padding:8px 12px; }
.stop-icon { display:block; width:12px; height:12px; background:var(--red); box-shadow:2px 2px #803849; }
#stage { grid-area:video; width:100%; max-height:none; box-shadow:4px 4px #050a18; }
.stats { grid-area:stats; gap:6px 16px; padding:12px 4px; }
#input-only-hint { grid-area:input; }
#controls { grid-area:controls; flex-wrap:wrap; justify-content:center; }
#session-help { grid-area:help; }
#session-sidebar { grid-area:sidebar; border:2px solid var(--line); border-top:4px solid var(--blue); padding:18px; background:var(--panel); box-shadow:5px 5px #060c1b; }
.deck-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:18px; }
.deck-heading h2 { font:600 2rem/1 Jersey,monospace; margin:0; }
.deck-heading .eyebrow { font-size:.6rem; margin-bottom:8px; }
.deck-heading img { image-rendering:pixelated; }
.quick-switches { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:18px; }
.switch-card { min-height:48px; padding:10px 8px; border:2px solid var(--line); background:#0b1429; cursor:pointer; font-size:.74rem; white-space:normal; line-height:1.2; }
.switch-card:has(input:checked) { border-color:var(--accent); background:#1a3d43; }
#session-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; margin-bottom:20px; }
#session-tabs button { display:flex; align-items:center; justify-content:center; gap:6px; min-height:52px; padding:8px 4px; font:500 1.1rem Jersey,monospace; }
#session-tabs [aria-selected=true] { color:var(--blue); border-color:var(--blue); box-shadow:inset 0 -3px var(--blue),3px 3px #050a18; background:#213453; }
#session-sidebar [role=tabpanel] { min-height:560px; }
#performance-details { margin:0; }
#playing-profile .preset-grid { display:none; }
#playing-profile .settings-grid,.controller-settings .settings-grid { grid-template-columns:minmax(0,1fr); gap:14px; }
#playing-profile #video-mode-status { min-height:3.8em; font-size:.74rem; }
#playing-profile #profile-settings>.hint { font-size:.74rem; }
.auto-quality,.controller-settings .check { min-height:48px; white-space:normal; cursor:pointer; }
#apply-profile { width:100%; margin:8px 0; background:#264a47; border-color:var(--accent); }
.panel-caption { display:flex; gap:16px; align-items:center; margin:6px 0 24px; }
.panel-caption h3 { font:500 1.5rem Jersey,monospace; margin:0; }
.panel-caption p { margin:4px 0 0; font-size:.75rem; }
#audio-controls { grid-template-columns:1fr; padding:0 0 16px; gap:20px; }
#audio-controls .check { min-height:48px; }
#enable-audio { border-color:var(--accent); }
.controller-settings { margin-top:12px; }
.console-utilities { border-top:2px solid var(--line); margin-top:20px; padding-top:16px; }
.console-utilities>button,.console-utilities details button { width:100%; min-height:48px; }
.console-utilities details { margin-top:8px; }
#stream-diagnostics { margin-top:4px; }
@media(max-width:1100px) {
  #player { grid-template-columns:minmax(0,1fr) 330px; gap:0 18px; }
  #session-sidebar { padding:14px; }
  .player-actions button>span:not(.stop-icon) { display:none; }
  .player-actions button { width:48px; }
}
@media(max-width:900px) {
  #player { grid-template-columns:minmax(0,1fr); grid-template-rows:none; grid-template-areas:'heading' 'video' 'stats' 'input' 'controls' 'sidebar' 'help'; }
  #session-sidebar { margin:12px 0; }
  #session-sidebar [role=tabpanel] { min-height:0; }
  #playing-profile .settings-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #playing-profile [data-choice-for=resolution-profile],#playing-profile [data-choice-for=bitrate] { grid-column:1/-1; }
  .player-actions button>span:not(.stop-icon) { display:inline; }
  .player-actions button { width:auto; }
}
@media(max-width:600px) {
  .banner-nav .brand { font-size:1rem; gap:8px; }
  .banner-nav .brand img { width:28px; }
  .banner-nav #logout { padding:8px; font-size:.75rem; }
  .banner-nav a.tesla-link { display:none; }
  .lobby-banner { padding:12px 14px 24px; }
  .banner-nav { gap:6px; margin-bottom:24px; }
  .lobby-grid .settings-grid { grid-template-columns:1fr; }
  .player-bar { gap:8px; }
  .player-bar>.session-title { gap:8px; }
  .session-title>img { width:24px; height:30px; }
  .player-bar strong { font-size:1.2rem; }
  .player-actions button>span:not(.stop-icon) { display:none; }
  .player-actions button { width:48px; padding:8px; }
  #stream-status { font-size:.7rem; }
  .stats { font-size:.65rem; }
  #playing-profile .settings-grid { grid-template-columns:1fr; }
}
#player:fullscreen,#player.theater { display:block; }
#player:fullscreen #stage,#player.theater #stage { grid-area:auto; box-shadow:none; }
#playing-profile #profile-settings>.hint:not(#video-mode-status) { display:none; }
#playing-profile .codec-field .choice-buttons button { padding:8px 4px; gap:2px; }
#playing-profile .codec-field img { width:26px; height:26px; }
@media(max-width:1100px) {
  #session-tabs button { flex-direction:column; gap:4px; min-height:64px; }
}
#player:fullscreen #stage,#player.theater #stage { touch-action:none; }
#player:fullscreen .stage-banner,#player.theater .stage-banner { bottom:calc(16px + env(safe-area-inset-bottom, 0px)); left:50%; right:auto; transform:translateX(-50%); width:min(600px,calc(100% - 32px)); }
#fullscreen-exit { position:absolute; top:calc(12px + env(safe-area-inset-top, 0px)); right:calc(12px + env(safe-area-inset-right, 0px)); z-index:3; min-height:48px; display:flex; align-items:center; gap:10px; background:#101a31e8; border-color:var(--accent); padding:10px 16px; }
#player:not(:fullscreen):not(.theater) #fullscreen-exit { display:none; }

.play-actions { display:flex; align-items:stretch; gap:8px; grid-column:1/-1; grid-row:1; min-width:0; }
.play-actions .fullscreen-toggle { position:relative; min-height:48px; max-width:65%; padding:8px 10px; margin:0; cursor:pointer; border:2px solid var(--line); background:#101a31; white-space:normal; font-size:.75rem; line-height:1.2; }
.fullscreen-toggle img { flex-shrink:0; }
.play-actions .fullscreen-toggle input { position:absolute; width:1px; height:1px; min-height:0; padding:0; border:0; clip-path:inset(50%); overflow:hidden; }
.play-actions .fullscreen-toggle.is-selected { border-color:var(--accent); background:#1a3d43; color:#d6ffef; box-shadow:inset 0 -3px var(--accent); }
.fullscreen-toggle:focus-within { outline:3px solid var(--accent); outline-offset:4px; }
.play-actions .primary { flex:1; min-width:0; }
