@media (max-width: 820px) {
            body {
                height: 100dvh;
                overflow: hidden;
            }

            .mobile-nav-backdrop {
                display: block;
                position: fixed;
                inset: 0;
                background: rgba(0, 0, 0, 0.58);
                opacity: 0;
                pointer-events: none;
                transition: opacity 0.2s ease;
                z-index: 70;
            }

            body.mobile-nav-open .mobile-nav-backdrop {
                opacity: 1;
                pointer-events: auto;
            }

            .sidebar {
                position: fixed;
                inset: 0 auto 0 0;
                width: min(74vw, 286px);
                z-index: 80;
                transform: translateX(-104%);
                transition: transform 0.2s ease;
                box-shadow: 0 20px 60px rgba(0, 0, 0, 0.55);
            }

            body.mobile-nav-open .sidebar {
                transform: translateX(0);
            }

            .sidebar.collapsed {
                width: min(74vw, 286px);
                padding: 14px 10px;
            }

            .sidebar.collapsed .brand {
                justify-content: flex-start;
                gap: 12px;
                padding: 0 10px 20px;
            }

            .sidebar.collapsed .brand-name,
            .sidebar.collapsed .sidebar-section,
            .sidebar.collapsed #new-chat-btn,
            .sidebar.collapsed #chat-history-list,
            .sidebar.collapsed .user-row {
                display: initial !important;
            }

            .sidebar.collapsed #new-chat-btn,
            .sidebar.collapsed #chat-history-list,
            .sidebar.collapsed .user-row {
                display: flex !important;
            }

            .sidebar.collapsed .nav-item {
                justify-content: flex-start;
                gap: 10px;
                padding: 7px 11px;
                font-size: 14px;
                border-radius: 14px;
            }

            .sidebar.collapsed .nav-item svg {
                width: 18px;
                height: 18px;
            }

            .sidebar.collapsed .sidebar-toggle-btn {
                margin-left: auto;
                margin-top: 0;
            }

            .mobile-webui .nav-item--ide,
            .mobile-webui .nav-item[data-target="ide"],
            .mobile-webui .set-nav .sn[data-ide-only="true"],
            .mobile-webui #set-ide,
            .nav-item--ide,
            .nav-item[data-target="ide"] {
                display: none !important;
            }

            .topbar {
                height: 56px;
                padding: 0 10px;
            }

            .mobile-topbar-nav-btn {
                display: inline-flex;
                width: 42px;
                height: 42px;
                align-items: center;
                justify-content: center;
                border-radius: 14px;
                border: 1px solid rgba(255, 255, 255, 0.08);
                background: rgba(18, 20, 26, 0.94);
                box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
            }

            .topbar-leading {
                flex: 1;
                min-width: 0;
            }

            .topbar-title {
                font-size: 14px;
                gap: 6px;
                min-width: 0;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            .topbar-actions {
                flex: 0 0 auto;
                display: inline-flex;
                align-items: center;
                justify-content: flex-end;
                gap: 6px;
                min-width: 0;
                margin-left: auto;
            }

            .topbar-actions .obs-report-issue-btn {
                display: none !important;
            }

            .obs-view .topbar .obs-model-picker {
                display: none;
            }

            .obs-view .topbar .obs-model-picker.mobile-picker-open {
                display: block;
                width: 0;
                height: 0;
                overflow: visible;
            }

            #obs-image .topbar .obs-model-picker--route {
                display: block;
                width: 0;
                height: 0;
                overflow: visible;
            }

            .obs-view .topbar .obs-model-picker.mobile-picker-open>.obs-model-trigger {
                display: none;
            }

            #obs-image .topbar .obs-model-picker--route>.obs-model-trigger {
                display: none;
            }

            .topbar .credits-chip {
                flex: 0 0 auto;
                max-width: min(48vw, 160px);
                min-height: 36px;
                display: inline-flex !important;
                align-items: center;
                justify-content: center;
                padding: 0 11px;
                gap: 0;
                border-radius: 999px;
                font-size: 11px;
            }

            .topbar .credits-chip-main {
                gap: 6px;
                min-width: 0;
            }

            .topbar .credits-chip-label {
                font-size: 9px;
            }

            .topbar .credits-chip-value {
                font-size: 12px;
                min-width: 0;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            .topbar .credits-chip-plan {
                display: none !important;
            }

            #obs-settings.obs-view.active {
                overflow-y: auto;
                -webkit-overflow-scrolling: touch;
            }

            .set-split {
                display: block;
                overflow: visible;
                min-height: auto;
            }

            .set-nav {
                width: auto;
                border-right: none;
                border-bottom: 1px solid var(--border);
                padding: 10px 12px;
                display: flex;
                gap: 8px;
                overflow-x: auto;
                overflow-y: hidden;
                background: rgba(18, 18, 18, 0.98);
                position: sticky;
                top: 0;
                z-index: 12;
            }

            .sn {
                flex: 0 0 auto;
                padding: 9px 12px;
                border: 1px solid var(--border);
                border-left: 1px solid var(--border);
                border-radius: 999px;
                white-space: nowrap;
                background: var(--bg-1);
            }

            .sn.active {
                border-left-color: var(--accent-mid);
                border-color: var(--accent-mid);
            }

            .set-body {
                max-width: none;
                padding: 16px 12px 120px;
                overflow: visible;
            }

            .set-body > .set-panel > .sg {
                content-visibility: auto;
                contain-intrinsic-size: 280px;
            }

            .account-summary-grid,
            .plan-grid,
            .account-billing-hero {
                grid-template-columns: 1fr;
            }

            .account-billing-main,
            .account-billing-side,
            .account-card,
            .plan-card,
            .history-item {
                padding: 14px;
            }

            .account-billing-balance {
                font-size: 32px;
            }

            .account-billing-tier {
                font-size: 21px;
            }

            .account-billing-actions {
                display: grid;
                grid-template-columns: 1fr;
            }

            .account-billing-actions .action-btn {
                width: 100%;
            }

            #obs-settings .subscription-plan-card--mobile-placeholder {
                min-height: 0;
                padding: 16px;
                border-radius: 18px;
                background: linear-gradient(180deg, rgba(24, 26, 34, 0.94), rgba(16, 18, 24, 0.98));
                border: 1px solid rgba(255, 255, 255, 0.08);
                box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
            }

            #obs-settings .subscription-plan-card--mobile-placeholder .subscription-plan-name {
                font-size: 0.98rem;
                margin-bottom: 8px;
            }

            #obs-settings .subscription-plan-card--mobile-placeholder .subscription-plan-copy {
                margin: 0;
                font-size: 0.9rem;
                line-height: 1.5;
                color: rgba(235, 238, 245, 0.74);
            }

            .content-area {
                padding: 16px 0 calc(var(--chat-composer-offset, 148px) + env(safe-area-inset-bottom) + 14px);
                scroll-padding-bottom: calc(var(--chat-composer-offset, 148px) + env(safe-area-inset-bottom) + 26px);
            }

            .feed-container {
                max-width: none;
                padding: 0 12px;
                gap: 18px;
            }

            .message {
                gap: 10px;
            }

            .avatar {
                width: 28px;
                height: 28px;
                font-size: 12px;
            }

            .message.user-msg .msg-content {
                max-width: calc(100% - 42px);
                padding: 10px 14px;
            }

            .message.ai-msg .msg-content {
                font-size: 14px;
                /* Take all remaining space after the avatar — calc(100% - 40px)
                   was reserving too much and double-counting the flex gap.
                   flex:1 + min-width:0 = fill the row width-honestly. */
                flex: 1 1 0;
                min-width: 0;
                width: auto;
                max-width: none;
                padding: 4px 0 8px;
                border-radius: 0;
            }

            .assistant-response-extras {
                margin-top: 12px;
                gap: 12px;
            }

            .assistant-extras-section {
                gap: 6px;
            }

            .assistant-extras-heading {
                font-size: 10px;
                letter-spacing: 0.08em;
            }

            /* Mobile: stack source cards into one column for legibility. */
            .assistant-source-row {
                grid-template-columns: 1fr;
                gap: 5px;
            }

            .assistant-source-chip {
                width: 100%;
                min-height: 42px;
                padding: 9px 11px;
                border-radius: 10px;
                grid-template-columns: 22px 1fr auto;
                gap: 9px;
            }

            .assistant-source-chip-icon {
                width: 22px;
                height: 22px;
                font-size: 10.5px;
            }

            .assistant-source-chip-label {
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                font-size: 12.5px;
            }

            .assistant-source-chip-domain {
                font-size: 10px;
            }

            .assistant-followup-row {
                gap: 5px;
            }

            .assistant-followup-chip {
                width: auto;
                max-width: 100%;
                font-size: 11.5px;
                min-height: 28px;
                padding: 5px 11px 5px 9px;
                border-radius: 999px;
            }

            .message.ai-msg .model-attribution.chat-sender {
                margin-bottom: 8px;
                font-size: 10px;
            }

            .response-text {
                gap: 12px;
                line-height: 1.62;
            }

            .response-text :is(h1, h2, h3, h4) {
                line-height: 1.12;
            }

            .response-text h1 {
                font-size: 1.5rem;
            }

            .response-text h2 {
                font-size: 1.18rem;
            }

            .response-text p,
            .response-text li {
                font-size: 14px;
            }

            .response-text ul,
            .response-text ol {
                gap: 8px;
                padding-left: 1.1rem;
            }

            .response-text blockquote {
                padding: 12px 13px;
                border-radius: 0 14px 14px 0;
            }

            .response-text pre {
                margin: 12px 0;
                padding: 14px;
                border-radius: 16px;
                font-size: 12.5px;
            }

            .chat-theme-picker {
                grid-template-columns: minmax(0, 1fr);
                gap: 10px;
            }

            .chat-theme-card {
                padding: 11px;
                border-radius: 16px;
            }

            .chat-theme-card-preview {
                aspect-ratio: 2.1 / 1;
            }

            .chat-avatar-swatch-row {
                justify-content: flex-start;
            }

            .chat-avatar-swatch {
                width: 32px;
                height: 32px;
            }

            .response-text table {
                display: block;
                overflow-x: auto;
                -webkit-overflow-scrolling: touch;
            }

            .response-text th,
            .response-text td {
                min-width: 128px;
                padding: 9px 10px;
            }

            .msg-content :is(h1, h2, h3, h4) {
                line-height: 1.16;
            }

            .msg-content h1 {
                font-size: 1.45rem;
            }

            .msg-content h2 {
                font-size: 1.2rem;
            }

            .msg-content :is(ul, ol) {
                margin-left: 1rem;
                gap: 6px;
            }

            .msg-table-wrap {
                margin: 14px 0;
                border-radius: 14px;
            }

            .msg-content table {
                min-width: 360px;
            }

            .msg-content th,
            .msg-content td {
                padding: 9px 10px;
                font-size: 13px;
            }

            .input-container {
                padding: 0 10px calc(8px + env(safe-area-inset-bottom));
                position: sticky;
                bottom: 0;
                z-index: 20;
                background: linear-gradient(180deg, rgba(13, 13, 13, 0), rgba(13, 13, 13, 0.92) 24%, rgba(13, 13, 13, 0.98));
                isolation: isolate;
            }

            .input-wrapper {
                max-width: none;
            }

            .input-tools {
                display: none !important;
            }

            .mobile-composer-model-slot {
                display: block;
            }

            .mobile-model-button {
                display: flex;
            }

            .input-box--chat {
                display: grid;
                grid-template-columns: minmax(0, 1fr);
                gap: 10px;
                padding: 12px;
                border-radius: 18px;
                align-items: stretch;
                background:
                    linear-gradient(180deg, rgba(16, 18, 27, 0.985), rgba(10, 12, 18, 0.99)),
                    radial-gradient(circle at top right, var(--accent-soft-10), transparent 42%);
                box-shadow: 0 16px 34px rgba(0, 0, 0, 0.28);
            }

            .input-box--chat .chat-composer-rail {
                order: 1;
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 10px;
                min-width: 0;
                width: 100%;
            }

            .input-box--chat .mobile-composer-model-slot {
                order: 1;
                flex: 1 1 auto;
                min-width: 0;
                display: block !important;
                visibility: visible !important;
                opacity: 1 !important;
            }

            .input-box--chat .mobile-model-button {
                display: flex !important;
                visibility: visible !important;
                opacity: 1 !important;
                width: 100%;
                min-height: 40px;
            }

            .input-box--chat .action-btn.attach {
                display: none !important;
            }

            .input-box--chat .chat-composer-inline-actions {
                order: 2;
                display: inline-flex !important;
                align-items: center;
                justify-content: flex-start;
                flex-wrap: wrap;
                gap: 6px;
                flex: 1 1 100%;
                width: 100%;
                min-width: 0;
            }

            .input-box--chat .chat-tool-button {
                min-width: 40px;
                min-height: 40px;
                width: 40px;
                padding: 0;
                border-radius: 14px;
                flex: 0 0 auto;
            }

            /* ── Skills dropdown (mobile) ── */
            .input-box--chat .skills-dropdown-wrap {
                position: static;
            }

            .input-box--chat .skills-dropdown {
                position: fixed;
                left: 12px;
                right: 12px;
                bottom: calc(env(safe-area-inset-bottom, 0px) + 96px);
                width: auto;
                max-width: none;
                min-width: 0;
                max-height: 60vh;
                overflow-y: auto;
                padding: 8px;
                z-index: 300;
                box-shadow: 0 16px 48px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 255, 255, 0.06);
            }

            .input-box--chat .skills-dropdown-item {
                padding: 12px 14px;
                font-size: 14px;
                min-height: 44px;
                border-radius: 12px;
            }

            .input-box--chat .skills-dropdown-icon {
                font-size: 16px;
            }

            /* ── Active skill chip (mobile) ── */
            .input-box--chat .skill-chip {
                flex: 0 1 auto;
                min-width: 0;
                max-width: calc(100% - 56px);
                height: 32px;
                padding: 0 6px 0 10px;
                margin-left: 0;
                font-size: 12px;
            }

            .input-box--chat .skill-chip-label {
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                font-size: 12px;
            }

            .input-box--chat .skill-chip-close {
                width: 22px;
                height: 22px;
                font-size: 18px;
            }

            .input-box--chat .chat-tool-icon,
            .input-box--chat .chat-tool-icon svg {
                width: 18px;
                height: 18px;
            }

            .input-box--chat .chat-tool-label {
                display: none;
            }

            .input-box--chat .chat-compose-main {
                order: 2;
                width: 100%;
                display: grid;
                grid-template-columns: minmax(0, 1fr) auto;
                align-items: end;
                gap: 10px;
            }

            .input-box--chat textarea {
                min-width: 0;
                width: 100%;
                flex: unset;
                font-size: 14px;
                line-height: 1.45;
                min-height: 24px;
                padding: 2px 0;
            }

            .input-box--chat .send-btn {
                width: 42px;
                height: 42px;
                margin-left: 0;
                justify-self: end;
            }

            .obs-model-menu {
                position: fixed;
                left: 12px;
                right: 12px;
                top: auto;
                bottom: calc(86px + env(safe-area-inset-bottom));
                width: auto;
                max-height: min(58vh, 620px);
            }

            .obs-model-menu-grid {
                grid-template-columns: 1fr;
            }

            .img-split {
                display: block;
                flex: none;
                min-height: auto;
                position: relative;
                overflow: visible;
            }

            #obs-image.obs-view.active {
                overflow-y: auto;
                -webkit-overflow-scrolling: touch;
            }

            #obs-image .img-split {
                display: block !important;
                grid-template-columns: minmax(0, 1fr) !important;
                min-height: auto;
                overflow: visible;
            }

            #obs-image .obs-gallery {
                display: block !important;
                width: 100%;
                padding: 10px 10px calc(206px + env(safe-area-inset-bottom, 0px)) !important;
                height: auto;
                min-height: auto;
                overflow: visible;
                box-sizing: border-box;
            }

            .gallery-toolbar {
                position: sticky;
                top: 0;
                grid-template-columns: minmax(0, 1fr) auto;
                grid-template-areas:
                    'center actions'
                    'sort sort';
            }

            #obs-image .gallery-toolbar {
                position: sticky;
                top: 0;
                z-index: 8;
                width: calc(100% + 20px);
                margin: -10px -10px 10px;
                padding: 10px 12px 10px;
                border-radius: 0 0 18px 18px;
                background: linear-gradient(180deg, rgba(13, 13, 13, 0.96), rgba(13, 13, 13, 0.82));
                border: 1px solid rgba(255, 255, 255, 0.08);
                border-top: none;
                border-left: none;
                border-right: none;
                box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24);
                grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
                grid-template-areas:
                    'actions center .'
                    'sort sort sort';
                gap: 8px 10px;
                justify-items: stretch;
                align-items: center;
            }

            #obs-image .gallery-toolbar-center {
                grid-area: center;
                min-width: 0;
                display: grid;
                align-items: flex-start;
                justify-self: center;
                justify-items: center;
                text-align: center;
                gap: 2px;
            }

            #obs-image .gallery-toolbar-copy {
                display: none;
            }

            #obs-image .gallery-toolbar-title {
                font-size: 16px;
                line-height: 1.1;
            }

            #obs-image .gallery-toolbar-actions {
                grid-area: actions;
                justify-self: start;
                justify-content: flex-start;
                gap: 6px;
                align-items: center;
            }

            #obs-image .gallery-toolbar-sort {
                grid-area: sort;
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                justify-self: stretch;
                gap: 6px;
                align-items: center;
            }

            #obs-image .gallery-sort-label {
                display: none;
            }

            .gallery-toolbar-btn,
            .gallery-sort-select {
                min-height: 42px;
            }

            #obs-image .gallery-toolbar-btn,
            #obs-image .gallery-sort-select {
                min-width: 0;
                min-height: 40px;
                height: 40px;
                border-radius: 14px;
                font-size: 12px;
                padding: 0 12px;
            }

            #obs-image .gallery-toolbar-btn {
                font-weight: 700;
                width: auto;
                min-width: 88px;
            }

            #obs-image .gallery-sort-select {
                width: 100%;
                max-width: none;
                padding-right: 34px;
            }

            .gallery-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 8px;
            }

            #obs-gallery-list.gallery-grid {
                display: grid !important;
                grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
                gap: 8px !important;
                width: 100%;
                overflow: visible !important;
                padding-right: 0 !important;
                padding-bottom: 0 !important;
                margin-right: 0 !important;
            }

            #obs-gallery-list.gallery-grid > .g-card {
                width: auto !important;
                min-width: 0 !important;
                flex: none !important;
                margin: 0 !important;
                aspect-ratio: 1 / 1;
            }

            .g-card {
                border-radius: 15px;
                overflow: hidden;
                isolation: isolate;
                contain: layout paint style;
                content-visibility: auto;
                contain-intrinsic-size: 168px 168px;
                margin: 0 !important;
            }

            #obs-community .community-post-card,
            #obs-settings .account-card,
            #obs-settings .plan-card,
            #obs-feedback .sg {
                content-visibility: auto;
                contain-intrinsic-size: 280px;
            }

            #obs-image #obs-gallery-list.gallery-grid .g-media-container {
                width: 100%;
                height: 100%;
                min-height: 0;
                aspect-ratio: auto;
            }

            #obs-image #obs-gallery-list.gallery-grid .g-media-container img,
            #obs-image #obs-gallery-list.gallery-grid .g-media-container video,
            #obs-image #obs-gallery-list.gallery-grid .g-loading-thumb {
                width: 100%;
                height: 100%;
                aspect-ratio: auto;
                flex: 1 1 auto;
                inset: 0;
                object-fit: cover;
            }

            .gallery-empty-main {
                min-height: calc(100dvh - 180px);
                padding: 28px 12px calc(228px + env(safe-area-inset-bottom));
            }

            .img-queue-panel {
                position: fixed;
                left: 10px;
                right: 10px;
                bottom: calc(82px + env(safe-area-inset-bottom));
                width: auto;
                border: none;
                background: transparent;
                backdrop-filter: none;
                z-index: 35;
                max-height: none;
                pointer-events: none;
            }

            .img-split.queue-collapsed .img-queue-panel {
                width: auto;
            }

            .img-split.queue-collapsed .img-prompt-bar {
                display: block !important;
            }

            .img-queue-header {
                display: none !important;
            }

            .img-queue-content,
            .img-queue-footer,
            .img-panel-toggle,
            .image-queue-clear-btn,
            .queue-header-label {
                display: none !important;
            }

            #obs-image .obs-gallery {
                overflow: visible;
            }

            #obs-image #obs-gallery-list.gallery-grid {
                padding-bottom: 0 !important;
            }

            #obs-image .gallery-empty-main {
                padding-bottom: calc(206px + env(safe-area-inset-bottom));
            }

            #obs-image .img-prompt-bar {
                display: block !important;
                position: fixed !important;
                left: 50% !important;
                right: auto !important;
                bottom: 0 !important;
                top: auto !important;
                transform: translateX(-50%);
                width: min(calc(100vw - 8px), 560px) !important;
                max-width: min(calc(100vw - 8px), 560px) !important;
                z-index: 86;
                pointer-events: auto;
                padding: 0 0 calc(env(safe-area-inset-bottom) + 2px);
                border-top: none;
                background: transparent;
                backdrop-filter: none;
                box-shadow: none;
                margin: 0;
                visibility: visible !important;
                opacity: 1 !important;
            }

            #obs-image .img-prompt-box {
                flex-wrap: wrap;
                gap: 8px;
                border-radius: 20px;
                padding: 9px 10px 10px;
                background: linear-gradient(180deg, rgba(20, 21, 28, 0.96), rgba(13, 14, 18, 0.98));
                border: 1px solid rgba(255, 255, 255, 0.08);
                box-shadow: 0 18px 42px rgba(0, 0, 0, 0.34);
                max-width: none;
            }

            #obs-image .img-reuse-strip {
                margin-bottom: 7px;
                padding: 7px 9px;
                gap: 8px;
                border-radius: 14px;
            }

            #obs-image .img-reuse-thumb {
                width: 30px;
                height: 30px;
                border-radius: 10px;
            }

            #obs-image .img-reuse-label {
                font-size: 8px;
            }

            #obs-image .img-reuse-name {
                font-size: 11px;
            }

            #obs-image .img-reuse-clear {
                width: 24px;
                height: 24px;
            }

            #obs-image .image-mobile-control-row {
                display: grid !important;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 6px;
                width: 100%;
                visibility: visible !important;
                opacity: 1 !important;
            }

            #obs-image .img-prompt-box .mobile-composer-model-slot {
                order: 1;
                flex: 1 1 auto;
                min-width: 0;
                display: block !important;
                visibility: visible !important;
                opacity: 1 !important;
            }

            #obs-image .img-prompt-box textarea {
                order: 2;
                width: 100%;
                font-size: 13.5px;
                min-height: 38px;
                max-height: 96px;
                padding: 4px 0;
            }

            #obs-image .img-compose-main {
                width: 100%;
                display: grid;
                grid-template-columns: minmax(0, 1fr) auto auto;
                grid-template-areas:
                    'prompt upload send'
                    'controls controls controls';
                align-items: end;
                gap: 6px;
            }

            #obs-image .img-compose-main textarea {
                grid-area: prompt;
            }

            #obs-image .img-upload-btn {
                grid-area: upload;
                width: 40px;
                min-width: 40px;
                height: 40px;
                padding: 0;
                border-radius: 14px;
            }

            #obs-image .img-compose-side-controls {
                grid-area: controls;
                width: 100%;
                display: flex;
                justify-content: space-between;
                align-items: center;
                gap: 8px;
            }

            #obs-image .img-send-btn {
                grid-area: send;
                align-self: end;
                width: 40px;
                min-width: 40px;
                height: 40px;
                padding: 0;
                border-radius: 14px;
            }

            #obs-image .mobile-model-button {
                display: flex !important;
                align-items: center;
                justify-content: space-between;
                gap: 8px;
                min-height: 40px;
                padding: 8px 10px;
                border-radius: 14px;
                visibility: visible !important;
                opacity: 1 !important;
                width: 100%;
            }

            #obs-image .mobile-model-button--route {
                background:
                    linear-gradient(180deg, rgba(26, 25, 36, 0.96), rgba(16, 16, 23, 0.98)),
                    radial-gradient(circle at top right, var(--accent-soft-12), transparent 36%);
                border-color: var(--accent-soft-18);
            }

            #obs-image .mobile-model-button--route.is-video {
                background:
                    linear-gradient(180deg, rgba(30, 22, 31, 0.96), rgba(16, 14, 20, 0.98)),
                    radial-gradient(circle at top right, var(--accent-soft-14), transparent 40%);
                border-color: var(--accent-soft-18);
            }

            #obs-image .mobile-model-copy {
                min-width: 0;
            }

            #obs-image .mobile-model-value {
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            .mobile-model-label {
                font-size: 8px;
            }

            .mobile-model-value {
                font-size: 11px;
            }

            .g-info {
                display: none;
            }

            .g-favorite-btn,
            .g-community-share-btn {
                width: 34px;
                height: 34px;
                top: 8px;
                border-width: 1px;
            }

            #obs-image .g-card-action-cluster {
                top: 8px;
                right: 8px;
                left: auto;
                gap: 5px;
                padding: 3px;
                max-width: calc(100% - 16px);
                overflow: hidden;
            }

            .g-media-type-badge {
                top: 8px;
                left: 8px;
                min-width: 52px;
                padding: 5px 9px;
                font-size: 9px;
                letter-spacing: 0.1em;
                border-radius: 999px;
            }

            #obs-chat-model-menu:not([hidden]),
            #obs-image-model-menu:not([hidden]),
            #obs-image-route-menu:not([hidden]),
            .obs-view .topbar .obs-model-menu:not([hidden]) {
                position: fixed;
                top: auto;
                right: 10px;
                bottom: calc(12px + env(safe-area-inset-bottom));
                left: 10px;
                width: auto !important;
                height: auto;
                min-height: 188px;
                max-height: min(72dvh, calc(100dvh - 118px - env(safe-area-inset-top) - env(safe-area-inset-bottom))) !important;
                overflow-y: auto;
                overscroll-behavior: contain;
                -webkit-overflow-scrolling: touch;
                display: flex;
                flex-direction: column;
                padding: 10px 10px calc(12px + env(safe-area-inset-bottom));
                border-radius: 18px;
                z-index: 7600 !important;
                box-shadow: 0 28px 68px rgba(0, 0, 0, 0.5);
                pointer-events: auto;
                touch-action: manipulation;
            }

            #obs-chat-model-menu[hidden],
            #obs-image-model-menu[hidden],
            #obs-image-route-menu[hidden],
            .obs-view .topbar .obs-model-menu[hidden] {
                display: none !important;
            }

            .obs-model-menu,
            .obs-model-menu.obs-model-menu--floating {
                z-index: 7600 !important;
            }

            #obs-chat-model-menu .obs-model-menu-grid,
            #obs-image-model-menu .obs-model-menu-grid,
            #obs-image-route-menu .obs-model-menu-grid,
            .obs-view .topbar .obs-model-menu-grid {
                grid-template-columns: 1fr;
                gap: 8px;
            }

            .obs-model-menu-header {
                margin-bottom: 8px;
            }

            .obs-model-menu-title {
                font-size: 14px;
            }

            .obs-model-menu-subtitle {
                font-size: 11px;
                line-height: 1.3;
            }

            .obs-model-menu-shortcuts {
                display: none !important;
            }

            .obs-model-card {
                min-height: 0;
                display: grid;
                grid-template-columns: 34px minmax(0, 1fr);
                column-gap: 10px;
                row-gap: 4px;
                padding: 10px 11px;
                border-radius: 12px;
            }

            .obs-model-card::before {
                content: attr(data-short);
                grid-row: 1 / span 4;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 32px;
                height: 32px;
                border-radius: 11px;
                border: 1px solid rgba(255, 255, 255, 0.08);
                background: rgba(255, 255, 255, 0.055);
                color: var(--text-2);
                font-size: 10px;
                font-weight: 900;
                letter-spacing: 0;
                text-transform: none;
            }

            .obs-model-card-title {
                font-size: 13px;
                line-height: 1.2;
            }

            .obs-model-card-subtitle {
                font-size: 11px;
                line-height: 1.25;
            }

            .obs-model-card-tags {
                gap: 4px;
                min-height: 0;
            }

            .obs-model-card-tag {
                min-height: 18px;
                padding: 1px 7px;
                font-size: 9px;
            }

            .obs-model-card-meta {
                margin-top: 2px;
                gap: 6px;
                justify-content: flex-start;
            }

            .obs-model-card-chip {
                min-height: 20px;
                padding: 2px 7px;
                font-size: 10px;
            }

            .obs-model-card-status {
                font-size: 10px;
            }
        }

        /* ── SCROLLBAR ── */
        ::-webkit-scrollbar {
            width: 6px;
        }

        ::-webkit-scrollbar-track {
            background: transparent;
        }

        ::-webkit-scrollbar-thumb {
            background: var(--bg-3);
            border-radius: 3px;
        }

        ::-webkit-scrollbar-thumb:hover {
            background: var(--text-3);
        }

/* Attachment discs use the same overlapping dock + corner-shelf layout as
   desktop on mobile too. Touch has no :hover, so tap-to-open is wired in JS
   (toggles `.is-open`, which mirrors the desktop hover styles in
   obsidian_views.css). No per-size overrides needed here. */