/* WIN Remote · workspace and responsive session shell */
:root { --bg: #10171d; --panel: #182229; --border: #2b3942; --fg: #e5ecec; --muted: #97a9b0; --accent: #59d4b5; --ok: #67d4a8; --err: #ff8980; }
body { font-family: "Segoe UI Variable", "Segoe UI", system-ui, sans-serif; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
button:not(.ghost):not(.w-button) { color: #e5ecec; }
button:disabled { cursor: default; opacity: .4; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
input[type=text], input[type=password], input[type=search], textarea { background: #10191f; border: 1px solid var(--border); border-radius: 8px; color: var(--fg); padding: 10px 12px; font: inherit; min-width: 0; }
input[type=checkbox] { accent-color: var(--accent); width: 17px; height: 17px; flex-shrink: 0; }
.brand { letter-spacing: -.7px; display: inline-flex; align-items: center; gap: 9px; font-size: 21px; }
.brand small { color: var(--muted); font-size: 10px; letter-spacing: 2px; font-weight: 500; margin-left: 1px; }
.brand-mark { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: var(--accent); color: #112b24; font-size: 23px; font-weight: 900; }
.fleet-count { font-size: 12px; color: var(--muted); padding: 0 20px 14px; }
#login { background: radial-gradient(ellipse at 30% 25%, #1b3437 0%, transparent 55%), var(--bg); padding: 24px; }
#login .card { width: 400px; max-width: 100%; padding: 36px; box-shadow: 0 30px 120px #0004; gap: 18px; }
#login h1 { font-size: 30px; }
#login button[type=submit], #clipboard-send, #clipboard-send-paste { background: var(--accent); color: #102b25 !important; min-height: 44px; }
#login .sub { line-height: 1.65; }
.login-label { font-size: 12px; color: var(--muted); margin-bottom: -10px; }
#login .brand { margin-bottom: 4px; }
#login h1 { font-size: 31px; font-weight: 500; line-height: 1.13; letter-spacing: -1px; }
#login .card { gap: 14px; }
#login .error:empty { min-height: 0; }
.status.ok { color: var(--ok); }
.modal { z-index: 300; backdrop-filter: blur(7px); padding: 16px; }
.modal .card { max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); overflow: auto; box-shadow: 0 24px 90px #0007; }
.modal .files-head, .modal .help-head, .modal .w-dialog-head { position: sticky; top: 0; z-index: 2; flex-shrink: 0; background: var(--panel); gap: 8px; }
.modal .files-head { flex-wrap: wrap; padding-right: 66px; min-height: 64px; }
.modal .files-head h1, .modal .files-head .muted, .modal .help-head h1, .modal .w-dialog-head h1, .modal .w-dialog-head h2 { min-width: 0; overflow-wrap: anywhere; }
.modal .files-head h1, .modal .help-head h1, .modal .w-dialog-head h1, .modal .w-dialog-head h2 { flex: 1; }
.modal .help-head { flex-wrap: wrap; padding-right: 66px; min-height: 64px; }
.modal .help-head > div { flex-wrap: wrap; min-width: 0; }
.modal .help-head select { max-width: 100%; }
.modal .dialog-close { flex: 0 0 44px; min-width: 44px; min-height: 44px; padding: 8px; margin: 0; font-size: 20px; align-self: center; }
.modal .files-head .dialog-close, .modal .help-head .dialog-close { position: absolute; right: 10px; top: 10px; }
.modal .w-dialog-head .dialog-close { position: static; }
.modal .w-dialog-head { margin-top: -1px; }
.modal .shots-config { flex-shrink: 0; }
.modal .shots-body, .modal .security-body, .modal .help-body { min-height: 0; }
#preview-modal, #shot-light, #rec-play { z-index: 410; }
.modal .file-session-card { width: 1100px; height: 720px; display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.file-session-card > .files-head { padding-left: 16px; }
.file-session-frame { width: 100%; flex: 1; min-height: 0; border: 0; background: var(--panel); }
.local-file-actions { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 10px; border-bottom: 1px solid var(--border); }
.local-file-actions button { min-height: 36px; padding: 6px 10px; font-size: 12px; border: 1px solid var(--border); }
.local-file-actions button[aria-pressed=true] { color: var(--accent); border-color: var(--accent); }
.local-folder-note { margin: 0; padding: 8px 12px; color: var(--muted); font-size: 12px; line-height: 1.5; }
body.embedded-files #viewer { display: none !important; }
body.embedded-files #files-modal { padding: 0; background: var(--panel); backdrop-filter: none; }
body.embedded-files #files-modal > .files-card { width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; border: 0; border-radius: 0; box-shadow: none; }
body.embedded-files #files-modal > .files-card > .files-head { display: none; }
.shot-light-inner, .rec-play-inner { max-width: 100%; max-height: calc(100dvh - 32px); min-height: 0; }
.shot-light-bar { position: relative; padding-right: 52px; min-height: 44px; flex-shrink: 0; }
.shot-light-bar .dialog-close { position: absolute; right: 0; top: 0; }
.shot-light-bar .muted { overflow-wrap: anywhere; min-width: 0; }
.w-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.w-dialog-head h2 { margin: 0; font-size: 20px; letter-spacing: -.4px; }
.options-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; position: sticky; top: -12px; z-index: 1; background: var(--panel); }
.options-head strong { font-size: 13px; }
#opts-close { min-height: 40px; min-width: 40px; font-size: 22px; padding: 5px; }
.w-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 36px; padding: 8px 11px; border: 1px solid var(--border); background: #202e35; color: var(--fg); font: 500 12px/1.25 "Segoe UI", sans-serif; border-radius: 7px; white-space: nowrap; }
.w-button:hover:not(:disabled) { border-color: #74948f; background: #2c4147; filter: none; }
.w-button.active { color: var(--accent); background: #203a36; border-color: #407967; }
.w-button svg { width: 17px; height: 17px; flex: 0 0 auto; }
.w-button.icon-only { width: 34px; padding: 7px; }
.w-button.icon-only span { display: none; }
body.has-workspace #desk-hint { display: none !important; }
.workspace { position: fixed; inset: 0; background: #10171d; display: flex; flex-direction: column; min-width: 0; z-index: 20; }
.workspace-top { min-height: 76px; padding: 16px 22px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.workspace-title { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 5px; }
.workspace-title small { font-size: 9px; letter-spacing: 1.8px; color: #82979d; font-weight: 600; }
.workspace-title strong { font-size: 18px; font-weight: 600; letter-spacing: -.4px; }
.devices-button { display: none; }
.workspace-grid { display: flex; gap: 14px; flex: 1; min-height: 0; padding: 18px; }
.remote-pane { position: relative; display: flex; flex-direction: column; flex: 1 1 0; min-width: 0; min-height: 0; border: 1px solid var(--border); border-radius: 11px; background: #182229; overflow: hidden; }
.remote-pane.active { border-color: #46766a; box-shadow: 0 0 0 1px #46766a20; }
.pane-head { min-height: 64px; padding: 10px 12px; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid var(--border); background: #1b282f; flex-shrink: 0; }
.pane-identity { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1; }
.pane-number { width: 27px; height: 30px; display: grid; place-items: center; flex-shrink: 0; color: #91b1b0; background: #273a42; font-size: 11px; font-weight: 700; border-radius: 6px; }
.active .pane-number { background: #29483e; color: var(--accent); }
.pane-names { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.pane-names strong { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pane-names small { font-size: 10px; color: #9cb7ad; }
.pane-names small.offline { color: #edbb74; }
.version-badge, .srow-ver, .ver { color: #a3c4b9; border: 1px solid #39584e; font-size: 10px; line-height: 18px; padding: 0 5px; border-radius: 4px; flex-shrink: 0; font-variant-numeric: tabular-nums; background: #1e342e; }
.version-badge.old, .srow-ver.old { color: #f0c288; background: #3a3023; border-color: #795d35; }
.desk-frame { border: 0; width: 100%; flex: 1 1 auto; min-height: 80px; background: #0a1015; }
.workspace-tabs { display: none; }
.workspace.stacked .workspace-grid { flex-direction: column; }
.pane-drop { display: none; position: absolute; top: 64px; left: 10px; right: 10px; bottom: 10px; background: #183e36ed; border: 2px dashed var(--accent); border-radius: 9px; align-items: center; justify-content: center; z-index: 10; padding: 20px; text-align: center; font-size: 18px; color: #bfffe6; }
.accept-drop .desk-frame { pointer-events: none; }
.accept-drop .pane-drop { display: flex; }
.files-open .accept-drop .pane-drop { bottom: 300px; }
.bridge-files { display: none; flex-direction: column; height: 340px; max-height: 65%; min-height: 0; flex-shrink: 1; overflow: auto; border-top: 1px solid var(--border); background: #18242b; }
.files-open .bridge-files { display: flex; }
.bridge-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 4px 10px; position: sticky; top: 0; z-index: 2; background: #18242b; flex-shrink: 0; border-bottom: 1px solid var(--border); }
.bridge-head strong { font-size: 12px; }
.bridge-close { min-height: 40px; }
.bridge-head ~ *:not(.bridge-items) { flex-shrink: 0; }
.bridge-path { display: flex; align-items: center; gap: 5px; padding: 9px 10px 5px; }
.bridge-path input { flex: 1; min-width: 0; font-family: Consolas, monospace; font-size: 11px; padding: 8px; }
.bridge-shortcuts { display: flex; padding: 2px 12px 8px; gap: 6px; }
.bridge-shortcuts .w-button { min-height: 25px; padding: 3px 7px; border-color: transparent; background: transparent; color: var(--muted); font-size: 11px; }
.bridge-shortcuts svg { width: 13px; height: 13px; }
.bridge-items { flex: 1; min-height: 0; overflow: auto; padding: 0 10px; }
.bridge-items > p { padding: 10px; font-size: 12px; line-height: 1.6; }
.bridge-entry { display: flex; align-items: center; gap: 8px; padding: 3px 5px; border-radius: 5px; border: 1px solid transparent; min-height: 34px; }
.bridge-entry:hover { background: #263940; }
.bridge-entry.selected { background: #234137; }
.bridge-entry.drop-target { border-color: var(--accent); background: #234137; }
.bridge-entry .entry-name { flex: 1; min-width: 0; padding: 3px 0; min-height: 25px; background: transparent; border: 0; justify-content: flex-start; font-size: 12px; }
.entry-name span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bridge-entry small { color: #8da3ac; font-size: 10px; flex-shrink: 0; }
.bridge-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; padding: 9px 12px; background: #1c2b31; border-top: 1px solid var(--border); }
.bridge-footer .w-button { font-size: 11px; min-height: 30px; padding: 5px 7px; }
.bridge-footer .w-button:last-child { background: #295244; border-color: #3e745e; color: #b4f5d6; }
.selection-count { width: 100%; color: #9db4bd; font-size: 10px; }
.selected-path { padding: 6px; font-size: 12px; overflow-wrap: anywhere; color: #9fd8c5; }
.file-error { color: #ffc090; }
.workspace-transfers { display: flex; flex-direction: column; gap: 4px; max-height: 120px; overflow: auto; flex-shrink: 0; }
.workspace-transfers:has(.transfer-job) { border-top: 1px solid var(--border); padding: 8px 18px; }
.transfer-job { display: flex; align-items: center; gap: 10px; font-size: 12px; padding: 0 8px; }
.transfer-job > span:nth-child(2) { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.transfer-indicator { height: 7px; width: 7px; border-radius: 50%; background: #edb46b; flex-shrink: 0; }
[data-state=done] .transfer-indicator { background: var(--accent); }
[data-state=error] .transfer-indicator { background: var(--err); }
.workspace-toast { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 500; padding: 13px 18px; border: 1px solid #43655b; border-radius: 9px; color: #d7f5e8; background: #223c34; box-shadow: 0 5px 30px #0005; max-width: min(600px, 92vw); width: max-content; font-size: 13px; line-height: 1.5; }
.workspace-picker .card { width: 490px; max-height: 80dvh; padding: 22px; }
.picker-list { display: flex; flex-direction: column; overflow: auto; gap: 7px; }
.picker-list .w-button { justify-content: flex-start; flex-wrap: wrap; padding: 12px; flex-shrink: 0; }
.picker-list small { margin-left: auto; color: var(--muted); font-size: 11px; }
.view-choice-description { color: var(--muted); font-size: 14px; line-height: 1.6; margin: 4px 0; overflow-wrap: anywhere; }
.view-choices { display: flex; flex-direction: column; gap: 10px; }
.view-choices .w-button { display: grid; grid-template-columns: 20px minmax(0, 1fr); text-align: left; justify-items: start; padding: 14px; white-space: normal; }
.view-choices .w-button:first-child { border-color: #46766a; }
.view-choices small { grid-column: 2; font-size: 12px; line-height: 1.5; color: var(--muted); font-weight: 400; overflow-wrap: anywhere; }
.clipboard-card { width: 580px; max-height: 90dvh; overflow: auto; padding: 24px; }
.clipboard-card label { font-size: 12px; }
.clipboard-card textarea { resize: vertical; min-height: 100px; max-height: 35dvh; width: 100%; font: 14px/1.55 Consolas, monospace; }
.clipboard-card .muted { font-size: 12px; line-height: 1.5; margin: 0; }
.clipboard-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.clipboard-actions button { flex: 1 1 auto; font-size: 12px; border: 1px solid var(--border); padding: 10px; }
.clip-sync-label { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
/* Embedded viewers fill their pane; no nested inventory, headers or auth UI. */
body.embedded-desk { overflow: hidden; background: #0b1218; }
body.embedded-desk #list, body.embedded-desk #desk-hint, body.embedded-desk #login, body.embedded-desk #back, body.embedded-desk #bar-handle { display: none !important; }
body.embedded-desk #viewer { position: fixed; inset: 0; min-height: 0; height: 100dvh; display: flex; }
body.embedded-desk #viewer-bar { position: relative; flex-shrink: 0; top: auto; transform: none !important; opacity: 1 !important; pointer-events: auto !important; padding: 6px 8px; gap: 3px; min-height: 42px; border-bottom: 1px solid #29383e; background: #162329; flex-wrap: wrap; }
body.embedded-desk #viewer-bar .icon-btn { min-height: 30px; min-width: 30px; padding: 5px 7px; font-size: 14px; border-radius: 5px; border: 1px solid transparent; gap: 5px; }
body.embedded-desk #viewer-bar .icon-btn span { font-size: 11px; }
body.embedded-desk #viewer-bar .icon-btn:hover { background: #2b3c42; }
body.embedded-desk #stage { flex: 1; min-height: 0; height: auto; padding: 0; background: #090f14; overflow: hidden; }
body.embedded-desk #screen { max-width: 100%; max-height: 100%; object-fit: contain; }
body.embedded-desk #opts-panel { max-width: calc(100vw - 16px); z-index: 60; right: 8px; top: 100%; }
body.embedded-desk .menu-pop { position: fixed; top: 45px; left: auto; right: 8px; max-width: calc(100vw - 16px); z-index: 70; }
body.embedded-desk .menu-item { min-height: 40px; font-size: 13px; }
body.embedded-desk #keybar { bottom: 0; padding-bottom: env(safe-area-inset-bottom); max-width: 100%; flex-wrap: wrap; }
body.embedded-desk #viewer-stats { font-size: 10px; padding: 5px 7px; right: 8px; top: 8px; }
body.embedded-desk #viewer-stats { color: #adccc0; background: #12211ddd; font-weight: 400; max-width: calc(100% - 16px); }
body.embedded-desk #stat-name { display: none; }
body.embedded-desk #stat-metrics { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.embedded-desk #control-toggle { display: block; width: 13px; height: 13px; margin: 0; }
body.embedded-desk .opt-row:has(#barhide) { display: none; }
body.embedded-desk .toggle.icon-btn:has(#control-toggle:checked) { box-shadow: none; border-color: #467862 !important; color: #aee4c8; background: #254334; }
@media (min-width: 900px) and (pointer: fine) {
  body.layout-desktop:not(.at-login) .workspace { left: var(--sb); }
  body.layout-desktop:not(.at-login) #list { background: #141f26; border-right: 1px solid var(--border); }
  body.layout-desktop:not(.at-login) #list .sb-head { padding: 24px 18px 16px; }
  body.layout-desktop:not(.at-login) #list .status { padding-left: 20px; padding-bottom: 6px; font-size: 11px; }
  body.layout-desktop:not(.at-login) #list .agent-search { margin: 5px 16px 18px; padding: 12px; background: #1b2931; }
  body.layout-desktop:not(.at-login) #list #list-actions { padding: 14px; gap: 7px; background: #141f26; }
  body.layout-desktop:not(.at-login) #list #list-actions .ghost { font-size: 11px; padding: 7px; border: 0; background: transparent; color: #acbcc3; }
  .sgroup { border-top-color: #26343c; }
  .sgroup-head { font-size: 10px; padding: 14px 18px; color: #8199a3; letter-spacing: 1.1px; }
  .sgroup-head .count { border: 0; font-size: 10px; background: #26353d; }
  .sgroup-items { padding: 0 10px 12px; }
  .srow { display: grid; grid-template-columns: 7px minmax(0, 1fr) auto; gap: 4px 8px; padding: 10px 12px; margin-bottom: 4px; border: 1px solid transparent; border-radius: 8px; }
  .srow .dot { grid-column: 1; grid-row: 1; width: 6px; height: 6px; }
  .srow-name { grid-column: 2; grid-row: 1; font-size: 12px; font-weight: 500; }
  .srow-ver { grid-column: 3; grid-row: 1; }
  .srow-actions { grid-row: 2; grid-column: 2 / 4; margin: 0; gap: 3px; opacity: .7; padding-top: 3px; }
  .srow .sact { font-size: 12px; padding: 4px 7px; background: #1b2a32; }
  .srow:hover { background: #1f3038; }
  .srow.active { outline: 0; background: #234036; border-color: #3b6753; }
  body.layout-desktop:not(.at-login):not(.viewing) #desk-hint { background: radial-gradient(ellipse at 60% 30%, #1c3537 0%, transparent 65%); }
  .welcome { max-width: 660px; text-align: left; padding: 30px; }
  .welcome .eyebrow { color: var(--accent); font-size: 11px; letter-spacing: 2px; }
  .welcome h1 { color: #e1ebe7; font-size: clamp(32px, 4vw, 50px); line-height: 1.14; letter-spacing: -1.7px; font-weight: 500; margin: 18px 0; }
  .welcome p { line-height: 1.8; font-size: 14px; max-width: 440px; }
  .welcome-steps { display: flex; gap: 30px; margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--border); }
  .welcome-steps b { display: block; color: #cbddd7; margin-bottom: 8px; font-size: 13px; font-weight: 500; }
  .welcome-steps span { font-size: 11px; }
  body.layout-desktop.sb-collapsed:not(.at-login) .fleet-count { display: none; }
  body.layout-desktop.sb-collapsed:not(.at-login) #list .srow { display: flex; flex-direction: column; }
  body.layout-desktop.sb-collapsed:not(.at-login) #list .srow-ver { display: block; font-size: 9px; line-height: 13px; padding: 0 3px; }
}
@media (max-width: 1250px) {
  .dual .selection-button { width: 32px; padding: 6px; }
  .dual .selection-button span { display: none; }
  .workspace-top { padding: 14px; }
  .workspace-title strong { font-size: 15px; }
  .workspace-grid { padding: 12px; gap: 10px; }
  .dual .pane-identity { gap: 6px; }
  .dual .pane-number { display: none; }
}
@media (max-width: 899px), (pointer: coarse) {
  .file-session-card > .files-head { flex-direction: column; align-items: flex-start; gap: 4px; }
  .file-session-card > .files-head h1 { flex: none; font-size: 16px; }
  .devices-button { display: inline-flex; }
  #list .bar { padding: 18px 16px 12px; gap: 12px; }
  #list .brand { flex: 1; }
  #list .status { font-size: 11px; }
  #list .fleet-count { padding: 0; width: 100%; }
  #agent-search { display: block !important; margin: 12px 16px; width: calc(100% - 32px); padding: 13px; }
  #agents { padding: 0 16px 24px; }
  .agent-card { border-radius: 12px; padding: 18px; background: #19272f; }
  .agent-card .name { font-size: 16px; }
  .agent-card .meta { padding: 7px 0; }
  .agent-card button { min-height: 42px; }
  .card-actions .ctrl-btn { background: #326b56; border: 1px solid #4b856d; }
  body.has-workspace #list { display: none !important; }
  body.has-workspace.show-devices #list { display: flex !important; position: fixed; inset: 0; overflow: auto; z-index: 90; padding-bottom: 65px; }
  body.has-workspace.show-devices .workspace-top .devices-button { position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%); z-index: 100; background: #376754; border: 1px solid #6bba9a; padding: 12px 24px; }
  .workspace-top { min-height: 61px; padding: max(10px, env(safe-area-inset-top)) 10px 10px; gap: 6px; }
  .workspace-title small { display: none; }
  .workspace-title strong { font-size: 13px; }
  .workspace-top .w-button { padding: 8px; min-height: 40px; font-size: 11px; }
  .workspace-top > .icon-only { display: none; }
  .workspace-top > .w-button:not(.devices-button) span { display: none; }
  .workspace-top > .w-button:not(.devices-button) { width: 40px; }
  .workspace-top > .w-button.android-button { width: auto; }
  .workspace-top > .w-button.android-button span { display: inline; }
  .workspace-tabs { display: flex; gap: 5px; padding: 4px 10px 9px; border-bottom: 1px solid var(--border); }
  .workspace-tabs .w-button { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; padding: 10px; min-height: 40px; }
  .workspace-grid { padding: 8px 7px max(8px, env(safe-area-inset-bottom)); gap: 0; }
  .remote-pane { display: none; }
  .remote-pane.active { display: flex; }
  .pane-head { min-height: 55px; padding: 8px; gap: 5px; }
  .pane-head .w-button { min-height: 36px; }
  .pane-number { display: none; }
  .pane-names strong { font-size: 12px; }
  .pane-identity { gap: 6px; }
  .selection-button { width: 34px; padding: 7px; }
  .selection-button span { display: none; }
  .bridge-files { height: 340px; max-height: 63%; }
  .bridge-entry { min-height: 41px; }
  .bridge-footer .w-button { min-height: 40px; }
  .bridge-footer .w-button:nth-child(2) { display: none; }
  .bridge-path .w-button { min-height: 40px; }
  .bridge-shortcuts .w-button { min-height: 32px; }
  .bridge-footer .w-button:last-child { width: 100%; }
  .workspace-transfers:has(.transfer-job) { padding: 6px; }
  .transfer-job { font-size: 11px; }
  .clipboard-card { padding: 18px; gap: 12px; }
  .clipboard-card textarea, input[type=text], input[type=password], input[type=search] { font-size: 16px; }
  .clipboard-actions button { min-height: 44px; }
  .clipboard-card .clip-sync-label { line-height: 1.5; }
  .modal .files-card { max-height: calc(100dvh - 32px); }
  .files-panes { flex-direction: column; overflow: auto; }
  .files-panes .fpane { min-height: 150px; }
  .files-panes .flist { max-height: 23dvh; }
  .ftransfer { flex-direction: row; justify-content: center; }
  body.embedded-desk #viewer-bar { padding: 5px; }
  body.embedded-desk #viewer-bar .icon-btn { min-height: 36px; min-width: 34px; }
  body.embedded-desk #viewer-bar .icon-btn span { display: none; }
  body.embedded-desk #viewer-bar #keyboard-btn span,
  body.embedded-desk #viewer-bar #lock span,
  body.embedded-desk #viewer-bar #clipboard-panel-btn span,
  body.embedded-desk #viewer-bar #session-files-btn span,
  body.embedded-desk #viewer-bar #session-android-btn span,
  body.embedded-desk #viewer-bar #fullscreen span,
  body.embedded-desk #viewer-bar #game-btn span,
  body.embedded-desk #viewer-bar .toggle span,
  body.embedded-desk #viewer-bar #audio-menu-trig span,
  body.embedded-desk #viewer-bar #opts-btn span { display: inline; }
  body.embedded-desk #rec-btn, body.embedded-desk #modes-menu-trig { display: none; }
  body.embedded-desk .menu-pop { top: 47px; }
  body.embedded-desk .opts-panel { max-height: 70dvh; overflow: auto; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }
.modal .file-delete-card { width: 460px; max-width: calc(100vw - 32px); max-height: 90dvh; overflow: auto; padding: 24px; box-sizing: border-box; }
.file-delete-card h2, .file-delete-card p { margin: 0; }
.file-delete-card h2 { font-size: 20px; }
.file-delete-card code, .file-delete-card strong { overflow-wrap: anywhere; white-space: pre-wrap; }
.file-delete-card code { padding: 10px; background: #0d1117; border-radius: 6px; font-size: 12px; }
.file-delete-card p { font-size: 13px; line-height: 1.5; }
.file-delete-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 6px; }
.file-delete-actions button { min-height: 40px; }
.file-delete-actions .dialog-close { flex: none; font-size: 14px; padding: 8px 14px; }
.file-delete-confirm { background: #b52f3b; color: #fff; }
.file-delete-button:not(:disabled) { color: #ffabb4; }
@media (max-width: 600px) { .fpane-bar { flex-wrap: wrap; gap: 6px; } .fpane-bar .fp-path { min-width: 60px; } }
/* Visible monitor status and fullscreen keyboard capture, in either viewer layout. */
.monitors { align-items: center; flex-wrap: wrap; gap: 5px; min-width: 0; }
.monitors label { font-size: 11px; color: #b2c5cb; }
.monitors select { background: #13232a; color: #e5f3f7; border: 1px solid #44606b; border-radius: 6px; padding: 6px; min-height: 32px; max-width: 245px; font-size: 12px; }
.monitors select:disabled { opacity: 1; color: #becdd2; }
.monitors #monitor-refresh { min-width: 32px; min-height: 32px; padding: 4px 8px; }
#monitor-state { font-size: 10px; color: #a7c0c9; }
.keyboard-capture-status { font-size: 10px; color: #b9ddc9; }
.keyboard-capture-status:empty { display: none; }
.input-status { color: #f0c586; }
body.pointer-captured #screen { cursor: none; }
body.pointer-captured #rcursor { filter: drop-shadow(0 0 1px #000) drop-shadow(0 0 1px #fff); }
.capture-aim { position: absolute; left: 0; top: 0; margin: -7px 0 0 -7px; pointer-events: none; width: 14px; height: 14px; z-index: 2; }
.capture-aim::before, .capture-aim::after { content: ''; position: absolute; background: #d1fff4; box-shadow: 0 0 0 1px #142b25; border-radius: 1px; }
.capture-aim::before { width: 14px; height: 2px; left: 0; top: 6px; }
.capture-aim::after { width: 2px; height: 14px; left: 6px; top: 0; }
.cursor-reference-hint { color: #a9c8bf; font-size: 11px; width: 100%; }
.session-modebar { order: 3; display: flex; align-items: center; flex-wrap: wrap; gap: 7px; flex-shrink: 0; padding: 8px 10px; border-top: 1px solid var(--border); background: #142129; font-size: 12px; }
.session-mode-states { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; }
.mode-badge { padding: 5px 8px; border: 1px solid #455762; border-radius: 5px; color: #c2cfd5; background: #20303a; font-weight: 600; }
.mode-badge.on { color: #ceffe8; border-color: #5aa887; background: #244f3d; }
.mode-performance { color: #b8cbd3; font-variant-numeric: tabular-nums; width: 100%; font-size: 11px; }
.workspace-toast { top: 84px; bottom: auto; pointer-events: none; }
.mouse-sensitivity { display: inline-flex; align-items: center; gap: 7px; color: #bacbd1; font-size: 12px; }
.mouse-sensitivity select { background: #1c3039; color: #e4f3ed; border: 1px solid #54716e; border-radius: 5px; min-height: 32px; }
#release-input-btn { margin-left: auto; min-height: 36px; padding: 8px 12px; color: #ffe8c7; background: #473827; border: 1px solid #b38c55; border-radius: 6px; font-weight: 600; }
#mouse-capture-btn { min-height: 36px; padding: 7px 10px; border: 1px solid #54716e; border-radius: 5px; }
#viewer-bar #game-btn.active, #viewer-bar #mouse-capture-btn.active, #viewer-bar #fullscreen.active { background: #285340; color: #d7ffea; border-color: #70b992; }
#stage { order: 2; }
@media (max-width: 600px) {
  .session-modebar { padding: 7px; gap: 6px; font-size: 11px; }
  .mode-badge { font-size: 10px; padding: 5px 6px; }
  #release-input-btn { min-height: 40px; font-size: 11px; }
  .mouse-sensitivity select { min-height: 36px; }
}
.remote-pane:fullscreen { display: flex; flex-direction: column; width: 100vw; height: 100dvh; border: none; border-radius: 0; background: #090f14; }
.remote-pane:fullscreen .desk-frame { flex: 1; min-height: 0; }
.remote-pane:fullscreen > .pane-head { display: none; }
/* Controls overlay the image in fullscreen; neither toolbar reduces its area. */
body.viewer-fullscreen #viewer { height: 100dvh; }
body.viewer-fullscreen #viewer-bar { position: absolute; top: 0; left: 0; right: 0; transform: translateY(-100%) !important; visibility: hidden; }
body.viewer-fullscreen #viewer-bar.show { transform: translateY(0) !important; visibility: visible; }
body.viewer-fullscreen .session-modebar { position: absolute; bottom: 0; left: 0; right: 0; z-index: 30; max-height: 40dvh; overflow: auto; padding-bottom: max(8px, env(safe-area-inset-bottom)); }
body.viewer-fullscreen #viewer-bar:not(.show) ~ .session-modebar { visibility: hidden; pointer-events: none; }
body.viewer-fullscreen #bar-handle { display: block !important; min-width: 44px; min-height: 32px; }
@media (pointer: coarse), (max-width: 600px) {
  body.viewer-fullscreen #bar-handle { left: 24px; transform: none; min-height: 44px; }
}
@media (max-width: 600px) {
  .monitors { flex-basis: 100%; }
  .monitors select { flex: 1; max-width: none; min-width: 0; min-height: 36px; }
  .keyboard-capture-status { flex-basis: 100%; padding: 2px 5px; }
}
