/* Current workspace presentation. Routing evidence and Markdown keep their own
   component rules in styles.css; this layer owns the shell and chat controls. */
/* Product UI uses the brand's sans face throughout. Neutral surface mixes keep
   the source palette intact while reducing blue saturation in dense workspaces. */
:root {
  --ui-font: "General Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei", sans-serif;
  --ui-font-mono: ui-monospace, "SFMono-Regular", "SF Mono", Consolas, "Liberation Mono", monospace;
  --ui-text: var(--inf-neutral-900);
  --ui-secondary: var(--inf-neutral-800);
  --ui-muted: var(--inf-neutral-700);
  --ui-surface: var(--inf-neutral-0);
  --ui-canvas: var(--inf-neutral-25);
  --ui-surface-subtle: color-mix(in srgb, var(--inf-neutral-700) 5%, var(--ui-surface));
  --ui-surface-hover: color-mix(in srgb, var(--inf-neutral-700) 5%, var(--ui-surface));
  --ui-surface-selected: color-mix(in srgb, var(--inf-neutral-700) 12%, var(--ui-surface));
  --ui-divider: color-mix(in srgb, var(--inf-neutral-700) 24%, var(--ui-surface));
  --ui-border: var(--inf-border-interactive);
  --ui-accent-subtle: color-mix(in srgb, var(--inf-action) 8%, var(--ui-surface));
  --ui-accent-border: color-mix(in srgb, var(--inf-action) 28%, var(--ui-surface));
  --ui-sidebar:280px;
  --ui-trace:400px;
  --ink:var(--ui-text);
  --muted:var(--ui-muted);
  --line:var(--ui-divider);
  --canvas:var(--ui-canvas);
}
body { font-family:var(--ui-font); font-size:16px; line-height:1.5; letter-spacing:-.01em; color:var(--ui-text); background:var(--ui-canvas); -webkit-font-smoothing:antialiased; }
button, input, select, textarea { font-family:var(--ui-font); }
.mono, pre, code, kbd { font-family:var(--ui-font-mono); font-variant-ligatures:none; }
:where(h1,h2,h3,h4) { text-wrap:balance; }
::selection { background:var(--ui-accent-border); color:var(--ui-text); }
html[lang=zh-CN] body { letter-spacing:0; }
button, a, input, select, textarea, summary { -webkit-tap-highlight-color:transparent; }
button { transition:background var(--inf-dur-fast),color var(--inf-dur-fast),border-color var(--inf-dur-fast),box-shadow var(--inf-dur-fast); }
:where(button,a,input,select,textarea,summary):focus-visible { outline:2px solid var(--inf-focus-ring); outline-offset:2px; box-shadow:0 0 0 2px var(--inf-focus-ring-halo); }
.ui-icon { display:block; width:20px; height:20px; flex-shrink:0; pointer-events:none; }
[data-icon], .preset-icon, .picker-chevron { display:inline-flex; align-items:center; justify-content:center; }
button>span:has(>.ui-icon) { display:inline-flex; flex-shrink:0; }
.topbar { height:64px; padding:0 20px; gap:16px; }
.brand { font-size:16px; gap:16px; }
.brand img { width:96px; }
.topnav { padding:4px; gap:4px; border-radius:var(--inf-radius-nav); background:var(--ui-surface-subtle); }
.nav-link { white-space:nowrap; display:inline-flex; align-items:center; gap:8px; font-size:15px; height:40px; padding:0 16px; font-weight:500; }
.nav-link span { margin:0; opacity:1; }
.nav-link .ui-icon { width:16px; height:16px; }
.nav-link.active { color:var(--ui-text); background:var(--ui-surface); box-shadow:var(--inf-shadow-neutral-sm); }
#history-count { font-size:13px; font-variant-numeric:tabular-nums; color:var(--ui-muted); background:var(--ui-surface-selected); border-radius:var(--inf-radius-pill); padding:0 5px; }
.header-status { gap:12px; }
#language-select { height:40px; font-size:14px; border-color:var(--line); width:108px; background:transparent; }
#guide-button { width:40px; height:40px; padding:8px; }
.chat-app { max-width:1920px; padding:12px 16px 16px; }
.chat-layout, .chat-layout:not(.settings-hidden) { grid-template-columns:var(--ui-sidebar) minmax(320px,1fr) var(--ui-trace); height:calc(100dvh - 92px); min-height:480px; border-color:var(--line); border-radius:var(--inf-radius-lg); box-shadow:0 2px 4px rgb(0 0 0 / 1%); }
.chat-layout.settings-hidden { grid-template-columns:minmax(320px,1fr) var(--ui-trace); }
.chat-layout.trace-hidden { grid-template-columns:var(--ui-sidebar) minmax(320px,1fr); }
.chat-layout.trace-wide { grid-template-columns:var(--ui-sidebar) minmax(320px,1fr) 520px; }
.chat-layout.settings-hidden.trace-wide { grid-template-columns:minmax(320px,1fr) 520px; }
.chat-layout.settings-hidden.trace-hidden { grid-template-columns:1fr; }
.settings-panel { padding:0 16px 16px; background:var(--ui-surface-subtle); }
.settings-panel .panel-heading, .trace-sidebar .panel-heading { height:60px; min-height:60px; gap:8px; }
.panel-heading h2, .trace-sidebar .panel-heading h2 { font-size:15px; letter-spacing:-.1px; }
#close-settings, #close-trace, #export-button, #expand-trace { width:36px; height:40px; padding:8px; flex-shrink:0; }
#close-settings .ui-icon, #close-trace .ui-icon, #export-button .ui-icon, #expand-trace .ui-icon { width:16px; height:16px; }
.settings-subheading { margin:0 0 12px; font-size:13px; }
.settings-subheading .small { font-size:13px; padding:4px 8px; }
.routing-library-link { flex-direction:column; align-items:flex-start; min-height:52px; border-radius:var(--inf-radius-sm); padding:10px; margin-bottom:12px; gap:4px; }
.routing-library-link>span:first-child { font-size:14px; }
#routing-library-count { font-size:12px; }
.configuration-section { padding:20px 0; }
.configuration-title h3 { font-size:15px; font-weight:600; }
.configuration-title>span { font-size:13px; }
.configuration-title b .ui-icon { width:16px; height:16px; transition:transform var(--inf-dur-fast); }
.configuration-section[open]>.configuration-title b { transform:none; }
.configuration-section[open]>.configuration-title b .ui-icon { transform:rotate(180deg); }
.settings-panel .strategy-group { background:var(--ui-surface-selected); padding:3px; }
.settings-panel .strategy { font-size:13px; min-height:36px; }
.settings-panel .field { margin-bottom:16px; }
.settings-panel .field label, .settings-panel .field-grid label { font-size:14px; line-height:1.5; margin-bottom:8px; }
.settings-panel label>span { font-size:12px; color:var(--ui-muted); }
.settings-panel .field-grid { gap:12px; }
.settings-panel .field-grid label { min-height:44px; display:flex; flex-direction:column; justify-content:flex-end; gap:2px; }
.settings-panel input:not([type=checkbox]):not([type=range]), .settings-panel select { min-height:44px; height:44px; font-size:14px; border-color:var(--ui-border); padding:8px 10px; }
.settings-panel .temperature-field input[type=number] { min-height:36px; height:36px; }
.settings-panel .field-note { font-size:13px; line-height:1.65; }
.settings-panel .range-labels, .parameter-extra>summary { font-size:13px; }
.settings-panel .toggle-row label { font-size:14px; }
.settings-panel textarea { font-size:14px; }
.settings-footnote { padding-top:16px; font-size:13px; }
.settings-footnote p { display:none; }
.chat-panel { position:relative; container-type:inline-size; }
.chat-header { height:80px; min-height:80px; padding:12px 24px; flex-wrap:nowrap; gap:16px; }
.chat-model { min-width:0; width:auto; flex:1; }
.model-picker-button { padding:3px 6px 3px 0; border-radius:var(--inf-radius-sm); font-size:16px; gap:8px; line-height:1.5; }
.model-picker-button:hover:not(:disabled) { color:var(--inf-action); }
.model-picker-button .ui-icon { width:16px; height:16px; }
#models-meta { font-size:13px; margin-top:2px; color:var(--ui-muted); }
.chat-header-actions { gap:4px; padding-left:8px; border-left:1px solid var(--line); }
.chat-header-actions .small { height:40px; width:40px; padding:8px; border-radius:var(--inf-radius-pill); }
.chat-header-actions .active { background:var(--ui-surface-selected); color:var(--ink); }
.chat-header-actions .active:hover { background:var(--ui-divider); }
.chat-scroll { padding:32px 32px 24px; overscroll-behavior:contain; scrollbar-gutter:stable both-edges; }
.chat-welcome { padding:0 0 24px; min-height:270px; }
.welcome-symbol { width:40px; margin-bottom:24px; }
.chat-welcome h1 { font-family:var(--ui-font); font-size:clamp(36px,5cqi,42px); font-weight:600; line-height:1.2; letter-spacing:-1.2px; color:var(--inf-neutral-900); }
html[lang=zh-CN] .chat-welcome h1 { letter-spacing:-.5px; }
.chat-welcome>p { font-size:16px; color:var(--ui-muted); margin-top:12px; line-height:1.6; }
.welcome-line { display:block; }
.welcome-emphasis { position:relative; width:fit-content; max-width:100%; margin-inline:auto; padding-right:8px; color:var(--inf-brand); }
.chat-welcome>p { max-width:410px; margin-inline:auto; text-wrap:pretty; }
.welcome-typed { position:absolute; inset:0; text-align:left; pointer-events:none; user-select:none; }
.typewriter-active .welcome-source { color:transparent; }
#composer-welcome-hint { position:absolute; top:16px; left:18px; right:18px; font:400 17px/1.75 var(--ui-font); color:var(--ui-muted); pointer-events:none; user-select:none; }
.composer.typewriter-active #prompt::placeholder { color:transparent; }
.welcome-typed::after, #composer-welcome-hint::after { content:''; display:inline-block; width:2px; height:.95em; margin-left:3px; vertical-align:-.1em; background:var(--inf-action); animation:welcome-caret 1s step-end infinite; }
@keyframes welcome-caret { 0%,45%,100% { opacity:1; } 50%,95% { opacity:0; } }
.chat-presets { max-width:476px; margin-top:32px; gap:12px; }
.chat-presets button { min-height:64px; padding:14px; gap:10px; font-size:14px; color:var(--inf-neutral-700); border-radius:var(--inf-radius-md); background:var(--white); border-color:var(--line); }
.chat-presets button:hover { border-color:var(--inf-neutral-300); background:var(--ui-surface-subtle); color:var(--ink); box-shadow:var(--inf-shadow-neutral-sm); }
.chat-presets .preset-icon { color:var(--ui-muted); }
.preset-icon .ui-icon { width:18px; height:18px; }
.chat-presets .preset-label { flex:1; color:inherit; }
.preset-arrow .ui-icon { width:14px; height:14px; color:var(--inf-neutral-400); }
.chat-messages { max-width:760px; }
.chat-turn { margin-bottom:40px; gap:28px; }
.chat-turn:last-child { margin-bottom:0; }
.user-message { max-width:85%; padding:12px 18px; font-size:16px; line-height:1.75; background:var(--ui-surface-hover); border:1px solid var(--ui-surface-hover); border-radius:16px 16px 4px 16px; }
.user-message:empty { display:none; }
.assistant-label { gap:10px; font-size:15px; font-weight:500; margin-bottom:16px; color:var(--ui-secondary); }
.assistant-label img { width:22px; }
.assistant-content { font-size:17px; line-height:1.8; letter-spacing:0; color:var(--ui-text); }
.assistant-content p { margin-bottom:1.05em; }
.assistant-content h2 { font-size:22px; }
.assistant-content h3 { font-size:18px; }
.assistant-content .chat-code code { font-size:14px; line-height:1.8; }
.markdown-code-toolbar { min-height:40px; padding:6px 14px; font-size:14px; }
.markdown-copy { padding:7px 10px; font-size:14px; }
.markdown-table table { font-size:15px; }
.chat-performance { gap:16px; margin-top:16px; font-size:14px; min-height:24px; }
.chat-metric { gap:7px; }
.chat-metric>span, .chat-metric small, .metric-source { font-size:12px; }
.chat-metric strong { color:var(--inf-neutral-700); font-weight:500; }
.chat-turn[data-streaming=true] .chat-metric strong { color:var(--inf-action); }
.answer-actions { margin-top:8px; gap:4px; flex-wrap:wrap; }
.answer-actions .small { padding:6px 9px; min-height:32px; font-size:13px; gap:6px; }
.answer-actions .ui-icon { width:14px; height:14px; }
.answer-actions>.muted { font-size:12px; }
.thinking-indicator { display:inline-flex; align-items:center; gap:8px; font-size:15px; }
.thinking-indicator>span { animation:thinking-pulse 1.4s ease-in-out infinite; letter-spacing:2px; color:var(--inf-action); }
@keyframes thinking-pulse { 50% { opacity:.25; } }
.composer-region { position:relative; width:100%; max-width:824px; margin-inline:auto; padding:12px 24px 16px; }
#request-form.composer { flex:none; position:relative; border:1px solid var(--inf-neutral-450); border-radius:var(--inf-radius-lg); background:var(--white); box-shadow:var(--inf-shadow-neutral-sm); overflow:visible; transition:border-color var(--inf-dur-base),box-shadow var(--inf-dur-base); }
#request-form.composer:hover { border-color:var(--ui-muted); }
#request-form.composer:focus-within { border-color:var(--inf-action); box-shadow:0 0 0 2px var(--ui-accent-subtle),var(--inf-shadow-neutral-sm); }
.composer #prompt { min-height:82px; height:82px; max-height:210px; padding:16px 18px 8px; font-size:17px; line-height:1.75; border-radius:var(--inf-radius-lg) var(--inf-radius-lg) 0 0; font-weight:400; margin:0; }
.composer #prompt:focus { box-shadow:none; outline:none; }
.composer #prompt::placeholder { color:var(--ui-muted); }
.composer-toolbar { align-items:center; padding:8px 10px 10px; gap:8px; }
.composer-tools { gap:4px!important; flex-wrap:nowrap; }
.composer-action { display:inline-flex; align-items:center; justify-content:center; gap:7px; height:40px; min-height:40px; padding:0 12px; border:1px solid transparent; border-radius:var(--inf-radius-pill); background:transparent; color:var(--inf-neutral-700); font-size:14px; line-height:1; white-space:nowrap; }
.composer-action:hover:not(:disabled) { background:var(--ui-surface-hover); }
.composer-action[aria-expanded=true] { background:var(--ui-surface-selected); color:var(--ink); }
#attach-button { padding:10px; width:40px; height:40px; font-size:inherit; }
#reasoning-button>span:last-child .ui-icon { width:16px; height:16px; }
.reasoning-control { display:flex; }
#reasoning-button[data-custom=true] { color:var(--inf-action); background:var(--ui-accent-subtle); }
.search-toggle { gap:7px; }
.search-toggle[aria-pressed=true] { background:var(--ui-accent-subtle); color:var(--inf-action); border-color:transparent; }
.search-on-dot { width:4px; height:4px; border-radius:50%; background:currentColor; display:none; }
.search-toggle[aria-pressed=true] .search-on-dot { display:block; }
.send-actions { gap:8px; flex-shrink:0; }
#run-button, #stop-button { width:44px; height:44px; min-width:44px; min-height:44px; padding:10px; border-radius:var(--inf-radius-pill); }
#run-button { box-shadow:var(--inf-shadow-action-sm); }
#run-button:disabled { opacity:1; background:var(--ui-surface-selected); color:var(--inf-neutral-400); box-shadow:none; }
#run-button:disabled .ui-icon { opacity:.8; }
#stop-button { color:var(--white); background:var(--inf-neutral-900); border:0; }
#stop-button:hover { background:var(--inf-neutral-700); }
#stop-button .ui-icon { width:18px; height:18px; }
#prompt-count { position:absolute; right:16px; top:-22px; font-size:13px; }
.composer-note { margin-top:8px; padding:0 2px; min-height:24px; align-items:center; gap:8px; font-size:12px; color:var(--ui-muted); }
.composer-state, .composer-hints { display:flex; align-items:center; gap:10px; min-width:0; }
#composer-status { display:inline-flex; align-items:center; gap:6px; line-height:1.5; }
#composer-status::before { content:''; width:5px; height:5px; flex-shrink:0; border-radius:50%; background:var(--inf-neutral-400); }
#composer-status[data-state=ready]::before { background:var(--inf-success); }
#composer-status[data-state=running]::before { background:var(--inf-action); animation:thinking-pulse 1.4s ease-in-out infinite; }
#composer-status[data-state=error]::before { background:var(--inf-danger); }
#context-count { display:none; font-size:12px; }
#context-count:empty { display:none; }
.keyboard-hint { display:inline-flex; align-items:center; gap:4px; white-space:nowrap; font-size:12px; }
.keyboard-hint kbd { font:10px/1.4 var(--inf-font-ui); color:var(--ui-muted); }
.hint-divider { color:var(--inf-neutral-300); margin-inline:3px; }
#composer-info-button { width:24px; height:24px; padding:4px; flex-shrink:0; }
#composer-info-button .ui-icon { width:14px; height:14px; }
#search-billing-note { margin:8px 4px 2px; font-size:13px; line-height:1.6; color:var(--inf-warning); }
.jump-latest { position:absolute; left:50%; top:-40px; transform:translateX(-50%); z-index:2; height:32px; min-height:32px; padding:0 12px; font-size:13px; white-space:nowrap; box-shadow:var(--inf-shadow-neutral-sm); border-color:var(--line); }
.jump-latest .ui-icon { width:14px; height:14px; }
.composer-popover { position:fixed; inset:auto; margin:0; padding:8px; width:340px; max-width:calc(100vw - 24px); border:1px solid var(--line); border-radius:var(--inf-radius-lg); background:var(--white); color:var(--ink); box-shadow:var(--inf-shadow-neutral-md); overflow-y:auto; overscroll-behavior:contain; }
.composer-popover:popover-open { animation:popover-enter var(--inf-dur-fast) var(--inf-ease-entrance); }
@keyframes popover-enter { from { opacity:0; } to { opacity:1; } }
#reasoning-menu { scroll-padding-block:56px 8px; }
.reasoning-menu-heading { position:sticky; top:-8px; z-index:1; display:block; margin:-8px -8px 4px; padding:14px 18px; border-bottom:1px solid var(--line); background:var(--white); font-size:14px; font-weight:600; }
.reasoning-option { min-height:60px; display:flex; align-items:center; justify-content:space-between; width:100%; text-align:left; padding:12px; border:0; border-radius:var(--inf-radius-sm); background:transparent; color:var(--ink); gap:12px; }
.reasoning-option:hover, .reasoning-option:focus-visible { background:var(--ui-surface-hover); }
.reasoning-option[aria-selected=true] { background:var(--ui-surface-subtle); }
.reasoning-option strong { display:block; font-size:15px; font-weight:500; }
.reasoning-option small { display:block; font-size:13px; line-height:1.5; margin-top:3px; color:var(--ui-muted); }
.reasoning-option .ui-icon { color:var(--inf-action); width:16px; height:16px; }
.reasoning-option[aria-selected=false] .ui-icon { visibility:hidden; }
.reasoning-menu-note { font-size:13px; padding:10px; color:var(--ui-muted); border-top:1px solid var(--line); margin-top:6px; line-height:1.6; }
.composer-info { width:320px; padding:20px; font-size:14px; line-height:1.75; }
.composer-info strong { font-weight:600; font-size:15px; }
.composer-info p { margin-top:10px; color:var(--ui-muted); }
.ui-tooltip { position:fixed; inset:auto; margin:0; padding:7px 10px; max-width:240px; border:0; border-radius:var(--inf-radius-sm); color:var(--white); background:var(--inf-neutral-800); font:13px/1.5 var(--ui-font); pointer-events:none; box-shadow:var(--inf-shadow-neutral-sm); }
.attachment-list { flex-wrap:nowrap; overflow-x:auto; padding:12px 12px 0; scrollbar-width:thin; }
.attachment-chip { flex:0 0 auto; max-width:250px; padding:8px; border-radius:var(--inf-radius-md); gap:10px; background:var(--white); border-color:var(--ui-border); }
.attachment-chip strong { font-size:14px; max-width:144px; }
.attachment-chip small { max-width:150px; font-size:12px; line-height:1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.attachment-chip img { width:36px; height:36px; border-radius:var(--inf-radius-sm); }
.file-glyph { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:var(--inf-radius-sm); background:var(--ui-surface-hover); color:var(--ui-muted); flex-shrink:0; }
.file-glyph .ui-icon { width:20px; height:20px; }
.attachment-chip button { height:28px; width:28px; border-radius:var(--inf-radius-pill); display:grid; place-items:center; padding:6px; flex-shrink:0; }
.attachment-chip button:hover { background:var(--ui-surface-selected); color:var(--ink); }
.attachment-chip button .ui-icon { width:14px; height:14px; }
.attachment-chip.has-error { background:var(--inf-functional-danger-subtle); }
.attachment-chip[data-uploading=true] .file-glyph .ui-icon { animation:thinking-pulse 1.4s ease-in-out infinite; }
.message-attachments { margin-top:-16px; margin-bottom:0; }
.message-attachment { font-size:14px; padding:8px 12px; gap:10px; border-radius:var(--inf-radius-md); background:var(--white); }
.message-attachment:hover { border-color:var(--inf-neutral-300); background:var(--ui-surface-subtle); }
.source-links { font-size:14px; gap:8px; margin-top:16px; }
.source-links a { border-radius:var(--inf-radius-pill); padding:6px 10px; font-size:13px; }
.source-links small { display:grid; place-items:center; min-width:16px; height:16px; border-radius:50%; background:var(--white); font-size:12px; }
.trace-sidebar { padding:0 16px 16px; }
.trace-sidebar .heading-with-dot { gap:2px; }
#run-status { font-size:12px; padding:4px 8px; }
.trace-run-heading label { font-size:13px; }
.trace-run-picker { margin-bottom:12px; }
#trace-run-select { font-size:14px; border-color:var(--ui-border); height:44px; }
.trace-context { font-size:12px; line-height:1.5; margin-top:8px; }
.route-path-heading h3 { font-size:14px; }
.route-path-heading>span { font-size:12px; }
.trace-sidebar .node-title { font-size:14px; }
.trace-sidebar .node-value { font-size:13px; }
.trace-sidebar .node-meta .mono, .route-step-state { font-size:12px; }
.trace-sidebar .route-step-index { width:32px; height:32px; font-size:12px; }
.trace-sidebar .route-node { min-height:60px; padding:8px; gap:10px; }
.trace-sidebar .route-node.selected { background:var(--ui-surface-selected); box-shadow:inset 2px 0 var(--inf-action); }
.trace-sidebar .route-node:not(.selected):hover { background:var(--ui-surface-subtle); }
.execution-node { padding:12px; }
.execution-node strong { font-size:14px; }
.execution-node small { font-size:12px; }
.trace-sidebar .inspector-heading { padding-top:16px; }
.trace-sidebar .inspector-tabs { display:flex; overflow-x:auto; scrollbar-width:thin; gap:8px; justify-content:space-between; margin-bottom:16px; }
.trace-sidebar .inspector-tabs button { padding:12px 2px; flex-shrink:0; font-size:13px; }
.trace-sidebar .inspector-content { scrollbar-width:thin; overscroll-behavior:contain; }
.trace-sidebar .empty-decision { padding:32px 8px; font-size:15px; line-height:1.8; }
.empty-decision p { font-size:14px; }
.audit-section>summary, .audit-facts>div, .audit-note, .audit-prompt, .decision-steps p, .decision-steps strong { font-size:14px; }
.audit-section { margin-top:20px; padding-top:16px; }
.audit-stamp, .decision-eyebrow, .decision-eyebrow>span { font-size:12px; }
.audit-code, .audit-table, .audit-table th, .audit-table td small { font-size:13px; }
.check-title strong, .quant-grid dt, .quant-grid small, .decision-result>p, .candidate-description, .check-state { font-size:13px; }
.decision-result { padding:16px; border-radius:var(--inf-radius-md); }
.decision-result h4 { font-size:16px; }
.trace-sidebar .flow-meta .mono, .trace-sidebar .flow-meta .muted { font-size:12px; }
.dialog-header { align-items:flex-start; }
.dialog-header h2 { font-size:20px; letter-spacing:-.4px; }
.dialog-header .icon-button { width:32px; height:32px; }
dialog { border-color:var(--line); border-radius:var(--inf-radius-lg); box-shadow:var(--inf-shadow-neutral-md); }
dialog::backdrop { background:rgb(22 24 28 / 28%); backdrop-filter:blur(3px); }
#models-dialog { max-width:560px; padding:24px; }
#models-dialog .dialog-header { margin-bottom:24px; }
#model-dialog-note { font-size:14px; margin-top:8px; }
.model-search-field { position:relative; margin-bottom:12px; }
.model-search-field>span { position:absolute; left:14px; top:13px; color:var(--ui-muted); }
.model-search-field .ui-icon { width:18px; height:18px; }
#model-search { padding:12px 14px 12px 42px; margin:0; font-size:16px; height:44px; border-color:var(--ui-border); }
.models-list { display:grid; gap:4px; margin:0 -8px; padding:4px 8px; }
.model-option { padding:14px 12px; border-radius:var(--inf-radius-md); min-height:76px; border:1px solid transparent; }
.model-option.selected { background:var(--ui-surface-subtle); border-color:var(--line); }
.model-option strong { font-size:16px; }
.model-option small { font-size:13px; margin-top:6px; }
.model-option-meta { font-size:13px; gap:10px; }
.model-option-meta .ui-icon { color:var(--inf-action); width:18px; height:18px; }
#model-results-count { font-size:13px; padding-top:16px; margin-top:16px; }
.alternate-view { padding:32px; border-radius:var(--inf-radius-lg); }
.view-heading h2 { font-size:24px; letter-spacing:-.5px; }
.view-heading p { font-size:15px; margin-top:10px; }
.history-row { padding:20px 0; gap:16px; }
.history-row h3 { font-size:16px; }
.history-row p { font-size:14px; }
.history-row .small { font-size:14px; }
#catalog-content th, #catalog-content td { font-size:14px; padding:16px; }
#catalog-content td small { font-size:13px; margin-top:6px; }
.toast { font-size:15px; border-radius:var(--inf-radius-md); padding:12px 20px; max-width:min(540px,calc(100vw - 32px)); line-height:1.6; }
.panel-backdrop { position:fixed; inset:0; width:100%; height:100%; border:0; border-radius:0; background:rgb(22 24 28 / 24%); z-index:30; cursor:default; }
.modal-panel { z-index:31!important; }
@container (max-width:500px) {
  .chat-header { padding-inline:16px; }
  .chat-scroll { padding-inline:18px; }
  .composer-region { padding-inline:16px; }
  .chat-welcome h1 { font-size:30px; letter-spacing:-.9px; }
  .chat-presets { gap:8px; }
  .chat-presets button { padding:12px; font-size:13px; }
  .preset-arrow { display:none!important; }
  .keyboard-hint { display:none; }
  .model-picker-button { font-size:16px; }
}
@media(min-width:1600px) {
  :root { --ui-sidebar:288px; --ui-trace:424px; }
  .chat-header { padding-inline:32px; }
  .assistant-content { font-size:17px; }
}
@media(max-width:1150px) {
  .chat-layout, .chat-layout:not(.settings-hidden), .chat-layout.settings-hidden { grid-template-columns:minmax(320px,1fr) var(--ui-trace); }
  .chat-layout.trace-hidden { grid-template-columns:1fr; }
  .chat-layout.trace-wide, .chat-layout.settings-hidden.trace-wide { grid-template-columns:minmax(320px,1fr) 500px; }
  .settings-panel, .chat-layout.trace-wide .settings-panel { position:fixed; width:300px; left:12px; top:12px; bottom:12px; border:1px solid var(--line); border-radius:var(--inf-radius-lg); box-shadow:var(--inf-shadow-neutral-md); z-index:31; }
}
@media(max-width:880px) {
  .chat-layout, .chat-layout:not(.settings-hidden), .chat-layout.settings-hidden, .chat-layout.trace-wide, .chat-layout.settings-hidden.trace-wide { grid-template-columns:minmax(0,1fr); }
  .trace-sidebar, .trace-wide .trace-sidebar { position:fixed; width:400px; max-width:calc(100vw - 24px); right:12px; top:12px; bottom:12px; border:1px solid var(--line); border-radius:var(--inf-radius-lg); box-shadow:var(--inf-shadow-neutral-md); z-index:31; }
}
@media(max-width:880px) {
  .topbar { height:108px; padding:12px 16px 8px; gap:8px; flex-wrap:wrap; }
  .brand { gap:10px; font-size:15px; }
  .brand img { width:82px; }
  .topnav { position:static; order:3; width:100%; justify-content:center; padding:0; background:transparent; }
  .nav-link { flex:1; justify-content:center; height:36px; padding:6px 8px; font-size:13px; gap:6px; }
  .nav-link.active { box-shadow:none; background:var(--ui-surface-selected); }
  .header-status { gap:4px; margin-left:auto; }
  #language-select { width:83px; height:32px; font-size:13px; padding:4px 18px 4px 8px; }
  #guide-button { width:28px; height:32px; padding:6px; }
  #guide-button .ui-icon { width:16px; height:16px; }
  .chat-app { padding:0; }
  .chat-layout, .chat-layout:not(.settings-hidden) { height:calc(100dvh - 108px); min-height:320px; border:0; border-radius:0; box-shadow:none; }
  .chat-header { height:80px; min-height:80px; gap:8px; padding:12px 16px; }
  .chat-model { width:auto; }
  .model-picker-button { font-size:16px; }
  #models-meta { font-size:12px; }
  .chat-header-actions { padding-left:6px; gap:0; }
  .chat-header-actions .small { width:36px; height:40px; padding:8px; }
  .chat-header-actions .ui-icon { width:18px; height:18px; }
  .chat-scroll { padding:24px 16px 16px; scrollbar-gutter:auto; }
  .chat-welcome { min-height:240px; padding:0 0 20px; }
  .welcome-symbol { width:32px; margin-bottom:20px; }
  .chat-welcome h1 { font-size:30px; letter-spacing:-.9px; }
  .chat-welcome>p { font-size:14px; margin-top:12px; }
  .chat-presets { max-width:400px; gap:8px; margin-top:24px; }
  .chat-presets button { padding:12px; min-height:54px; font-size:13px; gap:8px; }
  .preset-icon .ui-icon { width:16px; height:16px; }
  .chat-turn { gap:24px; margin-bottom:32px; }
  .user-message { font-size:16px; padding:10px 14px; max-width:90%; }
  .assistant-content { font-size:17px; line-height:1.8; }
  .composer-region { padding:8px 12px max(8px,env(safe-area-inset-bottom)); }
  .composer #prompt { font-size:17px; padding:14px 16px 8px; }
  .composer-toolbar { padding:4px 8px 8px; gap:4px; }
  .composer-tools { gap:0!important; }
  .composer-action { min-height:44px; height:44px; font-size:14px; gap:6px; padding:0 10px; }
  #attach-button { width:40px; height:44px; }
  .composer-action .ui-icon { width:18px; height:18px; }
  #run-button, #stop-button { min-width:44px; width:44px; height:44px; min-height:44px; }
  .composer-note { min-height:20px; font-size:12px; margin-top:6px; }
  .keyboard-hint { display:none; }
  #search-billing-note { font-size:12px; margin-top:6px; }
  .reasoning-option { min-height:54px; }
  .attachment-chip button { width:32px; height:36px; }
  .attachment-chip strong { max-width:124px; }
  .alternate-view { padding:24px 16px; border:0; border-radius:0; }
  .view-heading { align-items:flex-start; gap:16px; }
  .view-heading h2 { font-size:22px; }
  .view-heading p { font-size:14px; }
  .view-heading .secondary { font-size:13px; padding:8px 12px; white-space:nowrap; }
  #models-dialog { padding:20px; width:calc(100vw - 24px); }
  .model-option { padding:12px 8px; gap:8px; }
  .model-option strong { font-size:15px; }
  .model-option-meta { font-size:12px; gap:8px; }
  .model-option small { font-size:12px; }
  .trace-sidebar .panel-heading { height:56px; min-height:56px; }
  .trace-sidebar .route-node { min-height:60px; }
  .settings-panel { max-width:calc(100vw - 24px); }
}
@media(max-width:360px) {
  .brand-divider, .brand>span:last-child { display:none; }
  .chat-header { padding-inline:12px; }
  .chat-header-actions .small { width:32px; }
  .composer-action { padding-inline:8px; gap:4px; }
  #reasoning-button>span:last-child { display:none; }
  .chat-presets button { font-size:12px; }
}
@media(max-height:700px) and (min-width:881px) {
  .trace-sidebar { overflow-y:auto; }
  .trace-sidebar .inspector-content { flex:none; min-height:240px; overflow:visible; }
  .chat-welcome { min-height:220px; }
  .chat-presets { margin-top:20px; }
}
@media(prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}

.execution-chevron { transform:rotate(-90deg); width:14px; height:14px; color:var(--ui-muted); }
.flow-tool .ui-icon { width:16px; height:16px; display:inline-block; vertical-align:middle; margin-right:4px; }

/* Keep the audit tabs below their sticky heading, in either locale. */
.trace-sidebar .inspector-tabs { top:60px; }
html[lang=en] .chat-header { flex-wrap:nowrap; }
html[lang=en] .trace-sidebar .node-title { font-size:14px; }
html[lang=en] .trace-sidebar .node-state-label { font-size:12px; }
html[lang=en] .settings-panel .field label { font-size:14px; }
@media(max-width:880px) { .trace-sidebar .inspector-tabs { top:56px; } }

/* Typography and restrained surfaces apply equally to settings, history and audit. */
.panel-heading h2, .trace-sidebar .panel-heading h2 { font-size:16px; font-weight:600; letter-spacing:-.2px; }
.configuration-title h3 { font-size:15px; letter-spacing:-.1px; }
:where(.settings-subheading,.field-note,.range-labels,.settings-footnote,.composer-note,.answer-muted,.empty-decision p) { color:var(--ui-muted); }
.settings-panel .field label { font-weight:500; }
.settings-panel .field-note { line-height:1.6; }
.settings-panel :is(input,select,textarea) { color:var(--ui-text); background-color:var(--ui-surface); }
.settings-panel .strategy-group { background:var(--ui-surface-selected); }
.settings-panel .strategy.active { background:var(--ui-surface); color:var(--ui-text); font-weight:500; }
.routing-library-link { background:var(--ui-surface); border-color:var(--line); }
.routing-library-link:hover { background:var(--ui-surface-hover); border-color:var(--ui-border); }
#routing-library-count { color:var(--ui-muted); }
.quiet, .icon-button { color:var(--ui-muted); }
.quiet:hover:not(:disabled), .icon-button:hover:not(:disabled) { color:var(--ui-text); background:var(--ui-surface-hover); }
.composer-action { color:var(--ui-secondary); font-weight:500; }
#reasoning-button[data-custom=true], .search-toggle[aria-pressed=true] { background:var(--ui-accent-subtle); color:var(--inf-action); }
#models-meta, .trace-context, .trace-run-heading label { color:var(--ui-muted); }
#models-meta, #composer-status, .chat-performance { font-variant-numeric:tabular-nums; }
#composer-status { font-size:13px; }
.chat-metric>span, .chat-metric small, .metric-source, .answer-actions>.muted { font-size:13px; color:var(--ui-muted); }
.chat-metric strong { font-family:var(--ui-font-mono); font-size:14px; font-weight:500; }
.chat-presets button { font-size:15px; color:var(--ui-secondary); background:var(--ui-surface); }
.chat-presets .preset-icon, .preset-arrow .ui-icon { color:var(--ui-muted); }
.chat-presets button:hover .preset-icon { color:var(--inf-action); }
.user-message { background:var(--ui-surface-hover); border-color:transparent; color:var(--ui-text); }
.assistant-content :is(h1,h2,h3,h4,h5,h6) { font-family:var(--ui-font); color:var(--ui-text); letter-spacing:-.02em; }
.assistant-content strong { font-weight:600; }
.assistant-content code { background:var(--ui-surface-hover); color:var(--ui-secondary); }
.markdown-code, .markdown-table { background:var(--ui-surface); border-color:var(--line); }
.markdown-code-toolbar, .markdown-table th { background:var(--ui-surface-subtle); color:var(--ui-secondary); }
.markdown-table tbody tr:nth-child(even) { background:var(--ui-surface-subtle); }
.assistant-content blockquote { background:var(--ui-surface-subtle); border-left-color:var(--ui-border); color:var(--ui-secondary); }
.source-links a { background:var(--ui-surface-subtle); border-color:var(--line); color:var(--ui-secondary); }
.source-links a:hover { color:var(--inf-action); }
.badge.neutral { background:var(--ui-surface-hover); color:var(--ui-muted); }
.trace-sidebar .route-step-index { color:var(--ui-muted); border-color:var(--line); background:var(--ui-surface); font-family:var(--ui-font-mono); }
.trace-sidebar .executed .route-step-index { color:var(--ui-text); background:var(--ui-surface-hover); border-color:var(--line); }
.trace-sidebar .route-node.selected .route-step-index { color:var(--inf-action); background:var(--ui-surface); border-color:var(--ui-accent-border); }
.trace-sidebar .node-state-label, .trace-sidebar .executed .node-state-label { color:var(--ui-muted); }
.trace-sidebar .executed .node-state-label::before { content:''; display:inline-block; width:4px; height:4px; border-radius:50%; background:var(--inf-success); margin-right:4px; vertical-align:2px; }
.trace-sidebar .blocked .node-state-label::before { background:var(--inf-danger); }
.trace-sidebar .route-step-group::after { color:var(--ui-muted); }
.trace-sidebar .node-value, .execution-node small { color:var(--ui-muted); }
.execution-node { background:var(--ui-surface-subtle); border-color:var(--line); }
.execution-node.selected { background:var(--ui-surface-subtle); border-color:var(--ui-accent-border); }
.decision-result { background:var(--ui-surface-subtle); border-color:var(--line); }
.decision-result h4 { font-weight:600; color:var(--ui-text); }
.decision-eyebrow { color:var(--ui-secondary); font-weight:500; }
.audit-prompt, .audit-code, .check-row, .audit-verification, .audit-table th, .decision-calculation { background:var(--ui-surface-subtle); border-color:var(--line); }
.quant-grid>div, .audit-table .audit-total td { background:var(--ui-surface); }
.quant-grid dd { font-family:var(--ui-font-mono); font-size:15px; }
.rule-chips span, .check-state.unknown, .catalog-filter-counts span { background:var(--ui-surface-hover); }
.metrics-shortcut { color:var(--ui-secondary); background:var(--ui-surface-hover); }
.metrics-shortcut:hover { color:var(--inf-action); background:var(--ui-surface-selected); }
.inspector-tabs button { color:var(--ui-muted); }
.inspector-tabs button.active { color:var(--inf-action); }
#catalog-content th { background:var(--ui-surface-subtle); color:var(--ui-muted); font-weight:500; }
#catalog-content tbody tr:hover, .history-row:hover { background:var(--ui-surface-subtle); }
:is(#catalog-search,#library-search,#library-group) { border-color:var(--ui-border); }
.library-card, .library-toolbar { background:var(--ui-surface); }
.library-card blockquote, .library-tabs { background:var(--ui-surface-subtle); }
.library-card h3 { color:var(--ui-text); }
.library-tabs button.active { background:var(--ui-surface); color:var(--ui-text); }
.library-card p, .library-footnote, .library-example { color:var(--ui-muted); }
@container (max-width:500px) { .chat-presets button { font-size:14px; } }
@media(max-width:880px) {
  .chat-presets button { font-size:14px; }
  .panel-heading h2, .trace-sidebar .panel-heading h2 { font-size:15px; }
}
@media(max-width:360px) { .chat-presets button { font-size:13px; } }

/* Reading density: labels and prose stay legible; only units and IDs use captions. */
.settings-panel .panel-heading h2, .trace-sidebar .panel-heading h2 { font-size:16px; }
.settings-panel .field label, html[lang=en] .settings-panel .field label { color:var(--ui-text); font-size:14px; }
.settings-panel .field label>span { font-size:12px; color:var(--ui-muted); }
.settings-panel .strategy { font-size:14px; }
.settings-panel input::placeholder, .settings-panel textarea::placeholder, #model-search::placeholder, #catalog-search::placeholder { opacity:1; color:var(--ui-muted); }
.chat-header-actions .small { color:var(--ui-secondary); }
.chat-header-actions .active { background:var(--ui-surface-selected); color:var(--ui-text); }
#models-meta { font-size:13px; }
.chat-model .model-picker-button { font-size:17px; font-weight:600; }
.composer-tools { flex-wrap:wrap; }
.composer-toolbar { align-items:flex-end; }
.composer-tools .ui-icon { width:20px; height:20px; }
.composer-hints { flex-shrink:0; }
.composer-note { flex-wrap:wrap; row-gap:4px; }
.composer-state { flex:1; }
#composer-status { font-size:12px; }
#composer-info-button { width:28px; height:28px; padding:6px; }
#composer-info-button .ui-icon { width:16px; height:16px; }
.keyboard-hint, .keyboard-hint kbd { font-size:12px; }
.chat-metric strong { font-size:14px; font-weight:500; color:var(--ui-text); }
.chat-metric>span, .metric-source, .chat-metric small { font-size:12px; }
.assistant-content .chat-code code { font-size:14px; }
.markdown-table table { font-size:14px; }
.trace-run-heading { flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:10px; }
.trace-run-heading label { font-size:14px; color:var(--ui-text); font-weight:500; }
#run-status { font-size:12px; margin-left:auto; padding:4px 10px; }
#trace-latest { font-size:13px; padding:6px 8px; }
#trace-prompt { font-size:13px; color:var(--ui-muted); }
.trace-context { font-size:12px; }
.route-path-heading { gap:8px; flex-wrap:wrap; padding-block:4px 12px; }
.route-path-heading h3 { font-size:14px; color:var(--ui-text); }
.route-path-heading>span { font-size:12px; }
.trace-sidebar .route-node { grid-template-columns:32px minmax(0,1fr) auto; }
.trace-sidebar .node-title, html[lang=en] .trace-sidebar .node-title { font-size:14px; font-weight:600; }
.trace-sidebar .node-value { font-size:13px; line-height:1.5; }
.trace-sidebar .node-state-label, html[lang=en] .trace-sidebar .node-state-label { font-size:12px; }
.trace-sidebar .node-title small { font-size:12px; }
.trace-sidebar .node-meta .mono { font-size:12px; color:var(--ui-muted); }
.trace-sidebar .route-node.selected { background:var(--ui-accent-subtle); box-shadow:inset 3px 0 var(--inf-action); }
.trace-sidebar .flow-meta :is(.mono,.muted) { font-size:12px; color:var(--ui-muted); }
.trace-sidebar .flow-meta { flex-wrap:wrap; gap:4px 12px; }
.trace-sidebar .flow-tool { padding:6px 0; font-size:12px; line-height:1.5; }
.trace-sidebar .inspector-title { font-size:16px; }
.trace-sidebar .inspector-kicker, .trace-sidebar #follow-execution { font-size:12px; }
.trace-sidebar .empty-decision, .trace-sidebar .empty-decision p { font-size:14px; line-height:1.75; color:var(--ui-secondary); }
.trace-sidebar .empty-decision { padding-block:28px; }
.audit-section>summary, .audit-section-body, .audit-facts>div, .audit-note, .audit-prompt, .decision-steps p, .decision-steps strong { font-size:14px; }
.audit-code, .audit-table, .audit-table th, .audit-table td small { font-size:13px; }
.audit-stamp, .decision-eyebrow, .decision-eyebrow>span, .evidence-ref, .trace-sidebar .audit-verification>span { font-size:12px; }
.audit-verification { flex-wrap:wrap; }
.audit-verification button { font-size:13px; }
.decision-evidence h4, .decision-quantification h4, .filter-summary h4 { font-size:15px; }
.decision-result h4 { font-size:17px; }
.decision-result>p, .quant-grid dt, .quant-grid small, .check-title strong, .candidate-description, .check-state { font-size:13px; }
.quant-grid dd { font-size:16px; }
.check-row dl>div, .check-row code, .rule-chips span, .candidate-measurements, .constraint-meter p, .evidence-note { font-size:12px; }
.decision-calculation>p, .trace-sidebar .candidate-top, .trace-sidebar .candidate-reasons, .metrics-shortcut, .audit-plan { font-size:14px; }
.constraint-meter strong, .constraint-meter span, .filter-reason { font-size:13px; }
.trace-sidebar .candidate-name { color:var(--ui-text); }
.library-card p, .library-card blockquote, .library-card li, .library-example, .library-rules>div { font-size:14px; line-height:1.65; }
.library-card h3 { font-size:17px; }
.library-footnote, .library-card .muted, #library-count, .library-card small, .library-card dl>div, .library-skills>div { font-size:13px; }
.library-tabs button, .library-filters :is(input,select) { font-size:14px; }
.guide-steps strong { font-size:16px; }
.guide-steps p, .guide-note { font-size:14px; line-height:1.7; }
@media(max-width:880px) {
  .nav-link { font-size:13px; padding-inline:6px; gap:6px; }
  #language-select { width:96px; font-size:13px; }
  .chat-model .model-picker-button { font-size:16px; }
  #models-meta { font-size:12px; }
  .chat-header-actions .small { width:36px; height:44px; }
  .chat-header-actions .ui-icon { width:20px; height:20px; }
  .chat-presets button { font-size:14px; line-height:1.45; min-height:64px; }
  .composer-action { font-size:14px; padding-inline:10px; }
  .settings-panel, .chat-layout.trace-wide .settings-panel { width:320px; }
  .trace-sidebar .panel-heading h2 { font-size:16px; }
  .trace-sidebar .panel-heading .heading-with-dot { gap:2px; }
  #close-trace, #export-button, #expand-trace { width:32px; }
}
@media(max-width:360px) {
  .topnav .ui-icon { display:none; }
  .nav-link { padding-inline:6px; }
  .chat-model .model-picker-button { font-size:15px; }
  .chat-header { gap:4px; }
  .chat-header-actions { padding-left:4px; }
  .chat-header-actions .small { width:32px; }
  .composer-tools { gap:4px!important; }
  .composer-action { font-size:14px; padding-inline:8px; }
  #attach-button { width:36px; }
  .chat-presets button { font-size:13px; padding:10px; }
  .chat-presets .preset-icon { display:none; }
  .trace-sidebar .panel-heading h2 { font-size:15px; }
  #close-trace, #export-button, #expand-trace { width:28px; }
}

/* History actions share the workspace's type scale, tokens and pill controls. */
.chat-app .history-row { grid-template-columns:minmax(180px,1fr) minmax(120px,230px) 100px auto; padding:20px 12px; }
.history-summary,.history-model { min-width:0; }
.history-model { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }
.chat-app .history-row .history-actions { display:flex; align-items:center; gap:12px; grid-column:auto; }
.history-actions .quiet { color:var(--inf-brand); white-space:nowrap; }
.history-actions .icon-button { flex-shrink:0; width:40px; height:40px; border-radius:var(--inf-radius-pill,999px); }
.history-delete-action { color:var(--muted); }
.history-delete-action:hover:not(:disabled) { color:var(--inf-danger); background:var(--inf-functional-danger-subtle); }
#delete-history-dialog { max-width:460px; padding:28px; }
#delete-history-dialog h2 { font-size:21px; line-height:1.3; letter-spacing:-.4px; }
#delete-history-description { margin-top:14px; color:var(--muted); font-size:15px; line-height:1.7; }
#delete-history-preview { margin-top:18px; padding:12px 16px; border:1px solid var(--line); border-radius:var(--inf-radius-sm,8px); background:var(--ui-surface-subtle); font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#delete-history-error { margin-top:14px; color:var(--inf-danger); font-size:14px; line-height:1.6; }
#delete-history-error:empty { display:none; }
.history-dialog-actions { display:flex; justify-content:flex-end; gap:12px; margin-top:26px; }
#confirm-delete-history { background:var(--inf-danger-fill); border-color:var(--inf-danger-fill); color:var(--white); }
#confirm-delete-history:hover:not(:disabled) { filter:brightness(.92); }
@media(max-width:720px) {
  .chat-app .history-row { grid-template-columns:minmax(0,1fr) auto; gap:12px; padding:16px 0; }
  .chat-app .history-row .history-summary { grid-column:1/-1; }
  .history-model { grid-column:1; }
  .history-row>.badge { grid-column:1; }
  .chat-app .history-row .history-actions { grid-column:2; grid-row:2/4; }
  #delete-history-dialog { padding:24px; }
  .history-dialog-actions { flex-wrap:wrap; }
}