/* One existing PTT node, raised out of the radio's stacking context. Native dialogs remain above it. */
.radio-page #desktop-ptt-dock{position:fixed;z-index:100;width:236px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto;box-sizing:border-box;padding:10px 12px 12px;border:1px solid #5e8b99;border-radius:20px;background:linear-gradient(145deg,#1d3744f7,#0c1e29fa);color:#deeff3;box-shadow:0 12px 36px #0009,inset 0 1px #ffffff16;backdrop-filter:blur(12px);overscroll-behavior:contain}
.radio-page #desktop-ptt-dock .desktop-ptt-header{display:flex;align-items:center;gap:6px;margin:-2px -3px 0}
.radio-page #desktop-ptt-handle{display:flex;align-items:center;justify-content:space-between;flex:1;min-height:38px;padding:7px 9px;border:1px solid #507383;border-radius:11px;background:#142c39;color:#a8d2df;font:700 10px/1.4 monospace;letter-spacing:1px;cursor:grab;touch-action:none;user-select:none}
.radio-page #desktop-ptt-handle>span:first-child{font-size:21px;line-height:1}
.radio-page #desktop-ptt-reset{flex:none;min-height:38px;width:38px;padding:4px;border:1px solid #507383;border-radius:11px;background:#142c39;color:#a8d2df;font:24px/1 monospace}
.radio-page #desktop-ptt-dock.is-dragging{box-shadow:0 18px 48px #000b,0 0 0 2px #83dfdb88;user-select:none}
.radio-page #desktop-ptt-dock.is-dragging #desktop-ptt-handle{cursor:grabbing}
.radio-page #desktop-ptt-handle:disabled,.radio-page #desktop-ptt-reset:disabled{opacity:.55;cursor:default}
.radio-page #desktop-ptt-state{margin:10px 0;font:11px/1.5 monospace;text-align:center;color:#b0cbd5;min-height:17px}
.radio-page #desktop-ptt-dock .ptt-wrap{display:block;min-width:0;width:100%;text-align:center;margin:0;padding:0}
.radio-page #desktop-ptt-dock #ptt{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:100%;height:122px;min-height:90px;padding:12px 8px;box-sizing:border-box;border:2px solid #77c2c9;border-bottom:5px solid #244f60;border-radius:24px;background:radial-gradient(ellipse at 50% 15%,#295a68,#122b3a 75%);color:#e0f6f6;box-shadow:inset 0 1px #cff9ff55,0 5px 9px #0007;touch-action:none;user-select:none}
.radio-page #desktop-ptt-dock #ptt strong{font:700 44px/1 'Barlow Condensed',sans-serif;letter-spacing:3px}
.radio-page #desktop-ptt-dock #ptt>span{font:8px/1.5 monospace;letter-spacing:.4px;color:#b9dce4}
.radio-page #desktop-ptt-dock #ptt small{display:block;font:8px/1.5 monospace;color:#b9dce4}
.radio-page #desktop-ptt-dock #ptt:disabled{opacity:.55;cursor:default}
.radio-page #desktop-ptt-dock[data-state=transmitting]{border-color:#f5a476}
.radio-page #desktop-ptt-dock[data-state=transmitting] #ptt{background:radial-gradient(ellipse at 50% 10%,#af5737,#58261f);border-color:#ffd0a0;border-bottom-color:#713e29;color:#fff0d8}
.radio-page #desktop-ptt-dock[data-state=transmitting] #desktop-ptt-state{color:#ffd0a0;font-weight:700}
.radio-page #desktop-ptt-dock[data-state=busy] #desktop-ptt-state{color:#d5c395}
.radio-page #desktop-ptt-dock[data-state=finishing] #ptt{border-color:#e3cd81}
.radio-page #desktop-ptt-dock[data-state=off] #ptt,.radio-page #desktop-ptt-dock[data-state=offline] #ptt{border-color:#6b828e;background:#172b36}
.radio-page #desktop-ptt-dock .ptt-clock{width:100%;margin:10px 0 0;max-width:none;font-size:11px}
.radio-page #desktop-ptt-dock .ptt-wrap>p{display:block;margin:9px 0 0;color:#92b3c0;font:10px/1.5 monospace}
.radio-page #desktop-ptt-dock button:focus-visible{outline:3px solid #fff1a9;outline-offset:3px}
.radio-page.desktop-ptt-enabled .radio .transmit-controls{grid-template-columns:repeat(2,minmax(0,1fr))}
.radio-page.desktop-ptt-enabled .radio .transmit-controls .speech-queue{grid-column:1;grid-row:1}
.radio-page.desktop-ptt-enabled .radio .transmit-controls .station-panel{grid-column:2;grid-row:1}
.radio-page.desktop-ptt-enabled{padding-bottom:240px}
@media(max-width:650px){.radio-page.desktop-ptt-enabled .radio .transmit-controls{grid-template-columns:minmax(0,1fr)}.radio-page.desktop-ptt-enabled .radio .transmit-controls .speech-queue{grid-column:1;grid-row:1}.radio-page.desktop-ptt-enabled .radio .transmit-controls .station-panel{grid-column:1;grid-row:2}}
@media(max-height:420px){.radio-page #desktop-ptt-dock{width:212px;padding:7px 10px}.radio-page #desktop-ptt-dock #ptt{height:82px;min-height:74px}.radio-page #desktop-ptt-dock #ptt strong{font-size:34px}.radio-page #desktop-ptt-state{margin:5px 0}.radio-page #desktop-ptt-dock .ptt-clock{margin-top:6px}.radio-page #desktop-ptt-dock .ptt-wrap>p{display:none}}
@media(prefers-reduced-motion:reduce){.radio-page #desktop-ptt-dock{backdrop-filter:none}}

/* Desktop SDR: reserve a parking lane for PTT and fit a 1440 × 900 screen. */
@media(min-width:1200px) and (max-height:1000px){
 .radio-page.desktop-ptt-enabled:has(.radio[data-view=sdr]){padding-bottom:0}
 .radio-page.desktop-ptt-enabled:has(.radio[data-view=sdr]) main{width:calc(100% - 520px);max-width:1440px;margin-left:auto;margin-right:auto;padding:8px 16px 0}
 .radio-page:has(.radio[data-view=sdr]) header{height:58px}
 .radio-page:has(.radio[data-view=sdr]) .intro{margin-bottom:8px}
 .radio-page .radio[data-view=sdr] .radio-head{padding:7px 14px}
 .radio-page .radio[data-view=sdr] .transceiver-deck{padding:8px 12px 6px;gap:10px;grid-template-columns:minmax(0,1fr) 148px}
 .radio-page .radio[data-view=sdr] .screen-top{padding:3px 8px}
 .radio-page .radio[data-view=sdr] .screen-top #radio-menu-open{min-height:32px;padding:5px 8px}
 .radio-page .radio[data-view=sdr] .console{min-height:112px}
 .radio-page .radio[data-view=sdr] .audio-scope-panel #audio-scope{height:52px}
 .radio-page .radio[data-view=sdr] #channel-waterfall{height:52px}
 .radio-page .radio[data-view=sdr] .console .display #channel{font-size:44px;line-height:1;padding:2px 0}
 .radio-page .radio[data-view=sdr] .console .meter{padding:6px 8px}
 .radio-page .radio[data-view=sdr] .audio-scope-panel{padding:6px 8px}
 .radio-page .radio[data-view=sdr] .band-screen{min-height:0}
 .radio-page .radio[data-view=sdr] .transmit-controls .station-controls{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end}
 .radio-page .radio[data-view=sdr] .transmit-controls .station-controls .awake-label{grid-column:auto}
 .radio-page .radio[data-view=sdr] .favorites-ribbon{height:36px;padding:2px 6px}
 .radio-page .radio[data-view=sdr] .band-occupancy-detail{min-height:24px;padding:3px 0}
 .radio-page .radio[data-view=sdr] .band-footer{font-size:7px}
 .radio-page .radio[data-view=sdr] .channel-faces{padding:6px 8px}
 .radio-page .radio[data-view=sdr] .screen-keys button{min-height:36px;padding:6px 2px}
 .radio-page .radio[data-view=sdr] .transmit-controls{margin:0 14px 6px;padding-top:6px;gap:10px}
 .radio-page .radio[data-view=sdr] .radio-foot{padding:6px 14px}
 .radio-page:has(.radio[data-view=sdr]) main>footer{padding:12px 0}
}

/* Saved display preferences affect only the desktop overlay. */
.radio-page #desktop-ptt-dock[data-size=compact]{width:204px;padding:8px 10px}
.radio-page #desktop-ptt-dock[data-size=compact] #ptt{height:92px;min-height:74px;border-radius:18px}
.radio-page #desktop-ptt-dock[data-size=compact] #ptt strong{font-size:36px}
.radio-page #desktop-ptt-dock[data-size=compact] .on-air-card{grid-template-columns:62px minmax(0,1fr);gap:6px;padding:6px}
.radio-page #desktop-ptt-dock[data-size=compact] .on-air-portrait{width:62px;height:62px;min-height:62px}
.radio-page #desktop-ptt-dock[data-size=compact] .on-air-picture,.radio-page #desktop-ptt-dock[data-size=compact] .on-air-picture .profile-avatar{width:56px;height:56px;font-size:32px}
.radio-page #desktop-ptt-dock[data-size=large]{width:300px;padding:12px 14px}
.radio-page #desktop-ptt-dock[data-size=large] #ptt{height:156px;font-size:16px}
.radio-page #desktop-ptt-dock[data-size=large] #ptt strong{font-size:58px}
.radio-page #desktop-ptt-dock[data-size=large] .on-air-card{grid-template-columns:102px minmax(0,1fr);gap:10px}
.radio-page #desktop-ptt-dock[data-size=large] .on-air-portrait{width:102px;height:102px;min-height:102px}
.radio-page #desktop-ptt-dock[data-size=large] .on-air-picture,.radio-page #desktop-ptt-dock[data-size=large] .on-air-picture .profile-avatar{width:96px;height:96px;font-size:52px}
.radio-page #desktop-ptt-dock[data-size=large] .on-air-name{font-size:19px}
.radio-page #desktop-ptt-dock[data-speaker=false] #on-air-card{display:none}
.radio-page #desktop-ptt-options{border-top:1px solid #426473;margin-top:10px;text-align:left;font:11px/1.5 sans-serif;color:#b9d4df}
.radio-page #desktop-ptt-options summary{cursor:pointer;padding:9px 2px;min-height:34px;box-sizing:border-box}
.radio-page #desktop-ptt-options summary:focus-visible{outline:2px solid #fff1a9;outline-offset:2px}
.radio-page .desktop-ptt-options-body{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:9px 8px;padding:4px 0 8px}
.radio-page #desktop-ptt-size{width:100%;min-width:0;padding:6px;border:1px solid #52798a;border-radius:5px;background:#102532;color:#e1eff5;font:12px sans-serif}
.radio-page #desktop-ptt-options .desktop-ptt-speaker-label{grid-column:1/-1;display:flex;align-items:center;gap:7px;cursor:pointer}
.radio-page #desktop-ptt-speaker{width:16px;height:16px;flex:none;margin:0;accent-color:#79d7cc}

/* Window-style resizing, with the original PTT node and pointer handlers. */
.radio-page #desktop-ptt-dock{display:flex;flex-direction:column;min-width:min(140px,calc(100vw - 24px));min-height:0}
.radio-page #desktop-ptt-dock .desktop-ptt-header,.radio-page #desktop-ptt-state,.radio-page #desktop-ptt-options{flex:none}
.radio-page #desktop-ptt-dock .ptt-wrap{display:flex;flex-direction:column;flex:1;min-height:0}
.radio-page #desktop-ptt-dock[data-size] #ptt{flex:1;min-height:90px;height:auto;padding:12px 8px}
.radio-page #desktop-ptt-dock .on-air-card,.radio-page #desktop-ptt-dock .ptt-clock,.radio-page #desktop-ptt-dock .ptt-wrap>p{flex:none}
.radio-page #desktop-ptt-dock[data-size] .on-air-card{grid-template-columns:calc(var(--ptt-avatar,72px) + 6px) minmax(0,1fr)}
.radio-page #desktop-ptt-dock[data-size] .on-air-portrait{width:calc(var(--ptt-avatar,72px) + 6px);height:calc(var(--ptt-avatar,72px) + 6px);min-height:calc(var(--ptt-avatar,72px) + 6px)}
.radio-page #desktop-ptt-dock[data-size] .on-air-picture,.radio-page #desktop-ptt-dock[data-size] .on-air-picture .profile-avatar{width:var(--ptt-avatar,72px);height:var(--ptt-avatar,72px);font-size:calc(var(--ptt-avatar,72px)*.55)}
.radio-page #desktop-ptt-dock .desktop-ptt-resize{position:absolute;z-index:2;display:block;min-width:0;min-height:0;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:#9dcbd9;box-shadow:none;touch-action:none;user-select:none;line-height:1;font-size:15px}
.radio-page #desktop-ptt-dock .resize-n,.radio-page #desktop-ptt-dock .resize-s{left:18px;right:18px;height:7px;cursor:ns-resize}
.radio-page #desktop-ptt-dock .resize-n{top:0}.radio-page #desktop-ptt-dock .resize-s{bottom:0}
.radio-page #desktop-ptt-dock .resize-e,.radio-page #desktop-ptt-dock .resize-w{top:18px;bottom:18px;width:7px;cursor:ew-resize}
.radio-page #desktop-ptt-dock .resize-e{right:0}.radio-page #desktop-ptt-dock .resize-w{left:0}
.radio-page #desktop-ptt-dock .resize-ne,.radio-page #desktop-ptt-dock .resize-nw,.radio-page #desktop-ptt-dock .resize-se,.radio-page #desktop-ptt-dock .resize-sw{width:18px;height:18px}
.radio-page #desktop-ptt-dock .resize-ne{top:0;right:0;cursor:nesw-resize}
.radio-page #desktop-ptt-dock .resize-nw{top:0;left:0;cursor:nwse-resize}
.radio-page #desktop-ptt-dock .resize-se{bottom:0;right:0;cursor:nwse-resize;padding:0 2px 2px 0}
.radio-page #desktop-ptt-dock .resize-sw{bottom:0;left:0;cursor:nesw-resize}
.radio-page #desktop-ptt-dock.is-resizing{user-select:none}
.radio-page #desktop-ptt-dock .desktop-ptt-resize:disabled{cursor:default}
.radio-page #desktop-ptt-options{padding-right:8px}

/* Compact window chrome follows both available width and height. */
.radio-page #desktop-ptt-dock[data-density=dense],.radio-page #desktop-ptt-dock[data-density=tiny]{padding:6px 8px;border-radius:13px}
.radio-page #desktop-ptt-dock[data-density=dense] .desktop-ptt-header,.radio-page #desktop-ptt-dock[data-density=tiny] .desktop-ptt-header{margin:0;gap:4px}
.radio-page #desktop-ptt-dock[data-density=dense] #desktop-ptt-handle,.radio-page #desktop-ptt-dock[data-density=tiny] #desktop-ptt-handle{min-width:0;min-height:26px;padding:3px 5px;font-size:8px;letter-spacing:.4px;gap:3px}
.radio-page #desktop-ptt-dock[data-density=dense] #desktop-ptt-handle>span:first-child,.radio-page #desktop-ptt-dock[data-density=tiny] #desktop-ptt-handle>span:first-child{font-size:15px}
.radio-page #desktop-ptt-dock[data-density=dense] #desktop-ptt-reset,.radio-page #desktop-ptt-dock[data-density=tiny] #desktop-ptt-reset{min-height:26px;width:26px;padding:2px;font-size:12px}
.radio-page #desktop-ptt-dock[data-density=dense] #desktop-ptt-state,.radio-page #desktop-ptt-dock[data-density=tiny] #desktop-ptt-state{margin:4px 0;min-height:12px;font:9px/1.2 monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.radio-page #desktop-ptt-dock[data-density=dense] .on-air-card,.radio-page #desktop-ptt-dock[data-density=tiny] .on-air-card{padding:4px;gap:4px;margin-bottom:5px;border-radius:7px}
.radio-page #desktop-ptt-dock[data-density=dense] .on-air-name,.radio-page #desktop-ptt-dock[data-density=tiny] .on-air-name{font-size:12px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.radio-page #desktop-ptt-dock[data-density=dense] .on-air-caption,.radio-page #desktop-ptt-dock[data-density=tiny] .on-air-caption{font-size:6px;line-height:1.1;margin-bottom:2px;letter-spacing:0}
.radio-page #desktop-ptt-dock[data-density=dense] .on-air-meta{font-size:7px;margin-top:2px}
.radio-page #desktop-ptt-dock[data-density=tiny] .on-air-meta{display:none}
.radio-page #desktop-ptt-dock[data-density=dense] #ptt,.radio-page #desktop-ptt-dock[data-density=tiny] #ptt{min-height:44px;padding:5px 3px;gap:2px;border-radius:12px;border-bottom-width:3px}
.radio-page #desktop-ptt-dock[data-density=dense] #ptt strong{font-size:30px;line-height:1}
.radio-page #desktop-ptt-dock[data-density=tiny] #ptt strong{font-size:24px;line-height:1}
.radio-page #desktop-ptt-dock[data-density=dense] #ptt span,.radio-page #desktop-ptt-dock[data-density=dense] #ptt small{font-size:6px;letter-spacing:0}
.radio-page #desktop-ptt-dock[data-density=tiny] #ptt span,.radio-page #desktop-ptt-dock[data-density=tiny] #ptt small{display:none}
.radio-page #desktop-ptt-dock[data-density=dense] .ptt-wrap>p,.radio-page #desktop-ptt-dock[data-density=tiny] .ptt-wrap>p{display:none}
.radio-page #desktop-ptt-dock[data-density=dense] .ptt-clock,.radio-page #desktop-ptt-dock[data-density=tiny] .ptt-clock{margin-top:4px;font-size:8px;letter-spacing:0}
.radio-page #desktop-ptt-dock[data-density=dense] .ptt-clock progress,.radio-page #desktop-ptt-dock[data-density=tiny] .ptt-clock progress{height:3px;margin-top:3px}
.radio-page #desktop-ptt-dock[data-density=dense] #desktop-ptt-options,.radio-page #desktop-ptt-dock[data-density=tiny] #desktop-ptt-options{margin-top:4px;font-size:9px}
.radio-page #desktop-ptt-dock[data-density=dense] #desktop-ptt-options summary,.radio-page #desktop-ptt-dock[data-density=tiny] #desktop-ptt-options summary{min-height:22px;padding:3px 0}
.radio-page #desktop-ptt-dock[data-density=dense]:has(#desktop-ptt-options[open]),.radio-page #desktop-ptt-dock[data-density=tiny]:has(#desktop-ptt-options[open]){min-height:min(240px,calc(100dvh - 24px))}
/* In the smallest layouts the live timer shares the status line, without overlap. */
.radio-page #desktop-ptt-dock:is([data-density=dense],[data-density=tiny]) .ptt-clock{display:none}
.radio-page #desktop-ptt-dock:is([data-density=dense],[data-density=tiny]):is([data-state=transmitting],[data-state=finishing]) #desktop-ptt-state{visibility:hidden}
.radio-page #desktop-ptt-dock:is([data-density=dense],[data-density=tiny]):is([data-state=transmitting],[data-state=finishing]) .ptt-clock{display:block;position:absolute;top:34px;left:8px;right:8px;width:auto;margin:0;font:8px/1 monospace}
.radio-page #desktop-ptt-dock:is([data-density=dense],[data-density=tiny]):is([data-state=transmitting],[data-state=finishing]) .ptt-clock progress{height:2px;margin-top:2px}

/* Keep the original corner screws clear by insetting the header content. */
.radio-page .radio[data-view] .radio-head{padding-left:26px;padding-right:26px}
.radio-page .radio[data-view] .radio-head>div:first-child{padding-left:0}

/* Connection progress belongs to the existing header status, not a separate banner. */
.radio-page .radio-head .connection-bar #recovery-note{margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;color:#e4d8aa;font:inherit;font-size:9px;line-height:1.4;overflow-wrap:anywhere}
.radio-page .radio-head .connection-bar #recovery-note[hidden]{display:none}
.radio-page .connection-message:has(#recovery-note:not([hidden])) #connection-note{display:none}

/* Let the SDR display fill spare vertical room without scaling its controls. */
@media(min-width:1200px){
 .radio-page:has(.radio[data-view=sdr]){display:flex;flex-direction:column;min-height:100dvh;padding-bottom:0}
 .radio-page:has(.radio[data-view=sdr])>header{flex:none}
 .radio-page:has(.radio[data-view=sdr]) main{flex:1;display:flex;flex-direction:column;margin-top:0;margin-bottom:0}
 .radio-page:has(.radio[data-view=sdr]) main>.intro,.radio-page:has(.radio[data-view=sdr]) main>.station-strip,.radio-page:has(.radio[data-view=sdr]) main>footer{flex:none}
 .radio-page:has(.radio[data-view=sdr]) .workspace{display:grid;grid-template-columns:minmax(0,1fr);flex:1;min-height:0;align-items:stretch}
 .radio-page .radio[data-view=sdr]{display:flex;flex-direction:column}
 .radio-page .radio[data-view=sdr] .radio-head,.radio-page .radio[data-view=sdr] .transmit-controls,.radio-page .radio[data-view=sdr] .radio-foot{flex:none}
 .radio-page .radio[data-view=sdr] .transceiver-deck{flex:1;min-height:0}
 .radio-page .radio[data-view=sdr] .screen-unit{display:flex;flex-direction:column;align-self:stretch;min-height:0}
 .radio-page .radio[data-view=sdr] .screen-unit>.screen-top,.radio-page .radio[data-view=sdr] .screen-unit>.indicators,.radio-page .radio[data-view=sdr] .screen-unit>.channel-faces,.radio-page .radio[data-view=sdr] .screen-unit>.favorites-ribbon,.radio-page .radio[data-view=sdr] .screen-unit>.screen-keys{flex:none}
 .radio-page .radio[data-view=sdr] .display-page-body{flex:1;display:flex;min-height:0}
 .radio-page .radio[data-view=sdr] .screen-unit .sdr-receiver-page{display:flex;flex-direction:column;flex:1;min-width:0;min-height:0}
 .radio-page .radio[data-view=sdr] .screen-unit .console{flex:none}
 .radio-page .radio[data-view=sdr] .screen-unit .sdr-panel{flex:1;min-height:150px;display:flex;flex-direction:column}
 .radio-page .radio[data-view=sdr] .screen-unit .channel-waterfall{flex:1;display:flex;flex-direction:column}
 .radio-page .radio[data-view=sdr] .screen-unit .channel-waterfall>div{flex:none}
 .radio-page .radio[data-view=sdr] .screen-unit .channel-waterfall .band-screen{flex:1;min-height:52px}
 .radio-page .radio[data-view=sdr] .screen-unit #channel-waterfall{position:absolute;inset:0;width:100%;height:100%}
}
