/* Product interface layer. Legacy component rules live in style.css; new work uses these tokens. */
:root {
  color-scheme: light;
  --ui-canvas: #f2f6f9;
  --ui-surface: #ffffff;
  --ui-surface-soft: #f7fafc;
  --ui-surface-hover: #eaf3f8;
  --ui-border: #dbe5ec;
  --ui-text: #172a3a;
  --ui-muted: #607484;
  --ui-subtle: #8295a4;
  --ui-accent: #087f98;
  --ui-accent-hover: #086c83;
  --ui-accent-soft: #e2f4f8;
  --ui-accent-ink: #08657b;
  --ui-success: #16806b;
  --ui-danger: #b44c57;
  --ui-shadow: 0 10px 30px #173d5610;
  --sidebar-width: 248px;
  --sidebar-surface: #fafdff;
  --sidebar-surface-raised: var(--ui-surface);
  --sidebar-line: var(--ui-border);
  --sidebar-ink: var(--ui-text);
  --sidebar-muted: var(--ui-muted);
  --sidebar-hover: var(--ui-surface-hover);
  --sidebar-accent: var(--ui-accent);
  --sidebar-focus: var(--ui-accent);
  --canvas: var(--ui-canvas);
  --surface: var(--ui-surface);
  --surface-soft: var(--ui-surface-soft);
  --line: var(--ui-border);
  --ink: var(--ui-text);
  --ink-muted: var(--ui-muted);
  --accent: var(--ui-accent);
  --brand: var(--ui-accent);
}

body.theme-dark {
  color-scheme: dark;
  --ui-canvas: #0b121c;
  --ui-surface: #111e2a;
  --ui-surface-soft: #162634;
  --ui-surface-hover: #1d3443;
  --ui-border: #29404e;
  --ui-text: #e6f3f8;
  --ui-muted: #adbfcb;
  --ui-subtle: #8ca4b3;
  --ui-accent: #69d7e8;
  --ui-accent-hover: #8de5f1;
  --ui-accent-soft: #123b4b;
  --ui-accent-ink: #b1eff5;
  --ui-success: #64d8ae;
  --ui-danger: #f09ca2;
  --ui-shadow: 0 16px 36px #02070f55;
  --sidebar-surface: #0d1925;
  --sidebar-surface-raised: #172735;
  --sidebar-line: #283c4b;
  --sidebar-ink: var(--ui-text);
  --sidebar-muted: var(--ui-muted);
  --sidebar-hover: var(--ui-surface-hover);
  --sidebar-accent: var(--ui-accent);
  --sidebar-focus: var(--ui-accent);
}

body, body.theme-dark {
  background: var(--ui-canvas);
  color: var(--ui-text);
}
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(circle at 78% -15%, #56c1db16, transparent 42%);
}
body.theme-dark::before { background: radial-gradient(circle at 85% -10%, #0d89b329, transparent 46%); }

/* Shell and navigation */
.sidebar, body.theme-dark .sidebar {
  background: var(--sidebar-surface);
  border-color: var(--sidebar-line);
  padding-left: 16px;
  padding-right: 16px;
}
.sidebar .brand-mark {
  background: linear-gradient(145deg, #078aa2, #123e72);
  box-shadow: 0 7px 16px #05698135;
}
.sidebar .brand-wordmark, body.theme-dark .sidebar .brand-wordmark { color: var(--ui-text); }
.sidebar .brand small { color: var(--ui-subtle); }
.sidebar .workspace-chip, .tenant-button, body.theme-dark .tenant-button {
  background: var(--ui-surface);
  border-color: var(--ui-border);
  color: var(--ui-text);
}
.tenant-button:hover { background: var(--ui-surface-hover); border-color: var(--ui-accent); }
.tenant-avatar, body.theme-dark .tenant-avatar { background: var(--ui-accent-soft); color: var(--ui-accent-ink); border-color: var(--ui-border); }
.workspace-copy, body.theme-dark .workspace-copy { color: var(--ui-text); }
.workspace-copy small { color: var(--ui-subtle); }
.sidebar .nav-label, body.theme-dark .sidebar .nav-label { color: var(--ui-subtle); }
.sidebar .nav-item, body.theme-dark .sidebar .nav-item {
  color: var(--ui-muted);
  border-color: transparent;
  box-shadow: none;
}
.sidebar .nav-item .nav-icon { color: var(--ui-subtle); }
.sidebar .nav-item:hover, body.theme-dark .sidebar .nav-item:hover {
  background: var(--ui-surface-hover);
  color: var(--ui-text);
  border-color: transparent;
}
.sidebar .nav-item.selected, body.theme-dark .sidebar .nav-item.selected {
  background: var(--ui-accent-soft);
  color: var(--ui-accent-ink);
  border-color: transparent;
}
.sidebar .nav-item.selected .nav-icon, body.theme-dark .sidebar .nav-item.selected .nav-icon { color: var(--ui-accent); }
.sidebar .nav-copy { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; line-height: 1.2; }
.sidebar .nav-children { margin-top: 2px; color: var(--ui-subtle); font-size: 9px; font-weight: 400; white-space: nowrap; }
.sidebar .nav-item.selected .nav-children { color: var(--ui-accent-ink); opacity: .74; }
.sidebar .nav-item.selected::before, body.theme-dark .sidebar .nav-item.selected::before,
.sidebar .nav-indicator, .sidebar .nav-item.selected .nav-indicator { display: none !important; }
.sidebar .nav-group+.nav-group, body.theme-dark .sidebar .nav-group+.nav-group { border-color: var(--ui-border); }
.sidebar { padding-top: 16px; scrollbar-width: none; }
.sidebar::-webkit-scrollbar { display: none; }
.sidebar .sidebar-heading { padding-bottom: 16px; }
.sidebar .workspace-chip { margin-bottom: 14px; }
.sidebar nav { gap: 10px; }
.sidebar .nav-group+.nav-group { margin-top: 4px; padding-top: 10px; }
.sidebar-footer { padding-top: 8px; }
.sidebar-toggle, body.theme-dark .sidebar-toggle {
  background: var(--ui-surface);
  border-color: var(--ui-border);
  color: var(--ui-muted);
}
.sidebar-toggle:hover, body.theme-dark .sidebar-toggle:hover { background: var(--ui-accent-soft); color: var(--ui-accent-ink); }
#sidebar-toggle::after, .sidebar-compact .sidebar .nav-item::after { display: none; }
#navigation-hint { position: fixed; z-index: 100; padding: 7px 10px; border: 1px solid var(--ui-border); border-radius: 8px; background: var(--ui-text); color: var(--ui-surface); box-shadow: var(--ui-shadow); font-size: 11px; line-height: 1.3; white-space: nowrap; pointer-events: none; }
#navigation-hint[hidden] { display: none; }
/* The legacy compact nav rule targets every SVG; keep exactly one toggle glyph visible. */
.sidebar .sidebar-toggle .icon-expand { display: none; }
body.sidebar-compact .sidebar .sidebar-toggle .icon-collapse { display: none; }
body.sidebar-compact .sidebar .sidebar-toggle .icon-expand { display: block; }
.sidebar .privacy-note, body.theme-dark .sidebar .privacy-note { color: var(--ui-muted); border-color: var(--ui-border); }
.sidebar .privacy-note svg { color: var(--ui-accent); }
body.sidebar-compact { --sidebar-width: 72px; }

@media (min-width: 721px) {
  .sidebar-compact .sidebar, body.theme-dark.sidebar-compact .sidebar { padding-left: 16px; padding-right: 16px; }
  .sidebar-compact .sidebar-heading { padding-left: 4px; padding-right: 0; }
  .sidebar-compact .sidebar-toggle { width: 32px; height: 32px; margin-left: 0; }
  .sidebar-compact .sidebar nav { gap: 12px; }
  .sidebar-compact .sidebar .nav-group { gap: 5px; }
  .sidebar-compact .sidebar .nav-group+.nav-group { margin-top: 0; padding-top: 0; border: 0; }
  .sidebar-compact .sidebar .nav-label { height: 14px; margin: 0 0 7px; visibility: hidden; }
  .sidebar-compact .sidebar .nav-item { width: 40px; height: 40px; min-height: 40px; padding: 10px 12px; justify-content: flex-start; }
  .sidebar-compact .sidebar .nav-item .nav-icon { width: 16px; height: 20px; }
  .sidebar-compact .sidebar .nav-copy { display: none; }
  .sidebar-compact .workspace-chip { padding: 0; background: transparent; border: 0; }
  .sidebar-compact .tenant-button { width: 40px; height: 42px; min-height: 42px; padding: 6px; background: var(--ui-surface); border: 1px solid var(--ui-border); }
  .sidebar-compact .tenant-button .tenant-avatar { display: none; }
  .sidebar-compact .tenant-button .tenant-compact-icon { display: block; width: 20px; height: 20px; color: var(--ui-accent); }
  .sidebar-compact .tenant-button { position: relative; justify-content: center; }
  .sidebar-compact .tenant-button::after { content: '⌄'; position: absolute; right: 1px; bottom: 0; width: 11px; height: 12px; border-radius: 4px; background: var(--ui-accent-soft); color: var(--ui-accent-ink); font-size: 12px; line-height: 9px; text-align: center; }
  .sidebar-compact .tenant-button:disabled::after { display: none; }
  .sidebar-compact .tenant-button:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 2px; }
  .sidebar-compact .tenant-button .tenant-caret { display: none; }
  .sidebar-compact .sidebar-footer { display: none; }
}
.provider-live { margin-left: auto; color: var(--ui-subtle); font-size: 10px; white-space: nowrap; }
.tenant-compact-icon { display: none; }
.tenant-popover { z-index: 90; min-width: 232px; padding: 8px; border-radius: 12px; box-shadow: 0 18px 50px #071f3440; }
.tenant-popover[hidden] { display: none; }
.tenant-popover-label { padding: 8px 10px; font-size: 11px; font-weight: 650; letter-spacing: .04em; color: var(--ui-muted); }
.tenant-popover button { padding: 10px; border-radius: 8px; color: var(--ui-text); font-size: 12px; }
.tenant-popover button.selected, .tenant-popover button[aria-checked="true"] { background: var(--ui-accent-soft); color: var(--ui-accent-ink); }
.tenant-popover button:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: -2px; }
@media (max-width: 720px) { .sidebar .nav-children { display: none; } .sidebar-compact .sidebar .nav-copy { display: flex; } .sidebar-compact .tenant-button::after { display: none; } .provider-live { margin-left: 0; } }

body>main>header, body.theme-dark>main>header,
body>main>footer, body.theme-dark>main>footer {
  background: var(--ui-surface);
  border-color: var(--ui-border);
  color: var(--ui-muted);
}
body>main>header, body.theme-dark>main>header { backdrop-filter: none; }
body:not(.app-ready) .sidebar .nav-item.selected { background: transparent; color: var(--ui-muted); font-weight: inherit; }
body:not(.app-ready) #breadcrumb { font-size: 0; }
body:not(.app-ready) #breadcrumb::after { content: '正在载入工作空间…'; font-size: 13px; font-weight: 500; color: var(--ui-muted); }
#breadcrumb, body.theme-dark #breadcrumb { color: var(--ui-text); }
#current-account, body.theme-dark #current-account { background: var(--ui-surface-soft); color: var(--ui-muted); }
#content { padding-top: 26px; }
.heading { margin-bottom: 18px; padding-bottom: 16px; border-color: var(--ui-border); }
.heading h1, body.theme-dark .heading h1, h2, body.theme-dark h2 { color: var(--ui-text); }
.eyebrow, body.theme-dark .eyebrow { color: var(--ui-accent); }
.heading p, p, .muted, body.theme-dark p, body.theme-dark .muted { color: var(--ui-muted); }
.page-tabs, body.theme-dark .page-tabs { border-color: var(--ui-border); margin-bottom: 18px; }
.page-tabs button, body.theme-dark .page-tabs button { color: var(--ui-muted); }
.page-tabs button.selected, body.theme-dark .page-tabs button.selected { color: var(--ui-accent-ink); border-bottom-color: var(--ui-accent); }

/* Shared surfaces and controls */
.panel, .card, .metric, .lab-main, .lab-settings,
body.theme-dark .panel, body.theme-dark .card, body.theme-dark .metric, body.theme-dark .lab-main, body.theme-dark .lab-settings {
  background: var(--ui-surface);
  border-color: var(--ui-border);
  box-shadow: var(--ui-shadow);
}
.panel { padding: 20px; }
.section-space { margin-top: 16px; }
.card:hover { border-color: var(--ui-accent); }
button, body.theme-dark button { background: var(--ui-surface); color: var(--ui-text); border-color: var(--ui-border); }
button:hover, body.theme-dark button:hover { background: var(--ui-surface-hover); border-color: var(--ui-accent); }
.primary, body.theme-dark .primary { background: #087f98; border-color: #087f98; color: #fff; }
.primary:hover, body.theme-dark .primary:hover { background: #086c83; border-color: #086c83; color: #fff; }
.subtle, body.theme-dark .subtle { background: transparent; border-color: transparent; color: var(--ui-muted); }
.subtle:hover, body.theme-dark .subtle:hover { background: var(--ui-surface-hover); color: var(--ui-text); }
input, select, textarea, body.theme-dark input, body.theme-dark select, body.theme-dark textarea {
  background: var(--ui-surface);
  color: var(--ui-text);
  border-color: var(--ui-border);
}
input::placeholder, textarea::placeholder, body.theme-dark input::placeholder, body.theme-dark textarea::placeholder { color: var(--ui-subtle); }
input:focus, select:focus, textarea:focus, body.theme-dark input:focus, body.theme-dark select:focus, body.theme-dark textarea:focus {
  border-color: var(--ui-accent);
  box-shadow: 0 0 0 3px #48bbd12c;
}
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline-color: var(--ui-accent); }
.filter-bar, .log-filters, .workflow-strip>div, .provider-health,
body.theme-dark .filter-bar, body.theme-dark .log-filters {
  background: var(--ui-surface);
  border-color: var(--ui-border);
}
.workflow-strip, .table-wrap, .provider-meta, body.theme-dark .table-wrap { border-color: var(--ui-border); }
body.theme-dark .workflow-strip span { color: var(--ui-text); }
body.theme-dark .workflow-strip small, body.theme-dark .provider-health small { color: var(--ui-muted); }
body.theme-dark .workflow-strip b { background: var(--ui-accent-soft); color: var(--ui-accent-ink); }
body.theme-dark .provider-meta span { background: var(--ui-surface-soft); color: var(--ui-muted); }
body.theme-dark .provider-rank { color: #456171; }
th, body.theme-dark th { background: var(--ui-surface-soft); color: var(--ui-muted); border-color: var(--ui-border); }
td, body.theme-dark td { color: var(--ui-text); border-color: var(--ui-border); }
td small { color: var(--ui-subtle); }
tbody tr:hover, body.theme-dark tbody tr:hover { background: var(--ui-surface-hover); }
.tag, body.theme-dark .tag { background: var(--ui-surface-soft); color: var(--ui-muted); border-color: var(--ui-border); }
.tag.green, body.theme-dark .tag.green { background: var(--ui-accent-soft); color: var(--ui-accent-ink); }
.info, body.theme-dark .info { background: var(--ui-accent-soft); border-color: var(--ui-border); border-left-color: var(--ui-accent); color: var(--ui-accent-ink); }
.empty, body.theme-dark .empty { background: var(--ui-surface-soft); border-color: var(--ui-border); color: var(--ui-muted); }
.hero, body.theme-dark .hero {
  background: radial-gradient(circle at 95% 0%, #50a8d34a, transparent 45%), linear-gradient(115deg, #102b4a, #0b647b);
  border-color: #2c7f9d;
}
.hero .eyebrow { color: #9be9f3; }
.hero p { color: #d3edf2; }
.hero .route-options button.selected { color: #12374a; background: #e5f8fb; border-color: #e5f8fb; }
pre, body.theme-dark pre { background: #102633; color: #d0f1f4; }
dialog, body.theme-dark dialog { background: var(--ui-surface); border-color: var(--ui-border); color: var(--ui-text); }
.dialog-actions, body.theme-dark .dialog-actions { background: var(--ui-surface); border-color: var(--ui-border); }
#global-search, body.theme-dark #global-search, #theme-toggle, body.theme-dark #theme-toggle {
  background: var(--ui-surface-soft);
  border-color: var(--ui-border);
  color: var(--ui-text);
}
#theme-toggle:hover { background: var(--ui-accent-soft); color: var(--ui-accent-ink); }
#theme-toggle, body.theme-dark #theme-toggle { flex: 0 0 36px; padding: 0; line-height: 1; }
#theme-toggle svg { width: 19px; height: 19px; display: block; margin: auto; }
.model-bulk { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin: 10px 0; }
.model-bulk[hidden] { display: none; }
.model-bulk button { min-height: 30px; padding: 5px 9px; font-size: 11px; }
.model-bulk span { margin-left: auto; color: var(--ui-muted); font-size: 11px; }
.model-results .model-choice { display: flex; align-items: flex-start; gap: 10px; padding: 9px 11px; border: 1px solid var(--ui-border); border-radius: 8px; background: var(--ui-surface); color: var(--ui-text); cursor: pointer; }
.model-results .model-choice:hover { background: var(--ui-surface-hover); }
.model-results .model-choice input { width: 16px; height: 16px; margin: 1px 0 0; flex: none; accent-color: var(--ui-accent); }
.model-results .model-choice span { min-width: 0; overflow-wrap: anywhere; line-height: 1.35; }
.model-results .model-choice small { display: block; margin-top: 2px; color: var(--ui-muted); }
.search-results, body.theme-dark .search-results, .tenant-popover, body.theme-dark .tenant-popover { background: var(--ui-surface); border-color: var(--ui-border); color: var(--ui-text); }
.search-results button:hover, .tenant-popover button:hover { background: var(--ui-surface-hover); }

/* Usage analytics */
#usage-content { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; min-width: 0; }
.usage-data-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.usage-data-actions h2 { margin: 0 0 5px; font-size: 16px; }
.usage-data-actions p { margin: 0; }
.usage-data-buttons { display: flex; flex-wrap: wrap; gap: 8px; flex-shrink: 0; }
@media (max-width: 760px) { .usage-data-actions { align-items: stretch; flex-direction: column; } .usage-data-buttons { flex-shrink: 1; } }
.usage-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.usage-metric {
  min-width: 0;
  padding: 18px 20px;
  background: var(--ui-surface);
  border: 1px solid var(--ui-border);
  border-radius: 12px;
  box-shadow: var(--ui-shadow);
}
.usage-metric>span { color: var(--ui-muted); font-size: 12px; }
.usage-metric strong { display: block; margin: 13px 0 6px; color: var(--ui-text); font-size: clamp(21px, 2vw, 29px); line-height: 1.15; letter-spacing: -.7px; }
.usage-metric small { display: block; color: var(--ui-subtle); font-size: 11px; overflow-wrap: anywhere; }
.usage-overview-grid { display: grid; grid-template-columns: minmax(0, 1fr) 276px; gap: 16px; min-width: 0; }
.usage-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.usage-section-head h2, .usage-health h2 { margin: 6px 0 4px; }
.usage-section-head p, .usage-health p, .usage-cost p { margin: 0; font-size: 11px; }
.usage-section-head>span, .usage-peak { color: var(--ui-muted); font-size: 11px; white-space: nowrap; }
.usage-trend { min-width: 0; }
.usage-chart { min-width: 0; margin-top: 12px; }
.usage-chart-svg { display: block; width: 100%; height: 156px; overflow: visible; }
.usage-baseline { stroke: var(--ui-border); stroke-width: 2; }
.usage-chart-bar { fill: var(--ui-accent); opacity: .8; transition: opacity .15s; }
.usage-chart-bar:hover { opacity: 1; }
.usage-chart-labels { display: flex; justify-content: space-between; gap: 8px; margin-top: 6px; }
.usage-chart-labels span { color: var(--ui-subtle); font-size: 10px; white-space: nowrap; }
.usage-daily-details { min-width: 0; margin-top: 13px; font-size: 11px; }
.usage-daily-details summary { width: max-content; cursor: pointer; color: var(--ui-accent-ink); }
.usage-daily-details .table-wrap { max-width: 100%; max-height: 270px; margin-top: 10px; overflow: auto; }
.usage-health-total { display: flex; align-items: baseline; gap: 7px; margin: 22px 0 14px; }
.usage-health-total strong { color: var(--ui-text); font-size: 31px; line-height: 1; }
.usage-health-total span { color: var(--ui-muted); font-size: 11px; }
.usage-health progress { width: 100%; height: 10px; appearance: none; border: 0; border-radius: 99px; overflow: hidden; background: #ecbac2; }
.usage-health progress::-webkit-progress-bar { background: #ecbac2; }
.usage-health progress::-webkit-progress-value { background: var(--ui-success); border-radius: 99px; }
.usage-health progress::-moz-progress-bar { background: var(--ui-success); }
.usage-health-legend { display: flex; justify-content: space-between; gap: 8px; margin: 13px 0 20px; color: var(--ui-muted); font-size: 11px; }
.usage-health-legend span { display: inline-flex; align-items: center; gap: 6px; }
.usage-health-legend i { width: 7px; height: 7px; border-radius: 50%; }
.usage-legend-success { background: var(--ui-success); }
.usage-legend-failure { background: var(--ui-danger); }
.usage-cost-list { display: flex; flex-wrap: wrap; gap: 10px; margin: 10px 0; }
.usage-cost-list>div { display: flex; align-items: baseline; gap: 14px; min-width: 170px; padding: 10px 13px; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-soft); }
.usage-cost-list span { color: var(--ui-muted); font-size: 11px; }
.usage-cost-list strong { color: var(--ui-text); font-size: 15px; }
.usage-empty { color: var(--ui-muted); font-size: 12px; }
.usage-models { min-width: 0; }
.usage-models .table-wrap { max-width: 100%; max-height: 430px; overflow: auto; }
.usage-models td strong { display: block; color: var(--ui-text); font-weight: 600; }
.usage-models td small { display: block; overflow-wrap: anywhere; }
.usage-search { margin: 0; min-width: 215px; }
.usage-search input { margin: 0; font-size: 12px; }
.usage-rate { color: var(--ui-success); font-weight: 650; }
.usage-rate-low { color: var(--ui-danger); }
.usage-disclaimer { color: var(--ui-subtle); font-size: 11px; line-height: 1.6; }
.usage-error { color: var(--ui-danger); }

/* Developer reference */
.api-doc-heading { margin-bottom: 14px; }
.api-quickbar { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 14px 18px; background: var(--ui-surface); border: 1px solid var(--ui-border); border-radius: 12px; box-shadow: var(--ui-shadow); }
.api-quickbar>div { display: grid; gap: 3px; min-width: 0; margin-right: auto; }
.api-quickbar small { color: var(--ui-subtle); font-size: 10px; font-weight: 700; letter-spacing: .12em; }
.api-quickbar code { overflow: hidden; color: var(--ui-text); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.api-quickbar button, .api-quickbar a { flex: none; min-height: 32px; padding: 7px 11px; border: 1px solid var(--ui-border); border-radius: 7px; background: var(--ui-surface-soft); color: var(--ui-accent-ink); font-size: 11px; text-decoration: none; }
.api-quickbar button:hover, .api-quickbar a:hover { background: var(--ui-accent-soft); }
.api-doc-nav { position: sticky; top: 66px; z-index: 2; flex-wrap: nowrap; gap: 3px; margin: 10px 0 18px; padding: 7px; overflow-x: auto; background: var(--ui-surface); border: 1px solid var(--ui-border); border-radius: 10px; box-shadow: var(--ui-shadow); scrollbar-width: thin; }
.api-doc-nav button { flex: none; padding: 7px 10px; border: 0; border-radius: 6px; background: transparent; color: var(--ui-muted); white-space: nowrap; }
.api-doc-nav button:hover, .api-doc-nav button[aria-current="true"] { background: var(--ui-accent-soft); color: var(--ui-accent-ink); }
.api-section { min-width: 0; scroll-margin-top: 132px; }
.api-section h2 { margin-top: 0; }
.api-section pre { background: #122439; color: #e7f4ff; border: 1px solid #29425e; border-radius: 8px; }
.api-section .code-toolbar, body.theme-dark .api-section .code-toolbar { background: var(--ui-surface-soft); border-color: var(--ui-border); color: var(--ui-muted); }
.api-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0 18px}.api-steps>div{padding:14px;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface-soft)}.api-steps b{display:block;margin-bottom:8px;color:var(--ui-accent-ink);font-size:11px;letter-spacing:.1em}.api-steps strong{display:block;color:var(--ui-text)}.api-steps p{margin:6px 0 0;color:var(--ui-muted);line-height:1.65}.api-snippet-head,.key-curl-title{display:flex;justify-content:space-between;align-items:center;gap:12px}.api-snippet-head{margin-top:14px}.api-snippet-head button,.key-curl-title button{flex:none}.api-client-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.api-client-grid article{min-width:0;padding:16px;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface-soft)}.api-client-grid h3{margin:0 0 10px;color:var(--ui-text)}.api-client-grid p{line-height:1.7}.api-client-grid pre{max-width:100%;white-space:pre;overflow:auto}.key-curl-panel pre{margin:12px 0;max-width:100%;overflow:auto;white-space:pre;background:#122439;color:#e7f4ff;border:1px solid #29425e;border-radius:8px}.key-curl-title h2{margin:0 0 5px}.key-curl-title p{margin:0}
.api-client-troubleshooting{margin-top:12px;padding:12px 14px;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface-soft)}.api-client-troubleshooting summary{cursor:pointer;font-weight:700;color:var(--ui-text)}.api-client-troubleshooting summary:focus-visible{outline:2px solid var(--ui-accent-ink);outline-offset:3px}.api-client-troubleshooting[open] summary{margin-bottom:10px}.api-client-troubleshooting p{margin:0 0 10px}.api-client-troubleshooting ol{margin:10px 0 0;padding-left:22px}.api-client-troubleshooting pre{margin:10px 0}
@media(max-width:900px){.api-client-grid{grid-template-columns:1fr}}@media(max-width:720px){.api-steps{grid-template-columns:1fr}.key-curl-title{align-items:flex-start;flex-direction:column}}
.api-endpoint-search { display: block; max-width: 420px; color: var(--ui-muted); font-size: 11px; }
.api-endpoint-search input { margin-top: 6px; }
.api-endpoint-count { margin: 8px 0; color: var(--ui-subtle); font-size: 11px; }
.api-section tr[hidden] { display: none; }

/* Routing planner */
.routing-preview .panel-title { margin-bottom: 14px; }
.routing-preview .panel-title p { margin: 5px 0 0; color: var(--ui-muted); font-size: 12px; }
.routing-preview-controls { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(130px, .7fr) minmax(200px, 1.5fr) auto; align-items: end; gap: 10px; }
.routing-preview-controls label { min-width: 0; font-size: 11px; color: var(--ui-muted); }
.routing-preview-controls input, .routing-preview-controls select { margin: 6px 0 0; }
.routing-preview-controls button { min-height: 40px; white-space: nowrap; }
#route-preview-result { min-width: 0; margin-top: 16px; }
.routing-preview-summary { margin: 0 0 10px; color: var(--ui-muted); font-size: 11px; }
.routing-preview-over-budget { opacity: .55; }
.routing-preview-excluded { margin-top: 12px; color: var(--ui-muted); font-size: 11px; }
.routing-preview-excluded summary { cursor: pointer; color: var(--ui-accent-ink); }
.routing-preview-excluded p { margin: 7px 0; overflow-wrap: anywhere; }

/* Model lab conversation */
.lab-session-summary, body.theme-dark .lab-session-summary {
  max-width: none;
  margin-bottom: 12px;
  background: var(--ui-surface);
  border-color: var(--ui-border);
  box-shadow: var(--ui-shadow);
}
.lab-nav-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--ui-border); margin-bottom: 14px; }
.lab-nav-row .page-tabs { flex: 1; margin: 0; border-bottom: 0; }
.lab-embedded-toolbar { flex: none; display: flex; align-items: center; gap: 8px; margin: 0; padding: 0; border: 0; }
.lab-embedded-toolbar button { min-height: 34px; padding: 7px 11px; }
.lab-embedded-toolbar .primary, body.theme-dark .lab-embedded-toolbar .primary { background: #087f98; border-color: #087f98; color: #fff; }
.lab-embedded-toolbar .primary:hover, body.theme-dark .lab-embedded-toolbar .primary:hover { background: #086c83; border-color: #086c83; }
.lab-session-summary>div, body.theme-dark .lab-session-summary>div { border-color: var(--ui-border); }
.lab-session-summary small { color: var(--ui-subtle); }
.lab-session-summary strong, body.theme-dark .lab-session-summary strong { color: var(--ui-text); }
.lab-layout { grid-template-columns: minmax(0, 1fr) 258px; gap: 14px; align-items: start; }
.lab-main { min-width: 0; align-self: start; }
.lab-toolbar, body.theme-dark .lab-toolbar { background: var(--ui-surface-soft); border-color: var(--ui-border); }
.lab-model-quick select, body.theme-dark .lab-model-quick select { background: var(--ui-surface); border-color: var(--ui-border); color: var(--ui-text); }
.lab-context-note { background: var(--ui-accent-soft); color: var(--ui-accent-ink); }
.lab-messages { flex: none; height: clamp(280px, 34dvh, 540px); padding: 20px 24px; background: var(--ui-surface); scrollbar-color: var(--ui-border) transparent; }
.lab-message, body.theme-dark .lab-message { border-color: var(--ui-border); }
.lab-message-avatar, body.theme-dark .lab-message-avatar, .lab-empty-icon, body.theme-dark .lab-empty-icon { background: var(--ui-accent-soft); color: var(--ui-accent-ink); border-color: var(--ui-border); }
.lab-message.user .lab-message-avatar { background: var(--ui-surface-soft); color: var(--ui-muted); }
.lab-speaker strong, body.theme-dark .lab-speaker strong, .lab-message strong { color: var(--ui-text); }
.lab-speaker small, body.theme-dark .lab-speaker small { color: var(--ui-subtle); }
.lab-answer, body.theme-dark .lab-answer, body.theme-dark .lab-message .lab-answer { color: var(--ui-text); }
.lab-message.user .lab-answer, body.theme-dark .lab-message.user .lab-answer { background: var(--ui-surface-soft); border-color: var(--ui-border); color: var(--ui-text); }
.lab-route-result, body.theme-dark .lab-route-result { background: var(--ui-accent-soft); border-color: var(--ui-border); }
.lab-route-result strong, body.theme-dark .lab-route-result strong { color: var(--ui-accent-ink); }
.lab-route-result>span { background: var(--ui-accent); color: var(--ui-canvas); }
.lab-route-result em { background: var(--ui-surface); color: var(--ui-muted); }
.lab-thought, .lab-thought>div, body.theme-dark .lab-thought, body.theme-dark .lab-thought>div { background: var(--ui-surface-soft); border-color: var(--ui-border); color: var(--ui-muted); }
.lab-composer, body.theme-dark .lab-composer { margin: 0 16px; background: var(--ui-surface-soft); border-color: var(--ui-border); box-shadow: none; }
.lab-composer:focus-within, body.theme-dark .lab-composer:focus-within { border-color: var(--ui-accent); box-shadow: 0 0 0 3px #48bbd12c; }
.lab-composer textarea, body.theme-dark .lab-composer textarea { background: transparent; border: 0; min-height: 68px; padding: 13px 15px; }
.lab-compose-bottom { border-top: 1px solid var(--ui-border); }
.lab-compose-bottom>span, body.theme-dark .lab-compose-bottom>span, .lab-privacy, body.theme-dark .lab-privacy { color: var(--ui-subtle); }
.lab-settings { padding: 18px; }
.lab-settings-heading, body.theme-dark .lab-settings-heading { color: var(--ui-text); }
.lab-settings label, body.theme-dark .lab-settings label, .lab-settings .lab-help { color: var(--ui-muted); }
.lab-settings select, .lab-settings input[type=number], body.theme-dark .lab-settings select, body.theme-dark .lab-settings input[type=number] { background: var(--ui-surface-soft); border-color: var(--ui-border); color: var(--ui-text); }
.lab-switch input:checked, body.theme-dark .lab-switch input:checked { background: var(--ui-accent); }
.lab-settings-note, body.theme-dark .lab-settings-note { background: var(--ui-accent-soft); border-color: var(--ui-border); color: var(--ui-accent-ink); }
.lab-call-info { border-color: var(--ui-border); }
.lab-call-info strong, body.theme-dark .lab-call-info strong { color: var(--ui-text); }
.lab-empty p, body.theme-dark .lab-empty p { color: var(--ui-muted); }
.lab-prompts button, body.theme-dark .lab-prompts button { background: var(--ui-surface-soft); border-color: var(--ui-border); color: var(--ui-text); }
.lab-prompts button:hover, body.theme-dark .lab-prompts button:hover { background: var(--ui-accent-soft); border-color: var(--ui-accent); }
.lab-draft-state, body.theme-dark .lab-draft-state { background: var(--ui-accent-soft); color: var(--ui-accent-ink); }
.lab-response-meta span, body.theme-dark .lab-response-meta span { background: var(--ui-surface-soft); border-color: var(--ui-border); color: var(--ui-muted); }

@media (max-width: 1150px) {
  .usage-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lab-layout { grid-template-columns: minmax(0, 1fr) 240px; }
  .routing-preview-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .usage-overview-grid, .lab-layout { grid-template-columns: 1fr; }
  .lab-settings { position: static; max-height: none; }
}
@media (max-width: 720px) {
  body.sidebar-compact { --sidebar-width: 0px; }
  body>main { margin-left: 0; }
  .sidebar, .sidebar-compact .sidebar { width: 100%; }
  #content { padding-top: 20px; }
  .usage-metrics { gap: 9px; }
  .usage-metric { padding: 14px; }
  .usage-metric strong { font-size: 22px; }
  .usage-section-head { flex-wrap: wrap; }
  .usage-search { width: 100%; }
  .usage-health { min-width: 0; }
  .usage-chart-svg { height: 135px; }
  .lab-session-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lab-nav-row { display: block; }
  .lab-embedded-toolbar { justify-content: flex-start; padding: 8px 0; }
  .lab-messages { height: clamp(330px, 43dvh, 470px); padding: 16px; }
  .lab-composer { margin: 0 10px; }
  .lab-compose-bottom { gap: 7px; }
  .lab-settings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .api-quickbar { flex-wrap: wrap; padding: 12px; }
  .api-quickbar>div { flex-basis: 100%; }
  .api-doc-nav { position: static; margin-bottom: 14px; }
  .api-section { scroll-margin-top: 160px; }
  .routing-preview-controls { grid-template-columns: 1fr; }
}

/* 服务商配置：固定标题和操作栏，只有中间表单内容滚动。 */
#edit { padding: 0; overflow: hidden; }
#provider-form { display: flex; flex-direction: column; max-height: min(90dvh, 90vh); overflow: hidden; }
#edit .modal-title { flex: none; margin: 0; padding: 24px 28px 14px; background: var(--ui-surface); border-bottom: 1px solid var(--ui-border); }
#edit .provider-form-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 28px 20px; }
#edit .dialog-actions { position: static; flex: none; margin: 0; padding: 16px 28px; background: var(--ui-surface); border-top: 1px solid var(--ui-border); }
#key-editor { width: min(600px,calc(100vw - 24px)); max-height: calc(100dvh - 32px); padding: 0; overflow: hidden; background: var(--ui-surface); }
#key-form { display: flex; flex-direction: column; min-height: 0; max-height: calc(100dvh - 32px); }
#key-editor .modal-title { flex: none; margin: 0; padding: 20px 24px 14px; border-bottom: 1px solid var(--ui-border); background: var(--ui-surface); }
#key-editor .modal-title h2 { margin: 0; }
#key-editor #close-key { width: 32px; min-height: 32px; padding: 0; font-size: 20px; }
#key-editor .key-editor-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 4px 24px 18px; }
#key-editor .key-editor-actions { display: flex; flex: none; align-items: center; justify-content: flex-end; gap: 12px; padding: 12px 24px 16px; border-top: 1px solid var(--ui-border); background: var(--ui-surface); }
#key-editor #key-error { flex: 1; margin: 0; color: var(--ui-danger); }
#key-editor #key-error:empty { display: none; }
@media (max-width: 720px) {
 #edit .modal-title { padding: 20px 22px 14px; }
 #edit .provider-form-body { padding: 0 22px 18px; }
 #edit .dialog-actions { padding: 14px 22px; }
 #key-editor .modal-title { padding: 16px 18px 12px; }
 #key-editor .key-editor-body { padding: 4px 18px 14px; }
 #key-editor .key-editor-actions { padding: 12px 18px; }
}

/* API Key 页：搜索与创建是同一操作组。 */
.key-page-heading { gap: 18px; align-items: center; }
.key-page-heading>div:first-child { min-width: 0; }
.key-heading-actions { display: grid; grid-template-columns: minmax(220px, 320px) max-content; gap: 10px; align-items: center; flex: none; }
.key-heading-actions #key-search { width: 100%; min-width: 0; height: 42px; margin: 0; }
.key-heading-actions #new-key { min-height: 42px; white-space: nowrap; }
@media (max-width: 1150px) {
  .key-page-heading { flex-wrap: wrap; }
  .key-heading-actions { width: 100%; grid-template-columns: minmax(0, 1fr) max-content; }
}
@media (max-width: 520px) {
  .key-heading-actions { grid-template-columns: 1fr; }
  .key-heading-actions #new-key { width: 100%; }
}

/* 应用密钥以整行呈现，避免少量 Key 被挤在左侧窄卡片中。 */
#key-list { grid-template-columns: minmax(0, 1fr); }
#key-list .key-card {
  display: grid;
  grid-template-columns: minmax(230px, .8fr) minmax(0, 2fr);
  grid-template-areas: "identity metrics" "preview metrics" "window actions";
  gap: 10px 22px;
  align-items: center;
}
#key-list .key-card .card-top { grid-area: identity; }
#key-list .key-card .key-preview { grid-area: preview; width: max-content; max-width: 100%; margin: 0; }
#key-list .key-card .key-quota { grid-area: metrics; grid-template-columns: repeat(4, minmax(0, 1fr)); }
#key-list .key-card .key-window { grid-area: window; margin: 0; }
#key-list .key-card .card-actions { grid-area: actions; justify-content: flex-end; margin: 0; }
#key-list .key-card .card-actions button { flex: 0 0 auto; min-width: 86px; }
@media (max-width: 1150px) {
  #key-list .key-card { grid-template-columns: minmax(0, 1fr); grid-template-areas: "identity" "preview" "metrics" "window" "actions"; }
  #key-list .key-card .key-quota { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #key-list .key-card .card-actions { justify-content: flex-start; }
}

/* 价格导入：操作与可选映射在同一组，说明文本独立呈现。 */
.price-import { display: flex; align-items: end; gap: 14px; margin: 14px 0; flex-wrap: wrap; }
.price-import button { min-height: 42px; white-space: nowrap; }
.price-import label { flex: 1 1 240px; max-width: 360px; margin: 0; }
.price-import input { margin: 5px 0 0; }
.price-mapping { margin: 4px 0 12px; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-soft); padding: 10px 14px; }
.price-mapping summary { width: max-content; max-width: 100%; color: var(--ui-accent-ink); font-size: 12px; font-weight: 650; cursor: pointer; }
.price-mapping .price-import { margin-bottom: 0; }

/* 应用密钥：收束为一条身份 / 用量 / 操作的信息带。 */
#key-list .key-card {
  padding: 20px 22px;
  gap: 10px 24px;
  border: 1px solid var(--ui-border);
  border-left: 3px solid var(--ui-accent);
  border-radius: 16px;
  background: linear-gradient(115deg, var(--ui-surface) 0%, var(--ui-surface) 68%, var(--ui-surface-soft) 100%);
  box-shadow: var(--ui-shadow);
}
#key-list .key-card .card-top { justify-content: flex-start; align-items: center; gap: 12px; }
#key-list .key-card .key-symbol { width: 34px; height: 34px; flex: none; display: grid; place-items: center; border: 1px solid var(--ui-border); border-radius: 10px; background: var(--ui-accent-soft); color: var(--ui-accent-ink); }
#key-list .key-card .key-symbol svg { width: 18px; height: 18px; }
#key-list .key-card h3 { color: var(--ui-text); font-size: 17px; letter-spacing: -.02em; }
#key-list .key-card .tag { border-radius: 999px; padding: 5px 10px; font-size: 11px; }
#key-list .key-card .key-preview {
  display: inline-flex; align-items: center; min-height: 32px; padding: 5px 11px;
  border: 1px solid var(--ui-border); border-radius: 8px;
  background: var(--ui-surface-soft); color: var(--ui-muted);
  font-size: 12px; letter-spacing: .03em;
}
#key-list .key-card .key-preview span { margin-right: 8px; color: var(--ui-accent-ink); font: 700 9px/1 ui-sans-serif, sans-serif; letter-spacing: .12em; }
#key-list .key-card .key-preview code { color: var(--ui-text); font-size: 12px; }
#key-list .key-card .key-quota {
  gap: 0; padding: 5px 0; border: 1px solid var(--ui-border);
  border-radius: 12px; background: var(--ui-surface-soft);
}
#key-list .key-card .key-quota div { min-width: 0; padding: 8px 16px; border: 0; border-radius: 0; background: transparent; }
#key-list .key-card .key-quota div + div { border-left: 1px solid var(--ui-border); }
#key-list .key-card .key-quota small { margin-bottom: 5px; color: var(--ui-muted); font-size: 11px; }
#key-list .key-card .key-quota strong { color: var(--ui-text); font-size: 16px; line-height: 1.3; }
#key-list .key-card .key-window { color: var(--ui-muted); font-size: 12px; line-height: 1.65; }
#key-list .key-card .card-actions { gap: 8px; }
#key-list .key-card .card-actions button { min-height: 34px; min-width: 74px; padding: 6px 11px; }
@media (max-width: 1150px) {
  #key-list .key-card .key-quota div:nth-child(3) { border-left: 0; border-top: 1px solid var(--ui-border); }
  #key-list .key-card .key-quota div:nth-child(4) { border-top: 1px solid var(--ui-border); }
}
@media (max-width: 600px) {
  #key-list .key-card { padding: 17px; }
  #key-list .key-card .key-quota div { padding: 9px 12px; }
  #key-list .key-card .key-quota strong { font-size: 14px; }
  #key-list .key-card .card-actions { flex-wrap: wrap; }
}

/* 对话实验室：首屏露出输入区，窄屏生成设置可按需展开。 */
#content:has(.lab-layout)>.heading { margin-bottom: 10px; padding-bottom: 9px; }
#content:has(.lab-layout) .lab-nav-row { margin-bottom: 9px; }
#content:has(.lab-layout) .lab-session-summary { margin-bottom: 9px; }
#content:has(.lab-layout) .lab-session-summary>div { padding: 8px 13px; }
#content:has(.lab-layout) .lab-toolbar { min-height: 52px; padding: 8px 14px; }
#content:has(.lab-layout) .lab-messages { height: clamp(220px, calc(100dvh - 510px), 560px); }
#content:has(.lab-layout) .lab-empty { padding: 18px 16px; }
#content:has(.lab-layout) .lab-empty-icon { width: 42px; height: 42px; margin-bottom: 10px; }
#content:has(.lab-layout) .lab-prompts { margin-top: 13px; }
#content:has(.lab-layout) .lab-composer textarea { min-height: 58px; }
.lab-settings-heading { display: flex; align-items: center; gap: 8px; }
.lab-settings-heading #lab-settings-toggle { margin-left: auto; padding: 4px 7px; min-height: 27px; font-size: 11px; }
.lab-settings-body[hidden] { display: none !important; }
.lab-settings.is-collapsed { padding-bottom: 12px; }
@media (max-width: 900px) {
  .lab-settings-heading, .lab-settings-body { grid-column: 1 / -1; }
  .lab-settings-body { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px 16px; }
  .lab-settings-body .lab-settings-note, .lab-settings-body .lab-tool-config, .lab-settings-body .lab-help { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  #content:has(.lab-layout) .lab-messages { height: clamp(210px, calc(100dvh - 500px), 390px); }
  .lab-settings-body { grid-template-columns: 1fr; }
  .lab-settings-body .lab-settings-note, .lab-settings-body .lab-tool-config, .lab-settings-body .lab-help { grid-column: 1; }
}

/* Provider identity and model selection: order is metadata, never a watermark. */
.provider-card .card-top { min-width: 0; flex-wrap: wrap; }
.provider-card .provider-title { flex: 1 1 115px; }
.provider-card .card-top .provider-rank,
body.theme-dark .provider-card .card-top .provider-rank {
  position: static; flex: none; order: 1; align-self: center;
  padding: 4px 6px; border: 1px solid var(--ui-border); border-radius: 5px;
  background: var(--ui-surface-soft); color: var(--ui-muted);
  font-size: 10px; line-height: 1; letter-spacing: .04em; font-weight: 700;
}
.provider-card .card-top .tag { order: 2; margin-left: 0; }
.provider-card .provider-health small { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
#edit { width: min(700px, 94vw); }
.provider-model-section { margin: 18px 0; padding: 16px; border: 1px solid var(--ui-border); border-radius: 11px; background: var(--ui-surface-soft); }
.provider-model-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.provider-model-heading h3 { margin: 4px 0 0; color: var(--ui-text); font-size: 15px; }
.provider-model-heading small { color: var(--ui-muted); font-size: 11px; white-space: nowrap; }
.provider-model-section>label { margin: 9px 0 14px; }
.provider-model-section .model-picker { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px 12px; padding: 0; margin: 0; border: 0; background: transparent; }
.provider-model-section #fetch-models { grid-column: 2; grid-row: 1; min-height: 34px; padding: 6px 10px; font-size: 11px; white-space: nowrap; }
.provider-model-section #model-status { grid-column: 1; grid-row: 1; align-self: center; margin: 0; color: var(--ui-muted); line-height: 1.5; }
.provider-model-section .model-picker>label { grid-column: 1; grid-row: 2; margin: 0; }
.provider-model-section .model-picker>label input { margin-top: 4px; }
.provider-model-section .model-bulk { grid-column: 2; grid-row: 2; justify-content: flex-end; align-self: end; margin: 0; }
.provider-model-section .model-bulk button { white-space: nowrap; }
.provider-model-section .model-bulk span { flex-basis: 100%; text-align: right; }
.provider-model-section .model-results { grid-column: 1 / -1; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px; max-height: 250px; margin: 0; padding: 3px; }
.provider-model-section .model-results .model-choice { align-items: center; gap: 7px; min-height: 31px; margin: 0; padding: 5px 7px; border-radius: 6px; font-size: 11px; line-height: 1.3; }
.provider-model-section .model-results .model-choice:has(input:checked) { background: var(--ui-accent-soft); border-color: var(--ui-accent); color: var(--ui-accent-ink); }
.provider-model-section .model-results .model-choice small { margin-top: 1px; }
.provider-model-section .model-picker>small { grid-column: 1 / -1; margin-top: 2px; font-size: 10px; line-height: 1.5; }
.model-manual { margin-top: 13px; padding-top: 11px; border-top: 1px solid var(--ui-border); }
.model-manual summary { cursor: pointer; color: var(--ui-accent-ink); font-size: 11px; font-weight: 650; }
.model-manual summary small { margin-left: 8px; color: var(--ui-muted); font-weight: 400; }
.model-manual label { margin: 10px 0 0; }
.model-manual textarea { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; }
.price-validity strong, .price-validity small { display: block; white-space: nowrap; }
.price-validity strong { font-size: 11px; font-weight: 650; }
.price-validity small { margin-top: 3px; font-size: 10px; color: var(--ui-muted); }
.price-validity small:empty { display: none; }
.price-validity.is-overdue strong { color: var(--ui-danger, #b94d43); }

/* A single lab workspace language for conversation and media. */
#content:has(.lab-nav-row)>.heading { margin-bottom: 11px; padding-bottom: 10px; }
.lab-nav-row { min-width: 0; margin-bottom: 13px; padding-bottom: 1px; }
.lab-model-count { align-self: center; color: var(--ui-muted); font-size: 11px; white-space: nowrap; }
.lab-session-summary, .media-session-summary { width: 100%; max-width: none; margin: 0 0 12px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border: 1px solid var(--ui-border); border-radius: 11px; background: var(--ui-surface); box-shadow: var(--ui-shadow); overflow: hidden; }
.media-session-summary { grid-template-columns: .7fr 1.7fr .7fr; }
.lab-session-summary>div, .media-session-summary>div { min-width: 0; padding: 10px 14px; border-right: 1px solid var(--ui-border); }
.lab-session-summary>div:last-child, .media-session-summary>div:last-child { border-right: 0; }
.media-session-summary small { display: block; margin-bottom: 4px; color: var(--ui-subtle); font-size: 10px; }
.media-session-summary strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ui-text); font-size: 12px; }
.lab-layout { grid-template-columns: minmax(0,1fr) minmax(238px,260px); gap: 12px; }
.lab-main, .lab-settings, .media-form-panel, .media-result-panel { border-radius: 12px; border-color: var(--ui-border); background: var(--ui-surface); box-shadow: var(--ui-shadow); }
.lab-main { min-height: 0; }
#content:has(.lab-layout) .lab-messages { flex: none; height: clamp(155px,calc(100dvh - 590px),520px); padding: 18px 22px; }
.lab-toolbar { min-height: 56px; }
.lab-privacy { padding: 9px 14px; }
.media-kind-grid { grid-template-columns: repeat(auto-fit,minmax(160px,1fr)); gap: 8px; margin-bottom: 12px; }
.media-kind { min-height: 64px; padding: 9px 12px; border-radius: 9px; background: var(--ui-surface); border-color: var(--ui-border); }
.media-kind:hover { background: var(--ui-surface-hover); }
.media-kind.selected, body.theme-dark .media-kind.selected { background: var(--ui-accent-soft); border-color: var(--ui-accent); box-shadow: inset 0 0 0 1px var(--ui-accent); }
.media-kind b { color: var(--ui-text); }
.media-kind small { color: var(--ui-muted); }
.media-kind-icon, body.theme-dark .media-kind-icon { background: var(--ui-surface-soft); color: var(--ui-accent-ink); }
.media-kind.selected .media-kind-icon, body.theme-dark .media-kind.selected .media-kind-icon { background: var(--ui-accent); color: #fff; }
.media-workspace { grid-template-columns: minmax(320px, .8fr) minmax(0,1.2fr); gap: 12px; align-items: stretch; }
.media-form-panel, .media-result-panel { min-height: 420px; padding: 19px; }
.media-vision-controls[hidden], .media-vision-usage[hidden], .media-result-actions button[hidden] { display: none; }
.media-vision-controls { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.media-vision-controls label { min-width: 0; }
.media-vision-controls select { width: 100%; }
.media-result-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; justify-content: flex-end; }
.media-result-actions button { min-height: 30px; padding: 5px 9px; font-size: 11px; }
.media-result:has(.media-transcript) { justify-content: flex-start; }
.media-vision-usage { padding-top: 12px; border-top: 1px solid var(--ui-border); color: var(--ui-muted); font-size: 11px; }
.media-form-panel .panel-title, .media-result-panel .panel-title { border-color: var(--ui-border); }
.media-form-panel form { max-width: none; }
.media-form-panel textarea { min-height: 105px; }
.media-form-panel label { margin: 11px 0; }
.media-actions { margin-top: 16px; }
.media-result { min-height: 315px; }
.media-placeholder { max-width: 300px; margin: auto; }
.media-placeholder b { color: var(--ui-text); }
.media-placeholder small { color: var(--ui-muted); line-height: 1.5; }
.media-status, body.theme-dark .media-status { background: var(--ui-surface-soft); color: var(--ui-muted); }
.media-status[data-state="处理中"], .media-status[data-state="生成中"], .media-status[data-state="排队中"] { background: var(--ui-accent-soft); color: var(--ui-accent-ink); }
.media-status[data-state="未完成"], .media-status[data-state="生成失败"] { background: #fcebe8; color: #a64338; }
body.theme-dark .media-task, body.theme-dark .media-transcript { background: var(--ui-surface-soft); color: var(--ui-text); }
@media (max-width: 980px) { .media-workspace, .lab-layout { grid-template-columns: 1fr; } .lab-settings { position: static; max-height: none; } .media-form-panel, .media-result-panel { min-height: 0; } }
@media (max-width: 540px) { .media-vision-controls { grid-template-columns: 1fr; gap: 0; } .media-result-actions { justify-content: flex-start; } }
@media (max-height: 820px) and (min-width: 721px) {
  #content:has(.lab-layout) .lab-empty { justify-content: center; padding: 8px 12px; }
  #content:has(.lab-layout) .lab-empty-icon { display: none; }
  #content:has(.lab-layout) .lab-empty h2 { margin: 0 0 3px; font-size: 16px; }
  #content:has(.lab-layout) .lab-empty p { font-size: 11px; }
  #content:has(.lab-layout) .lab-prompts { margin-top: 8px; }
  #content:has(.lab-layout) .lab-prompts button { min-width: 120px; padding: 7px 9px; }
}
@media (max-width: 720px) {
  .lab-nav-row { display: flex; flex-wrap: wrap; }
  .lab-nav-row .page-tabs { flex-basis: 100%; }
  .lab-embedded-toolbar { width: 100%; justify-content: flex-end; padding: 5px 0; }
  .lab-session-summary, .media-session-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .media-session-summary>div { border-bottom: 1px solid var(--ui-border); }
  .media-session-summary>div:nth-child(2) { border-right: 0; }
  .media-session-summary>div:last-child { grid-column: 1 / -1; border-bottom: 0; }
  .media-kind-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .media-kind-grid [data-media-kind="vision"] { grid-column: 1 / -1; }
  #content:has(.lab-layout) .lab-messages { height: min(34dvh,240px); }
  .provider-model-section .model-picker { grid-template-columns: 1fr; }
  .provider-model-section #fetch-models, .provider-model-section #model-status, .provider-model-section .model-picker>label, .provider-model-section .model-bulk { grid-column: 1; grid-row: auto; }
  .provider-model-section .model-results { grid-template-columns: 1fr; }
  .provider-model-heading { align-items: start; }
  .provider-model-heading small { white-space: normal; text-align: right; }
}

/* Brand/toggle placement is defined alongside the shared navigation axis in workspaces.css. */
@media (min-width: 721px) {
  body:not(.sidebar-compact) .sidebar .workspace-chip { padding-left: 0; }
  body:not(.sidebar-compact) .sidebar .tenant-button { padding-left: 9px; }
}

/* Chat status belongs to the conversation canvas, not to a separate page-wide card. */
.lab-main>.lab-session-summary {
  grid-template-columns: .8fr .65fr .8fr 1.8fr;
  margin: 0;
  border: 0;
  border-bottom: 1px solid var(--ui-border);
  border-radius: 0;
  box-shadow: none;
  background: var(--ui-surface-soft);
}
.lab-main>.lab-session-summary>div { padding: 8px 12px; }
.lab-main>.lab-session-summary strong { color: var(--ui-text); }
.lab-main>.lab-session-summary small { color: var(--ui-muted); }
.lab-main>.lab-session-summary>div:last-child strong { white-space: normal; line-height: 1.35; }
.lab-settings-heading { margin-bottom: 10px; }
.lab-settings-note { margin-bottom: 10px; }
.compare-controls { padding: 15px 18px; margin-bottom: 12px; }
.compare-controls textarea { min-height: 76px; }
.compare-controls .compare-actions { margin-top: 8px; gap: 8px; }
.compare-controls .compare-actions button { min-height: 36px; }
.compare-controls>.muted { margin-bottom: 0; font-size: 10px; }
@media (max-width: 720px) {
  .lab-main>.lab-session-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .lab-main>.lab-session-summary>div:nth-child(2) { border-right: 0; }
  .lab-main>.lab-session-summary>div:nth-child(-n+2) { border-bottom: 1px solid var(--ui-border); }
  .sidebar .nav-group+.nav-group, .sidebar-compact .sidebar .nav-group+.nav-group { margin-top: 0; padding-top: 0; border: 0; }
  .sidebar nav, .sidebar-compact .sidebar nav { min-width: 0; min-height: 40px; align-items: center; }
  .sidebar .nav-item, .sidebar-compact .sidebar .nav-item { white-space: nowrap; }
  body>main>header { display: flex; align-items: center; gap: 8px; min-width: 0; overflow: hidden; }
  body>main>header>span:first-child { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #breadcrumb { white-space: nowrap; }
  .top-actions { flex: 0 0 auto; gap: 5px; min-width: 0; }
  #global-search, body.theme-dark #global-search { flex: 0 1 112px; width: 112px; min-width: 0; font-size: 11px; }
  #logout { width: 32px; min-width: 32px; padding: 0; font-size: 0; }
  #logout::after { content: '↗'; font-size: 17px; }
  .lab-nav-row:has(.lab-model-count) { align-items: center; }
  .lab-nav-row:has(.lab-model-count) .page-tabs { flex: 1 1 auto; }
  .lab-nav-row:has(.lab-model-count) .lab-embedded-toolbar { width: auto; padding: 0; }
}
.enterprise-binding-list{display:grid;gap:8px;margin:16px 0}.enterprise-binding-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 14px;border:1px solid var(--line);border-radius:12px}.enterprise-binding-row span{display:grid;gap:3px;min-width:0}.enterprise-binding-row small{color:var(--muted);overflow-wrap:anywhere}.enterprise-binding-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.enterprise-binding-actions{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:2px}.enterprise-binding-actions .field-help{min-width:0;overflow-wrap:anywhere}.enterprise-binding-actions button{flex:none;width:auto;min-width:126px;min-height:38px;padding:8px 16px;white-space:nowrap}@media(max-width:760px){.enterprise-binding-form{grid-template-columns:1fr}.enterprise-binding-row{align-items:flex-start}.enterprise-binding-actions{flex-wrap:wrap}.enterprise-binding-actions button{margin-left:auto}}
.enterprise-auto-join{grid-column:1/-1;display:flex;align-items:center;gap:8px}.enterprise-auto-join input{width:auto;margin:0;flex:none}
.feishu-account-heading{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.feishu-account-heading h2{margin:0}.feishu-account-panel>p{margin:12px 0 0}
.lab-history-search{display:block;margin-top:14px}.lab-history-search input{width:100%;margin-top:6px}
.sso-provider-list{display:grid;gap:7px;margin-top:8px}.sso-provider-list[hidden]{display:none}.sso-provider{display:flex;align-items:center;justify-content:space-between;text-decoration:none;border-radius:9px;padding:10px 13px}.lab-history-panel{margin-top:16px}.lab-history-panel>summary{cursor:pointer;font-weight:700}.lab-history-panel>summary span{margin-left:10px;color:var(--muted);font-weight:400;font-size:.85em}.lab-history-list{display:grid;gap:9px;margin-top:16px}.lab-history-item{padding:12px 14px;border:1px solid var(--line);border-radius:11px}.lab-history-item-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.lab-history-item-heading>span:first-child{display:grid;gap:4px;min-width:0}.lab-history-item-heading strong,.lab-history-item-heading small{overflow-wrap:anywhere}.lab-history-item-heading small{color:var(--muted)}.lab-history-actions{display:flex;gap:7px;flex:none}.lab-history-detail{white-space:pre-wrap;overflow-wrap:anywhere;max-height:360px;overflow:auto;margin:12px 0 0;padding:12px;background:var(--surface-soft);border-radius:9px;font:inherit}.lab-history-detail a{overflow-wrap:anywhere}@media(max-width:680px){.lab-history-item-heading{align-items:flex-start;flex-direction:column}.lab-history-actions{width:100%}}
.lab-answer.is-streaming{white-space:pre-wrap}
.lab-history-panel>summary{list-style:none}.lab-history-panel>summary::-webkit-details-marker{display:none}.lab-history-panel>summary::after{content:'⌄';float:right;color:var(--ui-muted)}.lab-history-panel[open]>summary::after{content:'⌃'}
.lab-history-controls{display:flex;align-items:end;gap:12px;margin-top:16px}.lab-history-controls label{margin:0;flex:1;min-width:150px}.lab-history-controls label+label{flex:0 0 150px}.lab-history-controls input,.lab-history-controls select{margin-top:5px}.lab-history-count{color:var(--ui-muted);font-size:12px;white-space:nowrap;padding-bottom:11px}
.lab-history-list{gap:8px;margin-top:14px}.lab-history-item{background:var(--ui-surface-soft);border-color:var(--ui-border)}.lab-history-item-heading{align-items:center}.lab-history-item-heading strong{font-size:13px;color:var(--ui-text)}.lab-history-item-heading small{font-size:11px;color:var(--ui-muted)}.lab-history-actions{align-items:center}.lab-history-actions button{min-height:30px;padding:5px 10px;font-size:11px}.lab-history-state{border-radius:99px;padding:4px 8px;background:var(--ui-accent-soft);color:var(--ui-accent-ink)!important}.lab-history-state[data-status="failed"]{color:var(--ui-danger)!important;background:color-mix(in srgb,var(--ui-danger) 12%,var(--ui-surface))}.lab-history-error{margin:8px 0 0;color:var(--ui-danger);font-size:12px;overflow-wrap:anywhere}.lab-history-more{margin-top:12px}
.lab-history-dialog{width:min(760px,calc(100vw - 24px));max-height:min(86dvh,860px);padding:0;overflow:hidden;flex-direction:column}.lab-history-dialog[open]{display:flex}.lab-history-dialog-head{display:flex;align-items:start;justify-content:space-between;gap:16px;flex:none;padding:20px 24px 16px;background:var(--ui-surface);border-bottom:1px solid var(--ui-border)}.lab-history-dialog-head small{font-size:10px;letter-spacing:.12em;color:var(--ui-accent-ink);font-weight:700}.lab-history-dialog-head h2{margin:4px 0 3px;font-size:19px;overflow-wrap:anywhere}.lab-history-dialog-head p{margin:0;color:var(--ui-muted)}.lab-history-dialog-head button{min-width:32px;min-height:32px;padding:2px;font-size:23px;line-height:1}.lab-history-dialog-content{overflow:auto;min-height:100px;padding:20px 24px 26px;scrollbar-width:thin}.lab-history-message{max-width:90%;margin-bottom:14px;padding:12px 15px;border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-surface-soft)}.lab-history-message.user{margin-left:auto;background:var(--ui-accent-soft)}.lab-history-message-head{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--ui-text)}.lab-history-message-head small,.lab-history-message-route{font-size:11px;color:var(--ui-muted)}.lab-history-message-body{margin-top:8px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7;color:var(--ui-text)}.lab-history-message-body p{margin:5px 0}.lab-history-message-body pre{white-space:pre;max-width:100%;overflow:auto}.lab-history-message details{margin-top:9px}.lab-history-message details p{white-space:pre-wrap;overflow-wrap:anywhere}.lab-history-message-route{display:block;margin-top:10px}.lab-history-truncated{margin:0 0 16px;color:var(--ui-muted);font-size:12px}.lab-history-media-result{display:grid;gap:10px}.lab-history-media-result a,.lab-history-task-id{overflow-wrap:anywhere}
@media(max-width:680px){.lab-history-controls{flex-wrap:wrap}.lab-history-controls label+label{flex:1}.lab-history-count{padding:0}.lab-history-dialog-head,.lab-history-dialog-content{padding-left:16px;padding-right:16px}.lab-history-message{max-width:100%}}
.subscription-status{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.subscription-status h2{margin:4px 0 6px}.subscription-status p{margin:0}
.subscription-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
.subscription-facts>div,.subscription-plan{border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface);padding:14px 16px}
.subscription-facts small,.subscription-plan small{display:block;color:var(--ui-muted);margin-bottom:5px}
.subscription-facts strong{font-size:14px;color:var(--ui-text)}
.subscription-notice{margin-top:12px}
.subscription-plans{display:grid;gap:10px;margin-top:14px}
.subscription-plan{display:flex;align-items:center;justify-content:space-between;gap:16px}
.subscription-plan strong{display:block;margin-bottom:5px;color:var(--ui-text)}
.subscription-plan small{margin:0}.subscription-prices{display:flex;gap:18px;white-space:nowrap;color:var(--ui-muted);font-size:13px}
.subscription-form{display:grid;gap:12px;margin-top:14px}.subscription-form>button{justify-self:start}
.subscription-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.subscription-section-head h2{margin:0 0 5px}.subscription-section-head p{margin:0}.subscription-rights,.subscription-plan-rights{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:14px}.subscription-rights>div,.subscription-plan-rights>div{min-width:0;padding:10px 12px;border:1px solid var(--ui-border);border-radius:8px;background:var(--ui-surface-soft)}.subscription-rights small,.subscription-plan-rights small{display:block;margin:0 0 5px;color:var(--ui-muted);font-size:11px}.subscription-rights strong,.subscription-plan-rights strong{display:block;color:var(--ui-text);font-size:13px}.subscription-plan{display:block}.subscription-plan-title{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}.subscription-plan-title small{flex:1 1 240px}.subscription-plan-rights{margin-top:10px}.subscription-entitlement-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end;gap:10px 16px;padding:14px;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface-soft)}.subscription-entitlement-form .check{align-self:center;margin:0}
@media(max-width:1100px){.subscription-rights,.subscription-plan-rights{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:720px){.subscription-rights,.subscription-plan-rights{grid-template-columns:repeat(2,minmax(0,1fr))}.subscription-entitlement-form{grid-template-columns:1fr}.subscription-plan-title{display:block}.subscription-prices{margin-top:8px}}
@media(max-width:720px){.subscription-status,.subscription-plan{flex-direction:column;align-items:flex-start}.subscription-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.subscription-facts>div:last-child{grid-column:1/-1}.subscription-prices{white-space:normal;flex-wrap:wrap}}