/* Shared by Refined and Classic; desktop navigation and tool order stay intact. */
.ap-nav-toggle, .ap-nav-close, .ap-nav-backdrop { display: none; }
.ap-nav-backdrop[hidden] { display: none !important; }
#aiReplySettingsState[data-state="unsaved"] { color: var(--warning); border-left: 3px solid var(--warning); padding-left: 10px; }
#aiReplyQueue h4 { font-size: 13px; margin: 14px 0 8px; }
.ai-reply-history { margin-top: 12px; }
.ai-reply-history summary { cursor: pointer; font-weight: 600; padding: 8px 0; }
.ai-reply-history summary:focus-visible, #chatHeadTitle:focus-visible { outline: 2px solid var(--brand-500); outline-offset: 3px; }
@media (max-width: 680px) {
    .ap-nav-toggle, .ap-nav-close { display: inline-flex; align-items: center; justify-content: center; }
    .ap-nav-close { margin-left: auto; flex-shrink: 0; }
    html[data-appearance] .app-shell > .app-sidebar {
        position: fixed; inset: 0 auto 0 0; width: min(290px, calc(100vw - 38px)); height: 100dvh;
        z-index: 901; box-shadow: var(--shadow-lg); visibility: hidden; transform: translateX(-105%);
    }
    html[data-nav-open="true"] .app-shell > .app-sidebar { visibility: visible; transform: translateX(0); }
    .ap-nav-backdrop { position: fixed; inset: 0; z-index: 900; display: block; border: 0; background: rgba(0,0,0,.5); }
    html[data-appearance] .main-header { padding: 14px; align-items: flex-start; flex-direction: column; gap: 10px; }
    html[data-appearance] .main-header-title { min-width: 0; max-width: 100%; }
    html[data-appearance] .main-header-actions { flex-wrap: wrap; max-width: 100%; gap: 8px; }
    html[data-appearance] .main-content { padding: 14px; }
    #messages .ai-reply-controls, #messages .ai-reply-controls label { min-width: 0; max-width: 100%; }
    #messages .ai-reply-controls select { width: 100%; min-width: 0; }
}