/* ================================================================
   Pollux — Mobile Responsive Overrides
   Charge APRES tous les autres CSS.
   Desktop = inchange. Tout ici est sous @media.
   Breakpoints: 768px (mobile), 1023px (tablet)
   ================================================================ */

/* ---- CSS Custom Properties for safe areas ---- */
:root {
    --mobile-bottom-bar-h: 56px;
    --mobile-header-h: 48px;
}

/* ================================================================
   TABLET (640px — 1023px)
   ================================================================ */
@media (max-width: 1023px) {
    /* Module nav: collapse to icon-only 52px */
    .module-nav {
        width: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;
    }
    .module-nav-label,
    .module-nav-logo-text,
    .module-nav-badge,
    .module-nav-footer { display: none !important; }
    .module-nav-item { justify-content: center; padding: 12px 0 !important; }
    .module-nav-logo { justify-content: center; padding: 12px 0 !important; }
}

/* ================================================================
   MOBILE (< 768px) — Tout le redesign
   ================================================================ */
@media (max-width: 767px) {

    /* ---- 1. Cacher le module nav lateral (visuellement, pas du DOM) ---- */
    .module-nav {
        position: fixed !important;
        left: -9999px !important;
        width: 1px !important;
        height: 1px !important;
        overflow: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    /* ---- Ensure hidden overlays never capture touches ---- */
    .mobile-overlay:not(.active),
    .app-launcher-backdrop:not(.open),
    .module-preview.hidden,
    .welcome-overlay.hidden,
    .pollux-confirm-overlay[hidden],
    .memory-overlay.hidden,
    .spotlight-overlay.hidden,
    .module-tooltip {
        pointer-events: none !important;
    }

    /* ---- 2. App container = colonne pleine largeur ---- */
    .app-container {
        flex-direction: column;
    }
    .main-content {
        width: 100% !important;
        min-width: 0 !important;
    }

    /* ---- 3. Bottom Tab Bar ---- */
    .mobile-bottom-bar {
        display: flex !important;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        height: var(--mobile-bottom-bar-h);
        padding-bottom: env(safe-area-inset-bottom, 0px);
        background: var(--surface);
        border-top: 1px solid var(--border);
        z-index: 1100;
        align-items: center;
        justify-content: space-around;
        box-shadow: 0 -2px 10px rgba(0,0,0,0.08);
    }
    .mobile-tab {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        flex: 1;
        padding: 6px 0;
        border: none;
        background: none;
        color: var(--text-muted);
        font: 500 10px/1 var(--sans);
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        transition: color 150ms;
        min-height: 44px; /* touch target */
    }
    .mobile-tab svg {
        width: 22px;
        height: 22px;
        flex-shrink: 0;
    }
    .mobile-tab.active {
        color: var(--accent);
    }
    .mobile-tab:active {
        transform: scale(0.92);
    }
    .mobile-tab-badge {
        position: absolute;
        top: 2px;
        right: calc(50% - 14px);
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #ef4444;
    }

    /* Reserve bottom space for the bar on the main app container */
    .app-container {
        height: calc(100dvh - var(--mobile-bottom-bar-h) - env(safe-area-inset-bottom, 0px)) !important;
        max-height: calc(100dvh - var(--mobile-bottom-bar-h) - env(safe-area-inset-bottom, 0px)) !important;
    }

    /* Chat input must sit above bottom bar */
    .chat-input-container {
        padding-bottom: 8px !important;
    }

    /* ---- 4. Sidebar = fullscreen drawer ---- */
    .sidebar {
        width: 100vw !important;
        max-width: 100vw !important;
        z-index: 1200 !important;
        pointer-events: none !important;
    }
    .sidebar.open {
        transform: translateX(0) !important;
        pointer-events: auto !important;
    }

    /* ---- 5. Artifact panel = bottom sheet ---- */
    .artifact-panel {
        position: fixed !important;
        top: auto !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 85vh !important;
        max-height: 85vh !important;
        border-radius: 16px 16px 0 0 !important;
        transform: translateY(100%) !important;
        transition: transform 300ms cubic-bezier(0.32, 0.72, 0, 1) !important;
        z-index: 1200 !important;
        pointer-events: none !important;
    }
    .artifact-panel:not(.hidden) {
        transform: translateY(0) !important;
        pointer-events: auto !important;
    }
    .artifact-panel.hidden {
        pointer-events: none !important;
    }
    /* Bottom sheet handle */
    .artifact-panel::before {
        content: '';
        display: block;
        width: 36px;
        height: 4px;
        border-radius: 2px;
        background: var(--border);
        margin: 10px auto 6px;
        flex-shrink: 0;
    }

    /* ---- 6. Toast container = pass-through clicks ---- */
    .toast-container {
        pointer-events: none !important;
        left: 12px !important;
        right: 12px !important;
        bottom: calc(var(--mobile-bottom-bar-h) + 12px) !important;
        max-width: 100% !important;
    }
    .toast-container .toast {
        pointer-events: auto !important;
        max-width: 100% !important;
    }

    /* App launcher = fullscreen on mobile */
    .app-launcher-backdrop:not(.hidden) .app-launcher {
        width: 100% !important;
        max-width: 100% !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        border-radius: 0 !important;
        margin: 0 !important;
    }
    .app-launcher-input {
        font-size: 16px !important;
    }

    /* ---- 7. Chat: hide text below input bar ---- */
    .chat-input-info {
        display: none !important;
    }

    /* ---- 7b. Chat layout mobile ---- */
    .chat-header {
        padding: 8px 12px !important;
        min-height: var(--mobile-header-h) !important;
    }
    .chat-input {
        font-size: 16px !important;
    }
    .chat-input-container {
        padding: 6px 10px 8px !important;
    }
    .message {
        padding: 10px 12px !important;
    }

    /* ---- 8. Spotlight (search) = fullscreen ---- */
    .spotlight-overlay {
        padding-top: 0 !important;
        align-items: flex-start !important;
    }
    .spotlight-dialog {
        width: 100% !important;
        max-width: 100% !important;
        max-height: 100vh !important;
        border-radius: 0 !important;
        margin: 0 !important;
    }
    .spotlight-input {
        font-size: 16px !important;
    }

    /* ---- 9. Input font 16px to prevent iOS zoom ---- */
    input, textarea, select {
        font-size: 16px !important;
    }

    /* Touch targets: only on primary action buttons, not global */
    .mobile-tab,
    .scribe-btn-primary,
    .scribe-btn-lg {
        min-height: 44px;
    }

    /* ---- 10. Module sidebars → horizontal tabs ---- */

    /* Scribe sidebar */
    .scribe-sidebar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 0 8px !important;
        gap: 0 !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        height: auto !important;
        min-height: 44px;
    }
    .scribe-sidebar-item {
        white-space: nowrap !important;
        padding: 10px 14px !important;
        border-radius: 0 !important;
        font-size: 12px !important;
        flex-shrink: 0;
    }
    .scribe-sidebar-item.active {
        border-bottom: 2px solid var(--accent) !important;
        background: transparent !important;
    }
    .scribe-sidebar-meetings,
    .scribe-sidebar-spacer,
    .scribe-sidebar-help {
        display: none !important;
    }
    .scribe-layout {
        flex-direction: column !important;
    }
    .scribe-body {
        width: 100% !important;
    }
    .scribe-main {
        padding: 16px 12px !important;
        max-width: 100% !important;
    }
    .scribe-header {
        padding: 0 12px !important;
        height: 48px !important;
        min-height: 48px !important;
    }
    .scribe-header h1 { font-size: 14px !important; }

    /* Sentinel sidebar */
    .sentinel-sidebar,
    .cert-sidebar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 0 8px !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        height: auto !important;
    }
    .sentinel-sidebar .sentinel-nav-item,
    .cert-sidebar .cert-nav-item {
        white-space: nowrap !important;
        padding: 10px 14px !important;
        flex-shrink: 0;
    }
    .sentinel-sidebar .sentinel-nav-label,
    .cert-sidebar .cert-nav-label {
        display: inline !important;
        font-size: 12px !important;
    }
    .sentinel-layout,
    .cert-layout {
        flex-direction: column !important;
    }
    .sentinel-main,
    .cert-main {
        padding: 16px 12px !important;
        max-width: 100% !important;
    }

    /* Admin sidebar */
    .admin-nav {
        width: 100% !important;
        min-width: 0 !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        padding: 0 8px !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        height: auto !important;
    }
    .admin-nav-item {
        white-space: nowrap !important;
        flex-shrink: 0;
    }
    .admin-nav-label { display: inline !important; font-size: 12px !important; }
    .admin-layout { flex-direction: column !important; }
    .admin-main { padding: 16px 12px !important; }

    /* Settings sidebar */
    .settings-sidebar,
    .settings-nav {
        width: 100% !important;
        min-width: 0 !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        height: auto !important;
        padding: 0 !important;
    }
    .settings-nav-item {
        white-space: nowrap !important;
        flex-shrink: 0;
    }
    .settings-nav-label { display: inline !important; font-size: 12px !important; }

    /* Praedict, Minerva, Wiki, Studio, Ecriture sidebars */
    .praedict-sidebar,
    .minerva-sidebar,
    .wiki-sidebar,
    .studio-sidebar,
    .ecriture-sidebar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 0 8px !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        height: auto !important;
    }
    .praedict-layout,
    .minerva-layout,
    .wiki-layout,
    .studio-layout,
    .ecriture-layout {
        flex-direction: column !important;
    }
    .praedict-main,
    .minerva-main,
    .wiki-main,
    .studio-main,
    .ecriture-main {
        padding: 16px 12px !important;
        max-width: 100% !important;
    }

    /* ---- 11. Scribe Live View — video/transcription toggle ---- */
    .scribe-live-container.jitsi-mode {
        grid-template-columns: 1fr !important;
        grid-template-rows: 1fr !important;
        height: calc(100vh - var(--mobile-bottom-bar-h) - 48px) !important;
    }
    .scribe-live-container.jitsi-mode .scribe-jitsi-panel {
        min-height: 100% !important;
        height: 100% !important;
    }
    .scribe-live-container.jitsi-mode .scribe-live-transcription-panel {
        display: none !important;
    }
    .scribe-live-container.jitsi-mode.show-transcription .scribe-jitsi-panel {
        display: none !important;
    }
    .scribe-live-container.jitsi-mode.show-transcription .scribe-live-transcription-panel {
        display: flex !important;
    }

    /* Mobile toggle bar for live view */
    .scribe-mobile-view-toggle {
        display: flex !important;
        position: fixed;
        bottom: calc(var(--mobile-bottom-bar-h) + env(safe-area-inset-bottom, 0px));
        left: 0;
        right: 0;
        height: 44px;
        background: var(--surface);
        border-top: 1px solid var(--border);
        z-index: 1050;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 0 8px;
    }
    .scribe-mobile-view-btn {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 8px;
        border: none;
        border-radius: 8px;
        background: transparent;
        color: var(--text-muted);
        font: 500 12px/1 var(--sans);
        cursor: pointer;
        min-height: 36px;
    }
    .scribe-mobile-view-btn.active {
        background: var(--accent-glow, rgba(99,102,241,0.1));
        color: var(--accent);
    }

    /* ---- 12. Forms = full width stacked ---- */
    .scribe-form-container {
        padding: 0 !important;
    }
    .scribe-form-row {
        flex-direction: column !important;
        gap: 0 !important;
    }
    .scribe-form-actions {
        position: sticky !important;
        bottom: var(--mobile-bottom-bar-h) !important;
        background: var(--bg) !important;
        padding: 12px 0 !important;
        border-top: 1px solid var(--border) !important;
        z-index: 10;
    }
    .scribe-mode-selector {
        flex-wrap: wrap !important;
    }
    .scribe-mode-opt {
        flex: 1 1 calc(33% - 8px) !important;
        min-width: 90px !important;
        padding: 12px 8px !important;
        font-size: 12px !important;
    }
    .scribe-hero {
        flex-direction: column !important;
        text-align: center !important;
        padding: 20px 0 !important;
    }
    .scribe-hero-right { display: none !important; }
    .scribe-hero-title { font-size: 20px !important; }
    .scribe-hero-actions {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }
    .scribe-hero-join {
        flex-direction: column !important;
    }
    .scribe-hero-join-input {
        width: 100% !important;
    }

    /* ---- 13. Meeting cards stacked ---- */
    .scribe-meeting-card {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 8px !important;
    }
    .scribe-meeting-actions {
        width: 100%;
        display: flex;
        gap: 8px;
    }
    .scribe-meeting-actions .scribe-btn {
        flex: 1;
    }
    .scribe-card-actions {
        position: absolute !important;
        top: 8px !important;
        right: 8px !important;
    }

    /* ---- 14. Detail view ---- */
    .scribe-detail-header {
        flex-direction: column !important;
        gap: 12px !important;
    }
    .scribe-tabs {
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
    }
    .scribe-tab {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        font-size: 12px !important;
    }
    .scribe-info-grid {
        grid-template-columns: 1fr !important;
    }
    .scribe-export-group {
        flex-wrap: wrap !important;
    }

    /* ---- 15. Quick menu ---- */
    .scribe-quick-menu {
        position: fixed !important;
        top: auto !important;
        bottom: calc(var(--mobile-bottom-bar-h) + env(safe-area-inset-bottom, 0px)) !important;
        left: 8px !important;
        right: 8px !important;
        min-width: 0 !important;
        border-radius: 16px 16px 0 0 !important;
    }

    /* ---- 16. Stats bar ---- */
    .scribe-stats-bar {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }
    .scribe-stat {
        padding: 14px !important;
    }
    .scribe-stat-value {
        font-size: 20px !important;
    }

    /* ---- 17. Welcome dashboard mobile ---- */
    .welcome-dashboard {
        padding: 20px 12px !important;
    }
    .wd-featured {
        grid-template-columns: 1fr !important;
    }
    .wd-grid {
        grid-template-columns: repeat(3, 1fr) !important;
    }

    /* ---- 18. Connection dot = above bottom bar ---- */
    .connection-dot {
        bottom: calc(var(--mobile-bottom-bar-h) + 8px + env(safe-area-inset-bottom, 0px)) !important;
    }

    /* ---- 19. Overscroll containment ---- */
    .scribe-live-transcription,
    .sidebar,
    .artifact-panel {
        overscroll-behavior: contain;
    }

    /* ================================================================
       20. SETTINGS MODULE — Full mobile redesign
       ================================================================ */

    /* Header compact */
    .settings-header {
        padding: 0 12px !important;
        height: 48px !important;
        min-height: 48px !important;
    }
    .settings-header h1 { font-size: 14px !important; }
    .settings-search-wrapper {
        min-width: 0 !important;
        max-width: none !important;
        flex: 1 !important;
    }
    .settings-search-wrapper .settings-search {
        min-width: 0 !important;
    }

    /* Sidebar → horizontal scrollable tabs */
    .settings-body {
        flex-direction: column !important;
    }
    .settings-nav {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 0 !important;
        gap: 0 !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        height: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    .settings-nav-item {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        padding: 10px 14px !important;
        border-radius: 0 !important;
        font-size: 12px !important;
        gap: 6px !important;
        justify-content: center !important;
    }
    .settings-nav-item.active {
        border-bottom: 2px solid var(--accent) !important;
        background: transparent !important;
    }
    .settings-nav-item svg {
        width: 16px !important;
        height: 16px !important;
    }

    /* Content full width */
    .settings-content {
        padding: 16px 12px !important;
        width: 100% !important;
    }
    .settings-section {
        max-width: 100% !important;
    }

    /* Profile hero stacks */
    .settings-profile-hero {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        gap: 12px !important;
    }

    /* Cards full width */
    .settings-card {
        padding: 16px !important;
    }

    /* Grids adapt */
    .settings-accent-colors {
        grid-template-columns: repeat(4, 1fr) !important;
    }
    .settings-checkboxes {
        grid-template-columns: 1fr !important;
    }
    .settings-sources-grid {
        grid-template-columns: 1fr !important;
    }

    /* Theme/font/detail pickers wrap */
    .settings-theme-picker,
    .settings-fontsize-picker,
    .settings-detail-picker {
        flex-wrap: wrap !important;
    }

    /* Module nav buttons wrap better */
    .settings-module-nav {
        gap: 4px !important;
    }
    .settings-module-nav button {
        font-size: 11px !important;
        padding: 6px 10px !important;
    }

    /* Actions sticky bottom */
    .settings-actions {
        position: sticky !important;
        bottom: 0 !important;
        background: var(--bg) !important;
        padding: 12px 0 !important;
        border-top: 1px solid var(--border) !important;
        z-index: 10;
    }

    /* Activity log shorter */
    .settings-activity-log {
        max-height: 180px !important;
    }

    /* ================================================================
       21. ADMIN MODULE — Full mobile redesign
       ================================================================ */

    /* Header compact */
    .admin-header {
        padding: 0 12px !important;
        height: 48px !important;
        min-height: 48px !important;
    }
    .admin-header h1 { font-size: 14px !important; }
    .admin-search-wrapper {
        min-width: 0 !important;
        max-width: none !important;
        flex: 1 !important;
    }
    .admin-search-wrapper .admin-search {
        min-width: 0 !important;
    }

    /* Sidebar → horizontal scrollable tabs */
    .admin-body {
        flex-direction: column !important;
    }
    .admin-nav {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 0 !important;
        gap: 0 !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        height: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    .admin-nav-item {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        padding: 10px 14px !important;
        border-radius: 0 !important;
        font-size: 12px !important;
        gap: 6px !important;
        justify-content: center !important;
    }
    .admin-nav-item.active {
        border-bottom: 2px solid var(--accent) !important;
        background: transparent !important;
    }
    .admin-nav-item svg {
        width: 16px !important;
        height: 16px !important;
    }
    .admin-nav-label {
        display: inline !important;
    }

    /* Content full width */
    .admin-content {
        padding: 16px 12px !important;
        width: 100% !important;
    }

    /* KPI grid: 2 columns on phone */
    .admin-kpi-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .admin-kpi-card {
        padding: 14px !important;
    }

    /* Charts: single column */
    .admin-chart-row {
        grid-template-columns: 1fr !important;
    }

    /* Module grids */
    .admin-module-grid,
    .admin-modules-overview-grid {
        grid-template-columns: 1fr !important;
    }

    /* Heatmap: horizontal scroll */
    .admin-heatmap {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        min-width: 0 !important;
    }

    /* Tables: force horizontal scroll with hint */
    .admin-table-wrap {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        margin: 0 -12px !important;
        padding: 0 12px !important;
    }
    .admin-table {
        min-width: 500px !important; /* Force scroll rather than squish */
    }
    .admin-table th,
    .admin-table td {
        padding: 8px 10px !important;
        font-size: 12px !important;
    }

    /* Toolbar stacks */
    .admin-toolbar {
        flex-direction: column !important;
        gap: 8px !important;
        align-items: stretch !important;
    }
    .admin-toolbar .admin-search {
        min-width: 0 !important;
        width: 100% !important;
    }
    .admin-toolbar select {
        width: 100% !important;
    }

    /* Batch bar stacks */
    .admin-batch-bar {
        flex-direction: column !important;
        gap: 6px !important;
    }

    /* Pagination compact */
    .admin-pagination {
        flex-wrap: wrap !important;
    }

    /* Modal fullscreen on mobile */
    .admin-modal {
        max-width: 100% !important;
        width: calc(100% - 24px) !important;
        max-height: 80vh !important;
    }

    /* Coverage bar narrower */
    .admin-kb-coverage-bar {
        width: 80px !important;
    }

    /* KB tabs scroll */
    .admin-kb-tabs {
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
    }
    .admin-kb-tabs button {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
    }

    /* ================================================================
       23. SENTINEL-CERT — Full mobile redesign
       ================================================================ */

    .cert-header {
        padding: 0 12px !important;
        height: 48px !important;
        min-height: 48px !important;
    }
    .cert-header h1 { font-size: 14px !important; }
    .cert-search-wrapper {
        min-width: 0 !important;
        max-width: none !important;
        flex: 1 !important;
    }

    /* Sidebar → horizontal tabs */
    .cert-layout {
        flex-direction: column !important;
    }
    .cert-sidebar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 0 !important;
        gap: 0 !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        height: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    .cert-nav-item,
    .cert-sidebar-item,
    .cert-sidebar > a,
    .cert-sidebar > button {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        padding: 10px 14px !important;
        border-radius: 0 !important;
        font-size: 12px !important;
        gap: 6px !important;
        justify-content: center !important;
    }
    .cert-nav-item.active,
    .cert-sidebar-item.active,
    .cert-sidebar > a.active,
    .cert-sidebar > button.active {
        border-bottom: 2px solid var(--accent) !important;
        background: transparent !important;
    }
    .cert-sidebar-spacer,
    .cert-sidebar-help { display: none !important; }
    .cert-nav-label,
    .cert-sidebar-label {
        display: inline !important;
        font-size: 12px !important;
    }
    .cert-body { width: 100% !important; }
    .cert-main {
        padding: 16px 12px !important;
        max-width: 100% !important;
    }

    /* Hide framework scores from sidebar tabs — moved to a toggle button */
    .cert-sidebar-frameworks {
        display: none !important;
    }
    /* Show the mobile framework toggle button (inserted by mobile.js) */
    .cert-mobile-fw-btn {
        display: flex !important;
        align-items: center;
        gap: 6px;
        white-space: nowrap;
        flex-shrink: 0;
        padding: 10px 14px;
        border: none;
        border-radius: 0;
        background: none;
        font: 500 12px/1 var(--sans);
        color: var(--accent);
        cursor: pointer;
    }
    /* Framework bottom sheet */
    .cert-fw-sheet {
        position: fixed;
        bottom: var(--mobile-bottom-bar-h);
        left: 0;
        right: 0;
        z-index: 1200;
        background: var(--surface);
        border-top: 1px solid var(--border);
        border-radius: 16px 16px 0 0;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
        padding: 16px;
        padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
        animation: certFwSheetUp 200ms ease;
    }
    .cert-fw-sheet-handle {
        width: 36px;
        height: 4px;
        border-radius: 2px;
        background: var(--border);
        margin: 0 auto 14px;
    }
    .cert-fw-sheet-title {
        font: 600 14px/1.3 var(--sans);
        color: var(--text);
        margin: 0 0 12px;
    }
    .cert-fw-sheet-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 14px;
        border: 1px solid var(--border);
        border-radius: 8px;
        margin-bottom: 6px;
        cursor: pointer;
        background: var(--bg);
        transition: border-color 150ms;
    }
    .cert-fw-sheet-item:active {
        border-color: var(--accent);
    }
    .cert-fw-sheet-item.active {
        border-color: var(--accent);
        background: var(--accent-glow, rgba(99,102,241,0.06));
    }
    .cert-fw-sheet-item-name {
        font: 500 13px/1 var(--sans);
        color: var(--text);
    }
    .cert-fw-sheet-item-score {
        font: 700 14px/1 var(--sans);
    }
    @keyframes certFwSheetUp {
        from { transform: translateY(100%); }
        to { transform: translateY(0); }
    }
    @keyframes mobileSheetUp {
        from { transform: translateY(100%); }
        to { transform: translateY(0); }
    }
    .cert-fw-cards {
        grid-template-columns: 1fr !important;
    }
    .cert-kanban {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .cert-eval-item {
        flex-direction: column !important;
        gap: 8px !important;
    }
    .cert-eval-actions { flex-wrap: wrap !important; }
    .cert-eval-status-btn {
        flex: 1 !important;
        text-align: center !important;
    }
    .cert-score-grid,
    .cert-heatmap-grid {
        grid-template-columns: 1fr !important;
    }
    .cert-tabs {
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
    }
    .cert-tabs button,
    .cert-tabs a {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        font-size: 12px !important;
    }
    .cert-action-table-wrap,
    .cert-table-wrap {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    .cert-action-table,
    .cert-table {
        min-width: 500px !important;
    }

    /* ================================================================
       24. PRAEDICT — Full mobile redesign
       ================================================================ */

    .pr-header {
        padding: 0 12px !important;
        height: 48px !important;
        min-height: 48px !important;
    }
    .pr-header h1 { font-size: 14px !important; }
    .pr-search-wrapper {
        min-width: 0 !important;
        max-width: none !important;
        flex: 1 !important;
    }
    .pr-layout { flex-direction: column !important; }
    .pr-sidebar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 0 !important;
        gap: 0 !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        height: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    .pr-sidebar-item,
    .pr-sidebar > a,
    .pr-sidebar > button {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        padding: 10px 14px !important;
        border-radius: 0 !important;
        font-size: 12px !important;
        gap: 6px !important;
    }
    .pr-sidebar-item.active,
    .pr-sidebar > a.active,
    .pr-sidebar > button.active {
        border-bottom: 2px solid var(--accent) !important;
        background: transparent !important;
    }
    .pr-sidebar-spacer,
    .pr-sidebar-help { display: none !important; }
    .pr-sidebar-label {
        display: inline !important;
        font-size: 12px !important;
    }
    .pr-body { width: 100% !important; }
    .pr-main {
        padding: 16px 12px !important;
        max-width: 100% !important;
    }
    .pr-naf-search {
        max-width: 100% !important;
    }
    .pr-naf-search input { min-width: 0 !important; }
    .pr-profile-header {
        flex-direction: column !important;
        text-align: center !important;
        gap: 12px !important;
    }
    .pr-risk-cards {
        grid-template-columns: 1fr !important;
    }
    .pr-risk-matrix {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        max-width: 100% !important;
    }
    .pr-duerp-table {
        display: block !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    .pr-tabs {
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
    }
    .pr-tabs button,
    .pr-tabs a {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        font-size: 12px !important;
    }
    .pr-stats-grid,
    .pr-kpi-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .pr-compare-grid {
        grid-template-columns: 1fr !important;
    }

    /* ================================================================
       25. WIKI — Full mobile redesign
       ================================================================ */

    .wiki-header {
        padding: 0 12px !important;
        height: 48px !important;
        min-height: 48px !important;
    }
    .wiki-header h1 { font-size: 14px !important; }
    .wiki-search-wrapper {
        min-width: 0 !important;
        max-width: none !important;
        flex: 1 !important;
    }
    .wiki-layout { flex-direction: column !important; }
    .wiki-sidebar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 0 !important;
        gap: 0 !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        height: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    /* The items are inside .wiki-sidebar-list — flatten it */
    .wiki-sidebar-list {
        display: flex !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        gap: 0 !important;
        width: 100% !important;
    }
    .wiki-sidebar-item,
    .wiki-sidebar > a,
    .wiki-sidebar > button {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        padding: 10px 14px !important;
        border-radius: 0 !important;
        font-size: 12px !important;
        gap: 6px !important;
    }
    .wiki-sidebar-item.active,
    .wiki-sidebar > a.active,
    .wiki-sidebar > button.active {
        border-bottom: 2px solid var(--accent) !important;
        background: transparent !important;
    }
    .wiki-sidebar-spacer,
    .wiki-sidebar-help,
    .wiki-sidebar-count { display: none !important; }
    .wiki-sidebar-label {
        display: inline !important;
        font-size: 12px !important;
    }
    .wiki-main {
        padding: 16px 12px !important;
        max-width: 100% !important;
    }
    #wiki-categories {
        grid-template-columns: 1fr !important;
    }
    .wiki-doc-card {
        flex-direction: column !important;
        gap: 8px !important;
    }
    .wiki-doc-card-actions { flex-wrap: wrap !important; }
    .wiki-toc { display: none !important; }
    .wiki-viewer-tabs {
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
    }
    .wiki-viewer-tabs button {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
    }
    .wiki-pdf-frame,
    .wiki-viewer-pdf {
        height: 60vh !important;
    }

    /* ================================================================
       26. SCRIBE — Extra mobile fixes
       ================================================================ */

    .scribe-modal-dialog {
        width: calc(100% - 24px) !important;
        max-width: 100% !important;
    }
    .scribe-live-notes-textarea {
        min-height: 60px !important;
        max-height: 100px !important;
    }
    .scribe-quick-markers {
        flex-wrap: wrap !important;
        gap: 4px !important;
    }
    .scribe-marker-btn {
        font-size: 11px !important;
        padding: 6px 10px !important;
    }
    .scribe-report-editor,
    .scribe-report-viewer {
        padding: 12px !important;
    }
    .scribe-speakers-panel { padding: 10px !important; }
    .scribe-speaker-row { flex-wrap: wrap !important; }
    .scribe-transcript-search {
        flex-direction: column !important;
        gap: 6px !important;
    }
    .scribe-share-modal-content {
        width: calc(100% - 24px) !important;
        max-width: 100% !important;
    }

    /* ================================================================
       27. Hide username/module label under chat input
       ================================================================ */

    .main-footer {
        display: none !important;
    }

    /* ================================================================
       29. SENTINEL — Limit to 5 tabs + "Plus" button
       ================================================================ */

    /* Hide tabs after the 5th */
    .sentinel-sidebar > :nth-child(n+6):not(.sentinel-sidebar-spacer):not(.sentinel-sidebar-help) {
        display: none !important;
    }
    /* The "more" button is inserted by mobile.js */
    .sentinel-mobile-more-btn {
        display: flex !important;
        align-items: center;
        gap: 6px;
        white-space: nowrap;
        flex-shrink: 0;
        padding: 10px 14px;
        border: none;
        border-radius: 0;
        background: none;
        font: 500 12px/1 var(--sans);
        color: var(--accent);
        cursor: pointer;
    }

    /* Sentinel article cards: compact on mobile */
    .sentinel-article-card {
        flex-direction: column !important;
        gap: 8px !important;
    }
    .sentinel-article-tags {
        flex-wrap: wrap !important;
    }
    .sentinel-filters-row {
        flex-direction: column !important;
        gap: 6px !important;
    }
    .sentinel-direction-charts {
        grid-template-columns: 1fr !important;
    }
    /* Risk matrix → list on mobile */
    .sentinel-risk-matrix-grid {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    /* ================================================================
       30. ADMIN — 3 tabs + "Modules" bottom sheet button
       ================================================================ */

    /* Hide admin nav items after the 3rd (Dashboard, Orgs, Users visible) */
    .admin-nav > :nth-child(n+4) {
        display: none !important;
    }
    /* Show the modules button inserted by JS */
    .admin-mobile-modules-btn {
        display: flex !important;
        align-items: center;
        gap: 6px;
        white-space: nowrap;
        flex-shrink: 0;
        padding: 10px 14px;
        border: none;
        border-radius: 0;
        background: none;
        font: 500 12px/1 var(--sans);
        color: var(--accent);
        cursor: pointer;
    }
    /* Admin table scroll indicator */
    .admin-table-wrap {
        position: relative !important;
    }
    .admin-table-wrap::after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: 24px;
        background: linear-gradient(to right, transparent, var(--bg));
        pointer-events: none;
        opacity: 0.8;
    }
    /* Admin modal fullscreen */
    .admin-modal-overlay .admin-modal {
        width: 100% !important;
        max-width: 100% !important;
        height: 100% !important;
        max-height: 100% !important;
        border-radius: 0 !important;
    }

    /* ================================================================
       31. COCKPIT — Conversations as cards, notifications bottom sheet
       ================================================================ */

    .ck-header {
        padding: 0 12px !important;
        height: 48px !important;
        min-height: 48px !important;
    }
    /* Product selector as bottom sheet trigger */
    .ck-product-selector {
        max-width: 120px !important;
        font-size: 12px !important;
    }
    /* Notification panel → bottom sheet */
    .ck-notif-panel {
        position: fixed !important;
        top: auto !important;
        bottom: var(--mobile-bottom-bar-h) !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-height: 60vh !important;
        border-radius: 16px 16px 0 0 !important;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.15) !important;
        z-index: 1200 !important;
    }
    /* Conversations list → cards */
    .ck-conversation-table {
        display: block !important;
    }
    .ck-conversation-table thead {
        display: none !important;
    }
    .ck-conversation-table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
    }
    .ck-conversation-table tr {
        display: flex !important;
        flex-direction: column !important;
        padding: 12px !important;
        background: var(--surface) !important;
        border: 1px solid var(--border) !important;
        border-radius: 8px !important;
        gap: 4px !important;
    }
    .ck-conversation-table td {
        display: block !important;
        padding: 2px 0 !important;
        border: none !important;
        font-size: 12px !important;
    }
    .ck-conversation-table td:first-child {
        font-weight: 600 !important;
        font-size: 13px !important;
    }
    /* KPI and charts */
    .ck-kpi-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    .ck-charts-row {
        grid-template-columns: 1fr !important;
    }
    /* Benchmark stacked */
    .ck-benchmark-grid {
        grid-template-columns: 1fr !important;
    }
    .ck-insights-list {
        gap: 8px !important;
    }

    /* ================================================================
       32. MINERVA — Cards as list, quiz stacked
       ================================================================ */

    .mv-header, .mn-header {
        padding: 0 12px !important;
        height: 48px !important;
        min-height: 48px !important;
    }
    /* Gamification bar compact */
    .mn-gamification {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        padding: 10px 12px !important;
    }
    .mn-xp-bar {
        width: 100% !important;
        order: 2 !important;
    }
    .mn-streak {
        font-size: 12px !important;
    }
    .mn-level {
        font-size: 12px !important;
    }
    /* Module cards → compact list */
    .mn-module-card, .mv-module-card {
        flex-direction: row !important;
        align-items: center !important;
        gap: 12px !important;
        padding: 12px !important;
    }
    .mn-module-card-icon, .mv-module-card-icon {
        width: 40px !important;
        height: 40px !important;
        flex-shrink: 0 !important;
    }
    .mn-module-card-desc, .mv-module-card-desc {
        display: none !important; /* Hide description, show only title + progress */
    }
    .mn-module-card-body, .mv-module-card-body {
        flex: 1 !important;
        min-width: 0 !important;
    }
    .mn-modules-grid, .mv-modules-grid {
        grid-template-columns: 1fr !important;
    }
    /* Quiz: options stacked */
    .mn-quiz-options, .mv-quiz-options {
        grid-template-columns: 1fr !important;
    }
    .mn-quiz-option, .mv-quiz-option {
        padding: 14px !important;
    }
    /* Leaderboard → cards */
    .mn-leaderboard-table thead,
    .mv-leaderboard-table thead {
        display: none !important;
    }
    .mn-leaderboard-table tbody,
    .mv-leaderboard-table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 6px !important;
    }
    .mn-leaderboard-table tr,
    .mv-leaderboard-table tr {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 10px 12px !important;
        background: var(--surface) !important;
        border: 1px solid var(--border) !important;
        border-radius: 8px !important;
    }
    .mn-leaderboard-table td,
    .mv-leaderboard-table td {
        border: none !important;
        padding: 0 !important;
    }
    /* Badges grid compact */
    .mn-badges-grid, .mv-badges-grid {
        grid-template-columns: repeat(3, 1fr) !important;
    }
    /* Adoption charts stacked */
    .mn-adoption-charts, .mv-adoption-charts {
        grid-template-columns: 1fr !important;
    }

    /* ================================================================
       33. ECRITURE — FAB settings + split → tabs
       ================================================================ */

    .ec-header {
        padding: 0 12px !important;
        height: 48px !important;
        min-height: 48px !important;
    }
    /* Hide settings sidebar, replace with FAB */
    .ec-settings {
        display: none !important;
    }
    .ec-layout {
        flex-direction: column !important;
    }
    .ec-body {
        width: 100% !important;
    }
    /* Split panes → stacked with tabs */
    .ec-panes {
        flex-direction: column !important;
    }
    .ec-pane {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 200px !important;
    }
    .ec-pane-divider {
        display: none !important;
    }
    /* FAB for settings (inserted by JS) */
    .ec-mobile-fab {
        display: flex !important;
        position: fixed;
        bottom: calc(var(--mobile-bottom-bar-h) + 16px);
        right: 16px;
        width: 48px;
        height: 48px;
        border-radius: 50%;
        background: var(--accent);
        color: #fff;
        border: none;
        align-items: center;
        justify-content: center;
        box-shadow: 0 4px 12px rgba(0,0,0,0.2);
        z-index: 1050;
        cursor: pointer;
    }
    .ec-mobile-fab:active {
        transform: scale(0.9);
    }
    /* Ecriture settings bottom sheet */
    .ec-settings-sheet {
        position: fixed;
        bottom: var(--mobile-bottom-bar-h);
        left: 0;
        right: 0;
        z-index: 1200;
        background: var(--surface);
        border-top: 1px solid var(--border);
        border-radius: 16px 16px 0 0;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
        padding: 16px 16px calc(env(safe-area-inset-bottom,0px) + 12px);
        animation: mobileSheetUp 200ms ease;
    }

    /* ================================================================
       34. STUDIO — Sidebar merged to 1 tab bar, explicit upload button
       ================================================================ */

    .st-header {
        padding: 0 12px !important;
        height: 48px !important;
        min-height: 48px !important;
    }
    .st-layout {
        flex-direction: column !important;
    }
    /* Merge sidebar modes + nav into horizontal tabs */
    .st-sidebar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        flex-direction: row !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 0 !important;
        gap: 0 !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
        height: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    .st-sidebar-modes,
    .st-sidebar-nav {
        display: contents !important; /* Flatten children into parent flex */
    }
    .st-sidebar-divider {
        display: none !important;
    }
    .st-sidebar-modes button,
    .st-sidebar-nav button,
    .st-sidebar > button {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        padding: 10px 14px !important;
        border-radius: 0 !important;
        font-size: 12px !important;
    }
    .st-body {
        width: 100% !important;
    }
    .st-main {
        padding: 16px 12px !important;
    }
    /* Prompt area full width */
    .st-prompt-zone textarea {
        width: 100% !important;
    }
    /* Image drop zone with explicit button */
    .st-image-drop {
        min-height: 80px !important;
    }
    /* Gallery 2 columns */
    .st-gallery-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    /* Lightbox fullscreen */
    .st-lightbox {
        padding: 0 !important;
    }
    .st-lightbox img {
        max-width: 100% !important;
        max-height: 80vh !important;
    }
    .st-lightbox-nav {
        display: none !important; /* Use swipe instead on mobile */
    }
    /* History dropdown → bottom sheet */
    .st-prompt-history-dropdown {
        position: fixed !important;
        bottom: var(--mobile-bottom-bar-h) !important;
        left: 0 !important;
        right: 0 !important;
        top: auto !important;
        max-height: 50vh !important;
        border-radius: 16px 16px 0 0 !important;
        z-index: 1200 !important;
    }

    /* ================================================================
       35. WIKI — Sticky back header in viewer
       ================================================================ */

    .wiki-viewer {
        position: relative !important;
    }
    .wiki-viewer-header {
        position: sticky !important;
        top: 0 !important;
        z-index: 10 !important;
        background: var(--bg) !important;
        padding: 10px 12px !important;
        border-bottom: 1px solid var(--border) !important;
    }
    .wiki-viewer-title {
        font-size: 14px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
    /* Semantic/keyword toggle → icon in search */
    .wiki-search-mode-toggle {
        gap: 4px !important;
    }
    .wiki-search-mode-toggle button {
        padding: 4px 8px !important;
        font-size: 11px !important;
    }

    /* ================================================================
       36. SCRIBE — Condensed live controls
       ================================================================ */

    /* Condense the live control bar into a single compact row */
    .scribe-live-controls {
        flex-wrap: wrap !important;
        gap: 6px !important;
        padding: 8px 12px !important;
    }
    .scribe-live-vu {
        display: none !important; /* Hide individual bars on mobile, VU bar remains */
    }
    .scribe-live-elapsed {
        font-size: 12px !important;
        gap: 6px !important;
    }
    .scribe-live-actions {
        flex-direction: column !important;
        gap: 8px !important;
    }
    /* Export buttons → single "Export" with bottom sheet (handled in scribe.js already via scribe-export-group flex-wrap) */
    .scribe-export-group {
        gap: 6px !important;
    }
    .scribe-export-group a {
        font-size: 11px !important;
        padding: 6px 10px !important;
    }

    /* ================================================================
       37. PRAEDICT — DUERP table → cards
       ================================================================ */

    /* Override DUERP table to card layout */
    .pr-duerp-table table {
        display: block !important;
    }
    .pr-duerp-table thead {
        display: none !important;
    }
    .pr-duerp-table tbody {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
    }
    .pr-duerp-table tr {
        display: flex !important;
        flex-direction: column !important;
        padding: 12px !important;
        background: var(--surface) !important;
        border: 1px solid var(--border) !important;
        border-radius: 8px !important;
        gap: 4px !important;
    }
    .pr-duerp-table td {
        display: block !important;
        padding: 2px 0 !important;
        border: none !important;
        font-size: 12px !important;
    }
    .pr-duerp-table td:first-child {
        font-weight: 600 !important;
        font-size: 13px !important;
    }
    /* Criticite badge inline */
    .pr-duerp-criticite {
        display: inline-block !important;
    }

    /* ================================================================
       38. CHAT — Compact welcome, tables/charts overflow
       ================================================================ */

    /* Charts in messages: scrollable */
    .message canvas,
    .message .chart-inline-wrapper {
        max-width: 100% !important;
        overflow-x: auto !important;
    }
    /* Tables in messages: horizontal scroll */
    .message table {
        display: block !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        max-width: 100% !important;
    }
    /* Welcome screen compact */
    .chat-welcome-prompts {
        grid-template-columns: 1fr !important;
    }
    /* Chat action buttons: only show key ones */
    .chat-input-actions {
        gap: 4px !important;
    }
    .chat-input-actions button {
        padding: 6px !important;
    }

}

/* ================================================================
   SMALL PHONES (< 380px)
   ================================================================ */
@media (max-width: 379px) {
    .mobile-tab span { display: none; } /* Icons only */
    .scribe-mode-opt { font-size: 11px !important; }
    .scribe-hero-title { font-size: 18px !important; }
}

/* ================================================================
   LANDSCAPE PHONE
   ================================================================ */
@media (max-width: 767px) and (orientation: landscape) {
    .mobile-bottom-bar {
        height: 44px;
    }
    .mobile-tab svg { width: 18px; height: 18px; }
    .mobile-tab span { font-size: 9px; }
    body {
        padding-bottom: calc(44px + env(safe-area-inset-bottom, 0px)) !important;
    }
    .scribe-live-container.jitsi-mode {
        height: calc(100vh - 44px - 44px) !important;
    }
}

/* ================================================================
   DESKTOP — Ensure bottom bar & mobile elements are hidden
   ================================================================ */
@media (min-width: 768px) {
    .mobile-bottom-bar,
    .scribe-mobile-view-toggle,
    .cert-mobile-fw-btn,
    .cert-fw-sheet,
    .sentinel-mobile-more-btn,
    .admin-mobile-modules-btn,
    .mobile-generic-sheet,
    .ec-mobile-fab,
    .ec-settings-sheet { display: none !important; }
}