@media (max-width: 820px) {
    .composer-inner { gap: 5px; padding: 6px; }
    .composer .composer-icon-button { width: 30px; height: 36px; flex: 0 0 30px; border-radius: 7px; }
    .composer .composer-icon-button svg { width: 17px; height: 17px; }
    .composer #microphoneButton { display: grid; width: 26px; height: 36px; flex: 0 0 26px; background: transparent; }
    .composer #microphoneButton svg { width: 14px; height: 14px; }
    .composer #microphoneButton.recording { background: var(--danger-soft); color: var(--danger); }
    .composer .send-button { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 9px; }
    .composer .send-button svg { width: 17px; height: 17px; }
    .composer textarea { min-width: 0; }
    /* Keep native font scaling, but avoid iOS focus zoom for small form fonts. */
    .sidebar .conversation-search input, .composer textarea, .chat-room-composer textarea { font-size: 16px; }
    .mobile-keyboard-open .app-view { position: fixed; top: var(--mobile-visual-top, 0px); height: var(--mobile-visual-height, 100dvh); padding-bottom: 0; }
    .mobile-keyboard-open .sidebar { top: var(--mobile-visual-top, 0px); bottom: auto; height: var(--mobile-visual-height, 100dvh); }
    .mobile-keyboard-open .mobile-workspace-nav { display: none; }
    .mobile-keyboard-open .composer { padding-bottom: 8px; }
    .mobile-keyboard-open #composerHint { display: none; }
    .mobile-keyboard-open .composer textarea { max-height: min(120px, calc(var(--mobile-visual-height) * .3)); }
    .mobile-sidebar-search .sidebar .sidebar-footer { display: none; }
    .mobile-sidebar-search .sidebar .sidebar-brand,
    .mobile-sidebar-search .sidebar .workspace-nav { flex-shrink: 0; }
    .mobile-sidebar-search .sidebar-context { flex: 1; }
    .chat-header { gap: 8px; padding-left: 10px; padding-right: 10px; }
    .chat-header .header-actions { flex-shrink: 0; gap: 4px; }
    .chat-header .icon-button { width: 40px; height: 40px; flex-basis: 40px; }
    .chat-header .management-mode-button { width: 40px; height: 40px; padding: 0; justify-content: center; }
    .chat-header .management-mode-button > span { display: none; }
    .chat-header #exportButton { padding: 0 8px; }
    .chat-header .chat-title { gap: 3px; }
    .chat-header #currentConversationTitle { font-size: 14px; line-height: 1.35; }
    .chat-header #connectionStatus { display: block; font-size: 11px; line-height: 1.4; white-space: nowrap; }
}
