/*
 * QuoteVault Responsive Foundation
 * Shared, late-loading overrides for the public site, Account, and Admin.
 * This file intentionally contains only layout/responsiveness and standard-user
 * preview presentation so feature styles remain owned by their existing page sheets.
 */

:root {
    --qv-mobile-gutter: clamp(14px, 4vw, 24px);
    --qv-touch-target: 44px;
    --qv-mobile-topbar: 126px;
}

html {
    max-width: 100%;
    color-scheme: dark;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    max-width: 100%;
    min-width: 0;
}

:where(button, a, input, select, textarea, summary) {
    touch-action: manipulation;
}

img,
video,
svg,
canvas {
    max-width: 100%;
}

pre,
code,
.qv-scroll-region,
.table-responsive {
    scrollbar-width: thin;
    scrollbar-color: #3a3a3a #090909;
}

/* The old global anywhere-wrap rule created one-character columns when a grid
   became narrow. Normal prose should wrap by words; identifiers opt back in. */
.content :where(p, small, strong, span, a, td, th, label, li),
.site-shell :where(p, small, strong, span, a, td, th, label, li),
.login-shell :where(p, small, strong, span, a, label),
.server-gate :where(p, small, strong, span, a, label) {
    overflow-wrap: break-word;
    word-break: normal;
}

.content :where(code, pre, .qv-identity-uid, [data-user-id], [data-guild-id], .qv-record-id, .qv-legacy-value),
.site-shell :where(code, pre, .archive-quote-id, .share-token) {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* ============================================================
   MEMBER / NON-ADMIN PREVIEW
   ============================================================ */
.qv-preview-menu-form {
    margin: 0;
}

.qv-preview-menu-form .dropdown-item {
    width: 100%;
    border: 0 !important;
    background: transparent !important;
    text-align: left;
}

.qv-preview-menu-form .qv-preview-exit-link,
.qv-member-preview .qv-preview-exit-link {
    color: #d7b36a !important;
}

.qv-preview-locked {
    cursor: not-allowed;
    opacity: .58;
}

.qv-preview-locked .nav-arrow {
    color: #8b6a65;
}

.qv-member-preview-banner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    margin: 20px 0 0;
    padding: 15px 17px;
    border: 1px solid #5f4a25;
    border-left: 3px solid #d3a33f;
    background: linear-gradient(90deg, rgba(211, 163, 63, .11), rgba(15, 14, 10, .92));
    box-shadow: 0 14px 40px rgba(0, 0, 0, .2);
}

.qv-member-preview-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(211, 163, 63, .42);
    background: #17130b;
    color: #d3a33f;
    font-size: 21px;
}

.qv-member-preview-copy {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.qv-member-preview-copy small {
    color: #c39536;
    font: 700 7px/1.2 var(--mono, "IBM Plex Mono", monospace);
    letter-spacing: .14em;
}

.qv-member-preview-copy strong {
    color: #ece8df;
    font: 700 19px/1.05 var(--condensed, "Barlow Condensed", sans-serif);
    letter-spacing: .025em;
    text-transform: uppercase;
}

.qv-member-preview-copy > span {
    color: #938b7b;
    font: 500 9px/1.55 var(--mono, "IBM Plex Mono", monospace);
}

.qv-member-preview-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.qv-member-preview-actions form {
    margin: 0;
}

.qv-member-preview-actions a,
.qv-member-preview-actions button {
    min-height: 38px;
    padding: 0 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #51452d;
    background: #0d0d0b;
    color: #cfc7b6;
    font: 700 8px/1 var(--mono, "IBM Plex Mono", monospace);
    letter-spacing: .08em;
    text-decoration: none;
    text-transform: uppercase;
}

.qv-member-preview-actions a:hover,
.qv-member-preview-actions button:hover {
    border-color: #b88c34;
    color: #fff;
}

.qv-access-preview-main {
    padding-top: 42px !important;
}

.qv-preview-disclaimer {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 20px;
    margin-bottom: 26px;
    padding: 22px;
    border: 1px solid #3a3427;
    background: linear-gradient(115deg, rgba(199, 148, 46, .1), #0c0c0b 46%);
}

.qv-preview-disclaimer > i {
    color: #c9942e;
    font-size: 34px;
}

.qv-preview-disclaimer small,
.qv-access-preview-panel-head > span {
    display: block;
    margin-bottom: 7px;
    color: #c9942e;
    font: 700 7px/1 var(--mono, "IBM Plex Mono", monospace);
    letter-spacing: .14em;
}

.qv-preview-disclaimer h2,
.qv-access-preview-panel-head h2 {
    margin: 0 0 8px !important;
    color: #eeeae2;
    font: 700 29px/1 var(--condensed, "Barlow Condensed", sans-serif) !important;
    letter-spacing: .01em;
    text-transform: uppercase;
}

.qv-preview-disclaimer h2::before,
.qv-access-preview-panel-head h2::before {
    display: none !important;
}

.qv-preview-disclaimer p,
.qv-access-preview-panel-head p,
.qv-access-preview-list p {
    margin: 0;
    color: #85817a;
    font: 500 9px/1.65 var(--mono, "IBM Plex Mono", monospace);
}

.qv-access-preview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.qv-access-preview-panel {
    min-width: 0;
    border: 1px solid #2b2b2b;
    background: #0b0b0b;
}

.qv-access-preview-panel.is-visible {
    border-top-color: #356f46;
}

.qv-access-preview-panel.is-locked {
    border-top-color: #71362f;
}

.qv-access-preview-panel-head {
    padding: 20px;
    border-bottom: 1px solid #242424;
}

.qv-access-preview-list {
    display: grid;
}

.qv-access-preview-list article {
    display: grid;
    grid-template-columns: minmax(120px, .38fr) minmax(0, 1fr);
    gap: 18px;
    padding: 17px 20px;
    border-bottom: 1px solid #202020;
}

.qv-access-preview-list article:last-child {
    border-bottom: 0;
}

.qv-access-preview-list strong {
    display: block;
    margin-bottom: 5px;
    color: #d7d4cc;
    font: 700 15px/1.1 var(--condensed, "Barlow Condensed", sans-serif);
    text-transform: uppercase;
}

.qv-access-state {
    align-self: start;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 28px;
    width: max-content;
    max-width: 100%;
    padding: 0 9px;
    border: 1px solid #303030;
    background: #0e0e0e;
    color: #92928d;
    font: 700 7px/1 var(--mono, "IBM Plex Mono", monospace);
    letter-spacing: .08em;
    text-transform: uppercase;
}

.qv-access-state.is-visible {
    border-color: #31583b;
    color: #7fbe8d;
}

.qv-access-state.is-locked {
    border-color: #65342f;
    color: #cd7168;
}

/* ============================================================
   TABLET / NARROW DESKTOP
   ============================================================ */
@media (max-width: 1180px) {
    .content {
        padding-right: 28px !important;
        padding-left: 28px !important;
    }

    .panel-topbar,
    .navbar {
        margin-right: -28px !important;
        margin-left: -28px !important;
        padding-right: 28px !important;
        padding-left: 28px !important;
    }

    .qv-dashboard-grid,
    .qv-dashboard-secondary,
    .qv-intelligence-grid,
    .qv-member-grid,
    .qv-author-grid,
    .qv-analytics-grid,
    .qv-system-grid,
    .qv-health-grid,
    .qv-health-grid-balanced,
    .qv-server-detail-grid,
    .qv-settings-grid,
    .settings-grid,
    .qv-port-grid,
    .qv-detail-columns,
    .qv-detail-grid,
    .qv-detail-grid-secondary {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .qv-settings-full-row,
    .qv-setting-card-wide,
    .qv-member-panel--wide,
    .qv-detail-panel.qv-detail-context,
    .qv-detail-panel.qv-detail-discovery {
        grid-column: 1 / -1 !important;
    }

    .qv-public-settings-grid,
    .qv-appearance-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .qv-public-address-card,
    .qv-appearance-preview {
        grid-column: 1 / -1 !important;
    }

    .qv-admin-record-meta,
    .qv-admin-quote-meta-row,
    .qv-mod-record-meta,
    .qv-revision-record-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .qv-health-maintenance-grid,
    .qv-health-capability-grid,
    .qv-health-lifecycle-grid,
    .qv-health-diagnostic-grid,
    .qv-health-action-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* ============================================================
   PANEL SHELL — MOBILE
   ============================================================ */
@media (max-width: 900px) {
    html {
        scroll-padding-top: 126px;
    }

    body {
        overflow-x: hidden !important;
    }

    body.panel-nav-open {
        overscroll-behavior: contain;
    }

    .sidebar {
        width: min(340px, 88vw) !important;
        max-width: 88vw !important;
        transform: translateX(-100%) !important;
        visibility: hidden;
        pointer-events: none;
    }

    body.panel-nav-open .sidebar {
        transform: translateX(0) !important;
        visibility: visible;
        pointer-events: auto;
    }

    .panel-nav-backdrop {
        visibility: hidden;
        pointer-events: none;
    }

    body.panel-nav-open .panel-nav-backdrop {
        visibility: visible;
        pointer-events: auto;
    }

    .sidebar .panel-brand {
        height: 76px !important;
        padding: 0 18px !important;
    }

    .sidebar .panel-brand-copy,
    .sidebar .sidebar-node,
    .sidebar .sidebar-label,
    .sidebar .nav-copy,
    .sidebar .nav-arrow,
    .sidebar .sidebar-foot {
        display: flex !important;
    }

    .sidebar .sidebar-label {
        display: block !important;
        padding: 21px 18px 9px !important;
    }

    .sidebar .nav {
        padding: 0 10px 8px !important;
    }

    .sidebar .nav-link {
        min-height: 54px !important;
        grid-template-columns: 34px minmax(0, 1fr) 16px !important;
        padding: 7px 10px !important;
    }

    .sidebar .nav-copy {
        min-width: 0;
        flex-direction: column;
        align-items: flex-start;
        line-height: 1.15;
    }

    .sidebar .nav-copy small {
        margin-top: 4px;
        color: #5f5f5b;
        font: 500 7px/1.3 var(--mono, "IBM Plex Mono", monospace);
        letter-spacing: .02em;
        text-transform: none;
    }

    .sidebar .sidebar-foot {
        justify-content: space-between;
    }

    .sidebar .sidebar-health {
        display: flex;
        align-items: center;
        gap: 9px;
    }

    .sidebar .sidebar-health > span:last-child {
        display: flex;
        flex-direction: column;
    }

    .panel-nav-toggle {
        top: calc(env(safe-area-inset-top, 0px) + 14px) !important;
        left: max(14px, env(safe-area-inset-left, 0px)) !important;
        width: 42px !important;
        height: 42px !important;
    }

    .content {
        width: 100% !important;
        margin-left: 0 !important;
        padding: 0 var(--qv-mobile-gutter) calc(72px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .panel-topbar,
    .navbar {
        width: auto !important;
        height: auto !important;
        min-height: 82px !important;
        margin: 0 calc(var(--qv-mobile-gutter) * -1) !important;
        padding: calc(env(safe-area-inset-top, 0px) + 12px) var(--qv-mobile-gutter) 12px max(68px, var(--qv-mobile-gutter)) !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 10px 12px !important;
        align-items: center !important;
        backdrop-filter: blur(16px);
    }

    .topbar-context {
        min-width: 0;
    }

    .topbar-title,
    .topbar-heading-line {
        min-width: 0;
    }

    .topbar-heading-line {
        display: block !important;
    }

    .topbar-title h4 {
        max-width: 100%;
        overflow: hidden;
        color: #f0efe9;
        font-size: clamp(20px, 4.8vw, 27px) !important;
        line-height: 1 !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .topbar-title small {
        display: block !important;
        margin-top: 5px;
        overflow: hidden;
        font-size: 6px !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .topbar-actions {
        min-width: 0;
        margin-left: 0 !important;
        display: flex !important;
        justify-content: flex-end;
        gap: 7px !important;
    }

    .server-control {
        min-width: 0;
        flex: 1 1 210px;
    }

    .server-control-meta {
        display: none !important;
    }

    .server-selector,
    .admin-scope-value {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 260px;
        height: 42px !important;
        min-height: 42px !important;
        padding-right: 28px !important;
        font-size: 9px !important;
    }

    .account-trigger,
    .dropdown-toggle.account-trigger {
        width: 42px;
        min-width: 42px;
        height: 42px;
        padding: 4px !important;
        justify-content: center;
    }

    .account-trigger img {
        width: 32px;
        height: 32px;
    }

    .account-trigger-copy,
    .account-chevron {
        display: none !important;
    }

    .account-menu .dropdown-menu {
        position: fixed !important;
        top: max(72px, calc(env(safe-area-inset-top, 0px) + 66px)) !important;
        right: var(--qv-mobile-gutter) !important;
        left: var(--qv-mobile-gutter) !important;
        width: auto !important;
        max-height: calc(100dvh - 96px);
        overflow-y: auto;
        transform: none !important;
    }

    .account-menu .dropdown-item {
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .qv-app-topbar-tools {
        gap: 5px !important;
    }

    .qv-app-topbar-tools > button {
        width: 42px !important;
        height: 42px !important;
        flex: 0 0 42px;
    }

    .admin-command-search {
        min-width: 0 !important;
        flex: 1 1 200px;
    }

    .admin-command-search input {
        width: 100% !important;
        min-width: 0 !important;
    }

    .admin-command-search kbd,
    .admin-command-search > span {
        display: none !important;
    }

    .admin-scope-control {
        display: none !important;
    }

    .content #main-section,
    .content > .container-fluid,
    .content > .container,
    .content > main {
        width: 100% !important;
        max-width: 100% !important;
        padding-top: 32px !important;
    }

    .content h2 {
        max-width: 100%;
        font-size: clamp(23px, 6.4vw, 34px) !important;
        line-height: 1.02 !important;
        letter-spacing: .01em !important;
    }

    .content h1,
    .content .qv-page-heading h2,
    .content .qv-quote-shell > h2 {
        max-width: 100%;
        font-size: clamp(35px, 10vw, 58px) !important;
        line-height: .94 !important;
        letter-spacing: -.02em !important;
    }

    .qv-page-heading {
        align-items: stretch !important;
        flex-direction: column !important;
        gap: 16px !important;
        margin-bottom: 22px !important;
        padding-bottom: 18px !important;
    }

    .qv-page-heading h1,
    .qv-page-heading h2 {
        font-size: clamp(36px, 10vw, 56px) !important;
    }

    .qv-page-heading p {
        max-width: 100% !important;
        font-size: 9px !important;
        line-height: 1.65 !important;
    }

    .qv-page-stat {
        width: 100% !important;
        min-width: 0 !important;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        text-align: left !important;
    }

    .qv-page-stat small {
        margin: 0 !important;
    }

    .qv-page-stat strong {
        font-size: 24px !important;
    }

    body > footer:not(.qv-app-panel-actions):not(.qv-quote-drawer-foot),
    body > div + footer:not(.qv-app-panel-actions):not(.qv-quote-drawer-foot) {
        width: 100%;
        margin-left: 0 !important;
        padding-right: var(--qv-mobile-gutter) !important;
        padding-left: var(--qv-mobile-gutter) !important;
    }

    /* Generic controls and data surfaces */
    :where(button, .btn, .copy-btn, .qv-ui-button, .qv-btn-ghost, .qv-detail-btn, .qv-page-link, .qv-page-action) {
        min-height: var(--qv-touch-target) !important;
    }

    :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
        max-width: 100%;
        font-size: 16px !important;
    }

    .table-responsive,
    .qv-scroll-region,
    .qv-port-table-wrap,
    .qv-permission-table {
        max-width: 100%;
        overflow-x: auto !important;
        overflow-y: visible;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-inline: contain;
    }

    .table-responsive > table,
    .qv-scroll-region > table,
    .qv-port-table-wrap > table,
    .qv-permission-table > table {
        min-width: 720px;
    }

    .content table.table {
        display: block;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-inline: contain;
    }

    .content table.table > thead,
    .content table.table > tbody {
        min-width: 680px;
    }

    .qv-table-toolbar,
    .qv-mod-toolbar,
    .qv-user-toolbar,
    .qv-organization-header,
    .qv-collection-detail-head,
    .qv-panel-head,
    .qv-system-toolbar,
    .qv-health-ops-head,
    .qv-feature-admin-toolbar {
        align-items: stretch !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    .qv-toolbar-actions,
    .qv-mod-toolbar-actions,
    .qv-collection-title-actions,
    .qv-author-actions,
    .qv-detail-actions,
    .qv-system-actions,
    .qv-server-actions,
    .qv-feature-record-actions {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start !important;
    }

    .qv-toolbar-actions > *,
    .qv-mod-toolbar-actions > *,
    .qv-collection-title-actions > *,
    .qv-detail-actions > *,
    .qv-system-actions > * {
        flex: 1 1 150px;
    }

    /* Major content grids */
    .qv-dashboard-grid,
    .qv-dashboard-secondary,
    .qv-intelligence-grid,
    .qv-member-grid,
    .qv-member-grid--lead,
    .qv-member-grid--three,
    .qv-author-grid,
    .qv-analytics-grid,
    .qv-system-grid,
    .qv-health-grid,
    .qv-health-grid-balanced,
    .qv-server-detail-grid,
    .qv-settings-grid,
    .settings-grid,
    .qv-port-grid,
    .qv-detail-columns,
    .qv-detail-grid,
    .qv-detail-grid-secondary,
    .qv-sync-grid,
    .qv-permission-map-grid,
    .qv-public-settings-grid,
    .qv-appearance-grid,
    .qv-health-maintenance-grid,
    .qv-health-capability-grid,
    .qv-health-lifecycle-grid,
    .qv-health-diagnostic-grid,
    .qv-health-action-grid,
    .qv-feature-admin-metrics,
    .qv-removal-admin-metrics,
    .qv-security-metrics,
    .qv-port-metrics,
    .qv-tags-metrics,
    .qv-analytics-cards,
    .qv-coverage-grid,
    .qv-metric-grid,
    .qv-mod-stats,
    .qv-author-stats,
    .qv-member-stats,
    .qv-settings-status-board,
    .settings-status-board {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .qv-collections-layout {
        grid-template-columns: minmax(210px, .42fr) minmax(0, 1fr) !important;
    }

    .qv-quote-searchbar,
    .qv-quote-filter-grid,
    .qv-quote-filter-grid-advanced,
    .qv-mod-event-filters,
    .qv-mod-event-filters-wide,
    .qv-log-filter,
    .qv-incident-filters,
    .qv-feature-admin-filter-stack,
    .qv-removal-admin-filter,
    .qv-collection-form-grid,
    .qv-collection-editor-grid,
    .qv-settings-form,
    .settings-form-grid,
    .settings-control-grid,
    .qv-port-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .qv-save-search-form,
    .qv-organization-search,
    .qv-revision-search,
    .qv-public-archive-actions,
    .qv-sharing-feature-actions {
        width: 100%;
        max-width: none !important;
    }

    .qv-quote-record-main,
    .qv-admin-quote-main,
    .qv-admin-record-main,
    .qv-mod-record-main {
        grid-template-columns: minmax(80px, .18fr) minmax(0, 1fr) !important;
    }

    .qv-quote-record-meta,
    .qv-admin-quote-meta-row,
    .qv-admin-record-meta,
    .qv-mod-record-meta,
    .qv-revision-record-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .qv-user-row {
        grid-template-columns: 48px minmax(150px, 1.2fr) minmax(100px, .7fr) minmax(210px, 1fr) !important;
    }

    .qv-user-role-form,
    .qv-user-action-form {
        min-width: 0 !important;
    }

    /* Application overlays */
    .qv-command {
        top: max(10px, env(safe-area-inset-top, 0px)) !important;
        right: 10px !important;
        left: 10px !important;
        width: auto !important;
        max-height: calc(100dvh - 20px - env(safe-area-inset-top, 0px)) !important;
    }

    .qv-command-head {
        grid-template-columns: auto minmax(0, 1fr) auto !important;
    }

    .qv-command-results {
        max-height: calc(100dvh - 180px) !important;
        overflow-y: auto;
    }

    .qv-app-panel,
    .qv-quote-drawer {
        top: 0 !important;
        bottom: 0 !important;
        width: min(100vw, 520px) !important;
        max-width: 100vw !important;
        height: 100dvh !important;
    }

    .qv-app-panel-head,
    .qv-quote-drawer-head {
        padding-top: max(18px, calc(env(safe-area-inset-top, 0px) + 12px)) !important;
    }

    .qv-app-panel-actions,
    .qv-quote-drawer-foot {
        padding-bottom: max(14px, calc(env(safe-area-inset-bottom, 0px) + 10px)) !important;
    }

    .qv-job-toast-stack,
    .qv-undo-toast {
        right: var(--qv-mobile-gutter) !important;
        bottom: max(var(--qv-mobile-gutter), env(safe-area-inset-bottom, 0px)) !important;
        left: var(--qv-mobile-gutter) !important;
        width: auto !important;
        max-width: none !important;
    }

    .qv-member-preview-banner,
    .qv-preview-disclaimer {
        grid-template-columns: auto minmax(0, 1fr) !important;
    }

    .qv-member-preview-actions,
    .qv-preview-disclaimer > form {
        grid-column: 1 / -1;
        justify-content: flex-start;
        padding-left: 58px;
    }

    .qv-access-preview-grid {
        grid-template-columns: 1fr;
    }
}

/* ============================================================
   PHONE — PANEL CONTENT
   ============================================================ */
@media (max-width: 650px) {
    :root {
        --qv-mobile-gutter: 14px;
    }

    .panel-topbar,
    .navbar {
        grid-template-columns: minmax(0, 1fr) !important;
        min-height: 118px !important;
        padding-left: 68px !important;
        align-content: center;
    }

    .topbar-actions {
        width: 100%;
        grid-column: 1;
        justify-content: stretch;
    }

    .server-control {
        flex: 1 1 auto;
    }

    .server-selector,
    .admin-command-search,
    .admin-command-search input {
        width: 100% !important;
        max-width: none !important;
    }

    .admin-command-search {
        flex: 1 1 auto;
    }

    .content #main-section,
    .content > .container-fluid,
    .content > .container,
    .content > main {
        padding-top: 24px !important;
    }

    .content h2 {
        margin-bottom: 16px !important;
        font-size: clamp(22px, 7.5vw, 31px) !important;
    }

    .content h1,
    .content .qv-page-heading h2,
    .content .qv-quote-shell > h2 {
        margin-bottom: 22px !important;
        font-size: clamp(32px, 11vw, 48px) !important;
    }

    .qv-page-heading h1,
    .qv-page-heading h2 {
        font-size: clamp(34px, 12vw, 50px) !important;
    }

    #main-section .alert-message,
    #main-section .qv-announcement,
    .content .alert-message,
    .content .qv-announcement {
        min-height: 0 !important;
        padding: 14px 14px 14px 52px !important;
        margin-bottom: 22px !important;
    }

    #main-section .alert-message::before,
    #main-section .qv-announcement::before,
    .content .alert-message::before,
    .content .qv-announcement::before {
        left: 12px !important;
        width: 30px !important;
        height: 30px !important;
    }

    .qv-member-preview-banner,
    .qv-preview-disclaimer {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        padding: 15px !important;
    }

    .qv-member-preview-icon,
    .qv-preview-disclaimer > i {
        width: 38px;
        height: 38px;
        font-size: 22px;
    }

    .qv-member-preview-actions,
    .qv-preview-disclaimer > form {
        grid-column: auto;
        padding-left: 0;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .qv-member-preview-actions a,
    .qv-member-preview-actions button,
    .qv-preview-disclaimer .qv-ui-button {
        width: 100%;
    }

    .qv-access-preview-list article {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 15px;
    }

    .qv-access-state {
        width: 100%;
        justify-content: center;
    }

    .qv-dashboard-hero,
    .qv-author-hero,
    .qv-member-hero,
    .qv-settings-heading,
    .qv-port-heading,
    .qv-security-heading,
    .qv-system-heading,
    .qv-health-heading,
    .qv-feature-heading,
    .qv-admin-search-hero,
    .qv-admin-changelog-hero {
        padding-right: 16px !important;
        padding-left: 16px !important;
    }

    .qv-dashboard-grid,
    .qv-dashboard-secondary,
    .qv-intelligence-grid,
    .qv-member-grid,
    .qv-member-grid--lead,
    .qv-member-grid--three,
    .qv-author-grid,
    .qv-analytics-grid,
    .qv-system-grid,
    .qv-health-grid,
    .qv-health-grid-balanced,
    .qv-server-detail-grid,
    .qv-settings-grid,
    .settings-grid,
    .qv-port-grid,
    .qv-detail-columns,
    .qv-detail-grid,
    .qv-detail-grid-secondary,
    .qv-sync-grid,
    .qv-permission-map-grid,
    .qv-public-settings-grid,
    .qv-appearance-grid,
    .qv-health-maintenance-grid,
    .qv-health-capability-grid,
    .qv-health-lifecycle-grid,
    .qv-health-diagnostic-grid,
    .qv-health-action-grid,
    .qv-feature-admin-metrics,
    .qv-removal-admin-metrics,
    .qv-security-metrics,
    .qv-port-metrics,
    .qv-tags-metrics,
    .qv-analytics-cards,
    .qv-coverage-grid,
    .qv-metric-grid,
    .qv-mod-stats,
    .qv-author-stats,
    .qv-member-stats,
    .qv-settings-status-board,
    .settings-status-board,
    .qv-collections-layout,
    .qv-quote-searchbar,
    .qv-quote-filter-grid,
    .qv-quote-filter-grid-advanced,
    .qv-mod-event-filters,
    .qv-mod-event-filters-wide,
    .qv-log-filter,
    .qv-incident-filters,
    .qv-feature-admin-filter-stack,
    .qv-removal-admin-filter,
    .qv-collection-form-grid,
    .qv-collection-editor-grid,
    .qv-settings-form,
    .settings-form-grid,
    .settings-control-grid,
    .qv-port-fields {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .qv-metric-grid,
    .qv-mod-stats,
    .qv-author-stats,
    .qv-member-stats,
    .qv-settings-status-board,
    .qv-port-metrics,
    .qv-tags-metrics,
    .qv-security-metrics {
        gap: 0 !important;
    }

    .qv-metric,
    .qv-system-stat,
    .qv-analytics-card,
    .qv-tags-metric,
    .qv-port-metrics > *,
    .qv-security-metrics > *,
    .qv-mod-stats > *,
    .qv-author-stats > *,
    .qv-member-stats > * {
        min-height: 112px !important;
    }

    .qv-quote-record-main,
    .qv-admin-quote-main,
    .qv-admin-record-main,
    .qv-mod-record-main {
        grid-template-columns: 1fr !important;
        gap: 9px !important;
        padding: 13px !important;
    }

    .qv-quote-record-meta,
    .qv-admin-quote-meta-row,
    .qv-admin-record-meta,
    .qv-mod-record-meta,
    .qv-revision-record-meta {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        padding: 12px 13px !important;
    }

    .qv-record-actions,
    .qv-admin-quote-actions,
    .qv-admin-record-action,
    .qv-revision-record-action {
        width: 100%;
        justify-self: stretch !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .qv-record-actions > *,
    .qv-admin-quote-actions > *,
    .qv-admin-record-action > *,
    .qv-revision-record-action > * {
        width: 100%;
    }


    .community-authors-page .authors-panel {
        overflow: visible !important;
        border: 0 !important;
        background: transparent !important;
    }

    .community-authors-page .authors-table,
    .community-authors-page .authors-table tbody,
    .community-authors-page .authors-table tr,
    .community-authors-page .authors-table td {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        white-space: normal !important;
    }

    .community-authors-page .authors-table {
        overflow: visible !important;
        background: transparent !important;
    }

    .community-authors-page .authors-table thead {
        display: none !important;
    }

    .community-authors-page .authors-table tbody {
        display: grid !important;
        gap: 10px;
    }

    .community-authors-page .authors-table tr {
        padding: 13px 14px !important;
        border: 1px solid #2b2b2b !important;
        background: #0c0c0c !important;
    }

    .community-authors-page .authors-table td {
        min-height: 36px;
        padding: 9px 0 !important;
        display: grid !important;
        grid-template-columns: minmax(92px, .38fr) minmax(0, 1fr) !important;
        gap: 12px;
        align-items: start;
        border: 0 !important;
        border-bottom: 1px solid #202020 !important;
        text-align: left !important;
    }

    .community-authors-page .authors-table td:last-child {
        border-bottom: 0 !important;
    }

    .community-authors-page .authors-table td::before {
        content: attr(data-label);
        color: #62625e;
        font: 700 7px/1.35 var(--mono, "IBM Plex Mono", monospace);
        letter-spacing: .1em;
        text-transform: uppercase;
    }

    .community-authors-page .authors-row-actions {
        width: 100%;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
    }

    .community-authors-page .authors-view-link {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        margin: 0 !important;
    }

    .qv-user-list {
        display: grid !important;
        gap: 10px;
        border: 0 !important;
        background: transparent !important;
    }

    .qv-user-row {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) !important;
        gap: 12px !important;
        padding: 16px !important;
        border: 1px solid #292929 !important;
        background: #0c0c0c;
    }

    .qv-user-index {
        grid-row: 1 / span 2;
        align-self: start;
    }

    .qv-user-current,
    .qv-user-authority,
    .qv-user-role-form,
    .qv-user-action-form,
    .qv-user-ban,
    .qv-user-unban,
    .qv-root-lock {
        grid-column: 1 / -1 !important;
        width: 100% !important;
    }

    .qv-user-role-form,
    .qv-user-action-form {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 8px !important;
    }

    .qv-user-role-form select,
    .qv-user-action-form select {
        width: 100% !important;
        min-width: 0 !important;
    }

    .qv-save-search-form,
    .qv-organization-search,
    .qv-revision-search,
    .qv-public-archive-actions,
    .qv-sharing-feature-actions,
    .qv-slug-input,
    .qv-media-field,
    .qv-color-control,
    .qv-color-rgb {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .qv-save-search-form button,
    .qv-organization-search button,
    .qv-revision-search button,
    .qv-public-archive-actions > *,
    .qv-sharing-feature-actions > *,
    .qv-media-field > .qv-ui-button {
        width: 100% !important;
    }

    .qv-organization-tabs,
    .qv-mod-work-tabs,
    .qv-query-presets,
    .qv-saved-search-list,
    .qv-active-filters {
        max-width: 100%;
        display: flex !important;
        overflow-x: auto;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
    }

    .qv-organization-tabs > *,
    .qv-mod-work-tabs > *,
    .qv-query-presets > *,
    .qv-saved-search-list > *,
    .qv-active-filters > * {
        flex: 0 0 auto;
        scroll-snap-align: start;
    }

    .qv-setting-card,
    .settings-card,
    .qv-public-address-card,
    .qv-appearance-preview {
        min-width: 0 !important;
        grid-template-columns: 1fr !important;
    }

    .qv-setting-copy,
    .qv-setting-input-wrap,
    .qv-setting-input,
    .qv-setting-select,
    .qv-setting-textarea {
        width: 100% !important;
        min-width: 0 !important;
    }

    .qv-settings-savebar,
    .settings-save-dock {
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        padding: 10px var(--qv-mobile-gutter) max(10px, env(safe-area-inset-bottom, 0px)) !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .qv-settings-savebar button,
    .settings-save-dock button {
        width: 100% !important;
    }

    .qv-color-popover {
        position: fixed !important;
        top: max(12px, env(safe-area-inset-top, 0px)) !important;
        right: 12px !important;
        bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important;
        left: 12px !important;
        width: auto !important;
        max-height: calc(100dvh - 24px) !important;
        overflow-y: auto;
    }

    .qv-color-rgb {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .qv-context-grid,
    .qv-timeline-diff,
    .qv-revision-text-grid,
    .qv-sharing-overview,
    .qv-sharing-feature-top,
    .qv-collection-share,
    .qv-detail-share-head,
    .qv-public-address-card,
    .qv-record-activity,
    .qv-activity-row,
    .qv-member-list article,
    .qv-related-list article {
        grid-template-columns: 1fr !important;
    }

    .qv-command-hint {
        display: none !important;
    }

    .qv-command-item {
        grid-template-columns: auto minmax(0, 1fr) !important;
    }

    .qv-command-item em {
        display: none;
    }

    .qv-quote-drawer-body,
    .qv-app-panel-body {
        padding: 14px !important;
    }

    .qv-quote-meta-grid {
        grid-template-columns: 1fr !important;
    }

    .qv-job-toast-actions,
    .qv-undo-toast-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .qv-job-toast-actions > *,
    .qv-undo-toast-actions > * {
        width: 100%;
    }

    .modal-dialog {
        width: auto !important;
        max-width: none !important;
        margin: max(10px, env(safe-area-inset-top, 0px)) 10px max(10px, env(safe-area-inset-bottom, 0px)) !important;
    }

    .modal-content {
        max-height: calc(100dvh - 20px);
        overflow-y: auto;
    }

    .qv-preferences-modal .modal-body {
        display: grid;
        grid-template-columns: 1fr !important;
        gap: 12px;
    }

    .qv-preferences-modal .modal-footer {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .qv-pagination,
    .qv-panel-pagination {
        justify-content: center !important;
    }
}


/* Synic diagnostics is intentionally independent of the product shell, but it
   still needs a usable narrow-screen table and touch-sized controls. */
@media (max-width: 760px) {
    .qv-diagnostics-page main {
        width: calc(100% - (var(--qv-mobile-gutter) * 2)) !important;
        margin: 18px auto 36px !important;
    }

    .qv-diagnostics-page .summary {
        grid-template-columns: 1fr !important;
    }

    .qv-diagnostics-page table {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .qv-diagnostics-page th,
    .qv-diagnostics-page td {
        padding: 11px !important;
    }
}

/* ============================================================
   PUBLIC SITE / ARCHIVE / LEGAL / SHARES
   ============================================================ */
@media (max-width: 900px) {
    .site-shell {
        width: 100%;
        overflow-x: hidden;
    }

    .site-nav {
        width: 100%;
        height: auto !important;
        min-height: 76px;
        padding: max(12px, env(safe-area-inset-top, 0px)) var(--qv-mobile-gutter) 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 10px 14px;
    }

    .site-nav .brand {
        min-width: 0;
    }

    .site-nav .brand-copy {
        min-width: 0;
    }

    .site-nav .brand-copy strong,
    .site-nav .brand-copy small {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .site-nav .account-link {
        min-height: 42px;
        padding: 0 12px !important;
        white-space: nowrap;
    }

    .site-nav .nav-links {
        grid-column: 1 / -1;
        width: calc(100% + (var(--qv-mobile-gutter) * 2));
        height: 46px !important;
        margin-left: calc(var(--qv-mobile-gutter) * -1);
        display: flex !important;
        overflow-x: auto;
        border-top: 1px solid #222;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        scroll-snap-type: x proximity;
    }

    .site-nav .nav-links::-webkit-scrollbar {
        display: none;
    }

    .site-nav .nav-links a {
        min-width: max-content;
        padding: 0 16px !important;
        flex: 0 0 auto;
        scroll-snap-align: start;
    }

    .hero {
        min-height: auto !important;
        padding: 38px var(--qv-mobile-gutter) 44px !important;
        background-position: center;
    }

    .hero::before {
        right: var(--qv-mobile-gutter) !important;
        left: var(--qv-mobile-gutter) !important;
        top: 62px !important;
    }

    .hero::after {
        display: none;
    }

    .hero-meta {
        gap: 14px;
        font-size: 7px !important;
    }

    .hero-grid {
        grid-template-columns: 1fr !important;
        gap: 38px !important;
        padding: 54px 0 20px !important;
    }

    .hero h1 {
        max-width: 100%;
        margin: 15px 0 24px !important;
        font-size: clamp(58px, 16vw, 104px) !important;
        line-height: .8 !important;
    }

    .hero-description {
        max-width: 100% !important;
        font-size: 14px !important;
        line-height: 1.7 !important;
    }

    .hero-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hero-actions .btn {
        width: 100%;
    }

    .hero-terminal {
        width: 100%;
        max-width: 680px;
        justify-self: stretch;
    }

    .hero-terminal blockquote {
        padding: 30px 24px !important;
        font-size: clamp(27px, 7vw, 42px) !important;
    }

    .quote-data {
        grid-template-columns: 1fr !important;
    }

    .quote-data span {
        border-right: 0 !important;
        border-bottom: 1px solid var(--line, #292929);
    }

    .quote-data span:last-child {
        border-bottom: 0 !important;
    }

    .section {
        padding: 64px var(--qv-mobile-gutter) !important;
    }

    .section-head,
    .command-section,
    .faq-section {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
    }

    .section-head {
        align-items: start !important;
        margin-bottom: 36px !important;
    }

    .section-head h2,
    .command-copy h2,
    .faq-intro h2,
    .final-cta h2 {
        font-size: clamp(46px, 13vw, 74px) !important;
    }

    .feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .feature-card {
        min-height: 300px !important;
        padding: 24px !important;
    }

    .feature-card > i {
        margin: 45px 0 28px !important;
    }

    .stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .faq-list article {
        grid-template-columns: 38px minmax(0, 1fr) !important;
    }

    .final-cta {
        padding: 76px var(--qv-mobile-gutter) !important;
    }

    .site-shell > footer,
    body > footer:not(.gate-footer) {
        grid-template-columns: 1fr !important;
        gap: 22px !important;
        padding-right: var(--qv-mobile-gutter) !important;
        padding-left: var(--qv-mobile-gutter) !important;
    }

    .footer-links {
        flex-wrap: wrap;
        gap: 14px 20px !important;
    }

    /* Public archive */
    .archive-shell,
    .archive-main,
    .archive-hero,
    .archive-section,
    .public-archive-main {
        max-width: 100% !important;
    }

    .archive-hero {
        min-height: auto !important;
        padding-right: var(--qv-mobile-gutter) !important;
        padding-left: var(--qv-mobile-gutter) !important;
    }

    .archive-hero-grid,
    .archive-hero-copy,
    .archive-member-hero,
    .archive-member-facts,
    .archive-tools,
    .archive-search,
    .archive-quote,
    .archive-quote-meta,
    .archive-card-grid,
    .archive-collection-grid,
    .archive-member-grid {
        grid-template-columns: 1fr !important;
    }

    .archive-hero h1 {
        max-width: 100%;
        font-size: clamp(52px, 14vw, 94px) !important;
    }

    .archive-tabs,
    .archive-nav,
    .archive-filter-tabs {
        max-width: 100%;
        display: flex !important;
        overflow-x: auto;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
    }

    .archive-tabs > *,
    .archive-nav > *,
    .archive-filter-tabs > * {
        flex: 0 0 auto;
    }

    .archive-search input {
        width: 100% !important;
    }

    .archive-quote,
    .archive-card,
    .archive-member-card {
        padding: 16px !important;
    }

    /* Share pages */
    .share-main {
        width: 100% !important;
        max-width: 100% !important;
        padding-right: var(--qv-mobile-gutter) !important;
        padding-left: var(--qv-mobile-gutter) !important;
    }

    .share-heading,
    .share-meta-grid,
    .share-list-main,
    .share-related,
    .share-identity,
    .share-copy-actions {
        grid-template-columns: 1fr !important;
    }

    .share-heading h1 {
        font-size: clamp(44px, 13vw, 72px) !important;
    }

    .share-list-record,
    .share-card,
    .share-related {
        min-width: 0;
    }

    .share-link-copy {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    /* Legal/docs */
    .legal-hero,
    .legal-layout,
    .docs-hero,
    .docs-layout {
        width: 100% !important;
        max-width: 100% !important;
        padding-right: var(--qv-mobile-gutter) !important;
        padding-left: var(--qv-mobile-gutter) !important;
    }

    .legal-summary,
    .legal-layout,
    .legal-section,
    .docs-layout,
    .doc-grid,
    .docs-grid {
        grid-template-columns: 1fr !important;
    }

    .legal-index,
    .docs-index {
        position: static !important;
        display: block !important;
        max-width: 100%;
        overflow-x: auto;
        white-space: nowrap;
    }

    .legal-index a,
    .docs-index a {
        display: inline-flex !important;
        width: auto !important;
        margin-right: 14px;
    }

    .legal-hero h1,
    .docs-hero h1 {
        font-size: clamp(54px, 16vw, 94px) !important;
    }

    .effective-date {
        min-width: 0 !important;
    }
}

@media (max-width: 560px) {
    .site-nav .brand-copy small {
        display: none !important;
    }

    .site-nav .brand-copy strong {
        font-size: 16px !important;
    }

    .site-nav .account-link {
        max-width: 128px;
        overflow: hidden;
        font-size: 9px !important;
        text-overflow: ellipsis;
    }

    .hero-actions,
    .feature-grid,
    .stats {
        grid-template-columns: 1fr !important;
    }

    .feature-card {
        min-height: 260px !important;
    }

    .hero-meta > :first-child {
        display: none;
    }

    .faq-list article {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .command-display {
        box-shadow: 8px 8px 0 #0f0f0f !important;
    }

    .command-preview {
        padding: 19px 16px !important;
        font-size: 12px !important;
        line-height: 1.8 !important;
    }
}

/* ============================================================
   LOGIN / SERVER SELECTION / ERROR SURFACES
   ============================================================ */
@media (max-width: 900px) {
    .login-shell {
        min-height: calc(100dvh - 120px) !important;
        padding: max(22px, env(safe-area-inset-top, 0px)) var(--qv-mobile-gutter) 28px !important;
    }

    .login-message-stack,
    .login-container {
        width: min(100%, 580px) !important;
        max-width: 100% !important;
    }

    .login-container {
        padding: clamp(24px, 7vw, 46px) !important;
    }

    .login-container h1 {
        font-size: clamp(42px, 13vw, 72px) !important;
        line-height: .92 !important;
    }

    .login-btn {
        width: 100%;
        min-height: 50px;
    }

    .server-gate {
        width: 100%;
        min-height: auto !important;
        padding: max(18px, env(safe-area-inset-top, 0px)) var(--qv-mobile-gutter) 30px !important;
    }

    .gate-layout {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
    }

    .gate-meta {
        gap: 12px;
        flex-wrap: wrap;
    }

    .gate-intro,
    .gate-control {
        min-width: 0;
    }

    .gate-copy h1 {
        font-size: clamp(56px, 16vw, 96px) !important;
    }

    .gate-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
    }

    .gate-button {
        width: 100%;
        min-height: 58px;
    }

    .gate-footer {
        position: static !important;
        width: 100%;
        padding: 20px var(--qv-mobile-gutter) max(20px, env(safe-area-inset-bottom, 0px)) !important;
        display: flex !important;
        flex-wrap: wrap;
        gap: 10px 20px;
    }

    .error-page,
    .error-shell,
    .removal-shell,
    .removal-main {
        width: 100% !important;
        max-width: 100% !important;
        padding-right: var(--qv-mobile-gutter) !important;
        padding-left: var(--qv-mobile-gutter) !important;
    }
}

/* Prevent sticky/fixed controls from covering the last interactive region. */
@media (max-width: 650px) {
    body:has(.qv-settings-savebar),
    body:has(.settings-save-dock) {
        padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sidebar,
    .panel-nav-backdrop,
    .qv-command,
    .qv-app-panel,
    .qv-quote-drawer {
        transition: none !important;
    }
}