/* Chat presentation restored from the pre-deployment source. Scoped to the conversation page. */
@font-face{font-family:Inter;src:url('/vendor/fonts/InterVariable.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('/vendor/fonts/JetBrainsMono-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
html[data-ui-theme] #appPage{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI','Microsoft YaHei',sans-serif;--shadow-sm:0 1px 2px #0000000a;--shadow-md:0 4px 12px #0000000f}
	html[data-ui-theme] #appPage .main-content {
	    background: var(--bg-primary);
	}
	html[data-ui-theme] #appPage .main-content::before {
	    background:
	        var(--dynamic-bg-image) center/cover no-repeat,
	        url('bg-gradient-small.webp') center/cover no-repeat;
	    filter: blur(4px) saturate(0.88);
	    opacity: 0.08;
	}
	html[data-ui-theme] body[data-background-mode="random"] #appPage .main-content::before {
	    opacity: 0.1;
	}
	html[data-ui-theme] #appPage .chat-header {
	    background: var(--bg-secondary);
	    border-bottom: 1px solid var(--border);
	}
	html[data-ui-theme] #appPage .chat-title-wrapper h2 {
	    font-size: 18px;
	    font-weight: 600;
	    color: var(--text-primary);
	}
html[data-ui-theme] #appPage .svg-render-container {
    background: var(--bg-secondary);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
}
html[data-ui-theme] #appPage .svg-render-header {
    background: var(--bg-tertiary);
    border-bottom: 1px solid var(--border);
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
}
html[data-ui-theme] #appPage .svg-render-header svg {
    color: var(--primary);
}
html[data-ui-theme] #appPage .svg-toggle-btn {
    background: var(--primary-bg);
    color: var(--primary);
    border: 1px solid var(--primary-light);
    border-radius: var(--radius-sm);
    font-size: 12px;
    font-weight: 500;
}
html[data-ui-theme] #appPage .svg-toggle-btn:hover {
    background: var(--primary);
    color: white;
}
html[data-ui-theme] #appPage .svg-render-content {
    background: white;
    text-align: center;
}
html[data-ui-theme] #appPage .svg-render-code {
    background: var(--bg-tertiary);
}
html[data-ui-theme] #appPage .svg-render-code code {
    font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
    font-size: 12px;
    line-height: 1.6;
}
html[data-ui-theme] #appPage .svg-preview-container {
    background: var(--bg-secondary);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
}
html[data-ui-theme] #appPage .svg-preview-header {
    background: var(--primary-bg);
    border-bottom: 1px solid var(--border);
    font-size: 13px;
    font-weight: 500;
    color: var(--primary);
}
html[data-ui-theme] #appPage .svg-preview-header::before {
    background: var(--primary);
    border-radius: 50%;
}
	html[data-ui-theme] #appPage .message-avatar {
	    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
	    border-radius: 50%;
	    color: white;
	    font-weight: 600;
	    font-size: 12px;
	}
	html[data-ui-theme] #appPage .message.user .message-avatar {
	    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
	}
	html[data-ui-theme] #appPage .message-role {
	    font-size: 13px;
	    font-weight: 600;
	    color: var(--text-primary);
	}
	html[data-ui-theme] #appPage .message-content {
	    background: var(--bg-secondary);
	    border-radius: var(--radius-lg);
	    border-bottom-left-radius: 4px;
	    box-shadow: var(--shadow-sm);
	    border: 1px solid var(--border);
	}
	html[data-ui-theme] #appPage .message.user .message-content {
	    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
	    border: none;
	    color: white;
	    border-radius: var(--radius-lg);
	    border-bottom-right-radius: 4px;
	}
	html[data-ui-theme] #appPage .message.user .message-content a {
	    color: white;
	}
	html[data-ui-theme] #appPage .content-html {
	    font-size: 15px;
	    line-height: 1.7;
	}
	html[data-ui-theme] #appPage .content-html strong {
	    font-weight: 600;
	}
	html[data-ui-theme] #appPage .content-html em {
	    font-style: italic;
	}
	html[data-ui-theme] #appPage .code-block-wrapper {
	    border-radius: var(--radius-md);
	    background: #1e293b;
	    border: 1px solid #334155;
	}
	html[data-ui-theme] #appPage .code-block-wrapper code {
	    font-family: 'JetBrains Mono', monospace;
	    font-size: 13px;
	    line-height: 1.6;
	    color: #e2e8f0;
	}
	html[data-ui-theme] #appPage .code-copy-btn {
	    background: rgba(255, 255, 255, 0.1);
	    border-radius: var(--radius-sm);
	    color: #94a3b8;
	    font-size: 12px;
	}
	html[data-ui-theme] #appPage .code-copy-btn:hover {
	    background: rgba(255, 255, 255, 0.2);
	    color: white;
	}
	html[data-ui-theme] #appPage .code-copy-btn.copied {
	    background: rgba(16, 185, 129, 0.2);
	    color: var(--success);
	}
	html[data-ui-theme] #appPage .content-html code:not(.hljs) {
	    background: var(--bg-tertiary);
	    border-radius: 4px;
	    font-family: 'JetBrains Mono', monospace;
	    font-size: 13px;
	    color: var(--primary-dark);
	}
	html[data-ui-theme] #appPage .message.user .content-html code:not(.hljs) {
	    background: rgba(255, 255, 255, 0.2);
	    color: white;
	}
	html[data-ui-theme] #appPage .thinking-timeline-container {
	    background: var(--bg-tertiary);
	    border-radius: var(--radius-md);
	    border: 1px solid var(--border);
	}
	html[data-ui-theme] #appPage .thinking-header {
	    background: var(--bg-secondary);
	    border-bottom: 1px solid var(--border);
	}
	html[data-ui-theme] #appPage .thinking-header:hover {
	    background: var(--bg-hover);
	}
	html[data-ui-theme] #appPage .thinking-header-title {
	    font-size: 13px;
	    font-weight: 600;
	    color: var(--text-primary);
	}
	html[data-ui-theme] #appPage .thinking-step-dot {
	    background: var(--primary);
	    border-radius: 50%;
	}
	html[data-ui-theme] #appPage .thinking-step-line {
	    background: var(--border);
	}
	html[data-ui-theme] #appPage .thinking-step-title {
	    font-size: 13px;
	    font-weight: 600;
	    color: var(--text-primary);
	}
	html[data-ui-theme] #appPage .thinking-step-content {
	    font-size: 13px;
	    color: var(--text-secondary);
	    line-height: 1.6;
	}
	html[data-ui-theme] #appPage .tool-call-block-realtime {
	    background: var(--bg-secondary);
	    border: 1px solid var(--border);
	    border-radius: var(--radius-md);
	}
	html[data-ui-theme] #appPage .tool-call-main:hover {
	    background: var(--bg-tertiary);
	}
	html[data-ui-theme] #appPage .tool-call-spinner {
	    border: 2px solid var(--border);
	    border-top-color: var(--primary);
	    border-radius: 50%;
	}
	html[data-ui-theme] #appPage .tool-call-name {
	    font-size: 13px;
	    font-weight: 600;
	    color: var(--text-primary);
	}
	html[data-ui-theme] #appPage .tool-call-main:hover .tool-call-name {
	    color: var(--primary);
	}
	html[data-ui-theme] #appPage .tool-call-params-preview {
	    font-size: 12px;
	    color: var(--text-muted);
	}
	html[data-ui-theme] #appPage .tool-call-main:hover .tool-call-params-preview {
	    color: var(--text-secondary);
	    opacity: 0.8;
	}
	html[data-ui-theme] #appPage .tool-call-section-title {
	    font-size: 11px;
	    font-weight: 600;
	    color: var(--text-muted);
	    text-transform: uppercase;
	    letter-spacing: 0.05em;
	}
	html[data-ui-theme] #appPage .tool-call-section-content {
	    font-size: 12px;
	    color: var(--text-secondary);
	    background: var(--bg-tertiary);
	    border-radius: var(--radius-sm);
	    line-height: 1.5;
	}
	html[data-ui-theme] #appPage .tool-call-result-content.loading {
	    opacity: 0.6;
	}
	html[data-ui-theme] #appPage .tool-call-block-realtime.success {
	    border-left: 3px solid var(--success);
	}
	html[data-ui-theme] #appPage .tool-call-block-realtime.error {
	    border-left: 3px solid var(--error);
	}
	html[data-ui-theme] #appPage .code-locked-block {
	    background: var(--bg-tertiary);
	    border: 2px dashed var(--border);
	    border-radius: var(--radius-md);
	    text-align: center;
	}
	html[data-ui-theme] #appPage .code-locked-header {
	    color: var(--text-muted);
	    font-size: 14px;
	}
	html[data-ui-theme] #appPage .code-locked-content p {
	    font-size: 13px;
	    color: var(--text-secondary);
	}
	html[data-ui-theme] #appPage .thinking-level-badge {
	    border: 1px solid rgba(255, 255, 255, 0.36);
	    border-radius: 5px;
	    background: rgba(255, 255, 255, 0.16);
	    color: #fff;
	    font-size: 10px;
	    font-weight: 700;
	    line-height: 1;
	}
	html[data-ui-theme] #appPage .thinking-level-settings {
	    border-top: 1px solid var(--border-light);
	    background: color-mix(in srgb, var(--bg-tertiary) 72%, transparent);
	}
	html[data-ui-theme] #appPage .thinking-level-heading {
	    color: var(--text-muted);
	    font-size: 11px;
	    font-weight: 600;
	}
	html[data-ui-theme] #appPage .thinking-level-heading span:last-child {
	    color: var(--primary);
	}
	html[data-ui-theme] #appPage .thinking-level-options button {
	    border: 1px solid var(--border);
	    border-radius: 6px;
	    background: var(--bg-secondary);
	    color: var(--text-secondary);
	    font: inherit;
	    font-size: 11px;
	    font-weight: 600;
	}
	html[data-ui-theme] #appPage .thinking-level-options button:hover {
	    border-color: var(--primary);
	    color: var(--primary);
	}
	html[data-ui-theme] #appPage .thinking-level-options button.active {
	    border-color: var(--primary);
	    background: var(--primary);
	    color: #fff;
	}
	html[data-ui-theme] #appPage .thinking-level-note {
	    color: var(--text-muted);
	    font-size: 10px;
	    line-height: 1.4;
	}
	html[data-ui-theme] #appPage .main-content.chat-file-dragover .input-container {
	    border-color: var(--primary);
	    box-shadow: 0 0 0 4px var(--primary-bg), var(--shadow-sm);
	}
	html[data-ui-theme] #appPage .main-content.chat-file-dragover .input-container::after {
	    border-radius: inherit;
	    background: color-mix(in srgb, var(--bg-primary) 92%, var(--primary) 8%);
	    color: var(--primary);
	    font-size: 13px;
	    font-weight: 700;
	}
	html[data-ui-theme] #appPage .message-image-gallery img {
	    border: 1px solid var(--border);
	    border-radius: 8px;
	    background: var(--bg-secondary);
	}
	html[data-ui-theme] #appPage .message-avatar {
	    border-radius: 50%;
	    font-weight: 600;
	    font-size: 14px;
	}
	html[data-ui-theme] #appPage .user-context .message-avatar {
	    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
	    color: white;
	}
	html[data-ui-theme] #appPage .ai-solver .message-avatar {
	    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
	    color: white;
	}
	html[data-ui-theme] #appPage .message-sender {
	    font-size: 12px;
	    font-weight: 600;
	    color: var(--text-muted);
	}
	html[data-ui-theme] #appPage .message-bubble {
	    background: var(--bg-tertiary);
	    border-radius: var(--radius-md);
	    font-size: 14px;
	    color: var(--text-primary);
	    line-height: 1.7;
	}
	html[data-ui-theme] #appPage .thinking-process {
	    background: var(--warning-bg);
	    border-left: 3px solid var(--warning);
	    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
	    font-size: 13px;
	    color: var(--text-secondary);
	}
@media (max-width: 768px) {
    html[data-ui-theme] #appPage .chat-title-wrapper h2 {
        font-size: 16px;
    }
    html[data-ui-theme] #appPage .code-block-wrapper {
        border-radius: 12px;
    }
    html[data-ui-theme] #appPage .code-block-wrapper pre {
        font-size: 11.5px;
        line-height: 1.55;
    }
    html[data-ui-theme] #appPage .code-block-wrapper code {
        font-size: 11.5px;
        line-height: 1.55;
    }
    html[data-ui-theme] #appPage .code-copy-btn {
        font-size: 11px;
    }
    html[data-ui-theme] #appPage .message-bubble {
        font-size: 14px;
    }
}
@media (max-width: 480px) {
    html[data-ui-theme] #appPage .code-block-wrapper {
        border-radius: 10px;
    }
    html[data-ui-theme] #appPage .code-block-wrapper pre {
        font-size: 10.5px;
        line-height: 1.5;
    }
    html[data-ui-theme] #appPage .code-block-wrapper code {
        font-size: 10.5px;
        line-height: 1.5;
    }
    html[data-ui-theme] #appPage .code-copy-btn {
        font-size: 10px;
    }
}
html[data-ui-theme] #appPage .code-block-wrapper {
    border-radius: var(--radius-lg);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-md);
}
html[data-ui-theme] #appPage .message-avatar {
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%);
    box-shadow: 0 10px 24px rgba(79, 70, 229, 0.18);
}
html[data-ui-theme] #appPage .main-content {
    background: transparent;
}
html[data-ui-theme] #appPage .chat-header {
    background: color-mix(in srgb, var(--bg-secondary) 90%, transparent);
    border-bottom: 1px solid var(--border);
}
html[data-ui-theme] #appPage .chat-title-wrapper h2 {
    letter-spacing: 0;
}
html[data-ui-theme] #appPage .chat-messages {
    background: transparent;
}
html[data-ui-theme] #appPage .message-bubble {
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-light);
    box-shadow: var(--shadow-sm);
}
html[data-ui-theme] #appPage .chat-message.ai-solver .message-bubble {
    background: var(--bg-secondary);
}
html[data-ui-theme] #appPage .chat-message.user .message-bubble {
    background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%);
    box-shadow: 0 12px 26px rgba(79, 70, 229, 0.14);
}
html[data-ui-theme] #appPage .svg-live-card {
    color: var(--text-primary);
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--svg-live-color) 28%, var(--border));
    border-radius: var(--radius-lg);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--svg-live-color) 7%, transparent);
}
html[data-ui-theme] #appPage .svg-live-render-header {
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--svg-live-color) 7%, var(--bg-tertiary));
    border-bottom-color: color-mix(in srgb, var(--svg-live-color) 22%, var(--border));
}
html[data-ui-theme] #appPage .svg-live-render-header > svg {
    color: var(--svg-live-color);
}
html[data-ui-theme] #appPage .svg-live-header-state {
    color: var(--svg-live-color);
    font-size: 12px;
    font-weight: 700;
}
html[data-ui-theme] #appPage .svg-live-body {
    background: color-mix(in srgb, var(--svg-live-color) 5%, var(--bg-secondary));
}
html[data-ui-theme] #appPage .svg-live-visual {
    background: color-mix(in srgb, var(--svg-live-color) 7%, var(--bg-primary));
    border: 1px solid color-mix(in srgb, var(--svg-live-color) 20%, var(--border));
    border-radius: 6px;
}
html[data-ui-theme] #appPage .svg-live-grid {
    opacity: 0.42;
    background-image:
        linear-gradient(color-mix(in srgb, var(--svg-live-color) 12%, transparent) 1px, transparent 1px),
        linear-gradient(90deg, color-mix(in srgb, var(--svg-live-color) 12%, transparent) 1px, transparent 1px);
    background-size: 14px 14px;
}
html[data-ui-theme] #appPage .svg-live-node {
    background: var(--bg-secondary);
    border: 2px solid var(--svg-live-color);
    border-radius: 4px;
    box-shadow: 0 3px 8px color-mix(in srgb, var(--svg-live-color) 15%, transparent);
}
html[data-ui-theme] #appPage .svg-live-node::after {
    background: color-mix(in srgb, var(--svg-live-color) 58%, transparent);
    border-radius: 2px;
}
html[data-ui-theme] #appPage .svg-live-link {
    background: var(--svg-live-color);
    opacity: 0.56;
}
html[data-ui-theme] #appPage .svg-live-scan {
    background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--svg-live-color) 22%, transparent), transparent);
}
html[data-ui-theme] #appPage .svg-live-mark {
    color: var(--svg-live-color);
}
html[data-ui-theme] #appPage .svg-live-title { font-size: 14px; font-weight: 700; }
html[data-ui-theme] #appPage .svg-live-metric { color: var(--text-muted); font-size: 11px; font-variant-numeric: tabular-nums; }
html[data-ui-theme] #appPage .svg-live-message {
    color: var(--text-secondary);
    font-size: 12px;
    line-height: 1.45;
}
html[data-ui-theme] #appPage .svg-live-steps {
    color: var(--text-muted);
    font-size: 11px;
}
html[data-ui-theme] #appPage .svg-live-steps i {
    background: var(--border);
}
html[data-ui-theme] #appPage .svg-live-steps span.is-current { color: var(--svg-live-color); font-weight: 700; }
html[data-ui-theme] #appPage .svg-live-steps span.is-complete { color: var(--success); }
html[data-ui-theme] #appPage .svg-live-progress {
    background: color-mix(in srgb, var(--border) 76%, transparent);
    border-radius: 999px;
}
html[data-ui-theme] #appPage .svg-live-progress > span {
    background: var(--svg-live-color);
    border-radius: inherit;
}
html[data-ui-theme] #appPage .chat-message.ai-solver .message-bubble::before,
html[data-ui-theme] #appPage .message.assistant .message-content::before {
    opacity: 0;
    background:
        linear-gradient(100deg, transparent 0%, color-mix(in srgb, var(--primary) 10%, transparent) 44%, transparent 70%);
}
html[data-ui-theme] #appPage .message.assistant.is-streaming .message-content {
    border-color: color-mix(in srgb, var(--primary) 28%, var(--border));
    box-shadow:
        0 12px 30px color-mix(in srgb, var(--primary) 7%, transparent),
        inset 0 0 0 1px color-mix(in srgb, var(--primary) 10%, transparent);
}
html[data-ui-theme] #appPage .message.assistant.is-streaming .assistant-content::after {
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary) 74%, var(--text-primary));
}
html[data-ui-theme] #appPage .message.assistant.is-streaming .message-content::before {
    content: none;
    animation: none;
}

/* Keep the original image layer when no custom background was selected. */
html[data-ui-theme] #appPage .main-content::before{background-image:var(--dynamic-bg-image),url('/bg-gradient-small.webp')!important;background-position:center;background-size:cover;background-repeat:no-repeat}
html[data-ui-theme] #appPage .message-content code{font-family:'JetBrains Mono',Consolas,monospace}
html[data-ui-theme] #appPage .content-html p{line-height:inherit}
html[data-ui-theme] #appPage .svg-render-header{min-height:42px}
html[data-ui-theme] #appPage .svg-toggle-btn{min-height:28px;padding:4px 12px;font-size:12px;line-height:1.5}
html[data-ui-theme] #appPage .svg-render-content{color:#1e1b4b;isolation:isolate}
html[data-ui-theme] #appPage .svg-render-content>svg{font-family:Inter,'Segoe UI','Microsoft YaHei',sans-serif}

/* Base typography and compact status labels were also affected by the reset. */
html[data-ui-theme] body{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI','Microsoft YaHei',sans-serif}
html[data-ui-theme] .csp-history-summary .csp-temp-status{display:inline-block;width:auto;margin:0 0 0 6px;padding:2px 9px;line-height:1.5;vertical-align:middle}
html[data-ui-theme] .csp-temp-hint{line-height:1.6}
html[data-ui-theme] .csp-history-card{border:1px solid var(--border);background:var(--bg-primary)}

/* Let the conversation background continue behind the composer. */
html[data-ui-theme] #appPage .input-area{background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none;padding-top:8px}
html[data-ui-theme] #appPage .input-container{border-color:color-mix(in srgb,var(--border) 65%,transparent);background:color-mix(in srgb,var(--bg-secondary) 94%,transparent);box-shadow:0 3px 16px #17254408;border-radius:18px}
html[data-ui-theme] #appPage .input-container:focus-within{border-color:color-mix(in srgb,var(--primary) 25%,var(--border));box-shadow:0 3px 18px #1725440a}
html[data-ui-theme] #appPage .model-selector-btn{background:transparent!important;padding:5px 7px!important;gap:7px;font-size:12px!important;border-radius:7px!important;box-shadow:none!important}
html[data-ui-theme] #appPage .model-selector-btn:hover{background:color-mix(in srgb,var(--primary) 5%,transparent)!important}
html[data-ui-theme] #appPage .model-selector-btn .model-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;min-width:20px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
html[data-ui-theme] #appPage .model-brand-image{display:block;width:22px;height:22px;max-width:none;max-height:none;object-fit:contain;flex-shrink:0}
html[data-ui-theme] #appPage .model-selector-btn .model-brand-image{width:18px;height:18px}
html[data-ui-theme="night"] #appPage .model-brand-openai{filter:invert(1)}
html[data-ui-theme] #appPage .model-dropdown{width:278px;min-width:0;max-width:calc(100vw - 44px);padding:6px;background:var(--bg-secondary);border:1px solid color-mix(in srgb,var(--border) 65%,transparent);border-radius:12px;box-shadow:0 8px 28px #17254414;overflow:hidden}
html[data-ui-theme] #appPage .model-dropdown-header{padding:7px 10px 6px;background:transparent;border:0;color:var(--text-muted);font-size:11px;font-weight:500;letter-spacing:0}
html[data-ui-theme] #appPage .model-options{display:flex;flex-direction:column;gap:0;padding:0;max-height:none;overflow:visible}
html[data-ui-theme] #appPage button.model-option{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;margin:0;padding:10px!important;border:0!important;border-radius:7px!important;background:transparent!important;box-shadow:none!important;color:var(--text-secondary)!important;transform:none!important;font-size:13px;font-weight:400;text-align:left}
html[data-ui-theme] #appPage button.model-option.active{background:color-mix(in srgb,var(--primary) 5%,transparent)!important;color:var(--text-primary)!important;font-weight:500!important}
html[data-ui-theme] #appPage button.model-option:hover:not(:disabled){background:color-mix(in srgb,var(--primary) 7%,transparent)!important;color:var(--text-primary)!important}
html[data-ui-theme] #appPage button.model-option:disabled{opacity:1;color:var(--text-muted)!important;cursor:default}
html[data-ui-theme] #appPage .model-option-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;min-width:24px;border:0;border-radius:0;padding:0;background:transparent;box-shadow:none}
html[data-ui-theme] #appPage .model-option-name{flex:1;min-width:0;font-size:13px;font-weight:inherit;line-height:1.5;white-space:nowrap}
html[data-ui-theme] #appPage .model-option-status{font-size:11px;font-weight:400;white-space:nowrap;color:var(--text-muted)}
html[data-ui-theme] #appPage .model-option-check{width:16px;height:16px;flex:0 0 16px;border:0!important;border-radius:0;background:transparent!important;box-shadow:none;color:var(--primary);opacity:0}
html[data-ui-theme] #appPage .model-option.active .model-option-check{opacity:1;background:transparent!important;color:var(--primary)}
html[data-ui-theme] #appPage .model-option-check svg{display:block;width:16px;height:16px;max-width:16px;max-height:16px;color:inherit}
html[data-ui-theme] #appPage .model-option:disabled .model-option-check{display:none}

/* The chat page fills the workspace, including when the mobile keyboard opens. */
html[data-ui-theme] #appPage .thinking-step-content { white-space:pre-wrap; overflow-wrap:anywhere; }
html[data-ui-theme] #appPage .chat-messages { scroll-behavior:auto; overflow-anchor:none; }
html[data-ui-theme] #appPage .input-area { position:relative; }
html[data-ui-theme] #appPage #chatScrollBottom {
    position:absolute; right:max(24px,calc((100% - 880px)/2)); top:-48px; z-index:5;
    display:flex; align-items:center; justify-content:center; width:38px; height:38px; min-height:38px;
    padding:8px; border:1px solid var(--border); border-radius:50%;
    background:var(--bg-secondary); color:var(--text-secondary); box-shadow:0 3px 12px #17254418;
    cursor:pointer; transition:background .15s,color .15s,transform .15s;
}
html[data-ui-theme] #appPage #chatScrollBottom[hidden] { display:none; }
html[data-ui-theme] #appPage #chatScrollBottom:hover { color:var(--primary); transform:translateY(2px); }
html[data-ui-theme] #appPage #chatScrollBottom:focus-visible { outline:2px solid var(--primary); outline-offset:3px; }
html[data-ui-theme] #appPage #chatScrollBottom svg { width:20px; height:20px; }
html[data-ui-theme] .workspace-main > #appPage { height:100%; min-height:0; top:0; margin:0; }
html[data-ui-theme] #appPage .chat-messages { min-height:0; }
html[data-ui-theme] #appPage .input-container { grid-template-areas:none; }
html[data-ui-theme] #appPage .model-selector-custom { grid-area:2 / 1 / 3 / 2; }
html[data-ui-theme] #appPage .input-actions { grid-area:2 / 2 / 3 / 3; }
html[data-ui-theme] #appPage .model-dropdown { max-height:min(420px,calc(var(--workspace-height,100dvh) - 170px)); overflow-y:auto; overscroll-behavior:contain; }
html[data-ui-theme] #appPage .message-avatar,
html[data-ui-theme] .user-avatar,
html[data-ui-theme] .user-avatar-large {
    display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
    overflow:hidden; border-radius:50%; padding:0; aspect-ratio:1;
    background:#e2eeed; color:#245c58; border:1px solid #b9d2ce;
    box-shadow:none; font-weight:650; line-height:1;
}
html[data-ui-theme] #appPage .message-avatar { width:32px; height:32px; }
html[data-ui-theme] #appPage .message.user .message-avatar { background:#e2eeed; color:#245c58; }
html[data-ui-theme] #appPage .assistant-model-avatar { background:var(--bg-secondary); border-color:var(--border); }
html[data-ui-theme] .avatar-image { display:block; width:100%; height:100%; max-width:none; object-fit:cover; object-position:center; border-radius:inherit; }
html[data-ui-theme] .has-avatar-image { background:var(--bg-secondary); }
html[data-ui-theme] .workspace-mobile-header .mobile-profile { margin-left:auto; width:36px; height:36px; min-height:36px; padding:0!important; border-radius:50%!important; overflow:hidden; }
@media(max-width:768px) {
    html[data-ui-theme] .workspace-shell { height:var(--workspace-height,100dvh); }
    html[data-ui-theme] .workspace-shell .workspace-main,
    html[data-ui-theme] .workspace-shell[data-workspace-mode="page"] > .workspace-main { height:calc(var(--workspace-height,100dvh) - 56px); }
    html[data-ui-theme] #appPage .input-area { padding-bottom:max(14px,env(safe-area-inset-bottom,0px)); }
    html[data-ui-theme] #appPage .model-selector-btn { min-height:40px!important; }
    html[data-ui-theme] #appPage .input-actions button { min-height:40px!important; }
}
