:root {
  color-scheme: dark;
  --bg: #07090c;
  --panel: #10151b;
  --panel-strong: #151c23;
  --line: #29323b;
  --muted: #99a5af;
  --red: #d51b22;
  --green: #67db9b;
  --blue: #8fdcf0;
  --text: #f5f7f8;
  --header-height: 64px;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { min-width: 280px; background: var(--bg); }
body { min-height: 100dvh; margin: 0; background: radial-gradient(circle at 50% -20%, #1a2630 0, transparent 38%), var(--bg); color: var(--text); }
button, input, select { font: inherit; }
button { min-height: 46px; border: 1px solid transparent; border-radius: 12px; padding: 0 15px; background: #20272e; color: #fff; font-weight: 820; cursor: pointer; touch-action: manipulation; }
button:active { transform: scale(.975); }
button:disabled { opacity: .42; pointer-events: none; }
button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible { outline: 3px solid rgba(143, 220, 240, .82); outline-offset: 2px; }
[aria-busy="true"] { cursor: progress; }

.remote-shell { width: min(900px, 100%); margin: auto; padding: calc(6px + env(safe-area-inset-top)) 18px calc(96px + env(safe-area-inset-bottom)); }
header { position: sticky; z-index: 30; top: 0; display: flex; align-items: center; gap: 11px; min-height: var(--header-height); margin: 0 -7px 8px; padding: 7px; background: rgba(7, 9, 12, .94); backdrop-filter: blur(16px); }
header strong, header small { display: block; }
header small, .muted { color: var(--muted); }
header i { width: 10px; height: 10px; flex: 0 0 auto; border-radius: 50%; background: #737d84; }
header i.online { background: var(--green); box-shadow: 0 0 16px var(--green); }
.connection-label { margin-left: auto; color: var(--muted); font-size: .72rem; font-weight: 780; }
.mark { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; flex: 0 0 auto; background: var(--red); font-weight: 950; }

.panel { border: 1px solid var(--line); border-radius: 20px; background: rgba(16, 21, 27, .97); padding: 20px; box-shadow: 0 14px 40px rgba(0, 0, 0, .16); }
.eyebrow { margin: 0 0 6px; color: var(--blue); font-size: .65rem; font-weight: 900; letter-spacing: .17em; }
.panel h1 { margin: 0 0 14px; font-size: clamp(2rem, 9vw, 3.4rem); line-height: .95; }
h2 { margin: 0; font-size: 1.15rem; }
label { display: grid; gap: 7px; color: #cbd2d7; font-size: .78rem; font-weight: 800; }
input, select { width: 100%; min-height: 48px; border: 1px solid var(--line); border-radius: 12px; background: #090d11; color: #fff; padding: 0 13px; }
form { display: grid; gap: 14px; margin-top: 22px; }
form button, .play { background: var(--red); }
.danger { color: #ffc4c6; background: rgba(240, 33, 41, .13); border-color: rgba(240, 33, 41, .3); }
.status { min-height: 1.4em; color: #ff8b8f; }
.paired-confirmation { margin: 0 0 10px; padding: 12px 14px; border: 1px solid rgba(103, 219, 155, .42); border-radius: 13px; background: rgba(103, 219, 155, .1); color: #aaf1c8; font-weight: 800; }

.now-playing-dock { position: sticky; z-index: 20; top: calc(var(--header-height) + env(safe-area-inset-top)); margin: 0 0 18px; padding: 7px 0 10px; background: linear-gradient(180deg, rgba(7, 9, 12, .98) 82%, rgba(7, 9, 12, 0)); backdrop-filter: blur(16px); }
.target-compact { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; }
.target-compact label { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 10px; }
.target-compact select { min-height: 44px; padding: 0 11px; }
#move-session { min-height: 44px; padding: 0 12px; border-color: rgba(143, 220, 240, .3); background: rgba(28, 80, 97, .34); color: #c9f3ff; font-size: .7rem; }
.now-playing { position: relative; display: grid; grid-template-columns: 76px minmax(0, 1fr) 42px; gap: 12px; align-items: center; margin: 8px 0; padding: 9px; border: 1px solid rgba(255, 255, 255, .075); border-radius: 17px; background: linear-gradient(135deg, rgba(22, 29, 36, .98), rgba(10, 14, 18, .96)); touch-action: none; user-select: none; }
.now-copy { min-width: 0; }
.now-playing h1 { margin: 0 0 4px; font-size: 1.12rem; line-height: 1.08; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.now-playing p { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.art { width: 76px; aspect-ratio: 1; border-radius: 13px; overflow: hidden; background: linear-gradient(145deg, #202a32, #0c1014); display: grid; place-items: center; }
.art img { width: 100%; height: 100%; object-fit: cover; }
.art span { font-size: 1.6rem; font-weight: 950; }
.now-chevron { min-width: 42px; min-height: 52px; padding: 0; background: transparent; color: #c9d0d5; font-size: 1.8rem; }
.gesture-hint { display: none; grid-column: 1 / -1; text-align: center; color: #7f8b94; font-size: .65rem; }
.programme-context { color: #c7d1d8; font-size: .72rem; }
.playback-badges { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.playback-badges span { flex: 0 0 auto; padding: 5px 8px; border: 1px solid var(--line); border-radius: 999px; color: #b8c2c9; background: #0d1217; font-size: .66rem; font-weight: 760; }
.playback-badges span.healthy { color: #aaf1c8; border-color: rgba(103, 219, 155, .35); }
.playback-badges span.warning { color: #ffd19b; border-color: rgba(255, 177, 87, .4); }

.remote-panel { animation: panel-in .16s ease-out; }
@keyframes panel-in { from { opacity: .55; transform: translateY(4px); } }
.timeline input, .volume input { min-height: 38px; padding: 0; accent-color: var(--red); }
.timeline > div { display: flex; justify-content: space-between; color: var(--muted); font-size: .72rem; }
.transport { display: grid; grid-template-columns: 1fr 1.25fr 1fr; gap: 11px; margin: 15px 0 11px; }
.transport button { min-height: 64px; border-radius: 999px; font-size: 1rem; }
.transport .play { font-size: 1.08rem; }
.primary-controls, .session-controls, .provider-actions { display: grid; gap: 8px; }
.primary-controls { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.primary-controls button { padding: 0 8px; font-size: .77rem; }
.primary-controls .context-hidden { display: none; }
.fix-control { color: #bfefff; border-color: rgba(143, 220, 240, .3); background: rgba(28, 80, 97, .34); }
.session-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 10px; }
.provider-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 14px 0 0; }
.provider-actions button[aria-pressed="true"] { color: #ffadb0; border-color: rgba(240, 33, 41, .34); }
.volume { margin-top: 15px; }

.options { margin-top: 16px; padding: 0; overflow: visible; }
.options summary { min-height: 54px; display: flex; align-items: center; cursor: pointer; padding: 0 20px; border-radius: 20px; font-weight: 900; touch-action: manipulation; }
.options[open] summary { border-bottom: 1px solid var(--line); border-radius: 20px 20px 0 0; }
.option-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 18px 20px 20px; }
.option-fields:empty::after { content: 'Options become available when media is selected'; grid-column: 1 / -1; color: var(--muted); font-size: .75rem; }

.queue { padding: 16px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.section-heading span { color: var(--muted); font-size: .72rem; }
.queue-tools { display: grid; grid-template-columns: 1fr 1fr auto; gap: 7px; margin-bottom: 12px; }
.queue-tools button { min-height: 44px; padding: 0 10px; font-size: .72rem; }
.empty-state { margin: 18px 5px; color: var(--muted); text-align: center; }
.queue-list { display: grid; gap: 8px; }
.queue-item { display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; gap: 9px; align-items: center; border: 1px solid var(--line); border-radius: 13px; padding: 6px; background: #0b0f13; }
.queue-item.dragging { opacity: .5; border-color: var(--blue); }
.queue-item.active { border-color: rgba(103, 219, 155, .55); }
.queue-item img, .queue-item .placeholder { width: 58px; height: 44px; border-radius: 8px; object-fit: cover; display: grid; place-items: center; background: #161d23; }
.queue-copy { min-width: 0; border: 0; background: none; padding: 0; text-align: left; }
.queue-copy strong, .queue-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.queue-copy small { margin-top: 3px; color: var(--muted); }
.queue-actions { display: grid; grid-template-columns: repeat(3, 44px); gap: 4px; }
.queue-actions button { min-width: 44px; min-height: 44px; padding: 0; color: #ced6dc; background: transparent; }
.queue-actions .queue-remove { color: #ffb1b4; }
.queue-readiness { color: var(--green) !important; }

.browse { padding: 14px; }
.provider-tabs { display: flex; overflow-x: auto; gap: 7px; padding-bottom: 2px; scrollbar-width: thin; }
.provider-tabs button { min-height: 44px; white-space: nowrap; font-size: .75rem; }
.provider-tabs button.active { background: #fff; color: #080b0e; }
.browse form { grid-template-columns: minmax(0, 1fr) auto auto; margin-top: 14px; }
.voice-search { min-width: 48px; padding: 0; font-size: 1.25rem; background: #19212a; }
.field-note { margin: 8px 2px 0; color: var(--green); font-size: .75rem; }
.shelves { display: grid; gap: 20px; }
.shelf-heading { display: flex; align-items: center; justify-content: space-between; margin: 4px 0 9px; }
.shelf-heading h2 { font-size: 1rem; }
.shelf-items, .results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.result { position: relative; overflow: hidden; text-align: left; background: #151b21; border: 1px solid var(--line); border-radius: 13px; }
.result-play { width: 100%; padding: 0; border-radius: 0; background: transparent; text-align: left; }
.result img, .result .placeholder { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; background: #090c10; display: grid; place-items: center; }
.result strong, .result small { display: block; padding: 0 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.result strong { padding-top: 9px; }
.result small { padding-top: 3px; padding-bottom: 10px; color: var(--muted); }
.queue-add { position: absolute; right: 7px; top: 7px; min-width: 44px; min-height: 44px; padding: 0; border-color: rgba(255, 255, 255, .28); background: rgba(4, 6, 8, .88); font-size: 1.15rem; }
.prepare-item, .check-item { width: calc(50% - 12px); min-height: 44px; margin: 0 3px 8px 8px; padding: 0 7px; border: 1px solid rgba(255,255,255,.15); border-radius: 9px; background: #202833; font-size: .66rem; font-weight: 850; }
.check-item { margin-left: 0; }

.devices-panel { display: grid; gap: 16px; }
.device-list { display: grid; gap: 8px; }
.device-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: stretch; min-height: 66px; padding: 5px; border: 1px solid var(--line); border-radius: 13px; background: #0b0f13; text-align: left; }
.device-select { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; min-width: 0; min-height: 56px; padding: 7px 8px; border: 0; background: transparent; text-align: left; }
.device-card strong, .device-card small { display: block; }
.device-card small { margin-top: 4px; color: var(--muted); }
.device-card.active { border-color: rgba(103, 219, 155, .55); }
.device-card span { color: var(--green); font-size: .72rem; }
.handoff-button { align-self: center; min-height: 48px; padding: 0 13px; border-color: rgba(143, 220, 240, .3); background: rgba(28, 80, 97, .34); color: #c9f3ff; font-size: .72rem; white-space: nowrap; }
.remote-account { padding: 12px; border-radius: 12px; background: #0b0f13; color: var(--muted); font-size: .76rem; line-height: 1.5; }
.phone-preferences { display: grid; gap: 8px; }
.switch-row { grid-template-columns: 24px minmax(0, 1fr); align-items: center; min-height: 46px; padding: 0 10px; border: 1px solid var(--line); border-radius: 12px; background: #0b0f13; }
.switch-row input { width: 20px; min-height: 20px; padding: 0; accent-color: var(--red); }
.unpair-button { color: #ffb1b4; background: transparent; border-color: rgba(240, 33, 41, .28); }

.remote-tabs { position: fixed; z-index: 40; left: 50%; bottom: 0; transform: translateX(-50%); display: grid; grid-template-columns: repeat(4, 1fr); width: min(900px, 100%); padding: 7px max(10px, env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left)); border-top: 1px solid var(--line); background: rgba(8, 11, 14, .96); backdrop-filter: blur(18px); }
.remote-tabs button { min-height: 54px; padding: 3px 5px; border-radius: 10px; background: transparent; color: var(--muted); font-size: .7rem; }
.remote-tabs button span { display: block; margin-bottom: 2px; font-size: 1.15rem; }
.remote-tabs button.active { color: #fff; background: #1a2128; }
.remote-note { margin: 22px 12px; color: var(--muted); font-size: .7rem; line-height: 1.5; text-align: center; }
.command-feedback { position: fixed; z-index: 60; left: 50%; bottom: calc(78px + env(safe-area-inset-bottom)); transform: translateX(-50%); width: min(420px, calc(100% - 28px)); padding: 13px 16px; border: 1px solid var(--line); border-radius: 14px; background: rgba(16, 21, 27, .98); box-shadow: 0 16px 50px rgba(0, 0, 0, .5); text-align: center; font-weight: 800; }
.command-feedback.pending { color: #cbd2d7; }
.command-feedback.success { color: #aaf1c8; border-color: rgba(103, 219, 155, .4); }
.command-feedback.error { color: #ffb1b4; border-color: rgba(240, 33, 41, .45); }

body.one-handed .remote-panel[data-remote-panel="remote"] { padding-bottom: 82px; }
body.one-handed .remote-panel[data-remote-panel="remote"] .transport { position: fixed; z-index: 38; left: 50%; bottom: calc(68px + env(safe-area-inset-bottom)); transform: translateX(-50%); width: min(520px, calc(100% - 20px)); margin: 0; padding: 8px; border: 1px solid var(--line); border-radius: 999px; background: rgba(10, 14, 18, .96); backdrop-filter: blur(16px); }

@media (max-width: 520px) {
  .remote-shell { padding-right: 11px; padding-left: 11px; }
  .panel { padding: 15px; border-radius: 17px; }
  .now-playing-dock { top: calc(60px + env(safe-area-inset-top)); }
  .now-playing { grid-template-columns: 64px minmax(0, 1fr) 36px; gap: 9px; padding: 7px; }
  .art { width: 64px; }
  .now-playing h1 { font-size: 1rem; }
  .now-playing .eyebrow { margin-bottom: 3px; }
  .transport { gap: 7px; }
  .transport button { min-height: 58px; padding: 0 9px; }
  .primary-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .primary-controls .fix-control { grid-column: 1 / -1; }
  .option-fields { grid-template-columns: 1fr; padding: 15px; }
  .browse { padding: 11px; }
  .browse form { grid-template-columns: minmax(0, 1fr) 48px; }
  .browse form button[type="submit"] { grid-column: 1 / -1; }
  .queue-item { grid-template-columns: 52px minmax(0, 1fr) auto; }
  .queue-item img, .queue-item .placeholder { width: 52px; height: 42px; }
  .queue-actions { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(44px, 1fr)); }
  .device-card { grid-template-columns: minmax(0, 1fr); }
  .handoff-button { width: 100%; }
}

@media (min-width: 560px) { .results, .shelf-items { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 760px) { .option-fields { grid-template-columns: repeat(4, minmax(0, 1fr)); } .results, .shelf-items { grid-template-columns: repeat(4, minmax(0, 1fr)); } .gesture-hint { display: block; } }
@media (max-height: 720px) and (orientation: landscape) { :root { --header-height: 54px; } .remote-shell { padding-top: env(safe-area-inset-top); } header { min-height: 54px; } .now-playing-dock { position: relative; top: auto; } .now-playing { grid-template-columns: 58px minmax(0, 1fr) 38px; } .art { width: 58px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }

/* TESLA-MEDIA-93: phone-first companion with a purpose-built desktop layout. */
:root{--remote-max:1180px;--remote-nav:70px}
.remote-shell{width:min(var(--remote-max),100%);padding-bottom:calc(92px + env(safe-area-inset-bottom))}
header{margin-bottom:12px}
.now-playing-dock{border-bottom:1px solid rgba(255,255,255,.07)}
.single-player .target-compact label{grid-template-columns:auto minmax(0,1fr)}
.single-player .target-compact select{border-color:transparent;background:transparent;color:#d8dfe3;font-weight:850;pointer-events:none;appearance:none}
.playback-badges{align-items:center}
.playback-badges span{padding:5px 9px}
.remote-panel[data-remote-panel="remote"]{display:flex;flex-direction:column;gap:12px}
.remote-panel[data-remote-panel="remote"]>.timeline{order:1}
.remote-panel[data-remote-panel="remote"]>.transport{order:2;margin:2px 0}
.remote-panel[data-remote-panel="remote"]>.session-controls{order:3;margin:0}
.remote-panel[data-remote-panel="remote"]>.primary-controls{order:4}
.remote-panel[data-remote-panel="remote"]>.volume{order:5;margin:0}
.remote-panel[data-remote-panel="remote"]>.provider-actions{order:6;margin:0}
.remote-panel[data-remote-panel="remote"]>.options{order:7;margin:0}
.session-controls button{min-height:50px}
.options summary{min-height:50px}
.command-feedback{width:auto;max-width:calc(100% - 28px);padding:9px 13px;border-radius:999px;font-size:.76rem;white-space:nowrap}
.remote-tabs{width:min(var(--remote-max),100%)}

@media(min-width:900px){
  .remote-shell{padding-inline:24px}
  #control-view{display:grid;grid-template-columns:minmax(0,1.28fr) minmax(330px,.72fr);grid-template-areas:'confirm confirm' 'dock dock' 'panel note';gap:0 22px}
  #paired-confirmation{grid-area:confirm}
  .now-playing-dock{grid-area:dock;display:grid;grid-template-columns:minmax(340px,.4fr) minmax(0,1fr);grid-template-areas:'target now' 'badges now';gap:7px 18px;align-items:center;padding:9px 0 15px}
  .target-compact{grid-area:target}.now-playing{grid-area:now;margin:0}.playback-badges{grid-area:badges}
  .remote-panel{grid-area:panel}
  .remote-note{grid-area:note;align-self:start;position:sticky;top:190px;margin:0;padding:20px;border:1px solid var(--line);border-radius:16px;background:rgba(16,21,27,.88);text-align:left}
  .remote-panel[data-remote-panel="remote"]{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);grid-template-areas:'timeline side' 'transport side' 'volume side';gap:13px 20px;align-items:start}
  .remote-panel[data-remote-panel="remote"]>.timeline{grid-area:timeline;order:unset;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:rgba(16,21,27,.92)}
  .remote-panel[data-remote-panel="remote"]>.transport{grid-area:transport;order:unset}
  .remote-panel[data-remote-panel="remote"]>.volume{grid-area:volume;order:unset;padding:14px 18px;border:1px solid var(--line);border-radius:16px;background:rgba(16,21,27,.92)}
  .remote-panel[data-remote-panel="remote"]>.primary-controls,.remote-panel[data-remote-panel="remote"]>.session-controls,.remote-panel[data-remote-panel="remote"]>.provider-actions,.remote-panel[data-remote-panel="remote"]>.options{grid-column:2;order:unset}
  .remote-panel[data-remote-panel="remote"]>.primary-controls{grid-row:1;grid-template-columns:repeat(2,minmax(0,1fr));padding:12px;border:1px solid var(--line);border-radius:16px;background:rgba(16,21,27,.92)}
  .remote-panel[data-remote-panel="remote"]>.session-controls{grid-row:2}
  .remote-panel[data-remote-panel="remote"]>.provider-actions{grid-row:3}
  .remote-panel[data-remote-panel="remote"]>.options{grid-row:4}
  .remote-tabs{left:auto;right:24px;bottom:18px;transform:none;width:auto;grid-template-columns:repeat(4,118px);padding:6px;border:1px solid var(--line);border-radius:16px;background:rgba(8,11,14,.96);box-shadow:0 18px 55px rgba(0,0,0,.4)}
  .remote-tabs button{min-height:48px}
  .command-feedback{bottom:90px}
  .results,.shelf-items{grid-template-columns:repeat(4,minmax(0,1fr))}
}

@media(max-width:520px){
  .remote-shell{padding-top:env(safe-area-inset-top);padding-bottom:calc(86px + env(safe-area-inset-bottom))}
  header{min-height:56px;margin-bottom:4px}
  header small{display:none}.connection-label{font-size:.64rem}
  .now-playing-dock{top:calc(56px + env(safe-area-inset-top));margin-bottom:12px;padding-bottom:9px}
  .target-compact label{font-size:.67rem}
  .single-player .target-compact{display:none}
  .now-playing{margin-top:3px}
  .playback-badges span{font-size:.6rem}
  .remote-panel[data-remote-panel="remote"]{gap:10px}
  .session-controls{grid-template-columns:repeat(2,minmax(0,1fr))}
  .primary-controls{grid-template-columns:repeat(3,minmax(0,1fr))}
  .primary-controls .fix-control{grid-column:auto}
  .primary-controls button{min-height:48px;font-size:.7rem}
  .provider-actions button{min-height:48px}
  .options summary{padding-inline:15px}
  .remote-tabs{height:calc(var(--remote-nav) + env(safe-area-inset-bottom));padding-top:5px}
  .remote-tabs button{min-height:54px;font-size:.62rem}.remote-tabs button span{font-size:1rem}
  .command-feedback{bottom:calc(76px + env(safe-area-inset-bottom));font-size:.7rem}
}

/* TESLA-MEDIA-96: synchronized Privacy Screen control. */
.privacy-control{border-color:rgba(255,255,255,.14)}
.privacy-control[aria-pressed="true"]{border-color:rgba(240,33,41,.48);background:rgba(240,33,41,.2);color:#ffc5c7;box-shadow:inset 0 0 0 1px rgba(240,33,41,.12)}
@media(min-width:521px) and (max-width:899px){.primary-controls{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* TESLA-MEDIA-102: contextual, multi-touch phone gamepad. */
.remote-tabs button b{display:block;font:inherit}
.game-controller{position:relative;width:100%;min-height:min(590px,calc(100dvh - 230px));padding:14px;border:1px solid var(--line);border-radius:22px;background:radial-gradient(circle at 50% 10%,rgba(41,51,63,.74),rgba(11,15,20,.98) 58%);touch-action:none;user-select:none;-webkit-user-select:none;overscroll-behavior:contain}
.game-controller[hidden]{display:none!important}
.game-controller-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.game-controller-head h2{font-size:1.24rem}.game-controller-head p{margin:4px 0 0}.game-controller-head .danger{min-height:44px;padding:0 16px;flex:0 0 auto}
.game-controller-surface{display:grid;grid-template-columns:minmax(150px,1fr) minmax(100px,.72fr) minmax(150px,1fr);align-items:center;gap:clamp(10px,3vw,30px);min-height:400px;padding:28px 8px 10px}
.game-left-controls,.game-system-controls,.game-face-controls{display:grid;place-items:center;min-width:0}
.game-system-controls{align-self:stretch;align-content:center;gap:22px}
.game-shoulders{display:flex;justify-content:space-between;gap:10px;min-height:54px}
.game-shoulders:empty{min-height:0}
.game-shoulders .game-button{flex:1;max-width:180px;border-radius:13px}
.game-button{min-width:58px;min-height:58px;padding:8px;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:linear-gradient(145deg,#252e37,#10151b);box-shadow:0 8px 18px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.08);color:#fff;font-size:.86rem;font-weight:900;touch-action:none}
.game-button.pressed{transform:translateY(2px) scale(.95);border-color:#fff;background:var(--red);box-shadow:0 2px 8px rgba(0,0,0,.35)}
.game-button.system{min-width:70px;min-height:38px;border-radius:999px;font-size:.68rem}
.game-system-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.game-dpad{position:relative;width:clamp(138px,26vw,200px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#222a32 0 20%,#11171d 22% 100%);border:1px solid rgba(255,255,255,.12);box-shadow:0 14px 28px rgba(0,0,0,.38),inset 0 0 0 16px rgba(255,255,255,.025);touch-action:none}
.game-dpad::before,.game-dpad::after{content:"";position:absolute;inset:18% 39%;border-radius:8px;background:#2c353e}.game-dpad::after{inset:39% 18%}
.game-dpad span{position:absolute;z-index:1;color:#aeb8c0;font-size:1.25rem;font-weight:900;pointer-events:none}.game-dpad .up{top:8%;left:50%;transform:translateX(-50%)}.game-dpad .down{bottom:8%;left:50%;transform:translateX(-50%)}.game-dpad .left{left:9%;top:50%;transform:translateY(-50%)}.game-dpad .right{right:9%;top:50%;transform:translateY(-50%)}
.game-dpad.pressed{border-color:rgba(240,33,41,.62);box-shadow:0 10px 24px rgba(0,0,0,.38),0 0 22px rgba(240,33,41,.16)}
.game-dpad.compact{width:92px;box-shadow:0 9px 20px rgba(0,0,0,.32),inset 0 0 0 10px rgba(255,255,255,.025)}.game-dpad.compact span{font-size:.85rem}
.game-stick{position:relative;width:clamp(140px,27vw,210px);aspect-ratio:1;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:radial-gradient(circle,#151c23 0 42%,#090d11 44% 62%,#1d252d 64%);box-shadow:0 16px 32px rgba(0,0,0,.4),inset 0 0 26px rgba(0,0,0,.6);touch-action:none}
.game-stick span{position:absolute;inset:24%;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:radial-gradient(circle at 35% 30%,#3d4853,#171e25 66%);box-shadow:0 9px 16px rgba(0,0,0,.48);pointer-events:none;transition:transform 45ms linear}
.game-face-controls{position:relative;width:clamp(160px,29vw,220px);height:clamp(160px,29vw,220px)}
.game-face-controls.diamond .game-button{position:absolute}.game-face-controls.diamond .top{top:0;left:50%;transform:translateX(-50%)}.game-face-controls.diamond .bottom{bottom:0;left:50%;transform:translateX(-50%)}.game-face-controls.diamond .left{left:0;top:50%;transform:translateY(-50%)}.game-face-controls.diamond .right{right:0;top:50%;transform:translateY(-50%)}
.game-face-controls.diamond .game-button.pressed.top,.game-face-controls.diamond .game-button.pressed.bottom{transform:translateX(-50%) translateY(2px) scale(.95)}.game-face-controls.diamond .game-button.pressed.left,.game-face-controls.diamond .game-button.pressed.right{transform:translateY(-50%) translateY(2px) scale(.95)}
.game-face-controls.pair{display:flex;align-items:center;justify-content:center;gap:14px}
.game-face-controls.six,.game-face-controls.grid{display:grid;grid-template-columns:repeat(3,minmax(48px,1fr));grid-template-rows:repeat(2,minmax(48px,1fr));gap:10px;width:min(250px,100%);height:auto}
.game-face-controls.six .game-button,.game-face-controls.grid .game-button{min-width:52px;width:100%;border-radius:18px}
.game-face-controls.keypad{display:grid;grid-template-columns:repeat(3,minmax(42px,1fr));grid-template-rows:repeat(4,minmax(40px,1fr));gap:7px;width:min(220px,100%);height:auto}.game-face-controls.keypad .game-button{min-width:44px;min-height:44px;width:100%;border-radius:13px}
.game-orientation-note{margin:8px 0 0;color:var(--muted);font-size:.68rem;text-align:center}
.game-controller.waiting .game-controller-surface,.game-controller.waiting .game-shoulders{opacity:.38;pointer-events:none;filter:saturate(.4)}
.game-mode .playback-badges{display:none}.game-mode .now-playing{grid-template-columns:64px minmax(0,1fr) 42px}.game-mode .art{width:64px}
.game-mode .remote-panel[data-remote-panel="remote"]{display:block!important}.game-mode .remote-panel[data-remote-panel="remote"]>:not(.game-controller){display:none!important}
.game-mode .remote-note{display:none}.game-mode .remote-tabs{grid-template-columns:repeat(2,minmax(110px,1fr))}

@media(max-width:620px){
  .game-controller{min-height:calc(100dvh - 205px);padding:10px;border-radius:17px}
  .game-controller-head{margin-bottom:4px}.game-controller-head h2{font-size:1.05rem}.game-controller-head .muted{font-size:.7rem}.game-controller-head .danger{min-height:40px;padding-inline:11px;font-size:.7rem}
  .game-controller-surface{grid-template-columns:minmax(112px,1fr) minmax(68px,.55fr) minmax(112px,1fr);gap:7px;min-height:330px;padding:17px 0 2px}
  .game-dpad{width:min(34vw,150px)}.game-stick{width:min(35vw,155px)}.game-face-controls{width:min(36vw,160px);height:min(36vw,160px)}
  .game-button{min-width:48px;min-height:48px;font-size:.76rem}.game-button.system{min-width:58px;min-height:34px;font-size:.58rem}.game-dpad.compact{width:70px}
  .game-shoulders{min-height:44px}.game-shoulders .game-button{min-height:42px}
}

@media(min-width:900px){.game-mode #control-view{grid-template-columns:1fr;grid-template-areas:'confirm' 'dock' 'panel'}.game-mode .remote-panel[data-remote-panel="remote"]{grid-column:1}}

@media(max-height:560px) and (orientation:landscape){
  .remote-shell{width:100%;padding:4px 10px calc(66px + env(safe-area-inset-bottom))}.remote-shell>header{display:none}.game-mode .now-playing-dock{position:fixed;z-index:45;top:5px;left:10px;width:min(310px,32vw);padding:0;background:transparent}.game-mode .target-compact,.game-mode .playback-badges,.game-mode .gesture-hint{display:none}.game-mode .now-playing{grid-template-columns:46px minmax(0,1fr);padding:5px;margin:0;background:rgba(7,9,12,.82);backdrop-filter:blur(12px)}.game-mode .art{width:46px}.game-mode .now-chevron{display:none}.game-mode .now-playing h1{font-size:.8rem}.game-mode .now-copy .muted{font-size:.62rem}
  .game-mode .remote-panel[data-remote-panel="remote"]{display:block}.game-controller{height:calc(100dvh - 74px);min-height:0;padding:8px 12px}.game-controller-head{position:absolute;z-index:2;top:8px;right:12px}.game-controller-head>div{display:none}.game-controller-surface{height:calc(100% - 52px);min-height:0;padding:2px 5vw 0;grid-template-columns:1fr minmax(90px,.65fr) 1fr}.game-shoulders{margin:0 24vw}.game-orientation-note{display:none}.game-dpad,.game-stick{width:min(31vh,190px)}.game-face-controls{width:min(34vh,210px);height:min(34vh,210px)}.game-dpad.compact{width:min(18vh,90px)}
  .game-mode .remote-tabs{right:10px;bottom:6px;grid-template-columns:repeat(2,94px)}.game-mode .remote-tabs button{min-height:42px}.game-mode .command-feedback{bottom:58px}
}

/* TESLA-MEDIA-103: full-viewport, forgiving contextual game controller. */
body[data-game-touch="comfortable"]{--game-target:74px;--game-visible:58px;--game-directional:164px}
body[data-game-touch="large"]{--game-target:88px;--game-visible:68px;--game-directional:194px}
body[data-game-touch="maximum"]{--game-target:100px;--game-visible:78px;--game-directional:224px}
body.game-mode{position:fixed;inset:0;overflow:hidden;overscroll-behavior:none;background:#05070a}
body.game-mode .remote-shell{position:fixed;inset:0;width:100%;max-width:none;height:100dvh;margin:0;padding:max(6px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));overflow:hidden}
body.game-mode .remote-shell>header,body.game-mode .paired-confirmation,body.game-mode .now-playing-dock,body.game-mode .remote-tabs,body.game-mode .remote-note{display:none!important}
body.game-mode #control-view{display:block!important;width:100%;height:100%;overflow:hidden}
body.game-mode .remote-panel[data-remote-panel="remote"]{display:block!important;width:100%;height:100%;padding:0}
body.game-mode .game-controller{display:grid!important;grid-template-rows:auto auto minmax(0,1fr) auto;width:100%;height:100%;min-height:0;margin:0;padding:clamp(7px,1.5vw,14px);border-radius:clamp(14px,2.4vw,24px);overflow:hidden;background:radial-gradient(circle at 50% -15%,rgba(54,67,80,.9),rgba(10,14,19,.99) 58%)}
.game-controller-head{display:grid;grid-template-columns:minmax(110px,1fr) auto;align-items:start;min-width:0;min-height:48px;margin:0;gap:10px}
.game-controller-title{min-width:0}.game-controller-title .eyebrow{margin-bottom:2px}.game-controller-title h2,.game-controller-title p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.game-controller-title h2{font-size:clamp(.95rem,2.6vw,1.25rem)}.game-controller-title .muted{font-size:clamp(.62rem,1.8vw,.76rem)}
.game-controller-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;min-width:0;gap:7px}
.game-touch-setting{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:.62rem;white-space:nowrap}.game-touch-setting select{width:auto;min-width:112px;min-height:40px;padding:0 28px 0 9px;font-size:.68rem}
.game-controller-actions button{min-height:48px;padding:0 12px;font-size:.68rem}
.game-controller-actions #game-exit{color:#fff;background:#216a8a;border-color:#2c89ad;box-shadow:0 8px 22px rgba(44,137,173,.24)}
.game-controller-actions #game-exit:disabled{color:#9eacc4;background:rgba(44,137,173,.12);border-color:rgba(44,137,173,.25);box-shadow:none}.game-more-actions{position:relative;min-width:0}.game-more-actions>summary{display:flex;align-items:center;justify-content:center;min-height:48px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:var(--panel-strong);font-weight:850;cursor:pointer;list-style:none}.game-more-actions>summary::-webkit-details-marker{display:none}.game-more-actions:not([open])>div{display:none}.game-more-actions>div{position:absolute;z-index:40;right:0;top:calc(100% + 6px);display:grid;width:min(230px,calc(100vw - 28px));gap:6px;padding:8px;border:1px solid var(--line);border-radius:14px;background:#111821;box-shadow:0 20px 55px #000b}.game-more-actions>div button{width:100%;min-height:48px}.game-more-actions>div .game-touch-setting{display:grid;grid-template-columns:1fr;gap:5px;white-space:normal}.game-more-actions>div .game-touch-setting select{width:100%;min-height:48px}.game-more-actions>div .danger{color:#ffc0c3;border-color:rgba(240,33,41,.35)}
.game-shoulders{align-items:center;min-height:var(--game-target);padding:2px clamp(4px,3vw,30px);gap:clamp(10px,5vw,60px)}
.game-shoulders:empty{min-height:10px}
.game-shoulders .game-button{max-width:260px;min-height:var(--game-target)}
.game-controller-surface{align-self:stretch;grid-template-columns:minmax(0,1fr) minmax(58px,.55fr) minmax(0,1fr);gap:clamp(4px,2vw,24px);width:100%;height:100%;min-height:0;padding:0 clamp(2px,2vw,24px)}
.game-left-controls,.game-face-controls{align-self:center}.game-system-controls{align-self:stretch;align-content:center;gap:clamp(8px,3vh,24px)}
.game-button{display:grid;place-items:center;min-width:var(--game-target);min-height:var(--game-target);padding:0;border:0;background:transparent;box-shadow:none;overflow:visible}
.game-button-face{display:grid;place-items:center;width:var(--game-visible);height:var(--game-visible);border:1px solid rgba(255,255,255,.3);border-radius:50%;background:linear-gradient(145deg,#2b3540,#11171d);box-shadow:0 9px 20px rgba(0,0,0,.4),inset 0 1px rgba(255,255,255,.1);font-size:clamp(.78rem,2.2vw,1rem);font-weight:950;transition:transform 55ms ease,background 55ms ease,border-color 55ms ease}
.game-button.pressed{border:0;background:transparent;box-shadow:none}.game-button.pressed .game-button-face{transform:scale(.9);border-color:#fff;background:var(--red);box-shadow:0 3px 10px rgba(0,0,0,.4)}
.game-button.system{min-width:max(72px,calc(var(--game-target) * .9));min-height:max(50px,calc(var(--game-target) * .62));font-size:inherit}.game-button.system .game-button-face{width:calc(100% - 10px);height:40px;border-radius:999px;font-size:.62rem}
.game-shoulders .game-button-face{width:100%;height:46px;border-radius:14px;font-size:.72rem}
.game-dpad,.game-stick{width:min(var(--game-directional),43vw,44dvh);max-width:none}
.game-dpad{box-shadow:0 16px 34px rgba(0,0,0,.46),inset 0 0 0 clamp(14px,3vw,22px) rgba(255,255,255,.028)}
.game-dpad.compact{width:min(calc(var(--game-directional) * .52),23vw,24dvh)}
.game-face-controls{width:min(calc(var(--game-directional) * 1.08),46vw,48dvh);height:min(calc(var(--game-directional) * 1.08),46vw,48dvh)}
.game-face-controls.pair{gap:2px}.game-face-controls.diamond .game-button{min-width:var(--game-target);min-height:var(--game-target)}
.game-face-controls.six,.game-face-controls.grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:2px;width:min(calc(var(--game-directional) * 1.35),49vw,62dvh);height:min(calc(var(--game-target) * 2),42vw,46dvh)}
.game-face-controls.six .game-button,.game-face-controls.grid .game-button{min-width:0;min-height:0;width:100%;height:100%;border-radius:0}.game-face-controls.six .game-button-face,.game-face-controls.grid .game-button-face{width:min(var(--game-visible),calc(100% - 3px));height:min(var(--game-visible),calc(100% - 3px));min-height:46px}
.game-face-controls.keypad{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:2px;width:min(calc(var(--game-directional) * 1.16),48vw,58dvh);height:min(calc(var(--game-target) * 3),50vw,60dvh)}.game-face-controls.keypad .game-button{min-width:0;min-height:0;width:100%;height:100%}.game-face-controls.keypad .game-button-face{width:min(58px,calc(100% - 3px));height:min(50px,calc(100% - 3px));min-height:36px;border-radius:13px}
.game-orientation-note{align-self:end;margin:2px 0 0;font-size:.62rem}
.game-result .result-play{padding-bottom:10px}.game-result img,.game-result .placeholder{aspect-ratio:3/4}.game-launch-label{display:block;margin:0 10px;padding:8px 10px;border-radius:9px;background:var(--red);color:#fff;text-align:center;font-size:.7rem;font-weight:900}.game-result .result-play:active .game-launch-label{transform:scale(.98)}

/* TESLA-MEDIA-104: physical and multi-controller management. */
#gamepad-settings span{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:4px;padding:0 5px;border-radius:999px;background:rgba(255,255,255,.12);font-size:.58rem}
#gamepad-settings.connected{border-color:rgba(100,222,166,.48);color:#bff5dc}#gamepad-settings.connected span{background:#43c987;color:#04130d}
.gamepad-sheet{position:absolute;z-index:30;top:clamp(58px,9vh,82px);right:clamp(8px,2vw,20px);width:min(520px,calc(100% - 16px));max-height:calc(100% - clamp(70px,11vh,96px));padding:16px;border:1px solid rgba(255,255,255,.2);border-radius:18px;background:rgba(10,14,19,.98);box-shadow:0 24px 70px rgba(0,0,0,.7);overflow:auto;overscroll-behavior:contain;touch-action:pan-y;user-select:auto;-webkit-user-select:auto}
.gamepad-sheet[hidden]{display:none!important}.gamepad-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.gamepad-sheet-head h3{margin:2px 0 0;font-size:1.2rem}.gamepad-sheet-head button{width:44px;min-height:44px;padding:0;font-size:1.4rem}
.gamepad-support,.gamepad-help{margin:10px 0;color:var(--muted);font-size:.72rem;line-height:1.45}.gamepad-support.connected{color:#bff5dc}
.gamepad-list{display:grid;gap:8px;margin:12px 0}.gamepad-empty{padding:14px;border:1px dashed rgba(255,255,255,.18);border-radius:12px;color:var(--muted);font-size:.74rem;text-align:center}
.physical-gamepad{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px;border:1px solid var(--line);border-radius:13px;background:#11171d}.physical-gamepad strong,.physical-gamepad small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.physical-gamepad strong{font-size:.82rem}.physical-gamepad small{margin-top:4px;color:var(--muted);font-size:.64rem}.physical-gamepad.active{border-color:rgba(100,222,166,.38)}
.physical-gamepad label{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:.6rem}.physical-gamepad select{width:auto;min-width:94px;min-height:42px;padding:0 28px 0 9px;font-size:.7rem}
.gamepad-preferences{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:12px;border-top:1px solid var(--line)}.gamepad-preferences label{display:grid;gap:6px;color:var(--muted);font-size:.66rem}.gamepad-preferences select{min-height:44px}.gamepad-preferences .game-dead-zone{grid-column:1/-1;grid-template-columns:1fr auto;align-items:center}.game-dead-zone input{grid-column:1/-1;width:100%;accent-color:var(--red)}.game-dead-zone output{color:#fff;font-weight:800}

@media(max-width:620px){.gamepad-sheet{top:54px;right:4px;width:calc(100% - 8px);max-height:calc(100% - 60px);padding:13px}.gamepad-preferences{grid-template-columns:1fr}.gamepad-preferences .game-dead-zone{grid-column:auto}.physical-gamepad{grid-template-columns:minmax(0,1fr) auto}}
body.game-mode.game-browse-mode{position:static;overflow:auto}body.game-mode.game-browse-mode .remote-shell{position:static;height:auto;min-height:100dvh;overflow:visible;padding:12px 12px 84px}body.game-mode.game-browse-mode .remote-panel[data-remote-panel="remote"]{display:none!important}body.game-mode.game-browse-mode .remote-panel[data-remote-panel="browse"]{display:block!important}body.game-mode.game-browse-mode .remote-tabs{display:grid!important;position:fixed;z-index:80;left:10px;right:10px;bottom:max(8px,env(safe-area-inset-bottom));grid-template-columns:repeat(3,minmax(0,1fr))}body.game-mode.game-browse-mode .remote-tabs [data-remote-tab="queue"]{display:none}body.game-mode.game-browse-mode .remote-tabs [data-remote-tab="browse"]{display:block}body.game-mode.game-browse-mode .browse{margin-top:0}.game-controller-actions button:disabled{opacity:.42}

@media(max-width:620px) and (orientation:portrait){
  body.game-mode .game-controller{padding:8px}
  .game-controller-head{align-items:flex-start}.game-controller-title .eyebrow{display:none}.game-controller-title .muted{max-width:40vw}
  .game-controller-actions{display:grid;grid-template-columns:auto auto}.game-controller-actions .game-more-actions{grid-column:2}.game-controller-actions button{min-height:48px;padding-inline:9px}
  .game-shoulders{min-height:calc(var(--game-target) * .78);padding-inline:2px}.game-shoulders .game-button{min-height:calc(var(--game-target) * .78)}
  .game-controller-surface{grid-template-columns:minmax(0,1fr) minmax(48px,.38fr) minmax(0,1fr);align-items:center;padding:0;gap:1px}
  .game-dpad,.game-stick{width:min(var(--game-directional),44vw,31dvh)}
  .game-face-controls{width:min(calc(var(--game-directional) * 1.06),46vw,32dvh);height:min(calc(var(--game-directional) * 1.06),46vw,32dvh)}
  .game-face-controls.six,.game-face-controls.grid{width:100%;max-width:100%;height:min(calc(var(--game-target) * 1.8),29dvh)}
  .game-face-controls.six .game-button-face,.game-face-controls.grid .game-button-face{width:min(58px,calc(100% - 4px));height:min(58px,calc(100% - 4px))}
  .game-dpad.compact{width:min(calc(var(--game-directional) * .44),18vw,14dvh)}
  .game-system-buttons{gap:1px}.game-button.system{min-width:58px}.game-button.system .game-button-face{height:34px}
}

@media(orientation:landscape){
  body.game-mode .game-controller{grid-template-rows:auto auto minmax(0,1fr);padding:6px 10px}
  .game-controller-head{position:relative;top:auto;right:auto;min-height:48px}.game-controller-head>.game-controller-title{display:block}.game-controller-head>.game-controller-actions{display:flex}.game-controller-title .eyebrow{display:none}.game-controller-title h2{font-size:.9rem}.game-controller-title .muted{font-size:.58rem}
  .game-controller-actions button{min-height:48px}
  .game-shoulders{position:static;grid-row:2;min-height:52px;margin:0;padding:0 25%}.game-shoulders .game-button{min-height:52px}.game-shoulders .game-button-face{height:42px}
  .game-controller-surface{grid-row:3;height:100%;padding:0 3vw;grid-template-columns:minmax(0,1fr) minmax(80px,.5fr) minmax(0,1fr)}
  .game-dpad,.game-stick{width:min(var(--game-directional),37vw,55dvh)}
  .game-face-controls{width:min(calc(var(--game-directional) * 1.1),39vw,62dvh);height:min(calc(var(--game-directional) * 1.1),39vw,62dvh)}
  .game-face-controls.six,.game-face-controls.grid{width:min(calc(var(--game-directional) * 1.5),40vw,76dvh);height:min(calc(var(--game-target) * 2),51dvh)}
  .game-face-controls.keypad{width:min(calc(var(--game-directional) * 1.32),40vw,70dvh);height:min(calc(var(--game-target) * 2.6),62dvh)}
  .game-dpad.compact{width:min(calc(var(--game-directional) * .5),14vw,28dvh)}
  .game-orientation-note{display:none}
}

@media(orientation:landscape) and (max-height:560px){
  .game-dpad,.game-stick{width:min(var(--game-directional),37vw,49.5dvh)}
  .game-face-controls{width:min(calc(var(--game-directional) * 1.1),39vw,50dvh);height:min(calc(var(--game-directional) * 1.1),39vw,50dvh)}
  .game-face-controls.six,.game-face-controls.grid{height:min(calc(var(--game-target) * 2),46dvh)}
  .game-face-controls.keypad{height:min(calc(var(--game-target) * 2.6),54dvh)}
}
.game-controller-actions .game-more-actions>div{max-height:calc(100dvh - 64px);overflow-y:auto;overscroll-behavior:contain}
body.game-mode .game-controller-actions .game-more-actions>div button{min-height:48px;height:auto}
.game-more-actions .game-more-close{position:sticky;z-index:2;top:0;background:#25303c}
body.game-mode .game-controller-actions #game-exit{width:auto;flex:0 0 auto}
@media(orientation:landscape) and (max-height:560px){body.game-mode .game-controller-actions .game-more-actions>div{position:fixed;top:auto;right:max(8px,env(safe-area-inset-right));bottom:max(8px,env(safe-area-inset-bottom));max-height:calc(100dvh - 72px)}body.game-mode .game-more-actions>div .game-touch-setting{grid-template-columns:auto minmax(0,1fr);align-items:center}}

/* 0.42 product shell */
:root{--bg:#090c11;--panel:#121923;--panel-strong:#1b2532;--line:#2c3949;--muted:#aab8c8;--green:#7ce0ab;--blue:#8fdcee;--text:#f4f7fb}
body{font-size:16px;line-height:1.45;background:radial-gradient(circle at 50% -18%,#1b2a38 0,transparent 38%),var(--bg)}
button{min-height:48px;font-weight:760}.panel{border-radius:16px;background:rgba(18,25,35,.97)}
.pair-card{width:min(520px,100%);margin:clamp(16px,8vh,80px) auto;padding:clamp(20px,6vw,32px)}.pair-card h1{font-size:clamp(2rem,8vw,2.8rem);line-height:1.05}.scan-pair,.primary-action{width:100%;background:var(--red)}.pair-divider{display:flex;align-items:center;gap:12px;margin:18px 0 0;color:var(--muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em}.pair-divider:before,.pair-divider:after{content:"";height:1px;flex:1;background:var(--line)}.pair-secondary{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.pair-secondary a,.settings-download{display:inline-flex;align-items:center;min-height:48px;padding:0 12px;border:1px solid var(--line);border-radius:12px;color:var(--text);font-weight:700;text-decoration:none}
.now-playing{grid-template-columns:96px minmax(0,1fr) 48px;padding:12px}.art{width:96px;border-radius:14px}.now-playing h1{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.playback-badges{margin-top:6px}.playback-badges span:nth-child(n+2){display:none}
.remote-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.remote-shortcuts button{min-width:0;padding-inline:8px}.remote-shortcuts span{display:inline-grid;place-items:center;min-width:22px;height:22px;margin-left:3px;border-radius:999px;background:#293748}
.remote-more-panel{display:grid;gap:10px;padding:12px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}.remote-more-panel[hidden]{display:none}.remote-more-panel .primary-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.remote-more-panel .session-controls{margin-top:0}.text-back{min-height:40px;padding:0;background:transparent;color:var(--blue)}
.cast-panel{display:grid;gap:16px}.cast-panel h2{font-size:1.6rem}.cast-target{display:grid;gap:4px;padding:16px;border:1px solid var(--line);border-radius:14px;background:#0b1017}.cast-target small,.cast-panel p{color:var(--muted)}#native-cast-unavailable{display:grid;gap:10px;padding:16px;border:1px solid var(--line);border-radius:14px}#native-cast-unavailable a{display:grid;place-items:center;min-height:48px;border-radius:12px;background:var(--red);color:#fff;font-weight:800;text-decoration:none}
.devices-panel details{border:1px solid var(--line);border-radius:14px;background:#0b1017;overflow:hidden}.devices-panel details summary{display:flex;align-items:center;min-height:56px;padding:0 14px;font-weight:800;cursor:pointer}.devices-panel details[open] summary{border-bottom:1px solid var(--line)}.devices-panel details>*:not(summary){margin:12px}.update-actions{display:flex;flex-wrap:wrap;gap:8px}.update-actions button{flex:1 1 150px}
body:not([data-remote-tab="remote"]) .now-playing-dock{position:relative;top:auto;display:grid;grid-template-columns:minmax(0,1fr);padding:4px 0 10px}body:not([data-remote-tab="remote"]) .now-playing{grid-template-columns:56px minmax(0,1fr) 40px;margin:4px 0;padding:7px}.remote-shell body:not([data-remote-tab="remote"]) .art{width:56px}body:not([data-remote-tab="remote"]) .art{width:56px}body:not([data-remote-tab="remote"]) .playback-badges{display:none}
@media(min-width:600px){.remote-shell{max-width:960px}.remote-panel[data-remote-panel="browse"] .browse,.remote-panel[data-remote-panel="settings"] .devices-panel,.remote-panel[data-remote-panel="cast"] .cast-panel{max-width:860px;margin-inline:auto}}
@media(max-width:520px){.remote-shell{padding-inline:16px}.now-playing{grid-template-columns:88px minmax(0,1fr) 40px}.art{width:88px}.remote-tabs button{min-height:56px}.pair-secondary>*{flex:1 1 100%}.remote-more-panel .primary-controls{grid-template-columns:1fr 1fr}.devices-panel{padding:14px}.devices-panel details>*:not(summary){margin:10px}}
@media(prefers-reduced-motion:reduce){.remote-panel{animation:none}}
.art-youtube,.art-livetv{aspect-ratio:16/9}.art-emby{aspect-ratio:2/3}.art-games{aspect-ratio:3/4}.art-games img{object-fit:contain;background:#0b1016}.result-emby:not(.result-episode) img,.result-emby:not(.result-episode) .placeholder{aspect-ratio:2/3}.result-youtube img,.result-youtube .placeholder,.result-livetv img,.result-livetv .placeholder,.result-episode img,.result-episode .placeholder{aspect-ratio:16/9}.result-games img,.result-games .placeholder{aspect-ratio:3/4;object-fit:contain}.result strong{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
