/* Phone dialogs share the workspace's readable type and touch targets. */
body.phone-device :is(.auth-overlay, .popout-modal-overlay) {
  height: var(--app-height, 100dvh);
  box-sizing: border-box;
  padding: max(12px, var(--sat, 0px)) max(12px, var(--sar, 0px)) max(12px, var(--sab, 0px)) max(12px, var(--sal, 0px));
  overflow-y: auto;
  overscroll-behavior: contain;
}
body.phone-device .auth-card { padding: 20px 16px; border-radius: 14px; }
body.phone-device .auth-card > div:not(#auth-wordmark),
body.phone-device .auth-card label { font-size: max(13px, .8125rem) !important; line-height: 1.5; }
body.phone-device .auth-card label { min-height: 44px; align-items: center !important; gap: 10px !important; }
body.phone-device .auth-card input[type="checkbox"] { width: 20px !important; height: 20px !important; flex: none; }
body.phone-device :is(.auth-card, .popout-modal-card) :is(button, [role="button"]) {
  min-height: max(44px, 2.75rem); min-width: 44px;
  font-size: max(14px, .875rem) !important;
  line-height: 1.35; white-space: normal;
}
body.phone-device :is(.auth-card, .popout-modal-card) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea) {
  min-height: max(44px, 2.75rem); min-width: 0; max-width: 100%;
  box-sizing: border-box; font-size: max(16px, 1rem) !important;
}
body.phone-device .popout-modal-card,
body.phone-device .popout-modal-card:has(.scan-settings) {
  width: 100%; max-width: 640px; max-height: 100%;
  min-width: 0; min-height: 0; padding: 16px;
  background: var(--surface-raise); color: var(--text-main);
  font-size: max(14px, .875rem); line-height: 1.45;
}
body.phone-device .popout-modal-header { gap: 12px; margin-bottom: 12px; flex: none; }
body.phone-device .popout-modal-title { min-width: 0; overflow-wrap: anywhere; font-size: max(18px, 1.125rem); }
body.phone-device .close-popout { flex: none; }
body.phone-device .popout-list-content { min-height: 0; min-width: 0; overflow-x: hidden; overflow-y: auto; }
body.phone-device .scan-settings { min-width: 0; }
body.phone-device .scan-settings .settings-tabs-bar {
  flex-wrap: nowrap; flex: none; gap: 8px; overflow-x: auto;
  padding-bottom: 10px; scrollbar-width: thin;
}
body.phone-device .scan-settings .settings-tab { flex: 0 0 auto; padding: 8px 12px; }
body.phone-device .scan-settings .settings-tabs-content { overflow: visible; flex: none; }
body.phone-device .scan-settings .set-section { padding: 12px; min-width: 0; }
body.phone-device .scan-settings .set-head { font-size: max(16px, 1rem); line-height: 1.4; }
body.phone-device .scan-settings :is(.set-note, .set-notif-item small, .set-mode-tag) { font-size: max(13px, .8125rem); }
body.phone-device .scan-settings :is(.set-row, .set-notif-item b) { font-size: max(14px, .875rem); }
body.phone-device .scan-settings .set-row { min-width: 0; overflow-wrap: anywhere; }
body.phone-device .scan-settings .set-notif-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
body.phone-device .scan-settings .set-actions { gap: 8px; }
body.phone-device .scan-settings label { min-height: 44px; align-items: center; }
body.phone-device .scan-settings input[type="checkbox"] { width: 20px; height: 20px; }
body.phone-device .scan-settings :is(button, input, select, textarea):focus-visible,
body.phone-device .auth-card :is(button, input, a):focus-visible { outline: 2px solid var(--accent-cyan); outline-offset: 2px; }
