.compact-only, body:not(.compact-radio) .compact-only { display: none; }
/* Activated by compact-radio.js only at 480-560px touch landscape. */
body.compact-radio { --compact-right: 160px; --compact-gap: 8px; --landscape-nav: calc(44px + env(safe-area-inset-bottom)); }
html body.compact-radio .app-shell { padding: env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left); }
.compact-radio .radio { position: relative; padding: 0 8px 8px; border: 0; border-radius: 5px; grid-template-columns: minmax(0,1fr) var(--compact-right); grid-template-rows: 40px 64px minmax(0,1fr) 42px; gap: 4px var(--compact-gap); grid-template-areas: "head head" "meter ptt" "channel ptt" "quick ptt"; }
.compact-radio .radio-topline, .compact-radio .radio-topline.private-channels-available, .compact-radio .radio-topline.admin-ptt-controls { height: 40px; padding: 2px 8px; margin-inline: -8px; grid-template-columns: 78px minmax(0,1fr) auto; gap: 8px; }
.compact-radio .radio-topline .radio-brand-burn { width: 76px; height: 29px; }
.compact-radio .radio-topline .radio-transmitter { font-size: 11px; }
.compact-radio .member-status-controls { gap: 4px; height: 36px; }
.compact-radio .member-status-controls > button { width: 42px; height: 36px; flex-basis: 42px; }
.compact-radio #compactStatusButton { display: inline-flex; }
.compact-radio #compactStatusButton[hidden] { display: none; }
.compact-radio .radio-footer { display: none; }
.compact-radio .meter-section { position: relative; margin: 0; padding: 0; grid-template-rows: minmax(0,1fr) 13px; }
.compact-radio .meter-bezel { padding: 2px; border-width: 1px; grid-template-rows: minmax(0,1fr) 11px; }
.compact-radio .horizontal-meter-face { padding: 2px 5px; gap: 3px; }
.compact-radio .line-meter-heading { grid-template-columns: 39px minmax(0,1fr); gap: 5px; }
.compact-radio .line-meter-heading strong, .compact-radio .line-meter-scale { font-size: 10px; }
.compact-radio .line-meter-row { gap: 1px; }
.compact-radio .line-meter-track { margin-left: 44px; height: 4px; }
.compact-radio .line-meter-indicator { height: 8px; width: 4px; }
.compact-radio .indicator-row { padding: 0; gap: 16px; font-size: 9px; }
.compact-radio .status-lamp { width: 5px; height: 5px; }
.compact-radio .network-readout { padding: 0 3px; font-size: 8px; }
.compact-radio .compact-surface-button { display: block; position: absolute; inset: 0; width: 100%; height: 100%; border: 0; padding: 0; background: transparent; z-index: 3; }
.compact-radio .display-section { padding: 0; gap: 4px; grid-template-rows: minmax(0,1fr) 42px; }
.compact-radio .channel-selection { display: grid; grid-template-columns: minmax(92px,1.3fr) 96px minmax(48px,.8fr); gap: 8px; align-items: center; }
.compact-radio .channel-display { position: relative; height: 64px; border-width: 3px; grid-template-rows: 10px 32px 16px; }
.compact-radio .seven-segment-display { transform: scale(.55); height: 32px; }
.compact-radio .channel-details { height: 16px; gap: 4px; }
.compact-radio .channel-tag, .compact-radio .channel-tag.channel-frequency, .compact-radio .channel-dw { font-size: 9px; }
.compact-radio .channel-controls { display: grid; grid-template-columns: 44px 44px; gap: 8px; }
.compact-radio .channel-knob { display: none; }
.compact-radio .step-button { width: 44px; height: 44px; }
.compact-radio .scan-button { grid-column: 3; grid-row: 1; height: 44px; width: 100%; min-width: 0; }
.compact-radio .scan-button strong { font-size: 10px; }
.compact-radio .channel-shortcuts { display: block; height: 42px; }
.compact-radio .channel-presets { gap: 6px; height: 42px; }
.compact-radio .preset-button { height: 42px; }
.compact-radio .preset-button strong { font-size: 17px; }
.compact-radio .preset-button span, .compact-radio .preset-button [data-landscape-short] { font-size: 10px; }
.compact-radio .preset-button [data-landscape-short]::after { display: none; }
.compact-radio .ptt-section { padding: 0; justify-content: center; gap: 16px; }
body.compact-radio:not(.ptt-classic) .ptt-button { width: min(152px,100%,calc(100dvh - 136px - env(safe-area-inset-top) - env(safe-area-inset-bottom))); height: auto; margin: 0; }
.compact-radio .ptt-round-label strong { font-size: 34px; }
.compact-radio .ptt-round-label small { font-size: 10px; }
.compact-radio .ptt-round-status, .compact-radio .ptt-round-mode { font-size: 9px; }
.compact-radio .ptt-round-channel-count { width: 22px; height: 22px; flex-basis: 22px; font-size: 11px; }
.compact-radio .speaker-actions { padding: 0; gap: 6px; border: 0; background: none; width: auto; }
.compact-radio .speaker-actions .joker-nominate, .compact-radio .speaker-actions .friend-button, .compact-radio .speaker-actions .mute-button { width: 44px; height: 44px; flex-basis: 44px; }
.compact-radio .speaker-actions button svg { width: 20px; height: 20px; }
.compact-radio .compact-quick-audio { grid-area: quick; display: grid; grid-template-columns: minmax(0,1fr) 62px; gap: 10px; align-items: center; }
.compact-radio .compact-quick-audio label { display: block; color: var(--cream); font: 10px/1.2 Arial,sans-serif; }
.compact-radio .compact-quick-audio output { float: right; color: var(--amber); }
.compact-radio .compact-quick-audio input { display: block; width: 100%; height: 26px; margin: 0; accent-color: var(--amber); }
.compact-radio #compactAudioButton { height: 42px; border: 1px solid #575d4b; border-bottom: 3px solid #0d110c; border-radius: 4px; background: linear-gradient(#414738,#282e24); color: var(--cream); display: grid; place-content: center; justify-items: center; gap: 1px; font: 10px Arial,sans-serif; }
.compact-radio #compactAudioButton svg { width: 18px; height: 18px; }
.compact-radio .radio-controls { display: none; }
.compact-radio.compact-audio-open .radio-controls,
.compact-radio.compact-status-open .compact-status-panel,
.compact-radio.compact-channels-open .compact-channel-panel,
.compact-radio.compact-meter-open .meter-section { display: block; position: absolute; z-index: 99; grid-area: auto; top: 44px; left: 8px; bottom: 8px; right: calc(var(--compact-right) + 16px); height: auto; width: auto; max-width: none; margin: 0; border: 1px solid #596047; border-radius: 3px; background: #171e15; padding: 0 10px 8px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.compact-radio .compact-panel-head { display: flex; position: sticky; top: 0; z-index: 8; height: 34px; margin: 0 -10px 6px; padding-left: 10px; align-items: center; justify-content: space-between; gap: 4px; background: #272f23; color: var(--amber); }
.compact-radio .compact-panel-head strong { font: 700 11px/1.2 Arial,sans-serif; }
.compact-radio .compact-close, .compact-radio .member-status-controls .compact-close { width: 36px; height: 34px; flex-basis: 36px; border: 0; background: transparent; color: var(--cream); display: grid; place-items: center; padding: 0; }
.compact-radio .compact-close svg { width: 18px; height: 18px; }
.compact-radio:not(.compact-meter-open) .meter-section .compact-panel-head { display: none; }
.compact-radio .radio-controls .dial-control { display: block; margin: 7px 0 10px; }
.compact-radio .radio-controls .dial-label { display: flex; max-width: none; font: 11px/1.3 Arial,sans-serif; color: var(--cream); justify-content: space-between; }
.compact-radio .radio-controls .rotary-knob { display: block; width: 100%; height: auto; }
.compact-radio .radio-controls .rotary-face, .compact-radio .radio-controls .vox-delay-face { display: none; }
.compact-radio .radio-controls .rotary-knob input, .compact-radio .radio-controls .gain-dual-knob #gain, .compact-radio .radio-controls .gain-dual-knob #voxDelay { position: static; width: 100%; height: 26px; inset: auto; opacity: 1; accent-color: var(--amber); border-radius: 0; cursor: auto; touch-action: auto; }
.compact-radio .radio-controls .gain-dual-knob { display: flex; flex-direction: column; }
.compact-radio .radio-controls #gain { order: 0; }
.compact-radio .radio-controls .vox-delay-caption { position: static; order: 1; transform: none; margin-top: 8px; font: 11px/1.3 Arial,sans-serif; }
.compact-radio .radio-controls #voxDelay { order: 2; }
.compact-radio .radio-controls .switch-bank { display: block; width: 100%; }
.compact-radio .radio-controls .switch-control, .compact-radio .radio-controls .switch-control:nth-child(odd) { display: flex; align-items: center; justify-content: space-between; min-height: 38px; gap: 8px; white-space: normal; font: 11px/1.3 Arial,sans-serif; }
.compact-radio .radio-controls .switch-control input { position: static; width: 20px; height: 20px; margin: 0; opacity: 1; accent-color: var(--amber); }
.compact-radio .radio-controls .switch-control i { display: none; }
.compact-radio .radio-controls .modulation-control select { position: static; opacity: 1; width: 124px; height: 34px; font-size: 16px; color: var(--cream); background: #293323; border: 1px solid #667055; }
.compact-radio .radio-controls .defaults-control { display: flex; justify-content: space-between; margin: 10px 0; font-size: 11px; }
.compact-radio .radio-controls .reset-defaults-button { width: 82px; height: 36px; min-height: 36px; font-size: 11px; }
.compact-radio .compact-status-panel > button { display: flex; align-items: center; justify-content: flex-start; gap: 10px; width: 100%; height: auto; min-height: 38px; padding: 6px; font: 11px/1.3 Arial,sans-serif; text-align: left; margin: 4px 0; }
.compact-radio .compact-status-label { min-width: 0; white-space: normal; }
.compact-radio.compact-status-open .compact-status-panel { position: fixed; top: calc(env(safe-area-inset-top) + 44px); left: calc(env(safe-area-inset-left) + 8px); right: calc(env(safe-area-inset-right) + var(--compact-right) + 16px); bottom: calc(var(--landscape-nav) + 8px); }
.compact-radio .compact-channel-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 5px; }
.compact-radio .compact-channel-grid button { height: 40px; border: 1px solid #505b43; border-radius: 3px; background: #303927; color: var(--cream); font: 14px Arial,sans-serif; }
.compact-radio .compact-channel-grid button:disabled { opacity: .4; }
.compact-radio .traffic-panel.mobile-log-open { inset: calc(env(safe-area-inset-top) + 44px) calc(env(safe-area-inset-right) + var(--compact-right) + 16px) calc(var(--landscape-nav) + 8px) calc(env(safe-area-inset-left) + 8px); padding: 0 8px 8px; border-radius: 3px; }
.compact-radio .traffic-panel.mobile-log-open .panel-heading { padding: 3px 0; height: 34px; }
.compact-radio .panel-heading h2 { font-size: 13px; }
.compact-radio .panel-heading .eyebrow { display: none; }
.compact-radio .traffic-tabs button { font-size: 11px; min-height: 32px; padding-inline: 2px; }
.compact-radio .mobile-menu { padding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); gap: 0; }
.compact-radio .mobile-menu-button { flex-direction: column; gap: 2px; height: 43px; min-width: 0; padding: 2px; font-size: 10px; }
.compact-radio .mobile-menu-icon { height: 19px; width: 19px; font-size: 18px; }
.compact-radio .mobile-menu-badge { top: 1px; left: 59%; }
.compact-radio .radio[data-meter] .digital-meter { padding: 2px 5px; grid-template-columns: minmax(0,1fr) minmax(0,1fr); grid-template-rows: minmax(0,1fr); gap: 7px; }
.compact-radio .digital-meter-header { display: none; }
.compact-radio .digital-link { padding: 0; border: 0; }
.compact-radio .digital-heading, .compact-radio .digital-heading output { font-size: 9px; }
.compact-radio .digital-meter-scale { display: none; }
.compact-radio .digital-network-values { font-size: 8px; }
.compact-radio .radio[data-meter] .bronze-meter { grid-template-columns: minmax(0,1fr) minmax(0,1fr); grid-template-rows: 23px 21px; padding: 2px 5px; gap: 2px 6px; overflow: hidden; }
.compact-radio .radio .bronze-meter .bronze-header, .compact-radio .radio .bronze-meter .bronze-scale, .compact-radio .radio .bronze-meter .bronze-forecast, .compact-radio .radio .bronze-meter .bronze-source { display: none; }
.compact-radio .radio .bronze-meter .bronze-signal { grid-template-rows: 12px 7px; gap: 2px; }
.compact-radio .bronze-heading, .compact-radio .bronze-heading output { font-size: 9px; }
.compact-radio .bronze-information { grid-column: 1 / -1; padding: 0; }
.compact-radio .radio .bronze-meter .bronze-clock time { font-size: 14px; }
.compact-radio .radio .bronze-meter #bronzeDate { font-size: 7px; }
.compact-radio .radio .bronze-meter .bronze-weather output { font-size: 13px; }
.compact-radio .radio .bronze-meter .bronze-weather img { width: 16px; height: 16px; }
.compact-radio.compact-meter-open .meter-section { display: grid; grid-template-rows: 34px minmax(0,1fr) 18px; gap: 4px; overflow: hidden; }
.compact-radio.compact-meter-open #compactMeterButton { display: none; }
.compact-radio.compact-meter-open .meter-bezel { grid-template-rows: minmax(0,1fr) 18px; }
.compact-radio.compact-meter-open .horizontal-meter-face { gap: 8px; padding: 12px; }
.compact-radio.compact-meter-open .radio[data-meter] .digital-meter { grid-template-columns: 1fr; grid-template-rows: 1fr 1fr; gap: 8px; padding: 8px; }
.compact-radio.compact-meter-open .digital-meter-scale { display: flex; }
.compact-radio.compact-meter-open .radio[data-meter] .bronze-meter { grid-template-rows: 32px 32px 36px 14px 10px; grid-template-columns: 1fr; padding: 4px 8px; overflow: auto; }
.compact-radio.compact-meter-open .radio .bronze-meter .bronze-forecast, .compact-radio.compact-meter-open .radio .bronze-meter .bronze-source { display: flex; font-size: 8px; }
.compact-radio.compact-meter-open .radio .bronze-meter .bronze-signal { grid-template-rows: 14px 10px; }
.compact-radio:not(.compact-meter-open) .radio[data-meter] .bronze-meter { grid-template-rows: minmax(0,1fr) 15px; padding: 1px 4px; gap: 1px 5px; border-width: 1px; }
.compact-radio:not(.compact-meter-open) .radio .bronze-meter .bronze-signal { grid-template-rows: 11px minmax(0,1fr); gap: 1px; }
.compact-radio:not(.compact-meter-open) .radio .bronze-meter .bronze-bar, .compact-radio:not(.compact-meter-open) .radio .bronze-meter .bronze-segments { min-height: 2px; padding: 0; }
.compact-radio:not(.compact-meter-open) .radio .bronze-meter .bronze-information { padding: 0; min-height: 0; }
.compact-radio:not(.compact-meter-open) .radio .bronze-meter .bronze-clock { flex-direction: row; align-items: center; gap: 5px; }
.compact-radio:not(.compact-meter-open) .radio .bronze-meter .bronze-weather > div { min-height: 15px; height: 15px; }
.compact-radio:not(.compact-meter-open) .radio .bronze-meter #bronzePlace { display: none; }
@media (max-height: 319px) {
  .compact-radio .radio { grid-template-rows: 36px 48px minmax(0,1fr) 36px; row-gap: 3px; padding-bottom: 4px; }
  .compact-radio .radio-topline, .compact-radio .radio-topline.private-channels-available, .compact-radio .radio-topline.admin-ptt-controls { height: 36px; }
  .compact-radio .meter-section { grid-template-rows: minmax(0,1fr) 11px; }
  .compact-radio .meter-bezel { grid-template-rows: minmax(0,1fr); }
  .compact-radio:not(.compact-meter-open) .network-readout { display: none; }
  .compact-radio .display-section { grid-template-rows: minmax(0,1fr) 36px; gap: 3px; }
  .compact-radio .channel-display { height: 53px; grid-template-rows: 8px 26px 13px; }
  .compact-radio .seven-segment-display { transform: scale(.43); height: 26px; }
  .compact-radio .channel-details { height: 13px; }
  .compact-radio .display-label { font-size: 8px; }
  .compact-radio .channel-shortcuts, .compact-radio .channel-presets, .compact-radio .preset-button, .compact-radio #compactAudioButton { height: 36px; }
  .compact-radio .ptt-section { gap: 7px; }
  .compact-radio .ptt-round-label strong { font-size: 28px; }
  .compact-radio .ptt-round-mode { font-size: 8px; }
  .compact-radio .ptt-round-label small { font-size: 9px; }
  .compact-radio .speaker-actions .joker-nominate, .compact-radio .speaker-actions .friend-button, .compact-radio .speaker-actions .mute-button { height: 34px; }
  .compact-radio .radio[data-meter] .bronze-meter { grid-template-rows: 18px 14px; }
  .compact-radio .radio .bronze-meter .bronze-signal { grid-template-rows: 10px 5px; }
  .compact-radio:not(.compact-meter-open) .radio .bronze-meter #bronzeDate, .compact-radio:not(.compact-meter-open) .radio .bronze-meter #bronzePlace { display: none; }
  .compact-radio.compact-audio-open .radio-controls, .compact-radio.compact-status-open .compact-status-panel, .compact-radio.compact-channels-open .compact-channel-panel, .compact-radio.compact-meter-open .meter-section { top: 39px; bottom: 4px; }
  .compact-radio .traffic-panel.mobile-log-open { top: calc(env(safe-area-inset-top) + 39px); bottom: calc(var(--landscape-nav) + 4px); }
  .compact-radio.compact-status-open .compact-status-panel { top: calc(env(safe-area-inset-top) + 39px); bottom: calc(var(--landscape-nav) + 4px); }
}