:root {
  --ink: #e8eef2;
  --muted: #8d9aa6;
  --faint: #64717d;
  --line: #28333e;
  --line-strong: #3b4a57;
  --panel: #131b23;
  --panel-raised: #19232d;
  --canvas: #0c1218;
  --sidebar: 252px;
  --accent: #43d3b4;
  --accent-ink: #071916;
  --blue: #6ea8ff;
  --danger: #ff817f;
  --white: #ffffff;
  font-family: "DM Sans", system-ui, sans-serif;
  color: var(--ink);
  background: var(--canvas);
  font-synthesis: none;
}
* { box-sizing: border-box; }
html, body { min-height: 100%; margin: 0; }
body { background: var(--canvas); color: var(--ink); font-size: 13px; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: wait; opacity: .6; }
/* Pager buttons are disabled on the first or last page, which is a normal state
   rather than a busy one, so they keep the default pointer. */
.admin-table-pagination button:disabled, .admin-user-pagination button:disabled, .redemption-pagination button:disabled,
.subscription-plan-pagination button:disabled, .admin-usage-pagination button:disabled, .audit-log-pagination button:disabled,
.channel-binding-pagination button:disabled, .provider-key-manage-pagination button:disabled,
.group-model-pagination button:disabled, .group-provider-pagination button:disabled, .gift-credit-pagination button:disabled,
.admin-pagination-controls button:disabled, .admin-page-numbers button:disabled { cursor: default; }
/* The sign-in submit is disabled while the request is in flight; the pending
   request is signalled by the disabled styling alone, so the pointer stays an
   arrow instead of turning into a progress circle. */
.auth-panel .auth-submit:disabled { cursor: default; }
a { color: inherit; }
[hidden] { display: none !important; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; }
.brand-mark { display: inline-block; width: 17px; height: 17px; border: 2px solid currentColor; border-radius: 4px; position: relative; transform: rotate(45deg); }
.brand-mark::after { content: ""; position: absolute; width: 5px; height: 5px; background: currentColor; border-radius: 1px; top: 4px; left: 4px; }
.eyebrow { margin: 0 0 8px; color: var(--accent); font: 600 10px/1.2 "Roboto Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }

.auth-shell { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 28px; color: #1d2933; background: #eef2f4; }
.auth-brand { display: flex; align-items: center; gap: 10px; color: #18222b; margin-bottom: 24px; }
.auth-brand .brand-mark { color: #167a68; }
.auth-brand strong { font-size: 17px; letter-spacing: -.02em; }
.auth-brand span:last-child { color: #74818c; font-size: 12px; }
.auth-panel { width: min(420px, 100%); padding: 34px; border: 1px solid #d8e0e5; border-radius: 12px; background: #fff; box-shadow: 0 22px 60px rgba(24, 42, 54, .1); }
.auth-panel-header { margin-bottom: 24px; }
.auth-panel-header h1 { margin: 0 0 8px; color: #17232c; font-size: 28px; letter-spacing: -.04em; }
.auth-panel-header p:last-child { margin: 0; color: #71808c; line-height: 1.6; }
.auth-tabs { margin-bottom: 22px; }
.auth-panel label, .settings-form label, .admin-form label, .search-field { display: flex; flex-direction: column; gap: 7px; color: #52616d; font-size: 12px; font-weight: 600; }
.auth-panel form { display: grid; gap: 16px; }
input, select, textarea { width: 100%; border: 1px solid #ccd7de; border-radius: 7px; outline: 0; background: #fff; color: #17232c; transition: border-color .15s, box-shadow .15s; }
input, select { min-height: 40px; padding: 0 11px; }
textarea { padding: 11px; resize: vertical; line-height: 1.5; }
input:focus, select:focus, textarea:focus { border-color: #43bba3; box-shadow: 0 0 0 3px rgba(67, 211, 180, .16); }
.terms-check { display: flex !important; flex-direction: row !important; align-items: flex-start; gap: 8px !important; color: #65737e !important; font-size: 11px !important; font-weight: 400 !important; line-height: 1.45; }
.terms-check input { width: 16px; min-height: 16px; margin-top: 1px; accent-color: #16816e; }
.terms-check a { color: #167a68; }
.form-error, .dialog-error { min-height: 15px; margin: -4px 0 0; color: #bd3e3d; font-size: 11px; }
.form-success { min-height: 0; margin: -4px 0 0; color: #166534; font-size: 11px; line-height: 1.5; }
.form-success:empty { display: none; }
.primary-button, .secondary-button, .text-button, .icon-text-button, .row-button { border-radius: 7px; border: 1px solid transparent; font-weight: 600; transition: background .15s, border-color .15s, color .15s; }
.primary-button, .secondary-button, .text-button, .icon-text-button, .row-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; vertical-align: middle; }
:is(.primary-button,.secondary-button,.text-button,.icon-text-button,.row-button,.icon-button) > :is(svg,i[data-lucide]) { display: block; flex: 0 0 auto; width: 16px; height: 16px; }
.primary-button { min-height: 40px; padding: 0 16px; background: var(--accent); color: var(--accent-ink); }
.primary-button:hover { background: #61e1c5; }
.primary-button.is-loading, .secondary-button.is-loading { opacity: .6; cursor: progress; position: relative; }
.primary-button.is-loading::after, .secondary-button.is-loading::after { content: ""; display: block; flex: 0 0 auto; width: 12px; height: 12px; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: agent-tool-spin .7s linear infinite; }
@keyframes agent-tool-spin { to { transform: rotate(360deg); } }
.secondary-button { min-height: 38px; padding: 0 14px; border-color: #3a4a57; background: transparent; color: var(--ink); }
.secondary-button:hover { border-color: #6f8290; background: rgba(255,255,255,.04); }
.text-button, .icon-text-button { padding: 0; border: 0; background: transparent; color: var(--accent); }
.text-button:hover, .icon-text-button:hover { color: #8df0d7; }
.back-link { margin-top: 20px; color: #74818c; font-size: 12px; text-decoration: none; }
.back-link:hover { color: #167a68; }

.app-shell { min-height: 100vh; background: var(--canvas); }
.sidebar { position: fixed; z-index: 40; inset: 0 auto 0 0; width: var(--sidebar); display: flex; flex-direction: column; padding: 20px 14px 14px; border-right: 1px solid var(--line); background: #101820; }
.console-brand { display: flex; align-items: center; gap: 9px; padding: 0 9px 20px; color: var(--ink); text-decoration: none; }
.console-brand .brand-mark { color: var(--accent); width: 15px; height: 15px; }
.console-brand strong { font-size: 16px; letter-spacing: -.02em; }
.console-brand span:last-child { margin-left: auto; color: var(--faint); font: 600 9px "Roboto Mono", monospace; letter-spacing: .12em; }
.new-chat-button { display: flex; align-items: center; gap: 9px; width: 100%; min-height: 39px; padding: 0 12px; border: 1px solid #36504f; border-radius: 7px; background: #15252a; color: var(--accent); font-weight: 600; }
.new-chat-button span { display: inline-grid; place-items: center; width: 19px; height: 19px; border: 1px solid currentColor; border-radius: 4px; font-size: 17px; line-height: 1; }
.new-chat-button:hover { border-color: var(--accent); background: #1a3033; }
.console-nav { display: grid; gap: 3px; margin-top: 23px; }
.console-nav p { margin: 10px 9px 5px; color: #5f6d79; font: 600 9px "Roboto Mono", monospace; letter-spacing: .12em; text-transform: uppercase; }
.console-nav button,
.console-nav a { display: flex; align-items: center; gap: 11px; width: 100%; min-height: 35px; padding: 0 10px; border: 0; border-radius: 6px; background: transparent; color: #8997a3; text-align: left; text-decoration: none; }
.console-nav button span,
.console-nav a span { width: 16px; color: #6b7a87; text-align: center; font-size: 14px; }
.console-nav button:hover,
.console-nav a:hover { background: #192630; color: var(--ink); }
.console-nav button.active { background: #193a39; color: var(--accent); }
.console-nav button.active span { color: var(--accent); }
.sidebar-status { display: flex; align-items: center; gap: 9px; margin-top: auto; padding: 12px 9px 3px; border-top: 1px solid #22303b; color: #91a0aa; }
.sidebar-status i, .live-indicator i { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px rgba(67,211,180,.12); }
.sidebar-status span { display: grid; gap: 2px; }
.sidebar-status strong { font-size: 10px; font-weight: 600; }
.sidebar-status small { color: #5e6c77; font-size: 9px; }

.console-main { min-height: 100vh; margin-left: var(--sidebar); }
.topbar { position: sticky; z-index: 30; top: 0; display: flex; align-items: center; justify-content: space-between; min-height: 66px; padding: 0 34px; border-bottom: 1px solid var(--line); background: rgba(12,18,24,.94); backdrop-filter: blur(12px); }
.topbar-location { display: grid; gap: 3px; }
.breadcrumb { margin: 0; color: var(--faint); font-size: 10px; }
.topbar-location > strong { font-size: 13px; font-weight: 600; }
.topbar-actions { position: relative; display: flex; align-items: center; gap: 17px; }
.balance-chip { color: var(--muted); font-size: 11px; transition: border-color .15s, background .15s, color .15s; }
.balance-chip b { margin-left: 7px; color: var(--accent); font: 600 11px "Roboto Mono", monospace; }
.user-button { display: flex; align-items: center; gap: 8px; padding: 0; border: 0; background: transparent; color: var(--ink); }
.user-button > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #2b4750; color: var(--accent); font-size: 11px; font-weight: 700; }
.user-button b { max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; font-weight: 600; }
.user-button em { color: var(--muted); font-style: normal; font-size: 13px; }
.user-menu { position: absolute; top: 39px; right: 0; width: 150px; padding: 5px; border: 1px solid var(--line-strong); border-radius: 7px; background: var(--panel-raised); box-shadow: 0 18px 40px rgba(0,0,0,.35); }
.user-menu button { display: block; width: 100%; padding: 9px; border: 0; border-radius: 5px; background: transparent; color: var(--ink); text-align: left; font-size: 11px; }
.user-menu button:hover { background: #23313d; }
.menu-button { display: none; width: 34px; height: 34px; border: 1px solid var(--line-strong); border-radius: 6px; background: transparent; }
.menu-button span { display: block; width: 15px; height: 1px; margin: 4px auto; background: var(--ink); }
.content-shell { max-width: 1480px; margin: 0 auto; padding: 42px 46px 70px; }
.view { display: none; }
.view.active { display: block; }
.view-heading, .workspace-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; margin-bottom: 27px; }
.view-heading h1, .workspace-heading h1 { margin: 0 0 7px; color: var(--ink); font-size: 28px; letter-spacing: -.04em; }
.view-heading p:not(.eyebrow), .workspace-heading p:not(.eyebrow) { margin: 0; color: var(--muted); line-height: 1.5; }
.view-heading .secondary-button, .view-heading .primary-button { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 7px; }
.view-heading .secondary-button svg, .view-heading .primary-button svg { width: 16px; height: 16px; }
.workspace-heading-actions { display: flex; align-items: center; gap: 14px; }
.live-indicator { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; }

.chat-workspace { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); box-shadow: 0 20px 55px rgba(0,0,0,.14); }
.chat-toolbar { display: flex; align-items: flex-end; gap: 18px; min-height: 75px; padding: 15px 18px; border-bottom: 1px solid var(--line); background: #151f28; }
.model-picker, .protocol-picker { display: grid; gap: 6px; }
.field-caption { color: var(--faint); font: 600 9px "Roboto Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.model-picker select { min-width: 220px; height: 35px; min-height: 35px; border-color: var(--line-strong); background: #101820; color: var(--ink); font-size: 11px; }
.protocol-picker .segmented { height: 35px; }
.toolbar-spacer { flex: 1; }
.icon-button { display: inline-grid; place-items: center; vertical-align: middle; width: 33px; height: 33px; border: 1px solid var(--line-strong); border-radius: 6px; background: transparent; color: var(--muted); }
.icon-button:hover { color: var(--ink); border-color: #70818e; }
.segmented { display: flex; align-items: center; padding: 3px; border: 1px solid var(--line-strong); border-radius: 7px; background: #101820; }
.segmented button { min-height: 28px; padding: 0 12px; border: 0; border-radius: 5px; background: transparent; color: var(--muted); font-size: 11px; font-weight: 600; white-space: nowrap; }
.segmented button:hover { color: var(--ink); }
.segmented button.active { background: #2c484b; color: var(--accent); }
.chat-stage { min-height: 450px; max-height: calc(100vh - 360px); overflow-y: auto; padding: 28px clamp(18px, 7vw, 110px) 36px; background: #101820; }
.welcome-message { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 365px; text-align: center; }
.welcome-mark { display: grid; place-items: center; width: 45px; height: 45px; margin-bottom: 18px; border: 1px solid #39615e; border-radius: 12px; color: var(--accent); font-size: 23px; }
.welcome-message h2 { margin: 0 0 8px; color: var(--ink); font-size: 22px; letter-spacing: -.03em; }
.welcome-message p { max-width: 430px; margin: 0; color: var(--muted); line-height: 1.5; }
.prompt-suggestions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 22px; }
.prompt-suggestions button { padding: 9px 11px; border: 1px solid var(--line-strong); border-radius: 6px; background: #151f28; color: #aab7c1; font-size: 11px; }
.prompt-suggestions button:hover { border-color: #4d7f78; color: var(--accent); }
.chat-message { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 12px; max-width: 760px; margin: 0 auto 22px; }
.chat-message.user { grid-template-columns: minmax(0, 1fr) 30px; }
.chat-message.user .message-avatar { order: 2; background: #2f4751; color: #c7e8df; }
.chat-message.user .message-content { order: 1; justify-self: end; max-width: 640px; background: #1c3336; border: 1px solid #294d4a; }
.message-avatar { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: #1e3c3b; color: var(--accent); font: 600 11px "Roboto Mono", monospace; }
.message-content { min-width: 0; padding: 12px 14px; border: 1px solid var(--line); border-radius: 8px; background: #161f28; color: #d9e2e7; line-height: 1.65; white-space: pre-wrap; }
.message-meta { margin-top: 7px; color: var(--faint); font: 9px "Roboto Mono", monospace; }
.composer-shell { padding: 15px 18px 12px; border-top: 1px solid var(--line); background: #151f28; }
.composer-row { display: flex; align-items: flex-end; gap: 10px; max-width: 900px; margin: 0 auto; padding: 10px 10px 10px 14px; border: 1px solid var(--line-strong); border-radius: 9px; background: #101820; }
.composer-row:focus-within { border-color: #4d8078; box-shadow: 0 0 0 3px rgba(67,211,180,.08); }
.composer-row textarea { min-height: 24px; max-height: 160px; padding: 2px 0; border: 0; background: transparent; color: var(--ink); resize: none; box-shadow: none; }
.composer-row textarea:focus { box-shadow: none; }
.composer-row textarea::placeholder { color: #6e7d89; }
.send-button { display: grid; place-items: center; flex: 0 0 auto; width: 32px; height: 32px; border: 0; border-radius: 7px; background: var(--accent); color: var(--accent-ink); font-size: 19px; font-weight: 700; }
.send-button:hover { background: #61e1c5; }
.composer-footer { display: flex; align-items: center; gap: 13px; max-width: 900px; margin: 8px auto 0; color: var(--faint); font: 9px "Roboto Mono", monospace; }
.composer-footer #request-state { color: #9ba9b3; }
.composer-footer .max-output { display: flex; align-items: center; gap: 7px; margin-left: auto; color: var(--faint); }
.max-output input { width: 60px; min-height: 25px; height: 25px; padding: 0 7px; border-color: var(--line-strong); background: #101820; color: var(--ink); font: 10px "Roboto Mono", monospace; }
.composer-footer .text-button { font: 9px "Roboto Mono", monospace; }

.metrics-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 11px; margin-bottom: 15px; }
.metrics-grid article { display: grid; gap: 12px; min-height: 136px; padding: 18px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.metrics-grid article span { color: var(--muted); font-size: 11px; }
.metrics-grid strong { font: 600 27px "Roboto Mono", monospace; letter-spacing: -.06em; }
.metrics-grid small { color: var(--faint); font-size: 10px; }
.overview-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(260px, 1fr); gap: 15px; margin-bottom: 15px; }
.data-section { overflow: hidden; margin-bottom: 15px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.section-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; padding: 18px 20px; border-bottom: 1px solid var(--line); }
.section-title h2 { margin: 0 0 5px; font-size: 14px; }
.section-title p { margin: 0; color: var(--muted); font-size: 11px; }
.usage-chart { display: flex; align-items: flex-end; gap: 9px; height: 180px; padding: 20px; }
.chart-bar { position: relative; flex: 1; min-width: 5px; max-width: 42px; border-radius: 4px 4px 2px 2px; background: #3c7d76; }
.chart-bar span { position: absolute; top: calc(100% + 7px); left: 50%; transform: translateX(-50%); color: var(--faint); font: 8px "Roboto Mono", monospace; white-space: nowrap; }
.quickstart-section { padding-bottom: 17px; }
.quickstart-section > code { display: block; margin: 19px 20px; padding: 11px; overflow: auto; border: 1px solid var(--line); border-radius: 6px; background: #101820; color: var(--accent); font: 10px "Roboto Mono", monospace; white-space: nowrap; }
.quickstart-section ol { display: grid; gap: 9px; margin: 0 20px 18px; padding-left: 18px; color: var(--muted); font-size: 11px; }
.quickstart-section li::marker { color: var(--accent); font-family: "Roboto Mono", monospace; }
.quickstart-section .text-button { margin-left: 20px; }

.notice { display: flex; align-items: center; gap: 12px; margin-bottom: 15px; padding: 13px 15px; border: 1px solid #3c5d60; border-radius: 7px; background: #18282c; color: #9bb4b2; font-size: 11px; }
.notice strong { color: var(--accent); }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 670px; }
th, td { padding: 13px 15px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
th { color: var(--faint); font: 600 9px "Roboto Mono", monospace; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
td { color: #b8c4cc; font-size: 11px; }
tbody tr:last-child td { border-bottom: 0; }
td strong { color: var(--ink); font-weight: 600; }
code, pre { font-family: "Roboto Mono", monospace; }
td code { color: #94d8c8; font-size: 10px; }
.capability-pill, .status-pill { display: inline-block; margin: 2px 4px 2px 0; padding: 3px 6px; border: 1px solid #35565a; border-radius: 4px; background: #183035; color: #9dd8cd; font: 9px "Roboto Mono", monospace; }
.status-pill { border-color: #3b5a47; background: #1c3026; color: #a9d9af; text-transform: capitalize; }
.row-button { min-height: 27px; padding: 0 9px; border-color: var(--line-strong); background: transparent; color: var(--muted); font-size: 10px; }
.row-button:hover { border-color: var(--accent); color: var(--accent); }
.row-button.danger:hover { border-color: var(--danger); color: var(--danger); }
.row-actions { display: flex; gap: 6px; }
.key-row-actions { flex-wrap: wrap; min-width: 140px; }
.key-row-actions button:disabled { opacity: .5; cursor: wait; }
.app-shell .api-key-security { margin: 0 0 20px; overflow: hidden; border: 1px solid #dce5ed; border-radius: 14px; background: #fff; color: #34465a; }
.api-key-security > summary { display: flex; align-items: center; gap: 10px; padding: 15px 18px; cursor: pointer; list-style: none; font-weight: 600; line-height: 1.6; }
.api-key-security > summary::-webkit-details-marker { display: none; }
.api-key-security > summary:hover { background: #f5f8fb; }
.api-key-security > summary > svg { width: 18px; height: 18px; flex: 0 0 18px; color: #326b9b; }
.api-key-security > summary > span { flex: 1; min-width: 0; }
.api-key-security > summary > .api-key-security-chevron { width: 16px; height: 16px; flex-basis: 16px; color: #697c90; }
.api-key-security[open] > summary { background: #f5f8fb; border-bottom: 1px solid #e6edf3; }
.api-key-security[open] > summary > .api-key-security-chevron { transform: rotate(180deg); }
.api-key-security-content { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px 28px; padding: 20px; }
.api-key-security-content h3 { margin: 0 0 8px; color: #22364c; font-size: 13px; line-height: 1.6; }
.api-key-security-content p { margin: 0; color: #526477; font-size: 13px; line-height: 1.85; overflow-wrap: anywhere; }
.api-key-security-example { grid-column: 1 / -1; padding: 16px 18px; border-radius: 10px; background: #f6f8fa; }
.api-key-security-sources { display: flex; flex-wrap: wrap; gap: 0 22px; }
.api-key-security-source { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; color: #235e9c; font-size: 12px; line-height: 1.6; text-underline-offset: 3px; }
.api-key-security-source:hover { color: #173f6b; }
.api-key-security-source svg { width: 14px; height: 14px; flex: 0 0 14px; }
@media (max-width: 640px) {
  .api-key-security > summary { padding: 14px; }
  .api-key-security-content { grid-template-columns: minmax(0,1fr); gap: 20px; padding: 16px; }
  .api-key-security-example { padding: 14px; }
}
.table-note { color: var(--faint); font-size: 10px; }
.usage-request-identity { display: inline-flex; align-items: center; gap: 6px; min-width: 210px; max-width: 100%; vertical-align: middle; }
.usage-request-identity > code { display: block; min-width: 0; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .usage-request-copy { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 24px; min-width: 24px; height: 24px; min-height: 24px; padding: 0; border: 0; border-radius: 5px; background: transparent; color: #64748b; box-shadow: none; cursor: pointer; }
.app-shell .usage-request-copy:hover { background: #edf4fb; color: #1769aa; }
.app-shell .usage-request-copy:focus-visible { outline: 2px solid #1685ee; outline-offset: 2px; }
.usage-request-copy svg { display: block; width: 12px; height: 12px; pointer-events: none; }
@media(pointer:coarse) { .app-shell .usage-request-copy { width: 30px; min-width: 30px; height: 30px; min-height: 30px; } }
.usage-request-ip { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin-top: 6px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.usage-request-ip > span:first-child { white-space: nowrap; }
.usage-request-ip code { min-width: 0; color: inherit; overflow-wrap: anywhere; white-space: normal; }
.empty-row td { padding: 30px 15px; color: var(--faint); text-align: center; }
.search-field { width: 210px; }
.search-field input { margin-top: 0; border-color: var(--line-strong); background: var(--panel); color: var(--ink); }
.balance-band { display: grid; gap: 6px; margin-bottom: 15px; padding: 24px; border: 1px solid #345c59; border-radius: 8px; background: #172a2c; }
.balance-band span { color: #a7bfbd; font-size: 11px; }
.balance-band strong { color: var(--accent); font: 600 32px "Roboto Mono", monospace; letter-spacing: -.06em; }
.balance-band small { color: #6f8f8c; font-size: 10px; }
.settings-form { max-width: 720px; padding: 22px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.form-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-bottom: 15px; }
.settings-form label, .admin-form label, .search-field { color: var(--muted); }
.settings-form input, .admin-form input, .admin-form select { border-color: var(--line-strong); background: #101820; color: var(--ink); }
.form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 13px; margin-top: 22px; }
#profile-status { color: var(--accent); font: 10px "Roboto Mono", monospace; }
.admin-panel { display: none; }
.admin-panel.active { display: block; }
.admin-form { display: grid; grid-template-columns: repeat(4, 1fr); align-items: end; gap: 13px; margin-bottom: 15px; padding: 17px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.admin-form h2 { grid-column: 1 / -1; margin: 0; font-size: 14px; }
.admin-form .primary-button { min-height: 40px; }
.logo-picker-control { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 8px; }
.logo-preview, .admin-table-logo { position: relative; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--line-strong); border-radius: 7px; background: #f7f8f8; color: #26333a; font-size: 11px; font-weight: 700; }
.logo-preview { width: 40px; height: 40px; }
.admin-table-logo { width: 30px; height: 30px; }
.logo-preview img, .admin-table-logo img { position: absolute; inset: 0; width: 100%; height: 100%; padding: 6px; background: #f7f8f8; object-fit: contain; }
.admin-table-logo img { padding: 5px; }

.dialog-body { width: min(460px, calc(100vw - 30px)); padding: 23px; border: 1px solid var(--line-strong); border-radius: 9px; background: var(--panel-raised); color: var(--ink); box-shadow: 0 25px 70px rgba(0,0,0,.45); }
dialog { padding: 0; border: 0; background: transparent; color: var(--ink); }
dialog::backdrop { background: rgba(0,0,0,.65); }
.dialog-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 21px; }
.dialog-heading h2 { margin: 0; font-size: 16px; }
.dialog-heading button { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; background: transparent; color: var(--muted); line-height: 1; }
.dialog-heading button svg { display: block; width: 18px; height: 18px; }
.dialog-body label { display: grid; gap: 7px; color: var(--muted); font-size: 11px; font-weight: 600; }
.dialog-body input { border-color: var(--line-strong); background: #101820; color: var(--ink); }
.dialog-body > p { color: var(--muted); font-size: 11px; line-height: 1.5; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 22px; }
.secret-key { display: flex; align-items: center; gap: 8px; padding: 9px; border: 1px solid #39565d; border-radius: 6px; background: #101820; }
.secret-key code { flex: 1; overflow: auto; color: var(--accent); font-size: 10px; white-space: nowrap; }
.secret-key button { min-height: 28px; padding: 0 9px; border: 1px solid var(--line-strong); border-radius: 5px; background: transparent; color: var(--muted); font-size: 10px; }
.toast { position: fixed; z-index: 100; right: 24px; bottom: 24px; max-width: 350px; padding: 11px 14px; border: 1px solid #3d565d; border-radius: 7px; background: #17262d; color: var(--ink); box-shadow: 0 14px 35px rgba(0,0,0,.35); font-size: 11px; opacity: 0; pointer-events: none; transform: translateY(10px); transition: .18s; }
.toast.show { opacity: 1; transform: none; }

@media (max-width: 1120px) {
  .content-shell { padding-inline: 28px; }
  .metrics-grid { grid-template-columns: repeat(2, 1fr); }
  .overview-grid { grid-template-columns: 1fr; }
  .admin-form { grid-template-columns: repeat(2, 1fr); }
  .chat-stage { padding-inline: 32px; }
}
@media (max-width: 820px) {
  :root { --sidebar: 252px; }
  .sidebar { left: calc(-1 * var(--sidebar)); box-shadow: 12px 0 35px rgba(0,0,0,.38); transition: left .2s; }
  body.sidebar-open .sidebar { left: 0; }
  body.sidebar-open::after { position: fixed; z-index: 35; inset: 0; background: rgba(0,0,0,.46); content: ""; }
  .console-main { margin-left: 0; }
  .menu-button { display: block; }
  .topbar { padding-inline: 18px; }
  .topbar-location { margin-right: auto; margin-left: 12px; }
  .content-shell { padding: 30px 18px 55px; }
  .workspace-heading, .view-heading { align-items: flex-start; flex-direction: column; }
  .workspace-heading-actions { align-self: stretch; justify-content: space-between; }
  .chat-toolbar { align-items: stretch; flex-wrap: wrap; }
  .model-picker { flex: 1; min-width: 180px; }
  .protocol-picker { width: 100%; }
  .protocol-picker .segmented { overflow-x: auto; }
  .toolbar-spacer { display: none; }
  .chat-stage { min-height: 430px; max-height: calc(100vh - 395px); padding-inline: 18px; }
  .composer-footer { flex-wrap: wrap; }
  .composer-footer .max-output { margin-left: 0; }
  .form-row { grid-template-columns: 1fr; }
  .search-field { width: 100%; }
}
@media (max-width: 560px) {
  .auth-shell { padding: 18px; }
  .auth-panel { padding: 27px 22px; }
  .auth-brand span:last-child { display: none; }
  .topbar { min-height: 58px; }
  .breadcrumb, #page-title, .balance-chip, .user-button b, .user-button em { display: none; }
  .topbar-location { margin-left: 10px; }
  .content-shell { padding-inline: 13px; }
  .workspace-heading h1, .view-heading h1 { font-size: 25px; }
  .chat-toolbar { padding: 13px; }
  .model-picker { min-width: 0; width: 100%; }
  .model-picker select { min-width: 0; }
  .chat-stage { min-height: 390px; max-height: calc(100vh - 405px); padding: 20px 12px; }
  .welcome-message { min-height: 330px; }
  .welcome-message h2 { font-size: 20px; }
  .prompt-suggestions { flex-direction: column; align-items: stretch; width: min(280px, 100%); }
  .prompt-suggestions button { text-align: left; }
  .composer-shell { padding: 12px 10px 10px; }
  .composer-footer { gap: 8px; }
  .composer-footer #protocol-endpoint { display: none; }
  .metrics-grid { gap: 8px; }
  .metrics-grid article { min-height: 110px; padding: 14px; }
  .metrics-grid strong { font-size: 21px; }
  .admin-form { grid-template-columns: 1fr; }
  .notice { align-items: flex-start; flex-direction: column; gap: 5px; }
  .toast { right: 13px; bottom: 13px; left: 13px; max-width: none; }
}

/* 2026 workspace refresh */
:root {
  --accent: #63ddbc;
  --accent-ink: #071713;
  --warm: #f2b36b;
  --coral: #f07c62;
  --canvas: #0d110f;
  --panel: #141916;
  --panel-raised: #1a211d;
  --line: #29322d;
  --line-strong: #3b4841;
  --ink: #eef3f0;
  --muted: #9aa7a0;
  --faint: #6d7a73;
}
body { font-size: 14px; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.auth-shell { display: block; min-height: 100vh; padding: 0; background: #edf1ee; color: #172019; }
.auth-layout { display: grid; grid-template-columns: minmax(420px, .9fr) minmax(520px, 1.1fr); min-height: 100vh; }
.auth-aside { position: relative; display: flex; min-height: 100vh; flex-direction: column; overflow: hidden; padding: 42px 52px; background: #111714; color: #eef3f0; }
.auth-aside::before, .auth-aside::after { position: absolute; z-index: 0; border: 1px solid #25332c; content: ""; pointer-events: none; }
.auth-aside::before { inset: 106px 52px 86px; }
.auth-aside::after { top: 106px; bottom: 86px; left: 50%; }
.auth-aside > * { position: relative; z-index: 1; }
.auth-aside .auth-brand { margin: 0; color: #eef3f0; }
.auth-aside .auth-brand .brand-mark { color: var(--accent); }
.auth-aside .auth-brand span:last-child { color: #79877f; }
.auth-aside-copy { max-width: 540px; margin: auto 0 38px; padding-top: 72px; }
.auth-aside-copy .eyebrow { margin-bottom: 18px; }
.auth-aside-copy h1 { margin: 0; color: #f4f7f5; font-size: 52px; font-weight: 600; line-height: 1.04; letter-spacing: -.04em; }
.auth-aside-copy > p:last-child { max-width: 470px; margin: 22px 0 0; color: #99a89f; font-size: 16px; line-height: 1.65; }
.auth-route-map { display: grid; grid-template-columns: repeat(3, minmax(74px, 1fr)); gap: 9px; max-width: 500px; margin-bottom: auto; }
.auth-route-map span, .auth-route-map strong { display: grid; min-height: 44px; place-items: center; border: 1px solid #303c36; background: #151c18; color: #9ba8a1; font: 500 11px "Roboto Mono", monospace; }
.auth-route-map strong { grid-column: 1 / -1; border-color: #487064; background: #192721; color: var(--accent); letter-spacing: .04em; }
.auth-route-map i { grid-column: 1 / -1; width: 1px; height: 16px; justify-self: center; background: #46685e; }
.auth-aside-status { display: flex; align-items: center; gap: 11px; margin-top: 34px; color: #aab7b0; }
.auth-aside-status > i { width: 8px; height: 8px; border-radius: 50%; background: #6be0a7; box-shadow: 0 0 0 4px rgba(107,224,167,.1); }
.auth-aside-status span { display: grid; gap: 3px; }
.auth-aside-status strong { font-size: 11px; }
.auth-aside-status small { color: #69766f; font-size: 10px; }
.auth-main { display: flex; min-height: 100vh; flex-direction: column; align-items: center; justify-content: center; padding: 48px 64px; }
.auth-brand-mobile { display: none; }
.auth-panel { width: min(420px, 100%); padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.auth-panel-header { margin-bottom: 30px; }
.auth-panel-header h2 { margin: 0 0 10px; color: #172019; font-size: 34px; font-weight: 600; line-height: 1.1; letter-spacing: -.04em; }
.auth-panel-header p:last-child { color: #68756e; font-size: 14px; }
.auth-tabs { width: 100%; margin-bottom: 27px; padding: 4px; border: 1px solid #d3dbd6; background: #e4e9e6; }
.auth-tabs button { flex: 1; min-height: 34px; color: #6d7872; }
.auth-tabs button.active { background: #fff; color: #172019; box-shadow: 0 1px 4px rgba(23,32,25,.08); }
.auth-panel label { gap: 8px; color: #46534c; font-size: 12px; }
.auth-panel form { gap: 18px; }
.auth-panel input:not([type="checkbox"]) { min-height: 46px; border-color: #c8d1cb; background: #f8faf8; }
.auth-panel input:not([type="checkbox"]):focus { border-color: #2da787; background: #fff; }
.auth-panel .terms-check { color: #69766f !important; font-size: 11px !important; }
.auth-panel .primary-button { min-height: 46px; margin-top: 2px; background: #18372f; color: #f1f6f3; }
.auth-panel .primary-button:hover { background: #235246; }
.auth-main .back-link { margin-top: 28px; color: #6c7972; }
.auth-main .back-link:hover { color: #1b6957; }

.sidebar { background: #101512; border-color: #27302b; }
.console-brand { min-height: 46px; }
.console-brand span:last-child { color: #718077; }
.new-chat-button { border-color: #3d5d52; background: #17241f; color: #79e5c4; }
.console-nav p { color: #65736b; }
.console-nav button,
.console-nav a { color: #a2ada7; }
.console-nav button span { color: #77847d; }
.console-nav button:hover,
.console-nav a:hover { background: #1b231f; }
.console-nav button.active { background: #20382f; color: #78e4c3; box-shadow: inset 2px 0 #78e4c3; }
.sidebar-status { border-color: #28312c; }
.console-main { background: #0d110f; }
.topbar { min-height: 68px; border-color: #29312d; background: rgba(13,17,15,.94); }
.balance-chip { padding: 7px 10px; border: 1px solid #333c37; border-radius: 6px; background: #131815; }
.balance-chip b { color: var(--warm); }
.user-button > span { background: #33281e; color: #ffc27e; }
.content-shell { padding-top: 38px; }
.workspace-heading h1, .view-heading h1 { font-size: 31px; }
.workspace-heading p:not(.eyebrow), .view-heading p:not(.eyebrow) { font-size: 14px; }
.live-indicator i { background: #72dfa7; }
.chat-workspace { position: relative; border-color: #344039; border-radius: 8px; background: #121713; box-shadow: 0 22px 60px rgba(0,0,0,.22); }
.chat-toolbar { min-height: 78px; border-color: #2e3933; background: #171d19; }
.model-picker select, .max-output input { border-color: #3d4942; background: #101411; }
.segmented { border-color: #3b4841; background: #101411; }
.segmented button.active { background: #244239; color: #80e5c5; }
.icon-button { border-color: #3d4942; }
.icon-button[aria-expanded="true"] { border-color: var(--accent); background: #20352e; color: var(--accent); }
.chat-stage { background: #101411; scrollbar-color: #3a4740 transparent; }
.welcome-mark { border-color: #4c786a; background: #17241f; color: #74e3c1; }
.welcome-message h2 { font-size: 24px; }
.prompt-suggestions button { border-color: #36423b; background: #171d19; }
.prompt-suggestions button:nth-child(2) { border-color: #514333; color: #d5b17f; }
.prompt-suggestions button:nth-child(3) { border-color: #4d3834; color: #d89b8e; }
.prompt-suggestions button:hover { border-color: #6eae9c; background: #1d2823; }
.message-content { border-color: #313b35; background: #171d19; }
.chat-message.user .message-content { border-color: #59452f; background: #241e17; }
.chat-message.user .message-avatar { background: #3a2c20; color: #ffc181; }
.composer-shell { border-color: #2f3934; background: #171d19; }
.composer-row { border-color: #404c45; background: #101411; }
.send-button { background: #69dfbe; }
.send-button:hover { background: #89e8cc; }
.chat-settings-panel { position: absolute; z-index: 12; top: 78px; right: 0; width: min(370px, 100%); min-height: calc(100% - 78px); padding: 22px; border-left: 1px solid #3a4640; background: #171d19; box-shadow: -22px 0 45px rgba(0,0,0,.3); }
.settings-panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 25px; padding-bottom: 17px; border-bottom: 1px solid #303a35; }
.settings-panel-heading h2 { margin: 6px 0 0; font-size: 17px; }
.settings-panel-heading button { width: 30px; height: 30px; border: 1px solid #3a4640; border-radius: 6px; background: transparent; color: #9ba8a1; }
.chat-settings-panel label { display: grid; gap: 8px; margin-bottom: 17px; color: #a6b2ac; font-size: 11px; font-weight: 600; }
.chat-settings-panel textarea, .chat-settings-panel input { border-color: #3d4942; background: #101411; color: #eaf0ed; }
.chat-settings-panel > p { margin: 4px 0 0; color: #748079; font-size: 10px; line-height: 1.5; }
.metrics-grid article:nth-child(1) { border-top-color: #5c9b88; }
.metrics-grid article:nth-child(2) { border-top-color: #567ea1; }
.metrics-grid article:nth-child(3) { border-top-color: #a87c4d; }
.metrics-grid article:nth-child(4) { border-top-color: #9d6154; }
.data-section, .metrics-grid article, .settings-form, .admin-form { background: #141916; }
.chart-bar { background: #5bbd9f; }
.status-pill { border-color: #426750; background: #18291f; color: #87d89c; }
.capability-pill { border-color: #40564f; background: #19241f; color: #9bcbbd; }
.notice { border-color: #53613e; background: #202418; color: #bbc7a7; }
.notice strong { color: #d5d987; }

@media (max-width: 980px) {
  .auth-layout { grid-template-columns: minmax(350px, .8fr) minmax(460px, 1.2fr); }
  .auth-aside { padding: 36px; }
  .auth-aside-copy h1 { font-size: 43px; }
  .auth-main { padding-inline: 44px; }
}
@media (max-width: 780px) {
  .auth-layout { display: block; }
  .auth-aside { display: none; }
  .auth-main { min-height: 100vh; padding: 34px 24px; }
  .auth-brand-mobile { display: flex; margin-bottom: 46px; align-self: flex-start; }
  .auth-panel { margin: auto 0; }
  .auth-main .back-link { margin-top: 42px; }
}
@media (max-width: 560px) {
  body { font-size: 13px; }
  .auth-main { align-items: stretch; padding: 25px 20px; }
  .auth-brand-mobile { margin-bottom: 34px; }
  .auth-panel-header h2 { font-size: 30px; }
  .workspace-heading h1, .view-heading h1 { font-size: 27px; }
  .chat-settings-panel { top: 131px; min-height: calc(100% - 131px); }
}
.chat-stage { min-height: 280px; height: calc(100vh - 440px); max-height: 560px; }
@supports (height: 100dvh) {
  .chat-stage { height: calc(100dvh - 440px); }
}
@media (max-width: 820px) {
  .chat-stage { min-height: 330px; height: calc(100vh - 470px); }
  @supports (height: 100dvh) {
    .chat-stage { height: calc(100dvh - 470px); }
  }
}
@media (max-width: 560px) {
  .chat-stage { min-height: 320px; height: calc(100vh - 485px); }
  @supports (height: 100dvh) {
    .chat-stage { height: calc(100dvh - 485px); }
  }
}
.welcome-message { min-height: 100%; }
@media (max-width: 560px) {
  .content-shell { padding-top: 26px; padding-bottom: 24px; }
  .workspace-heading { gap: 16px; margin-bottom: 18px; }
  .workspace-heading-actions { width: 100%; }
  .chat-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; min-height: 0; padding: 13px; }
  .model-picker { grid-column: 1 / -1; }
  .protocol-picker { grid-column: 1; width: 100%; }
  .protocol-picker .segmented { width: 100%; overflow: visible; }
  .protocol-picker .segmented button { flex: 1; min-width: 0; padding-inline: 7px; }
  .chat-toolbar .icon-button { grid-column: 2; align-self: end; }
  .chat-stage { min-height: 260px; height: calc(100vh - 580px); }
  @supports (height: 100dvh) {
    .chat-stage { height: calc(100dvh - 580px); }
  }
  .chat-settings-panel { top: 141px; min-height: calc(100% - 141px); }
}

/* Homepage-aligned authentication experience. */
.auth-shell {
  --auth-blue: #1687e8;
  --accent: #1687e8;
  --accent-ink: #ffffff;
  --auth-ink: #0a0a0a;
  --auth-muted: #737373;
  --auth-line: #e5e5e5;
  display: flex;
  width: 100%;
  min-height: 100vh;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  padding: 0;
  background: #fff;
  color: var(--auth-ink);
  font-family: Inter, Arial, sans-serif;
}
.auth-header { position: relative; z-index: 10; flex: 0 0 64px; border-bottom: 1px solid var(--auth-line); background: rgba(255,255,255,.96); }
.auth-nav { display: grid; width: min(1440px, calc(100% - 48px)); height: 64px; grid-template-columns: auto 1fr; align-items: center; gap: 34px; margin-inline: auto; }
.auth-home-logo { display: inline-flex; align-items: center; gap: 10px; width: max-content; color: var(--auth-ink); font-size: 24px; line-height: 1; text-decoration: none; }
.auth-home-logo strong { font-weight: 700; letter-spacing: 0; }
.auth-home-logo-mark { position: relative; display: inline-block; flex: 0 0 auto; width: 18px; height: 18px; color: currentColor; transform: rotate(45deg); }
.auth-home-logo-mark::before { position: absolute; top: 1px; left: 1px; width: 7px; height: 7px; border-radius: 3px 1px 1px; background: currentColor; box-shadow: 9px 0 0 currentColor, 0 9px 0 currentColor, 9px 9px 0 currentColor; content: ""; }
.auth-nav-links { display: flex; align-items: center; justify-content: flex-end; gap: 31px; height: 100%; }
.auth-nav-links a { display: flex; height: 100%; align-items: center; color: var(--auth-muted); font-size: 14px; font-weight: 500; text-decoration: none; }
.auth-nav-links a:hover { color: var(--auth-ink); }

.auth-layout { display: grid; flex: 1; min-height: calc(100vh - 64px); grid-template-columns: minmax(0, 1.16fr) minmax(470px, .84fr); }
.auth-aside { position: relative; display: flex; min-height: calc(100vh - 64px); flex-direction: column; overflow: hidden; padding: clamp(44px, 5vw, 72px); background: var(--auth-blue); color: #fff; }
.auth-aside::before, .auth-aside::after { position: absolute; z-index: 0; border: 1px solid rgba(255,255,255,.2); content: ""; pointer-events: none; }
.auth-aside::before { inset: 28px; }
.auth-aside::after { top: 28px; bottom: 28px; left: 50%; }
.auth-aside > * { position: relative; z-index: 1; }
.auth-aside-copy { max-width: 660px; margin: 0; padding-top: 8px; }
.auth-aside-copy .eyebrow { margin: 0 0 20px; color: rgba(255,255,255,.78); font-size: 12px; letter-spacing: 0; }
.auth-aside-copy h1 { margin: 0; color: #fff; font-size: clamp(48px, 5vw, 68px); font-weight: 700; line-height: 1.03; letter-spacing: 0; }
.auth-aside-copy > p:last-child { max-width: 540px; margin: 24px 0 0; color: rgba(255,255,255,.78); font-size: 17px; line-height: 1.65; }
.auth-route-map { display: grid; max-width: 620px; grid-template-columns: repeat(3, minmax(90px, 1fr)); gap: 9px; margin: auto 0 28px; }
.auth-route-map span, .auth-route-map strong { display: grid; min-height: 48px; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 8px; background: rgba(255,255,255,.1); color: #fff; font: 600 12px "Roboto Mono", monospace; letter-spacing: 0; }
.auth-route-map strong { grid-column: 1 / -1; border-color: #fff; background: #fff; color: var(--auth-ink); }
.auth-route-map i { grid-column: 1 / -1; width: 1px; height: 18px; justify-self: center; background: rgba(255,255,255,.55); }
.auth-aside-status { display: flex; align-items: center; gap: 11px; margin-top: 0; color: rgba(255,255,255,.88); }
.auth-aside-status > i { width: 8px; height: 8px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 4px rgba(255,255,255,.16); }
.auth-aside-status span { display: grid; gap: 3px; }
.auth-aside-status strong { font-size: 12px; }
.auth-aside-status small { color: rgba(255,255,255,.64); font-size: 11px; }
.auth-main { display: flex; min-height: calc(100vh - 64px); flex-direction: column; align-items: center; justify-content: center; padding: 48px clamp(42px, 5vw, 76px); background: #fff; }
.auth-panel { width: min(480px, 100%); padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.auth-panel-header { margin-bottom: 28px; }
.auth-panel-header .eyebrow { margin-bottom: 12px; color: var(--auth-blue); font-size: 12px; letter-spacing: 0; }
.auth-panel-header h2 { margin: 0 0 12px; color: var(--auth-ink); font-size: 40px; font-weight: 700; line-height: 1.1; letter-spacing: 0; }
.auth-panel-header p:last-child { margin: 0; color: var(--auth-muted); font-size: 15px; line-height: 1.6; }
.auth-tabs { width: 100%; margin-bottom: 25px; padding: 4px; border: 1px solid var(--auth-line); border-radius: 8px; background: #f5f5f5; }
.auth-tabs button { flex: 1; min-height: 40px; border-radius: 6px; color: var(--auth-muted); font-size: 14px; }
.auth-tabs button:hover { background: #e5e5e5; color: var(--auth-ink); }
.auth-tabs button.active,
.auth-tabs button.active:hover { background: var(--auth-ink); color: #fff; box-shadow: none; }
.auth-panel form { display: grid; gap: 18px; }
.auth-panel label { gap: 8px; color: #404040; font-size: 14px; font-weight: 600; }
.auth-panel .auth-password-help { color: #737373; font-size: 12px; font-weight: 400; line-height: 1.45; }
.auth-panel input:not([type="checkbox"]) { min-height: 52px; padding-inline: 14px; border-color: #d4d4d4; border-radius: 8px; background: #fff; color: var(--auth-ink); font-size: 15px; }
.auth-panel input:not([type="checkbox"]):focus { border-color: var(--auth-ink); background: #fff; box-shadow: 0 0 0 3px rgba(10,10,10,.08); }
.auth-panel .terms-check { align-items: flex-start; gap: 10px !important; color: #525252 !important; font-size: 13px !important; line-height: 1.55; }
.auth-panel .terms-check input { width: 18px; min-height: 18px; margin-top: 1px; accent-color: var(--auth-ink); }
.auth-panel .terms-check a { color: var(--auth-ink); text-underline-offset: 3px; }
.auth-panel .form-error { min-height: 17px; margin-top: -5px; font-size: 13px; }
.auth-panel .form-success { font-size: 13px; }
.auth-panel .primary-button { min-height: 50px; margin-top: 0; border-radius: 8px; background: var(--auth-ink); color: #fff; font-size: 15px; }
.auth-panel .primary-button:hover { background: #262626; }
.auth-oauth { display: grid; gap: 14px; margin-top: 22px; }
.auth-oauth-divider { display: flex; align-items: center; gap: 12px; color: var(--auth-muted); font-size: 12px; }
.auth-oauth-divider::before,.auth-oauth-divider::after { height: 1px; flex: 1; background: var(--auth-line); content: ""; }
.auth-oauth-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.auth-oauth-actions:has(.oauth-button[hidden]) { grid-template-columns: 1fr; }
.oauth-button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 9px; border: 1px solid #d4d4d4; border-radius: 8px; background: #fff; color: var(--auth-ink); font-size: 14px; font-weight: 600; }
.oauth-button:hover { border-color: #a3a3a3; background: #fafafa; }
.oauth-button svg { width: 18px; height: 18px; }
.oauth-button .oauth-github-mark { display: block; flex: 0 0 auto; width: 20px; height: 20px; }
.oauth-google-icon { display: block; flex: 0 0 auto; width: 18px; height: 18px; object-fit: contain; }
.auth-main .back-link { margin-top: 26px; color: var(--auth-muted); font-size: 14px; text-underline-offset: 4px; }
.auth-main .back-link:hover { color: var(--auth-ink); }
.auth-panel .auth-availability-note { display: flex; align-items: flex-start; gap: 10px; margin: 0; padding: 12px 14px; border: 1px solid rgba(22, 135, 232, 0.24); border-radius: 8px; background: rgba(22, 135, 232, 0.07); color: #525252; font-size: 12.5px; line-height: 1.6; }
.auth-panel .auth-availability-note svg { flex: 0 0 auto; width: 16px; height: 16px; margin-top: 2px; color: var(--auth-blue); }

@media (max-width: 980px) {
  .auth-layout { grid-template-columns: minmax(0, .95fr) minmax(440px, 1.05fr); }
  .auth-aside { padding: 42px 36px; }
  .auth-aside-copy h1 { font-size: 49px; }
  .auth-main { padding-inline: 40px; }
}
@media (max-width: 780px) {
  .auth-nav { gap: 22px; }
  .auth-nav-links { justify-content: flex-end; }
  .auth-layout { display: block; }
  .auth-aside { display: none; }
  .auth-main { min-height: calc(100vh - 64px); padding: 44px 24px; }
  .auth-panel { margin: auto 0; }
}
@media (max-width: 560px) {
  .auth-header, .auth-nav { height: 58px; }
  .auth-header { flex-basis: 58px; }
  .auth-nav { display: flex; width: calc(100% - 32px); }
  .auth-home-logo { font-size: 22px; }
  .auth-nav-links { display: none; }

  .auth-main { min-height: calc(100vh - 58px); padding: 34px 20px; }
  .auth-panel-header h2 { font-size: 34px; }
  .auth-panel-header p:last-child { font-size: 14px; }
  .auth-panel label { font-size: 13px; }
  .auth-panel input:not([type="checkbox"]) { min-height: 50px; }
}
@media (min-width: 781px) and (max-height: 800px) {
  .auth-shell:has(.register-field:not([hidden])) .auth-main { justify-content: flex-start; padding-block: 24px; }
  .auth-shell:has(.register-field:not([hidden])) .auth-panel-header { margin-bottom: 18px; }
  .auth-shell:has(.register-field:not([hidden])) .auth-panel-header h2 { font-size: 36px; }
  .auth-shell:has(.register-field:not([hidden])) .auth-tabs { margin-bottom: 18px; }
  .auth-shell:has(.register-field:not([hidden])) .auth-panel form { gap: 13px; }
  .auth-shell:has(.register-field:not([hidden])) .auth-panel input:not([type="checkbox"]) { min-height: 46px; }
  .auth-shell:has(.register-field:not([hidden])) .auth-panel .primary-button { min-height: 46px; }
  .auth-shell:has(.register-field:not([hidden])) .auth-main .back-link { margin-top: 14px; }
  .auth-shell:has(.register-field:not([hidden])) .auth-availability-note { padding-block: 9px; }
}
/* Homepage-aligned authenticated console. */
.app-shell {
  --sidebar: 260px;
  --accent: #1687e8;
  --accent-ink: #ffffff;
  --blue: #1687e8;
  --danger: #dc2626;
  --canvas: #f7f8fa;
  --panel: #ffffff;
  --panel-raised: #ffffff;
  --line: #e5e5e5;
  --line-strong: #d4d4d4;
  --ink: #0a0a0a;
  --muted: #737373;
  --faint: #a3a3a3;
  min-height: 100vh;
  background: var(--canvas);
  color: var(--ink);
  font-family: Inter, Arial, sans-serif;
  font-size: 15px;
}
body:has(.app-shell:not([hidden])) { background: #f7f8fa; }
.app-shell button:focus-visible,
.app-shell a:focus-visible,
.app-shell input:focus-visible,
.app-shell select:focus-visible,
.app-shell textarea:focus-visible { outline-color: var(--accent); }
.app-shell .eyebrow { color: var(--accent); font-size: 11px; letter-spacing: 0; }
.app-shell .sidebar { width: var(--sidebar); overflow-y: auto; padding: 20px 12px 14px; border-color: #e5e7eb; background: #fff; color: #171717; scrollbar-width: thin; }
.app-shell .console-brand { min-height: 44px; gap: 10px; padding: 0 8px; color: #171717; text-decoration: none; }
.app-shell .console-brand .brand-mark { position: relative; width: 17px; height: 17px; border: 0; border-radius: 0; color: #171717; transform: rotate(45deg); }
.app-shell .console-brand .brand-mark::after { top: 1px; left: 1px; width: 7px; height: 7px; border-radius: 3px 1px 1px; background: currentColor; box-shadow: 9px 0 0 currentColor, 0 9px 0 currentColor, 9px 9px 0 currentColor; }
.app-shell .console-brand strong { font-size: 20px; font-weight: 650; letter-spacing: -.03em; }
.app-shell .console-brand span:last-child { margin-left: auto; color: #a3a3a3; font: 500 9px "Roboto Mono", monospace; letter-spacing: .06em; }
.app-shell .new-chat-button { min-height: 42px; gap: 9px; padding: 0 13px; border: 1px solid rgba(89,104,206,.92); border-radius: 10px; background: rgba(89,104,206,.92); color: #fff; font-size: 13px; box-shadow: none; }
.app-shell .new-chat-button:hover { border-color: #4d5bc0; background: #4d5bc0; }
.app-shell .new-chat-button svg { width: 17px; height: 17px; stroke-width: 1.8; }
.app-shell .console-nav { gap: 3px; margin-top: 20px; }
.app-shell .console-nav p { margin: 16px 11px 7px; color: #a3a3a3; font: 600 10px Inter,Arial,sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.app-shell .console-nav button,
.app-shell .console-nav a { position: relative; min-height: 40px; gap: 11px; padding: 0 11px; border-radius: 8px; color: #525252; font-size: 13px; }
.app-shell .console-nav button svg,
.app-shell .console-nav a svg { flex: 0 0 auto; width: 17px; height: 17px; color: #8a8a8a; stroke-width: 1.7; }
.app-shell .console-nav a .console-nav-external { width: 13px; height: 13px; margin-left: auto; color: #a3a3a3; }
body.sidebar-collapsed .app-shell .console-nav a .console-nav-external { display: none; }
.app-shell .console-nav button:hover,
.app-shell .console-nav a:hover { background: #f5f5f5; color: #171717; }
.app-shell .console-nav button:hover svg,
.app-shell .console-nav a:hover svg { color: #525252; }
.app-shell .console-nav button.active { background: rgba(238,240,255,.72); color: #4d5bc0; box-shadow: none; font-weight: 600; }
.app-shell .console-nav button.active::before { position: absolute; top: 11px; bottom: 11px; left: 0; width: 2px; border-radius: 2px; background: #5968ce; content: ""; }
.app-shell .console-nav button.active svg { color: rgba(89,104,206,.92); }
.app-shell .admin-nav-group { display: grid; min-width: 0; gap: 2px; margin-top: 8px; padding-top: 8px; border-top: 1px solid #f0f0f0; }
.app-shell .console-nav .admin-nav-toggle span { min-width: 0; flex: 1 1 auto; }
.app-shell .console-nav .admin-nav-toggle .admin-nav-chevron { width: 15px; height: 15px; margin-left: auto; transition: transform .18s ease; }
.app-shell .console-nav .admin-nav-toggle[aria-expanded="false"] .admin-nav-chevron { transform: rotate(-90deg); }
.app-shell .console-nav .admin-nav-toggle.active { background: transparent; color: #171717; box-shadow: none; }
.app-shell .console-nav .admin-nav-toggle.active::before { display: none; }
.app-shell .console-nav .admin-nav-toggle.active > svg:first-child { color: #171717; }
.app-shell .admin-subnav { display: grid; gap: 2px; margin: 2px 0 5px 19px; padding: 3px 0 3px 9px; border-left: 1px solid #e5e7eb; }
.app-shell .console-nav .admin-subnav button { min-height: 34px; gap: 9px; padding: 0 8px; border-radius: 7px; font-size: 12px; }
.app-shell .console-nav .admin-subnav button svg { width: 15px; height: 15px; }
.app-shell .sidebar-status { border-color: #ededed; color: #525252; }
.app-shell .sidebar-status i,
.app-shell .live-indicator i { background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,.1); }
.app-shell .sidebar-status strong { font-size: 11px; font-weight: 550; }
.app-shell .sidebar-status small { color: #a3a3a3; font-size: 10px; }
.app-shell .console-main { min-height: 100vh; margin-left: var(--sidebar); background: var(--canvas); }
.app-shell .topbar { min-height: 64px; padding: 0 28px; border-color: var(--line); background: rgba(255,255,255,.96); box-shadow: 0 1px 8px rgba(0,0,0,.025); }
.app-shell .breadcrumb { color: var(--faint); font-size: 11px; }
.app-shell .topbar-location > strong { font-size: 14px; }
.app-shell .balance-chip { padding: 8px 11px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--muted); font-size: 12px; }
.app-shell .balance-chip b { color: var(--ink); font: 600 12px "Roboto Mono", monospace; }
.app-shell .balance-chip:hover { border-color: #a7d3f2; background: #f5fbff; color: var(--ink); }
.app-shell .balance-chip:focus-visible { outline: 3px solid rgba(11,132,220,.18); outline-offset: 2px; }
.app-shell .user-button { color: var(--ink); }
.app-shell .user-button > span { width: 31px; height: 31px; background: #eaf6ff; color: var(--accent); font-size: 12px; }
.app-shell .user-button b { font-size: 13px; }
.app-shell .user-button .user-chevron { width: 15px; height: 15px; color: var(--muted); }
.app-shell .user-menu { top: 42px; width: 170px; border-color: var(--line); border-radius: 8px; background: #fff; box-shadow: 0 18px 45px rgba(0,0,0,.12); }
.app-shell .user-menu button { color: var(--ink); font-size: 13px; }
.app-shell .user-menu button:hover { background: #f5f5f5; }
.app-shell .menu-button { border-color: var(--line-strong); border-radius: 7px; background: #fff; }
.app-shell .menu-button span { background: var(--ink); }
.app-shell .content-shell { width: 100%; max-width: none; padding: 38px 28px 68px; }
.app-shell .view-heading,
.app-shell .workspace-heading { gap: 24px; margin-bottom: 28px; }
.app-shell .view-heading h1,
.app-shell .workspace-heading h1 { margin-bottom: 8px; color: var(--ink); font-size: 32px; font-weight: 700; letter-spacing: 0; }
.app-shell .view-heading p:not(.eyebrow),
.app-shell .workspace-heading p:not(.eyebrow) { color: var(--muted); font-size: 15px; line-height: 1.55; }
.app-shell .live-indicator { color: var(--muted); font-size: 13px; }
.app-shell input,
.app-shell select,
.app-shell textarea { border-color: var(--line-strong); border-radius: 7px; background: #fff; color: var(--ink); font-size: 14px; }
.app-shell input:focus,
.app-shell select:focus,
.app-shell textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(22,135,232,.12); }
.app-shell input:disabled { border-color: var(--line); background: #f5f5f5; color: var(--muted); }
.app-shell .primary-button { min-height: 42px; border-radius: 8px; background: var(--ink); color: #fff; font-size: 14px; }
.app-shell .primary-button:hover { background: #262626; }
.app-shell .secondary-button { min-height: 40px; border-color: var(--line-strong); border-radius: 8px; background: #fff; color: var(--ink); font-size: 14px; }
.app-shell .secondary-button:hover { border-color: #a3a3a3; background: #f5f5f5; }
.app-shell .text-button,
.app-shell .icon-text-button { color: #0879d1; font-size: 13px; }
.app-shell .text-button:hover,
.app-shell .icon-text-button:hover { color: #075ea4; }
.app-shell .chat-workspace { border-color: var(--line); border-radius: 8px; background: #fff; box-shadow: 0 14px 38px rgba(0,0,0,.055); }
.app-shell .chat-toolbar { min-height: 78px; border-color: var(--line); background: #fafafa; }
.app-shell .field-caption { color: var(--muted); font-size: 10px; letter-spacing: 0; }
.app-shell .model-picker select { min-height: 40px; height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 13px; }
.app-shell .protocol-picker .segmented { height: 40px; }
.app-shell .segmented { border-color: var(--line); border-radius: 8px; background: #f5f5f5; }
.app-shell .segmented button { min-height: 32px; border-radius: 6px; color: var(--muted); font-size: 12px; }
.app-shell .segmented button:hover { background: #e5e5e5; color: var(--ink); }
.app-shell .segmented button.active,
.app-shell .segmented button.active:hover { background: var(--ink); color: #fff; }
.app-shell .icon-button { display: grid; width: 38px; height: 38px; place-items: center; border-color: var(--line-strong); border-radius: 7px; background: #fff; color: var(--muted); }
.app-shell .icon-button:hover { border-color: #a3a3a3; background: #f5f5f5; color: var(--ink); }
.app-shell .icon-button[aria-expanded="true"] { border-color: var(--accent); background: #eaf6ff; color: var(--accent); }
.app-shell .icon-button svg { width: 17px; height: 17px; }
.app-shell .chat-stage { background: #fff; scrollbar-color: #d4d4d4 transparent; }
.app-shell .welcome-mark { width: 46px; height: 46px; border-color: #9dd4fa; border-radius: 8px; background: #eaf6ff; color: var(--accent); }
.app-shell .welcome-mark svg { width: 22px; height: 22px; }
.app-shell .welcome-message h2 { color: var(--ink); font-size: 25px; letter-spacing: 0; }
.app-shell .welcome-message p { color: var(--muted); font-size: 14px; }
.app-shell .prompt-suggestions button { min-height: 38px; padding: 0 13px; border-color: var(--line-strong); border-radius: 7px; background: #fff; color: #525252; font-size: 13px; }
.app-shell .prompt-suggestions button:hover { border-color: #8ecaf3; background: #eaf6ff; color: #075ea4; }
.app-shell .message-avatar { background: #eaf6ff; color: var(--accent); }
.app-shell .message-content { border-color: var(--line); background: #fafafa; color: #262626; font-size: 14px; }
.app-shell .chat-message.user .message-avatar { background: #0a0a0a; color: #fff; }
.app-shell .chat-message.user .message-content { border-color: #b8dcf7; background: #eaf6ff; color: #1f2937; }
.app-shell .message-meta { color: var(--faint); }
.app-shell .composer-shell { border-color: var(--line); background: #fafafa; }
.app-shell .composer-row { border-color: var(--line-strong); border-radius: 8px; background: #fff; }
.app-shell .composer-row:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(22,135,232,.1); }
.app-shell .composer-row textarea { background: transparent; color: var(--ink); font-size: 14px; }
.app-shell .composer-row textarea::placeholder { color: var(--faint); }
.app-shell .send-button { background: var(--ink); color: #fff; }
.app-shell .send-button:hover { background: #262626; }
.app-shell .send-button svg { width: 18px; height: 18px; }
.app-shell .composer-footer { color: var(--faint); font-size: 10px; letter-spacing: 0; }
.app-shell .composer-footer #request-state { color: var(--muted); }
.app-shell .max-output input { border-color: var(--line-strong); background: #fff; color: var(--ink); }
.app-shell .chat-settings-panel { border-color: var(--line); background: #fff; box-shadow: -20px 0 45px rgba(0,0,0,.1); }
.app-shell .settings-panel-heading { border-color: var(--line); }
.app-shell .settings-panel-heading h2 { color: var(--ink); }
.app-shell .settings-panel-heading button { border-color: var(--line-strong); background: #fff; color: var(--muted); }
.app-shell .chat-settings-panel label { color: #525252; }
.app-shell .chat-settings-panel textarea,
.app-shell .chat-settings-panel input { border-color: var(--line-strong); background: #fff; color: var(--ink); }
.app-shell .chat-settings-panel > p { color: var(--muted); }
.app-shell .metrics-grid { gap: 12px; margin-bottom: 16px; }
.app-shell .metrics-grid article { min-height: 140px; gap: 12px; padding: 20px; border-color: var(--line); border-radius: 8px; background: #fff; }
.app-shell .metrics-grid article:nth-child(1) { border-top: 3px solid var(--accent); }
.app-shell .metrics-grid article:nth-child(2) { border-top: 3px solid #0a0a0a; }
.app-shell .metrics-grid article:nth-child(3) { border-top: 3px solid #16a34a; }
.app-shell .metrics-grid article:nth-child(4) { border-top: 3px solid #f59e0b; }
.app-shell .metrics-grid article span { color: var(--muted); font-size: 13px; }
.app-shell .metrics-grid strong { color: var(--ink); font: 600 29px "Roboto Mono", monospace; letter-spacing: 0; }
.app-shell .metrics-grid small { color: var(--faint); font-size: 11px; }
.app-shell .overview-grid { gap: 16px; margin-bottom: 16px; }
.app-shell .data-section { margin-bottom: 16px; border-color: var(--line); border-radius: 8px; background: #fff; }
.app-shell .section-title { padding: 19px 21px; border-color: var(--line); }
.app-shell .section-title h2 { color: var(--ink); font-size: 16px; }
.app-shell .section-title p { color: var(--muted); font-size: 12px; }
.app-shell .usage-chart { background: #fff; }
.app-shell .chart-bar { background: var(--accent); }
.app-shell .chart-bar span { color: var(--muted); }
.app-shell .quickstart-section > code { border-color: var(--line); background: #f5f5f5; color: #075ea4; font-size: 11px; }
.app-shell .quickstart-section ol { color: var(--muted); font-size: 12px; }
.app-shell .quickstart-section li::marker { color: var(--accent); }
.app-shell .notice { padding: 14px 16px; border-color: #b8dcf7; border-radius: 8px; background: #eaf6ff; color: #3f6078; font-size: 13px; }
.app-shell .notice strong { color: #075ea4; }
.app-shell table { min-width: 720px; }
.app-shell th,
.app-shell td { padding: 14px 16px; border-color: var(--line); }
.app-shell th { background: #fafafa; color: var(--muted); font-size: 10px; letter-spacing: 0; }
.app-shell td { color: #525252; font-size: 13px; }
.app-shell tbody tr:hover td { background: #fcfcfc; }
.app-shell td strong { color: var(--ink); }
.app-shell td code { color: #075ea4; font-size: 11px; }
.app-shell .capability-pill { border-color: #d4d4d4; background: #f5f5f5; color: #404040; font-size: 10px; }
.app-shell .status-pill { border-color: #a7e0b5; background: #eefbf1; color: #187a32; font-size: 10px; }
.app-shell .status-pill.active, .supplier-channel-card .status-pill.active { border-color: #a7e0b5; background: #eefbf1; color: #187a32; }
.app-shell .status-pill.inactive, .supplier-channel-card .status-pill.inactive { border-color: #cbd5e1; background: #f1f5f9; color: #475569; }
.app-shell .customer-group-pill { text-transform: none; }
.app-shell .row-button { min-height: 30px; border-color: var(--line-strong); background: #fff; color: #525252; font-size: 11px; }
.app-shell .row-button:hover { border-color: var(--accent); background: #eaf6ff; color: #075ea4; }
.app-shell .row-button.danger:hover { border-color: #f0aaaa; background: #fef2f2; color: var(--danger); }
.app-shell .status-pill.error { border-color: #fecaca; background: #fef2f2; color: #b42318; }
.app-shell .status-pill.cancelled,.admin-usage-detail-dialog .status-pill.cancelled { border-color: #fde68a; background: #fffbeb; color: #92400e; text-transform: none; }
.usage-cancelled-notice { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 12px 0; }
/* A disabled record is off rather than broken, so it uses the yellow palette
   instead of the green enabled pill or the red error pill. */
.app-shell .status-pill.disabled { border-color: #fde68a; background: #fffbeb; color: #92400e; }
.app-shell .table-note,
.app-shell .empty-row td { color: var(--faint); }
.app-shell .search-field { color: #525252; font-size: 12px; }
.app-shell .search-field input { min-height: 42px; border-color: var(--line-strong); background: #fff; color: var(--ink); }
.app-shell .balance-band { gap: 8px; margin-bottom: 16px; padding: 28px; border: 0; border-radius: 8px; background: var(--accent); color: #fff; }
.app-shell .balance-band span { color: rgba(255,255,255,.78); font-size: 13px; }
.app-shell .balance-band strong { color: #fff; font: 600 36px "Roboto Mono", monospace; letter-spacing: 0; }
.app-shell .balance-band small { color: rgba(255,255,255,.72); font-size: 12px; }
.app-shell .billing-balance-band { grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 24px; }
.app-shell .billing-balance-copy { display: grid; min-width: 0; gap: 8px; }
.app-shell .billing-balance-actions { display: flex; align-items: center; gap: 10px; }
.app-shell .overview-balance-band { grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 24px; }
.app-shell .overview-balance-copy { display: grid; min-width: 0; gap: 8px; }
.app-shell .overview-recharge { display: grid; justify-items: end; gap: 10px; }
.app-shell .overview-recharge-label { color: rgba(255,255,255,.78); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.app-shell .overview-recharge-amounts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.app-shell .recharge-amount-chip { min-width: 64px; min-height: 38px; padding: 0 12px; border: 1px solid rgba(255,255,255,.6); border-radius: 7px; background: rgba(0,67,120,.18); color: #fff; font: 600 13px "Roboto Mono", monospace; cursor: pointer; }
.app-shell .recharge-amount-chip:hover { border-color: #fff; background: rgba(0,49,89,.3); }
.app-shell .recharge-amount-chip:focus-visible { outline: 3px solid rgba(255,255,255,.42); outline-offset: 2px; }
.app-shell .billing-credit-line { display: grid; gap: 12px; margin: 0 24px 24px; padding: 16px 20px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.app-shell .credit-line-meter { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
.app-shell .credit-line-meter span { color: var(--muted); font-size: 12px; font-weight: 600; }
.app-shell .credit-line-meter strong { color: var(--ink); font: 600 22px "Roboto Mono", monospace; font-variant-numeric: tabular-nums; }
.app-shell .credit-line-meter small { color: var(--muted); font-size: 12px; }
.app-shell .credit-line-bar { height: 8px; border-radius: 999px; background: #eef2f4; overflow: hidden; }
.app-shell .credit-line-bar > i { display: block; width: 0; height: 100%; border-radius: 999px; background: #1687e8; transition: width .2s; }
.app-shell .credit-line-period { margin: 0; color: var(--muted); font-size: 12px; }
.user-credit-line { display: grid; gap: 12px; margin-top: 16px; padding-top: 16px; border-top: 1px solid #e5e5e5; }
.user-credit-line[hidden] { display: none; }
.user-credit-line-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.user-credit-line-grid label { display: grid; gap: 8px; min-width: 0; }
.user-credit-line-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.user-credit-line-actions small { color: #737373; font-size: 12px; }
.user-credit-line-help { margin: 0; color: #737373; font-size: 12px; line-height: 1.7; }
.app-shell .billing-recharge-trigger,
.app-shell .billing-redeem-trigger { display: inline-flex; min-width: 148px; min-height: 46px; align-items: center; justify-content: center; gap: 8px; padding: 0 16px; border: 1px solid rgba(255,255,255,.78); border-radius: 7px; font-size: 13px; font-weight: 700; }
.app-shell .billing-recharge-trigger { background: #fff; color: #075ea4; }
.app-shell .billing-recharge-trigger:hover { border-color: #fff; background: #f5fbff; color: #054f8a; }
.app-shell .billing-redeem-trigger { background: rgba(0,67,120,.18); color: #fff; }
.app-shell .billing-redeem-trigger:hover { border-color: #fff; background: rgba(0,49,89,.3); color: #fff; }
.app-shell .billing-recharge-trigger:focus-visible,
.app-shell .billing-redeem-trigger:focus-visible { outline: 3px solid rgba(255,255,255,.42); outline-offset: 3px; }
.app-shell .billing-recharge-trigger svg,
.app-shell .billing-redeem-trigger svg { width: 17px; height: 17px; }
.app-shell .billing-recharge-trigger span,
.app-shell .billing-redeem-trigger span { color: inherit; font-size: inherit; }
.billing-redeem-dialog { width: min(480px,calc(100vw - 32px)); }
.billing-redeem-dialog .dialog-heading { align-items: flex-start; }
.billing-redeem-dialog .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.billing-redeem-dialog .dialog-heading button { display: grid; flex: 0 0 28px; place-items: center; }
.billing-redeem-dialog .dialog-heading button svg { width: 15px; height: 15px; }
.billing-redeem-dialog > label { margin-top: 18px; }
.billing-redeem-dialog input { min-height: 44px; font-family: "Roboto Mono",monospace; }
.billing-redeem-dialog #redeem-code-status { min-height: 18px; margin: 9px 0 0; color: #08745f; font-size: 12px; line-height: 1.5; }
.billing-redeem-dialog #redeem-code-status.error { color: #b42318; }
.billing-redeem-dialog .primary-button { display: inline-flex; align-items: center; gap: 8px; }
.billing-redeem-dialog .primary-button svg { width: 16px; height: 16px; }
.billing-recharge-dialog { width: min(600px,calc(100vw - 32px)); }
.billing-recharge-dialog .dialog-heading { align-items: flex-start; }
.billing-recharge-dialog .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.billing-recharge-dialog .dialog-heading button { display: grid; flex: 0 0 28px; place-items: center; }
.billing-recharge-dialog #recharge-checkout-fields { display: grid; gap: 20px; margin-top: 22px; }
.billing-recharge-dialog #recharge-checkout-fields > label { display: grid; gap: 8px; color: #404040; font-size: 12px; font-weight: 650; }
.billing-recharge-dialog #recharge-amount { min-height: 46px; font: 600 15px "Roboto Mono",monospace; }
.recharge-method-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.recharge-method-fieldset legend { margin-bottom: 9px; color: #404040; font-size: 12px; font-weight: 650; }
.recharge-method-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.recharge-method-option { position: relative; display: grid; min-width: 0; min-height: 68px; grid-template-columns: 18px 28px minmax(0,1fr) 18px; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid #d4d4d4; border-radius: 7px; background: #fff; cursor: pointer; }
.payment-method-icon { display: block; flex: 0 0 auto; width: 24px; height: 24px; object-fit: contain; }
.recharge-method-option > .payment-method-icon { width: 28px; height: 28px; }
.recharge-method-option:has(input:checked) { border-color: #1687e8; background: #f5fbff; box-shadow: inset 0 0 0 1px #1687e8; }
.recharge-method-option input { width: 16px; min-height: 16px; margin: 0; accent-color: #075ea4; }
.recharge-method-option > span { display: grid; min-width: 0; gap: 4px; }
.recharge-method-option strong { overflow: hidden; color: #171717; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.recharge-method-option small { color: #737373; font-size: 10px; }
.recharge-method-option > svg { width: 16px; height: 16px; color: transparent; }
.recharge-method-option:has(input:checked) > svg { color: #075ea4; }
.recharge-method-empty { grid-column: 1 / -1; margin: 0; padding: 18px; border: 1px dashed #d4d4d4; color: #737373; font-size: 12px; text-align: center; }
.recharge-payment-summary { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: baseline; gap: 5px 18px; padding: 14px 16px; border-left: 3px solid #1687e8; background: #f5fbff; }
.recharge-payment-summary span { color: #525252; font-size: 11px; font-weight: 650; text-transform: uppercase; }
.recharge-payment-summary strong { color: #075ea4; font: 650 20px "Roboto Mono",monospace; }
.recharge-payment-summary small { grid-column: 1 / -1; color: #737373; font-size: 11px; line-height: 1.5; }
.recharge-status { min-height: 19px; margin: 13px 0 0; color: #525252; font-size: 12px; line-height: 1.55; }
.recharge-status.pending { color: #075ea4; }
.recharge-status.success { color: #08745f; }
.recharge-status.error { color: #b42318; }
.recharge-qr-panel { display: grid; justify-items: center; gap: 10px; margin-top: 20px; text-align: center; }
.recharge-qr-panel[hidden] { display: none; }
.recharge-qr-panel img { width: min(280px,80vw); aspect-ratio: 1; border: 1px solid #d4d4d4; background: #fff; image-rendering: pixelated; }
.recharge-qr-panel strong { color: #171717; font-size: 15px; }
.recharge-qr-panel span { color: #737373; font-size: 12px; }
.recharge-qr-panel .secondary-button { display: inline-flex; min-height: 38px; align-items: center; gap: 7px; margin-top: 3px; }
.recharge-qr-panel .secondary-button svg { width: 15px; height: 15px; }
.billing-recharge-dialog .primary-button { display: inline-flex; align-items: center; gap: 8px; }
.billing-recharge-dialog .primary-button svg { width: 16px; height: 16px; }
.app-shell .billing-ledger-section .section-title .secondary-button { display: inline-flex; min-height: 36px; align-items: center; gap: 7px; }
.app-shell .billing-ledger-section .section-title .secondary-button svg { width: 15px; height: 15px; }
.app-shell .billing-ledger-section { margin-top: 22px; }
.app-shell .billing-ledger-section .section-title { padding: 26px 28px; }
.app-shell .billing-ledger-section .section-title h2 { margin-bottom: 7px; }
.app-shell .billing-ledger-filter-bar { display: grid; grid-template-columns: minmax(230px,1.35fr) repeat(4,minmax(120px,1fr)) auto; align-items: end; gap: 18px 16px; margin: 0; padding: 24px 28px 26px; border-bottom: 1px solid var(--line); }
.app-shell .billing-ledger-filter-bar label { display: grid; min-width: 0; gap: 10px; color: var(--muted); font-size: 12px; font-weight: 600; }
.app-shell .billing-ledger-filter-bar input,
.app-shell .billing-ledger-filter-bar select { width: 100%; min-width: 0; min-height: 42px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 13px; }
.app-shell .billing-ledger-filter-summary { display: flex; min-height: 42px; align-items: center; justify-content: flex-end; gap: 11px; color: var(--muted); font-size: 13px; white-space: nowrap; }
.app-shell .billing-ledger-filter-summary .icon-button { flex: 0 0 auto; width: 42px; height: 42px; }
.app-shell .billing-ledger-filter-summary .icon-button svg { width: 16px; height: 16px; }
.app-shell .billing-ledger-table { min-width: 720px; }
.app-shell .billing-ledger-table th,
.app-shell .billing-ledger-table td { padding: 20px 28px; }
.app-shell .billing-ledger-table td { line-height: 1.65; }
.app-shell .billing-ledger-table td:first-child { min-width: 260px; }
.app-shell .billing-ledger-description { display: grid; min-width: 0; gap: 8px; }
.app-shell .billing-ledger-description code { display: block; overflow: hidden; max-width: 300px; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .billing-ledger-kind { padding: 4px 8px; }
.app-shell .billing-ledger-pagination { min-height: 62px; padding: 8px 24px; }
.app-shell .billing-ledger-amount.credit { color: #08745f; }
.app-shell .billing-ledger-amount.debit { color: #b42318; }
.app-shell .billing-ledger-kind.usage { border-color: #fed7aa; background: #fff7ed; color: #9a3412; }
.app-shell .billing-ledger-kind.adjustment { border-color: #c4b5fd; background: #f5f3ff; color: #6d28d9; }
.app-shell .billing-ledger-kind.refund { border-color: #bae6fd; background: #f0f9ff; color: #0369a1; }
.app-shell .settings-form { max-width: 820px; padding: 24px; border-color: var(--line); border-radius: 8px; background: #fff; }
.app-shell .settings-form label,
.app-shell .admin-form label { color: #525252; font-size: 12px; }
.app-shell .settings-form input,
.app-shell .admin-form input,
.app-shell .admin-form select { min-height: 42px; border-color: var(--line-strong); background: #fff; color: var(--ink); }
.app-shell #profile-status { color: #075ea4; font-size: 11px; }
.app-shell .admin-form { gap: 14px; margin-bottom: 16px; padding: 20px; border-color: var(--line); border-radius: 8px; background: #fff; }
.app-shell .admin-form h2 { color: var(--ink); font-size: 16px; }
.app-shell .admin-panel { position: relative; }
.admin-panel-loading::before { content: ""; position: absolute; inset: 0; z-index: 5; background: rgba(255,255,255,.55); backdrop-filter: blur(1px); border-radius: 8px; pointer-events: all; }
.admin-panel-loading::after { content: ""; position: absolute; top: 84px; left: 50%; z-index: 6; width: 22px; height: 22px; margin-left: -11px; border: 3px solid var(--accent); border-top-color: transparent; border-radius: 50%; animation: agent-tool-spin .7s linear infinite; }

.admin-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.app-shell .admin-panel-heading h2 { margin: 0 0 5px; color: var(--ink); font-size: 18px; }
.app-shell .admin-panel-heading p { margin: 0; color: var(--muted); font-size: 13px; }
.app-shell .admin-panel-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }
.app-shell .admin-actions-menu { position: relative; flex: 0 0 auto; }
.app-shell .admin-actions-menu > summary { list-style: none; cursor: pointer; }
.app-shell .admin-actions-menu > summary::-webkit-details-marker { display: none; }
.app-shell .admin-actions-menu[open] > summary { border-color: var(--accent); background: #eaf6ff; color: var(--accent); }
.app-shell .admin-actions-menu-popover { position: absolute; z-index: 60; top: calc(100% + 7px); right: 0; display: grid; width: 250px; padding: 6px; border: 1px solid var(--line-strong); border-radius: 7px; background: #fff; box-shadow: 0 14px 34px rgba(23,23,23,.14); }
.app-shell .admin-actions-menu-popover button { display: grid; min-height: 38px; grid-template-columns: 18px minmax(0,1fr); align-items: center; gap: 9px; padding: 0 10px; border: 0; border-radius: 5px; background: transparent; color: #404040; font-size: 12px; font-weight: 600; text-align: left; }
.app-shell .admin-actions-menu-popover button:hover,
.app-shell .admin-actions-menu-popover button:focus-visible { background: #f5f5f5; color: var(--ink); }
.app-shell .admin-actions-menu-popover button:disabled { cursor: wait; opacity: .55; }
.app-shell .admin-actions-menu-popover button svg { width: 16px; height: 16px; color: var(--muted); }
.app-shell .admin-actions-menu-popover button.danger { color: #b42318; }
.app-shell .admin-actions-menu-popover button.danger svg { color: #d92d20; }
.app-shell .admin-actions-menu-popover button.danger:hover,
.app-shell .admin-actions-menu-popover button.danger:focus-visible { background: #fff1f0; color: #912018; }
.app-shell .admin-actions-menu-divider { height: 1px; margin: 5px 4px; background: var(--line); }
.app-shell .admin-panel-heading .primary-button,
.app-shell .admin-panel-heading .secondary-button { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; gap: 7px; flex: 0 0 auto; }
.app-shell .admin-panel-heading .primary-button svg,
.app-shell .admin-panel-heading .secondary-button svg { width: 16px; height: 16px; }
.app-shell .provider-view-toggle { min-height: 42px; padding: 4px; }
.app-shell .provider-view-toggle button { display: inline-flex; min-height: 32px; align-items: center; justify-content: center; gap: 6px; }
.app-shell .provider-view-toggle button svg { width: 14px; height: 14px; }
.app-shell .admin-user-filter-bar { display: grid; grid-template-columns: minmax(230px,1fr) repeat(3,minmax(130px,165px)) minmax(190px,230px) auto; align-items: end; gap: 12px; margin-bottom: 12px; }
.app-shell .admin-user-filter-bar label { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .admin-user-filter-bar input,
.app-shell .admin-user-filter-bar select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .admin-user-sort-control { display: grid; min-width: 0; gap: 6px; }
.app-shell .admin-user-sort-control > label { color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .admin-user-sort-input { display: grid; grid-template-columns: minmax(0,1fr) 40px; gap: 6px; }
.app-shell .admin-user-sort-input .icon-button { width: 40px; height: 40px; border-color: var(--line-strong); background: #fff; }
.app-shell .admin-user-sort-input .icon-button:hover { border-color: #a7d3f2; background: #f5fbff; color: var(--accent); }
.app-shell .admin-user-sort-input .icon-button svg { width: 16px; height: 16px; }
.app-shell .admin-user-filter-summary { display: flex; min-height: 40px; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.app-shell .admin-user-filter-summary .icon-button { width: 40px; height: 40px; }
.app-shell .admin-user-table { min-width: var(--admin-user-table-min-width,980px); }
.app-shell .admin-user-table .admin-user-column-hidden { display: none!important; }
.app-shell .admin-user-table td[data-admin-user-column="user"] { min-width: 230px; }
.app-shell .admin-user-table td[data-admin-user-column="id"],
.app-shell .admin-user-table td[data-admin-user-column="balance"],
.app-shell .admin-user-table td[data-admin-user-column="created"],
.app-shell .admin-user-table td[data-admin-user-column="last_login"] { white-space: nowrap; }
.app-shell .admin-user-row-quick-actions { justify-content: flex-end; }
.app-shell .admin-user-row-quick-actions .icon-button { width: 34px; height: 34px; }
.app-shell .admin-user-row-quick-actions .icon-button svg { width: 16px; height: 16px; }
.app-shell .admin-user-pagination { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.app-shell .admin-user-pagination > div { display: flex; align-items: center; gap: 7px; }
.app-shell .admin-user-pagination label { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .admin-user-pagination select { width: 70px; min-height: 36px; border-color: var(--line-strong); background: #fff; font-size: 12px; }
.app-shell .admin-user-pagination .icon-button { width: 36px; height: 36px; }
.app-shell .recharge-log-filter-bar { display: grid; grid-template-columns: minmax(230px,1fr) minmax(150px,180px) repeat(2,minmax(170px,200px)) auto; align-items: end; gap: 12px; margin-bottom: 12px; }
.app-shell .recharge-log-filter-bar label { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .recharge-log-filter-bar input,
.app-shell .recharge-log-filter-bar select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .recharge-log-filter-summary { display: flex; min-height: 40px; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.app-shell .recharge-log-filter-summary .icon-button { width: 40px; height: 40px; }
.app-shell .recharge-log-total { display: flex; min-height: 48px; align-items: center; justify-content: flex-end; gap: 12px; padding: 0 14px; border: 1px solid var(--line); border-bottom: 0; background: #fafafa; }
.app-shell .recharge-log-total span { color: var(--muted); font-size: 12px; }
.app-shell .recharge-log-total strong { color: #047857; font: 650 16px "Roboto Mono",monospace; }
.app-shell .recharge-log-table { min-width: 1160px; }
.app-shell .recharge-log-table td:first-child code { display: inline-block; overflow: hidden; max-width: 165px; text-overflow: ellipsis; vertical-align: bottom; }
.app-shell .recharge-log-table td:nth-child(5),
.app-shell .recharge-log-table td:nth-child(6),
.app-shell .recharge-log-table td:nth-child(8) { white-space: nowrap; }
.app-shell .recharge-log-table th:nth-child(3),
.app-shell .recharge-log-table td:nth-child(3) { min-width: 96px; }
.app-shell .recharge-log-table th:nth-child(4),
.app-shell .recharge-log-table td:nth-child(4) { min-width: 120px; }
.app-shell .recharge-method-cell { display: grid; gap: 3px; }
.app-shell .recharge-method-cell strong { font-size: 12px; white-space: nowrap; }
.app-shell .recharge-method-cell code { color: var(--muted); font-size: 10px; }
.app-shell .payment-method-name { display: inline-flex; align-items: center; gap: 7px; }
.app-shell .recharge-method-cell .payment-method-icon { width: 20px; height: 20px; }
.app-shell .recharge-method-cell.has-payment-icon code { padding-left: 27px; }
.app-shell .recharge-log-amount { color: #047857; font-family: "Roboto Mono",monospace; }
.app-shell .recharge-source-pill { white-space: nowrap; }
.app-shell .recharge-source-pill.payment { border-color: #a7f3d0; background: #ecfdf5; color: #047857; }
.app-shell .recharge-source-pill.manual { border-color: #bae6fd; background: #f0f9ff; color: #075985; }
.app-shell .recharge-source-pill.adjustment { border-color: #fde68a; background: #fffbeb; color: #92400e; }
.app-shell .recharge-source-pill.redemption { border-color: #bbf7d0; background: #f0fdf4; color: #166534; }
.app-shell .recharge-source-pill.welcome,
.app-shell .recharge-source-pill.initial { border-color: #ddd6fe; background: #f5f3ff; color: #5b21b6; }
.app-shell .recharge-source-pill.refund { border-color: #fecaca; background: #fef2f2; color: #991b1b; }
.app-shell .admin-key-filter-bar { display: grid; grid-template-columns: minmax(250px,1fr) minmax(170px,220px) minmax(140px,170px) minmax(190px,240px) auto; align-items: end; gap: 12px; margin-bottom: 12px; }
.app-shell .admin-key-filter-bar label,
.app-shell .admin-key-sort-control { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .admin-key-filter-bar input,
.app-shell .admin-key-filter-bar select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .admin-key-sort-input { display: grid; grid-template-columns: minmax(0,1fr) 40px; gap: 6px; }
.app-shell .admin-key-sort-input .icon-button { width: 40px; height: 40px; border-color: var(--line-strong); background: #fff; }
.app-shell .admin-key-sort-input .icon-button:hover { border-color: #a7d3f2; background: #f5fbff; color: var(--accent); }
.app-shell .admin-key-sort-input .icon-button svg { width: 16px; height: 16px; }
.app-shell .admin-key-filter-summary { display: flex; min-height: 40px; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.app-shell .admin-key-filter-summary .icon-button { width: 40px; height: 40px; }
.app-shell .admin-key-table { min-width: var(--admin-key-table-min-width,1420px); }
.app-shell .admin-key-table .admin-key-column-hidden { display: none!important; }
.app-shell .admin-key-table td[data-admin-key-column="key"] { min-width: 200px; }
.app-shell .admin-key-table td[data-admin-key-column="customer"] { min-width: 210px; }
.app-shell .admin-key-table td[data-admin-key-column="available"],
.app-shell .admin-key-table td[data-admin-key-column="discount"],
.app-shell .admin-key-table td[data-admin-key-column="request_limit"],
.app-shell .admin-key-table td[data-admin-key-column="models"],
.app-shell .admin-key-table td[data-admin-key-column="network"] { white-space: nowrap; }
.app-shell .admin-key-table td[data-admin-key-column="actions"] { width: 58px; text-align: right; }
.app-shell .admin-key-table td[data-admin-key-column="actions"] .icon-button { width: 34px; height: 34px; }
.app-shell .admin-key-pagination { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.app-shell .admin-key-pagination > div { display: flex; gap: 7px; }
.app-shell .admin-key-pagination .icon-button { width: 36px; height: 36px; }
.app-shell .redemption-filter-bar { display: grid; grid-template-columns: minmax(240px,1fr) minmax(140px,180px) minmax(190px,230px) auto; align-items: end; gap: 12px; margin-bottom: 12px; }
.app-shell .redemption-filter-bar label,
.app-shell .redemption-sort-control { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .redemption-filter-bar input,
.app-shell .redemption-filter-bar select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .redemption-sort-input { display: grid; grid-template-columns: minmax(0,1fr) 40px; gap: 6px; }
.app-shell .redemption-sort-input .icon-button { width: 40px; height: 40px; border-color: var(--line-strong); background: #fff; }
.app-shell .redemption-sort-input .icon-button:hover { border-color: #a7d3f2; background: #f5fbff; color: var(--accent); }
.app-shell .redemption-sort-input .icon-button svg { width: 16px; height: 16px; }
.app-shell .redemption-filter-summary { display: flex; min-height: 40px; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.app-shell .redemption-filter-summary .icon-button { width: 40px; height: 40px; }
.app-shell .redemption-cleanup-button { border-color: #fecaca; color: #b42318; }
.app-shell .redemption-cleanup-button:hover { border-color: #f0aaaa; background: #fef2f2; color: #991b1b; }
.app-shell .redemption-cleanup-button svg { width: 15px; height: 15px; }
.app-shell .redemption-table { min-width: var(--redemption-table-min-width,1080px); }
.app-shell .redemption-table .redemption-column-hidden { display: none!important; }
.app-shell .redemption-table td[data-redemption-column="id"],
.app-shell .redemption-table td[data-redemption-column="code"],
.app-shell .redemption-table td[data-redemption-column="amount"],
.app-shell .redemption-table td[data-redemption-column="expires"],
.app-shell .redemption-table td[data-redemption-column="created"] { white-space: nowrap; }
.app-shell .redemption-id-cell { display: inline-block; overflow: hidden; max-width: 170px; text-overflow: ellipsis; vertical-align: bottom; }
.app-shell .redemption-row-quick-actions { justify-content: flex-end; }
.app-shell .redemption-row-quick-actions .icon-button { width: 34px; height: 34px; }
.app-shell .redemption-row-quick-actions .icon-button svg { width: 16px; height: 16px; }
.app-shell .redemption-pagination { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.app-shell .redemption-pagination > div { display: flex; align-items: center; gap: 7px; }
.app-shell .redemption-pagination label { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .redemption-pagination select { width: 70px; min-height: 36px; border-color: var(--line-strong); background: #fff; font-size: 12px; }
.app-shell .redemption-pagination .icon-button { width: 36px; height: 36px; }
.app-shell .status-pill.warning { border-color: #fed7aa; background: #fff7ed; color: #9a3412; }
#user-dialog { width: min(880px,100%); max-width: 100%; }
.user-editor-content { min-height: 0; overflow-y: auto; }
.user-balance-field { max-width: 520px; }
.admin-user-customer-group-field { max-width: 520px; }
.user-remark-field { display: grid; max-width: 100%; gap: 7px; margin-top: 18px; color: var(--muted); font-size: 12px; font-weight: 600; }
.user-remark-field[hidden] { display: none; }
.user-remark-field textarea { min-height: 82px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 13px; }
.admin-user-remark { display: inline-block; overflow: hidden; max-width: 260px; color: #075ea4; font-size: 11px; line-height: 1.4; text-overflow: ellipsis; vertical-align: bottom; white-space: nowrap; }
.user-balance-summary,
.user-balance-adjustment-dialog { --ink: #0a0a0a; --muted: #737373; --line: #e5e5e5; --line-strong: #d4d4d4; --danger: #dc2626; }
.user-balance-summary { display: grid; max-width: 520px; gap: 8px; }
.user-balance-summary[hidden] { display: none; }
.user-balance-summary > span { color: var(--muted); font-size: 12px; font-weight: 600; }
.user-balance-summary > div { display: flex; min-height: 46px; align-items: center; justify-content: space-between; gap: 14px; padding: 8px 10px 8px 14px; border: 1px solid var(--line-strong); border-radius: 7px; background: #fafafa; }
.user-balance-summary output { min-width: 0; overflow-wrap: anywhere; color: var(--ink); font-size: 18px; font-weight: 700; }
.user-balance-summary button { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 7px; }
.user-balance-summary button svg { width: 15px; height: 15px; }
.user-balance-adjustment-dialog { width: min(520px,calc(100vw - 30px)); }
.user-balance-adjustment-dialog .dialog-heading { align-items: flex-start; }
.user-balance-adjustment-dialog .dialog-heading p { margin: 5px 0 0; color: var(--muted); font-size: 12px; font-weight: 400; }
.user-balance-adjustment-dialog > label { margin-top: 16px; }
.user-balance-operation { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 7px; background: #f5f5f5; }
.user-balance-operation button { display: inline-flex; min-width: 0; min-height: 36px; align-items: center; justify-content: center; gap: 7px; border: 0; border-radius: 5px; background: transparent; color: var(--muted); font-size: 13px; font-weight: 650; }
.user-balance-operation button:hover { background: #e5e5e5; color: var(--ink); }
.user-balance-operation button.active { background: var(--ink); color: #fff; }
.user-balance-operation svg { width: 15px; height: 15px; }
.user-balance-preview { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-top: 18px; border-block: 1px solid var(--line); background: var(--line); }
.user-balance-preview > span { display: grid; min-width: 0; gap: 5px; padding: 12px; background: #fff; }
.user-balance-preview small { color: var(--muted); font-size: 10px; font-weight: 650; text-transform: uppercase; }
.user-balance-preview strong { overflow-wrap: anywhere; color: var(--ink); font-size: 14px; }
.user-balance-preview.error strong:last-child { color: var(--danger); }
.app-shell .provider-filter-bar { display: grid; grid-template-columns: minmax(220px,1fr) repeat(7,minmax(120px,145px)) auto; align-items: end; gap: 12px; margin-bottom: 12px; }
.app-shell .provider-filter-bar label,
.app-shell .provider-sort-control { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .provider-filter-bar input,
.app-shell .provider-filter-bar select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .provider-sort-input,
.app-shell .model-sort-input { display: grid; grid-template-columns: minmax(0,1fr) 40px; gap: 6px; }
.app-shell .provider-sort-input .icon-button,
.app-shell .model-sort-input .icon-button { width: 40px; height: 40px; border-color: var(--line-strong); background: #fff; }
.app-shell .provider-sort-input .icon-button:hover,
.app-shell .model-sort-input .icon-button:hover { border-color: #a7d3f2; background: #f5fbff; color: var(--accent); }
.app-shell .provider-sort-input .icon-button svg,
.app-shell .model-sort-input .icon-button svg { width: 16px; height: 16px; }
.app-shell .provider-filter-summary { display: flex; min-height: 40px; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.app-shell .provider-filter-summary .icon-button { flex: 0 0 auto; width: 40px; height: 40px; }
.app-shell .provider-filter-summary .icon-button svg { width: 16px; height: 16px; }
.app-shell .model-filter-bar { display: grid; grid-template-columns: minmax(210px,1fr) repeat(6,minmax(108px,142px)) auto; align-items: end; gap: 12px; margin-bottom: 12px; }
.app-shell .model-filter-bar label,
.app-shell .model-sort-control { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .model-filter-bar input,
.app-shell .model-filter-bar select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .model-filter-summary { display: flex; min-height: 40px; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.app-shell .model-filter-summary .icon-button { flex: 0 0 auto; width: 40px; height: 40px; }
.app-shell .model-filter-summary .icon-button svg { width: 16px; height: 16px; }
.app-shell .admin-table-pagination { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.app-shell .admin-table-pagination > div { display: flex; align-items: center; gap: 7px; }
.app-shell .admin-table-pagination label { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .admin-table-pagination select { width: 70px; min-height: 36px; border-color: var(--line-strong); background: #fff; font-size: 12px; }
.app-shell .admin-table-pagination .icon-button { width: 36px; height: 36px; }
.app-shell .admin-table-pagination .icon-button svg { width: 16px; height: 16px; }
.app-shell .admin-pagination-controls { min-width: 0; justify-content: flex-end; }
.app-shell .admin-page-numbers { display: flex; min-width: 32px; align-items: center; justify-content: center; gap: 5px; }
.app-shell .admin-page-number { width: 32px; min-width: 32px; height: 32px; padding: 0 5px; border: 1px solid var(--line-strong); border-radius: 6px; background: #fff; color: var(--muted); font: 600 11px "Roboto Mono",monospace; }
.app-shell .admin-page-number:hover { border-color: #a7d3f2; background: #f5fbff; color: var(--accent); }
.app-shell .admin-page-number.active { border-color: var(--ink); background: var(--ink); color: #fff; }
.app-shell .admin-page-number:focus-visible { outline: 3px solid rgba(11,132,220,.18); outline-offset: 2px; }
.app-shell .admin-page-ellipsis { display: inline-flex; width: 18px; height: 32px; align-items: center; justify-content: center; color: var(--faint); font: 600 11px "Roboto Mono",monospace; }
.app-shell .admin-model-table { min-width: var(--model-table-min-width,1220px); }
.app-shell .admin-model-table .model-column-hidden { display: none!important; }
.app-shell .admin-model-table .model-row-quick-actions { min-width: 34px; justify-content: flex-end; }
.app-shell .model-row-quick-actions .icon-button { width: 32px; height: 32px; flex: 0 0 32px; }
.app-shell .model-row-quick-actions .icon-button svg { width: 15px; height: 15px; }
.app-shell .model-description-cell { display: -webkit-box; min-width: 180px; max-width: 280px; overflow: hidden; color: var(--muted); font-size: 11px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; }
.app-shell .model-pricing-cell { display: grid; min-width: 190px; gap: 3px; }
.app-shell .model-pricing-cell strong { color: var(--ink); font-size: 11px; }
.app-shell .model-pricing-cell small { color: var(--muted); font: 10px/1.35 "Roboto Mono",monospace; }
.app-shell .provider-bulk-bar { display: flex; min-height: 50px; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 10px; padding: 7px 10px 7px 14px; border: 1px solid #b8dcf7; border-radius: 7px; background: #f5fbff; color: #075ea4; font-size: 12px; }
.app-shell .provider-bulk-bar[hidden] { display: none; }
.app-shell .provider-bulk-bar small { margin-left: 4px; color: #56768c; font-size: 11px; }
.app-shell .provider-bulk-bar > div { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.app-shell .provider-bulk-bar .secondary-button { display: inline-flex; min-height: 34px; align-items: center; gap: 6px; background: #fff; }
.app-shell .provider-bulk-bar .secondary-button.danger { border-color: #fecaca; color: #b42318; }
.app-shell .provider-bulk-bar .secondary-button.danger:hover { border-color: #f0aaaa; background: #fef2f2; color: #991b1b; }
.app-shell .provider-bulk-bar .secondary-button svg,
.app-shell .provider-bulk-bar .icon-button svg { width: 15px; height: 15px; }
.app-shell .provider-bulk-bar .icon-button { width: 34px; height: 34px; }
.app-shell .provider-admin-table { min-width: var(--provider-table-min-width,1510px); }
.app-shell .provider-admin-table.tag-view { min-width: var(--provider-table-min-width,1120px); }
.app-shell .provider-admin-table .provider-column-hidden { display: none!important; }
.app-shell .provider-compact-toggle[aria-pressed="true"] { border-color: #a7d3f2; background: #eaf6ff; color: #075ea4; }
.app-shell .provider-select-column { width: 42px; padding-right: 4px; text-align: center; }
.app-shell .provider-select-column input { width: 16px; height: 16px; min-height: 16px; margin: 0; accent-color: var(--accent); }
.app-shell .provider-admin-table .row-actions { min-width: 96px; max-width: 110px; flex-wrap: wrap; }
.app-shell .provider-admin-table .provider-row-quick-actions { min-width: 146px; max-width: 146px; flex-wrap: nowrap; gap: 6px; }
.app-shell .provider-row-quick-actions .icon-button { width: 32px; height: 32px; flex: 0 0 32px; }
.app-shell .provider-row-quick-actions .icon-button svg { width: 15px; height: 15px; }
.app-shell .provider-row-quick-actions .icon-button.danger { border-color: #fecaca; color: #b42318; }
.app-shell .provider-row-quick-actions .icon-button.danger:hover { border-color: #f87171; background: #fff1f0; color: #912018; }
.app-shell .provider-id-cell { display: block; overflow: hidden; max-width: 148px; color: #075ea4; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .provider-admin-table .provider-name-column { width: 220px; max-width: 220px; }
.app-shell .provider-name-cell { display: grid; width: 100%; min-width: 0; max-width: 220px; overflow: hidden; gap: 4px; }
.app-shell .provider-name-cell strong,
.app-shell .provider-name-cell small { display: block; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .provider-name-cell small { color: var(--faint); font-size: 10px; font-weight: 400; line-height: 1.35; }
.app-shell .provider-tag-list { display: flex; min-width: 110px; flex-wrap: wrap; gap: 4px; }
.app-shell .provider-tag-list span { max-width: 150px; overflow: hidden; padding: 3px 6px; border: 1px solid #c8dff1; border-radius: 4px; background: #f3faff; color: #075ea4; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .provider-tag-name-cell { display: grid; min-width: 160px; gap: 5px; }
.app-shell .provider-tag-name-cell strong { display: inline-flex; width: fit-content; max-width: 220px; overflow: hidden; padding: 4px 7px; border: 1px solid #c8dff1; border-radius: 4px; background: #f3faff; color: #075ea4; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .provider-tag-name-cell small { color: var(--faint); font-size: 10px; }
.app-shell .provider-tag-channel-count { display: grid; min-width: 66px; gap: 2px; }
.app-shell .provider-tag-channel-count strong { color: var(--ink); font-size: 16px; }
.app-shell .provider-tag-channel-count small { color: var(--faint); font-size: 10px; }
.app-shell .provider-tag-types,.app-shell .provider-tag-models { display: flex; min-width: 120px; max-width: 220px; flex-wrap: wrap; gap: 4px; }
.app-shell .provider-tag-types span,.app-shell .provider-tag-models span { max-width: 150px; overflow: hidden; padding: 3px 6px; border: 1px solid #dedede; border-radius: 4px; background: #fafafa; color: #404040; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .provider-tag-models small { align-self: center; color: var(--faint); font-size: 10px; }
.app-shell .provider-tag-routing { display: grid; min-width: 118px; gap: 4px; }
.app-shell .provider-tag-routing strong { color: var(--ink); font-size: 11px; }
.app-shell .provider-tag-routing small { color: var(--faint); font-size: 10px; }
.app-shell .provider-tag-status { display: grid; min-width: 110px; gap: 4px; }
.app-shell .provider-tag-status small { color: var(--faint); font-size: 10px; }
.app-shell .provider-admin-table.tag-view .row-actions { min-width: 178px; max-width: 210px; }
.app-shell .provider-access-all { display: inline-flex; min-width: 96px; color: #187a32; font-size: 11px; font-weight: 600; white-space: nowrap; }
.app-shell .provider-access-list { display: flex; min-width: 130px; max-width: 210px; flex-wrap: wrap; gap: 4px; }
.app-shell .provider-access-list span,.app-shell .provider-access-list small { max-width: 150px; overflow: hidden; padding: 3px 6px; border: 1px solid #d4d4d4; border-radius: 4px; background: #fafafa; color: #404040; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .provider-access-list small { color: #737373; }
.app-shell .provider-routing-input { width: 76px; min-height: 32px; padding: 4px 7px; color: var(--ink); font: 600 12px "Roboto Mono",monospace; text-align: right; }
.app-shell .provider-routing-input:disabled { background: #f5f5f5; color: var(--faint); cursor: wait; }
.app-shell .provider-route-summary { display: grid; min-width: 104px; gap: 3px; padding: 0; border: 0; background: transparent; color: var(--ink); text-align: left; }
.app-shell .provider-route-summary:hover strong { color: #075ea4; }
.app-shell .provider-route-summary strong { font-size: 11px; }
.app-shell .provider-route-summary span { color: var(--muted); font-size: 10px; white-space: nowrap; }
.app-shell .provider-health { display: grid; min-width: 145px; max-width: 220px; gap: 3px; }
.app-shell .provider-health span { width: fit-content; padding: 3px 7px; border: 1px solid #d4d4d4; border-radius: 4px; background: #f5f5f5; color: #525252; font-size: 11px; font-weight: 600; }
.app-shell .provider-health small,
.app-shell .provider-health time { display: block; overflow: hidden; color: var(--faint); font-size: 11px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .provider-health.healthy span { border-color: #a7e0b5; background: #eefbf1; color: #187a32; }
.app-shell .provider-health.failed span { border-color: #fecaca; background: #fef2f2; color: #b42318; }
.app-shell .provider-health.failed small { color: #b42318; }
.app-shell .provider-runtime { display: grid; min-width: 170px; gap: 4px; }
.app-shell .provider-runtime strong { color: var(--ink); font: 600 11px "Roboto Mono",monospace; white-space: nowrap; }
.app-shell .provider-runtime small,
.app-shell .provider-runtime time { color: var(--faint); font-size: 10px; line-height: 1.35; white-space: nowrap; }
.app-shell .provider-runtime.empty strong { color: var(--muted); font-family: inherit; }
.app-shell .provider-balance-button { display: flex; min-width: 150px; align-items: flex-start; gap: 8px; padding: 0; border: 0; background: transparent; color: var(--ink); text-align: left; }
.app-shell .provider-balance-button:hover:not(:disabled) { color: #075ea4; }
.app-shell .provider-balance-button > svg { flex: 0 0 auto; width: 16px; height: 16px; margin-top: 1px; color: #1687e8; }
.app-shell .provider-balance-button > span { display: grid; min-width: 0; gap: 3px; }
.app-shell .provider-balance-button strong { font: 600 11px "Roboto Mono",monospace; white-space: nowrap; }
.app-shell .provider-balance-button small { overflow: hidden; max-width: 180px; color: var(--faint); font-size: 10px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .provider-balance-button.unavailable { display: grid; gap: 3px; color: var(--muted); cursor: default; }
.app-shell .provider-balance-button.unavailable strong { font-family: inherit; }
.app-shell .provider-used-quota { display: grid; min-width: 104px; gap: 3px; }
.app-shell .provider-used-quota strong { color: var(--ink); font: 600 11px "Roboto Mono",monospace; white-space: nowrap; }
.app-shell .provider-used-quota small { color: #187a32; font-size: 10px; white-space: nowrap; }
.app-shell .provider-used-quota.paused small { color: #b54708; }
@media (min-width: 821px) {
  .app-shell .provider-admin-table.compact-mode th,
  .app-shell .provider-admin-table.compact-mode td { padding: 9px 10px; }
  .app-shell .provider-admin-table.compact-mode .provider-select-column { width: 34px; padding-right: 2px; }
  .app-shell .provider-admin-table.compact-mode .provider-id-cell { max-width: 112px; }
  .app-shell .provider-admin-table.compact-mode .provider-name-column { width: 180px; max-width: 180px; }
  .app-shell .provider-admin-table.compact-mode .provider-name-cell { max-width: 180px; gap: 2px; }
  .app-shell .provider-admin-table.compact-mode .provider-tag-list { min-width: 86px; gap: 3px; }
  .app-shell .provider-admin-table.compact-mode .provider-tag-list span { max-width: 120px; padding: 2px 5px; }
  .app-shell .provider-admin-table.compact-mode .provider-access-all { min-width: 78px; }
  .app-shell .provider-admin-table.compact-mode .provider-access-list { min-width: 96px; max-width: 160px; gap: 3px; }
  .app-shell .provider-admin-table.compact-mode .provider-routing-input { width: 64px; min-height: 28px; padding: 3px 5px; font-size: 11px; }
  .app-shell .provider-admin-table.compact-mode .provider-route-summary { min-width: 82px; gap: 2px; }
  .app-shell .provider-admin-table.compact-mode .provider-health { min-width: 112px; max-width: 170px; gap: 2px; }
  .app-shell .provider-admin-table.compact-mode .provider-runtime { min-width: 126px; gap: 2px; }
  .app-shell .provider-admin-table.compact-mode .provider-balance-button { min-width: 116px; gap: 6px; }
  .app-shell .provider-admin-table.compact-mode .provider-used-quota { min-width: 84px; gap: 2px; }
  .app-shell .provider-admin-table.compact-mode .provider-row-quick-actions { min-width: 126px; max-width: 126px; gap: 4px; }
  .app-shell .provider-admin-table.compact-mode .provider-row-quick-actions .icon-button { width: 28px; height: 28px; flex-basis: 28px; }
  .app-shell .provider-admin-table.compact-mode .provider-tag-name-cell { min-width: 126px; gap: 3px; }
  .app-shell .provider-admin-table.compact-mode .provider-tag-types,
  .app-shell .provider-admin-table.compact-mode .provider-tag-models { min-width: 94px; max-width: 170px; gap: 3px; }
  .app-shell .provider-admin-table.compact-mode .provider-tag-routing { min-width: 96px; gap: 2px; }
  .app-shell .provider-admin-table.compact-mode .provider-tag-status { min-width: 90px; gap: 2px; }
  .app-shell .provider-admin-table.compact-mode.tag-view .row-actions { min-width: 154px; max-width: 178px; gap: 4px; }
}
@media (max-width: 820px) {
  .app-shell .provider-compact-toggle { display: none!important; }
}
.app-shell .audit-log-filter-bar { display: grid; grid-template-columns: minmax(190px,1fr) minmax(130px,150px) minmax(180px,220px) minmax(165px,190px) minmax(165px,190px) auto; align-items: end; gap: 12px; margin-bottom: 12px; }
.app-shell .audit-log-filter-bar label { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .audit-log-filter-bar input,
.app-shell .audit-log-filter-bar select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .audit-log-filter-summary { display: flex; min-height: 40px; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.app-shell .audit-log-filter-summary .icon-button { width: 40px; height: 40px; }
.app-shell .audit-log-table { min-width: var(--audit-log-table-min-width,1040px); }
.app-shell .audit-log-table .audit-log-column-hidden { display: none!important; }
.app-shell .audit-log-table td[data-audit-log-column="created"] { min-width: 145px; white-space: nowrap; }
.app-shell .audit-log-table td[data-audit-log-column="actor"] { min-width: 190px; }
.app-shell .audit-log-table td[data-audit-log-column="action"] code { color: #262626; }
.app-shell .audit-log-table td[data-audit-log-column="resource"] { min-width: 180px; }
.app-shell .audit-log-table td[data-audit-log-column="actions"] { width: 58px; }
.app-shell .audit-metadata { display: block; max-width: 330px; overflow: hidden; color: #525252; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .audit-event-id { display: block; overflow: hidden; max-width: 180px; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .audit-log-detail-button { width: 34px; height: 34px; }
.app-shell .audit-log-detail-button svg { width: 16px; height: 16px; }
.app-shell .audit-log-pagination { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.app-shell .audit-log-pagination > div { display: flex; align-items: center; gap: 7px; }
.app-shell .audit-log-pagination label { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
.app-shell .audit-log-pagination select { min-width: 76px; min-height: 36px; padding: 6px 28px 6px 10px; border-color: var(--line-strong); background-color: #fff; font-size: 12px; }
.app-shell .audit-log-pagination .icon-button { width: 36px; height: 36px; }
.app-shell .audit-log-pagination .icon-button svg { width: 16px; height: 16px; }
dialog.provider-editor-dialog.audit-log-detail-dialog { width: min(720px,100vw); }
.audit-log-detail { display: grid; width: 100%; height: 100%; grid-template-rows: auto minmax(0,1fr) auto; background: #fff; color: #0a0a0a; box-shadow: -22px 0 60px rgba(0,0,0,.16); }
.audit-log-detail-content { min-height: 0; overflow-y: auto; }
.audit-log-detail-hero { display: flex; min-height: 108px; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 28px; border-bottom: 1px solid #e5e5e5; background: #fafafa; }
.audit-log-detail-hero > div { display: grid; min-width: 0; gap: 7px; }
.audit-log-detail-hero span { color: #737373; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.audit-log-detail-hero code { overflow: hidden; max-width: 440px; color: #171717; font-size: 15px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.audit-log-detail-hero time { flex: 0 0 auto; color: #525252; font: 11px "Roboto Mono",monospace; white-space: nowrap; }
.audit-log-detail-section { padding: 24px 28px; border-bottom: 1px solid #e5e5e5; }
.audit-log-detail-section:last-child { border-bottom: 0; }
.audit-log-detail-section .section-title { margin-bottom: 15px; }
.audit-log-detail-list { display: grid; margin: 0; border-top: 1px solid #e5e5e5; }
.audit-log-detail-list > div { display: grid; grid-template-columns: 125px minmax(0,1fr); gap: 14px; padding: 12px 0; border-bottom: 1px solid #e5e5e5; }
.audit-log-detail-list dt { color: #737373; font-size: 11px; }
.audit-log-detail-list dd { display: grid; min-width: 0; gap: 3px; margin: 0; color: #171717; font-size: 12px; text-align: right; overflow-wrap: anywhere; }
.audit-log-detail-list dd span { color: #737373; font-size: 10px; }
.audit-log-detail-list code { overflow-wrap: anywhere; white-space: normal; }
#audit-log-detail-metadata { overflow: auto; max-height: 440px; margin: 0; padding: 15px; border: 1px solid #e5e5e5; border-radius: 8px; background: #fafafa; color: #262626; font: 11px/1.65 "Roboto Mono",monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.audit-log-detail .provider-editor-footer > span { overflow: hidden; color: #737373; font: 10px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .admin-usage-filter-bar { display: grid; grid-template-columns: repeat(3,minmax(170px,1fr)) repeat(3,minmax(135px,.72fr)); align-items: end; gap: 12px; margin-bottom: 14px; }
.app-shell .admin-usage-filter-bar label { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .admin-usage-filter-bar input,
.app-shell .admin-usage-filter-bar select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .admin-usage-filter-summary { display: flex; min-height: 40px; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.app-shell .admin-usage-filter-summary .icon-button { width: 40px; height: 40px; }
.app-shell .admin-usage-summary { display: grid; grid-template-columns: repeat(auto-fit,minmax(130px,1fr)); gap: 1px; margin-bottom: 10px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--line); }
.app-shell .admin-usage-summary > div { display: grid; min-width: 0; gap: 7px; padding: 15px 17px; background: #fff; }
.app-shell .admin-usage-summary span { color: var(--muted); font-size: 11px; }
.app-shell .admin-usage-summary strong { overflow: hidden; color: var(--ink); font: 600 19px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .admin-usage-summary-note { margin: 0 0 14px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.app-shell .admin-usage-table { min-width: var(--admin-usage-table-min-width,1420px); }
.app-shell .admin-usage-table .admin-usage-column-hidden { display: none!important; }
.app-shell .admin-usage-table td[data-admin-usage-column="created"] { min-width: 145px; white-space: nowrap; }
.app-shell .admin-usage-table td[data-admin-usage-column="customer"] { min-width: 190px; }
.app-shell .admin-usage-table td[data-admin-usage-column="request"] code { display: block; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .admin-usage-table td[data-admin-usage-column="key"],
.app-shell .admin-usage-table td[data-admin-usage-column="provider"],
.app-shell .admin-usage-table td[data-admin-usage-column="channel"] { min-width: 160px; }
.app-shell .admin-usage-table td[data-admin-usage-column="status"],
.app-shell .admin-usage-table td[data-admin-usage-column="tokens"],
.app-shell .admin-usage-table td[data-admin-usage-column="latency"],
.app-shell .admin-usage-table td[data-admin-usage-column="output_tps"],
.app-shell .admin-usage-table td[data-admin-usage-column="cost"] { white-space: nowrap; }
.app-shell .admin-usage-table td[data-admin-usage-column="actions"] { width: 58px; }
.app-shell .admin-usage-detail-button { width: 34px; height: 34px; }
.app-shell .admin-usage-detail-button svg { width: 16px; height: 16px; }
dialog.provider-editor-dialog.admin-usage-detail-dialog { width: min(720px,100vw); }
.admin-usage-detail { display: grid; width: 100%; height: 100%; grid-template-rows: auto minmax(0,1fr) auto; background: #fff; color: #0a0a0a; box-shadow: -22px 0 60px rgba(0,0,0,.16); }
.admin-usage-detail-content { min-height: 0; overflow-y: auto; }
.admin-usage-detail-hero { display: flex; min-height: 108px; align-items: center; justify-content: space-between; gap: 18px; padding: 22px 28px; border-bottom: 1px solid #e5e5e5; background: #fafafa; }
.admin-usage-detail-hero > div { display: grid; min-width: 0; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 7px 10px; }
.admin-usage-detail-hero strong { min-width: 0; overflow: hidden; color: #171717; font: 600 14px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.admin-usage-detail-hero time { grid-column: 1/-1; color: #737373; font-size: 11px; }
.admin-usage-detail-hero .icon-button { flex: 0 0 auto; width: 38px; height: 38px; border-color: #d4d4d4; background: #fff; color: #525252; }
.admin-usage-detail-section { padding: 25px 28px 28px; border-bottom: 1px solid #e5e5e5; }
.admin-usage-detail-section:last-child { border-bottom: 0; }
.admin-usage-detail-heading { margin-bottom: 16px; }
.admin-usage-detail-heading h3 { margin: 0 0 4px; color: #171717; font-size: 15px; }
.admin-usage-detail-heading p { margin: 0; color: #737373; font-size: 11px; }
.admin-usage-detail-list { display: grid; margin: 0; border-top: 1px solid #e5e5e5; }
.admin-usage-detail-list > div { display: grid; grid-template-columns: minmax(120px,.65fr) minmax(0,1.35fr); gap: 20px; padding: 11px 0; border-bottom: 1px solid #ededed; }
.admin-usage-detail-list dt { color: #737373; font-size: 11px; }
.admin-usage-detail-list dd { min-width: 0; margin: 0; overflow-wrap: anywhere; color: #262626; font: 500 11px/1.45 "Roboto Mono",monospace; text-align: right; }
.admin-usage-detail-list .usage-mode-badge { margin: 0 0 0 auto; }
.admin-request-headers summary { padding: 3px 0; color: #171717; cursor: pointer; font-size: 15px; font-weight: 600; }
.admin-request-headers summary:hover { color: #1769aa; }
.admin-request-headers summary:focus-visible { outline: 2px solid #1685ee; outline-offset: 5px; border-radius: 3px; }
.admin-request-headers-note { margin: 12px 0 0; color: #64748b; font-size: 12px; line-height: 1.6; }
.admin-request-headers-note.is-truncated { color: #92400e; }
#admin-usage-detail-headers-content { max-height: 400px; overflow: auto; overflow-wrap: anywhere; color: #262626; font-size: 12px; }
.admin-request-headers-list { margin: 15px 0 0; border-top: 1px solid #e5e7eb; }
.admin-request-headers-list > div { display: grid; grid-template-columns: minmax(110px,.65fr) minmax(0,1.35fr); gap: 16px; padding: 12px 0; border-bottom: 1px solid #e5e7eb; }
.admin-request-headers-list dt,.admin-request-headers-list dd { min-width: 0; margin: 0; color: #334155; font: 11px/1.65 "Roboto Mono",monospace; overflow-wrap: anywhere; }
.admin-request-headers-list dd { color: #0f172a; }
.admin-request-headers-list code { display: block; color: inherit; font: inherit; white-space: pre-wrap; }
.admin-request-headers-list code + code { margin-top: 6px; }
@media(max-width:600px) { .admin-request-headers-list > div { grid-template-columns: minmax(0,1fr); gap: 4px; } }
.admin-usage-detail-metrics { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); overflow: hidden; border: 1px solid #e5e5e5; border-radius: 8px; }
.admin-usage-detail-metrics.billing { grid-template-columns: repeat(3,minmax(0,1fr)); }
.admin-usage-detail-metrics > div { display: grid; min-width: 0; gap: 7px; padding: 14px 12px; border-right: 1px solid #e5e5e5; background: #fafafa; }
.admin-usage-detail-metrics > div:last-child { border-right: 0; }
.admin-usage-detail-metrics span { color: #737373; font-size: 10px; line-height: 1.35; }
.admin-usage-detail-metrics strong { min-width: 0; overflow: hidden; color: #171717; font: 600 15px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
#admin-usage-detail-metadata { overflow: auto; max-height: 360px; margin: 0; padding: 15px; border: 1px solid #e5e5e5; border-radius: 8px; background: #fafafa; color: #262626; font: 11px/1.65 "Roboto Mono",monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.upstream-error-card { min-width: 0; margin: 12px 0; border: 1px solid #e5e5e5; border-radius: 8px; padding: 12px; }
.upstream-error-card summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 4px; cursor: pointer; font-size: 12px; }
.upstream-error-card summary:hover { color: #1769aa; }
.upstream-error-card summary:focus-visible { outline: 2px solid #1685ee; outline-offset: 4px; }
.upstream-error-card pre { max-height: 360px; overflow: auto; margin: 10px 0 0; padding: 12px; background: #fafafa; border: 1px solid #ededed; border-radius: 6px; font: 11px/1.65 "Roboto Mono",monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.upstream-error-path,.upstream-error-message { font-size: 12px; overflow-wrap: anywhere; }
.upstream-error-path { color: #737373; }
.upstream-error-notice { padding: 8px 10px; background: #fff8eb; color: #8a5200; border-radius: 5px; font-size: 11px; line-height: 1.6; }
.upstream-error-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 11px; }
.admin-usage-detail .provider-editor-footer > span { overflow: hidden; color: #737373; font: 10px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .admin-usage-pagination { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.app-shell .admin-usage-pagination > div { display: flex; align-items: center; gap: 7px; }
.app-shell .admin-usage-pagination label { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
.app-shell .admin-usage-pagination select { min-width: 76px; min-height: 36px; padding: 6px 28px 6px 10px; border-color: var(--line-strong); background-color: #fff; font-size: 12px; }
.app-shell .admin-usage-pagination .icon-button { width: 36px; height: 36px; }
.app-shell .admin-usage-pagination .icon-button svg { width: 16px; height: 16px; }
.app-shell .admin-failure-actions { align-items: center; }
.app-shell .failure-period-control { width: auto; margin: 0; }
.app-shell .admin-failure-summary { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); margin-bottom: 20px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.app-shell .admin-failure-summary > div { display: grid; min-width: 0; gap: 7px; padding: 15px 17px; border-right: 1px solid var(--line); }
.app-shell .admin-failure-summary > div:last-child { border-right: 0; }
.app-shell .admin-failure-summary span { color: var(--muted); font-size: 11px; }
.app-shell .admin-failure-summary strong { overflow: hidden; color: var(--ink); font: 600 19px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .admin-failure-chart-section { min-width: 0; margin-bottom: 24px; padding: 20px 0 12px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.app-shell .admin-failure-chart-section .usage-analytics-chart { overflow-x: auto; }
.app-shell .admin-failure-chart-section .section-title { align-items: center; }
.app-shell .admin-failure-chart-section h3,
.app-shell .admin-failure-breakdowns h3 { margin: 0 0 4px; color: var(--ink); font-size: 15px; }
.app-shell .admin-failure-chart-section .section-title p,
.app-shell .admin-failure-breakdowns .section-title p { margin: 0; color: var(--muted); font-size: 11px; }
.app-shell .usage-chart-legend .failure::before { background: #d92d20; }
.app-shell .usage-chart-bars i.failure { background: #d92d20; }
.app-shell .admin-failure-breakdowns { display: grid; grid-template-columns: 1.1fr repeat(2,minmax(0,1fr)); gap: 22px; }
.app-shell .admin-failure-breakdowns > section { min-width: 0; }
.app-shell .admin-failure-breakdowns > section:not(:last-child) { padding-right: 22px; border-right: 1px solid var(--line); }
.app-shell .admin-failure-breakdowns table { min-width: 430px; }
.app-shell .admin-failure-breakdowns td:first-child { min-width: 150px; }
.app-shell .admin-failure-breakdowns td:not(:first-child) { white-space: nowrap; }
.app-shell .admin-performance-actions { align-items: center; }
.app-shell .performance-period-control { width: auto; margin: 0; }
.app-shell .admin-performance-summary { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); margin-bottom: 20px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.app-shell .admin-performance-summary > div { display: grid; min-width: 0; gap: 7px; padding: 15px 17px; border-right: 1px solid var(--line); }
.app-shell .admin-performance-summary > div:last-child { border-right: 0; }
.app-shell .admin-performance-summary span { color: var(--muted); font-size: 11px; }
.app-shell .admin-performance-summary strong { overflow: hidden; color: var(--ink); font: 600 19px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .admin-performance-chart-section { min-width: 0; margin-bottom: 24px; padding: 20px 0 12px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.app-shell .admin-performance-chart-section .usage-analytics-chart { overflow-x: auto; }
.app-shell .admin-performance-chart-section .section-title { align-items: center; }
.app-shell .admin-performance-chart-section h3,
.app-shell .admin-performance-breakdowns h3 { margin: 0 0 4px; color: var(--ink); font-size: 15px; }
.app-shell .admin-performance-chart-section .section-title p,
.app-shell .admin-performance-breakdowns .section-title p { margin: 0; color: var(--muted); font-size: 11px; }
.app-shell .admin-performance-breakdowns { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.app-shell .admin-performance-breakdowns > section { min-width: 0; }
.app-shell .admin-performance-breakdowns > section:not(:last-child) { padding-right: 22px; border-right: 1px solid var(--line); }
.app-shell .admin-performance-breakdowns table { min-width: 500px; }
.app-shell .admin-performance-breakdowns td:first-child { min-width: 150px; }
.app-shell .admin-performance-breakdowns td:not(:first-child) { white-space: nowrap; }
.app-shell .admin-system-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-bottom: 20px; }
.app-shell .admin-system-metrics article { display: grid; min-width: 0; min-height: 112px; align-content: center; gap: 7px; padding: 17px 18px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.app-shell .admin-system-metrics span { color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .admin-system-metrics strong { overflow: hidden; color: var(--ink); font: 600 21px/1.15 "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .admin-system-metrics em { overflow: hidden; color: var(--faint); font-size: 11px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .admin-system-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.app-shell .admin-system-grid > section { min-width: 0; padding-top: 20px; border-top: 1px solid var(--line); }
.app-shell .admin-system-grid > section:last-child { grid-column: 1/-1; }
.app-shell .admin-system-grid h3 { margin: 0 0 4px; color: var(--ink); font-size: 15px; }
.app-shell .admin-system-grid .section-title p { margin: 0; color: var(--muted); font-size: 11px; }
.app-shell .admin-system-table { min-width: 410px; }
.app-shell .admin-system-table th { width: 52%; color: var(--muted); font-size: 12px; font-weight: 500; }
.app-shell .admin-system-table td { color: var(--ink); font: 12px "Roboto Mono",monospace; text-align: right; white-space: nowrap; }
.app-shell .admin-system-tasks { display: grid; gap: 24px; margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.app-shell .admin-system-tasks-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.app-shell .admin-system-tasks-heading > div:first-child { display: flex; min-width: 0; align-items: center; gap: 11px; }
.app-shell .admin-system-tasks-icon { display: grid; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; border: 1px solid #b8dcf7; border-radius: 7px; background: #eaf6ff; color: #075ea4; }
.app-shell .admin-system-tasks-icon svg { width: 17px; height: 17px; }
.app-shell .admin-system-tasks-heading h3,.app-shell .admin-system-task-group h4 { margin: 0 0 3px; color: var(--ink); font-size: 15px; }
.app-shell .admin-system-tasks-heading p,.app-shell .admin-system-task-group-heading p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.app-shell .admin-system-task-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 12px; }
.app-shell .admin-system-task-actions > span { display: inline-flex; align-items: center; gap: 6px; color: var(--faint); font-size: 11px; white-space: nowrap; }
.app-shell .admin-system-task-actions > span::before { width: 6px; height: 6px; border-radius: 50%; background: #a3a3a3; content: ""; }
.app-shell .admin-system-task-actions > span.active::before { background: #16a34a; }
.app-shell .admin-system-task-actions .secondary-button { display: inline-flex; align-items: center; gap: 7px; }
.app-shell .admin-system-task-actions .secondary-button svg { width: 14px; height: 14px; }
.app-shell .admin-system-task-group { min-width: 0; }
.app-shell .admin-system-task-group-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 9px; }
.app-shell .admin-system-task-group-heading > span { display: grid; min-width: 27px; height: 24px; padding: 0 7px; place-items: center; border: 1px solid var(--line-strong); border-radius: 5px; background: #fafafa; color: var(--muted); font: 600 11px "Roboto Mono",monospace; }
.app-shell .admin-system-task-table { min-width: 900px; }
.app-shell .admin-system-task-table th { color: var(--muted); font-size: 10px; font-weight: 600; }
.app-shell .admin-system-task-table td { vertical-align: middle; }
.app-shell .admin-system-task-table td:first-child { min-width: 190px; }
.app-shell .admin-system-task-table td:first-child strong,.app-shell .admin-system-task-table td:first-child code { display: block; }
.app-shell .admin-system-task-table td:first-child strong { margin-bottom: 3px; color: var(--ink); font-size: 12px; }
.app-shell .admin-system-task-table td:first-child code { max-width: 210px; overflow: hidden; color: var(--faint); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .system-task-status { display: inline-flex; align-items: center; gap: 6px; padding: 4px 7px; border: 1px solid #d4d4d4; border-radius: 5px; background: #fafafa; color: #525252; font-size: 10px; font-weight: 600; text-transform: capitalize; white-space: nowrap; }
.app-shell .system-task-status i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.app-shell .system-task-status.running { border-color: #b8dcf7; background: #eaf6ff; color: #075ea4; }
.app-shell .system-task-status.succeeded { border-color: #a7e0b5; background: #eefbf1; color: #187a32; }
.app-shell .system-task-status.failed { border-color: #fecaca; background: #fef2f2; color: #b42318; }
.app-shell .system-task-progress-cell { display: grid; width: 150px; grid-template-columns: 105px 35px; align-items: center; gap: 8px; }
.app-shell .system-task-progress-cell strong { color: var(--muted); font: 600 10px "Roboto Mono",monospace; text-align: right; }
.app-shell .system-task-progress-track { height: 6px; overflow: hidden; border-radius: 3px; background: #e5e5e5; }
.app-shell .system-task-progress-track span { display: block; width: var(--system-task-progress); height: 100%; border-radius: inherit; background: #1687e8; }
.app-shell .system-task-executor { display: block; max-width: 175px; overflow: hidden; color: #525252; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .admin-system-task-table time { color: var(--muted); font-size: 11px; white-space: nowrap; }
.app-shell .system-task-detail { display: block; max-width: 260px; overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .system-task-detail.error { color: #b42318; }
.app-shell .admin-overview-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-bottom: 20px; }
.app-shell .admin-overview-metrics article { display: grid; min-width: 0; min-height: 112px; align-content: center; gap: 7px; padding: 17px 18px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.app-shell .admin-overview-metrics span { color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .admin-overview-metrics strong { overflow: hidden; color: var(--ink); font: 600 21px/1.15 "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .admin-overview-metrics em { overflow: hidden; color: var(--faint); font-size: 11px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .admin-overview-chart-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; margin-bottom: 24px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.app-shell .admin-overview-chart { min-width: 0; padding: 20px 0 12px; }
.app-shell .admin-overview-chart:first-child { padding-right: 22px; border-right: 1px solid var(--line); }
.app-shell .admin-overview-chart .section-title { align-items: center; }
.app-shell .admin-overview-chart h3,
.app-shell .admin-overview-breakdowns h3 { margin: 0 0 4px; color: var(--ink); font-size: 15px; }
.app-shell .admin-overview-chart .section-title p,
.app-shell .admin-overview-breakdowns .section-title p { margin: 0; color: var(--muted); font-size: 11px; }
.app-shell .admin-overview-breakdowns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.app-shell .admin-overview-breakdowns > section { min-width: 0; }
.app-shell .admin-overview-breakdowns > section:first-child { padding-right: 22px; border-right: 1px solid var(--line); }
.app-shell .admin-overview-breakdowns table { min-width: 610px; }
.app-shell .admin-overview-breakdowns td:first-child { min-width: 165px; }
.app-shell .admin-overview-breakdowns td:not(:first-child) { white-space: nowrap; }
.app-shell .global-settings-form { display: grid; max-width: 1280px; gap: 0; padding: 0 0 8px; }
.app-shell .global-settings-layout { display: grid; min-width: 0; grid-template-columns: 210px minmax(0,1fr); align-items: start; gap: 20px; }
.app-shell .global-settings-nav { position: sticky; top: 72px; display: grid; gap: 3px; padding: 7px; border: 1px solid var(--line); border-radius: 8px; background: #fafafa; }
.app-shell .global-settings-nav button { display: grid; width: 100%; min-height: 43px; grid-template-columns: 25px minmax(0,1fr); align-items: center; gap: 9px; padding: 7px 10px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: #525252; text-align: left; }
.app-shell .global-settings-nav button:hover { background: #f0f0f0; color: var(--ink); }
.app-shell .global-settings-nav button.active { border-color: #b8dcf7; background: #eaf6ff; color: #075ea4; }
.app-shell .global-settings-nav button svg { width: 16px; height: 16px; }
.app-shell .global-settings-nav button > span { min-width: 0; overflow: hidden; font-size: 11px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .global-settings-editor { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.app-shell .global-settings-section { display: grid; min-height: 520px; align-content: start; gap: 20px; padding: 26px 28px 30px; scroll-margin-top: 72px; }
.app-shell .global-settings-section[hidden] { display: none; }
.app-shell .global-settings-section-heading { display: flex; align-items: center; gap: 12px; }
.app-shell .global-settings-section-heading > span { display: grid; flex: 0 0 38px; width: 38px; height: 38px; place-items: center; border: 1px solid #b8dcf7; border-radius: 8px; background: #eaf6ff; color: #075ea4; }
.app-shell .global-settings-section-heading svg { width: 18px; height: 18px; }
.app-shell .global-settings-section-heading h3 { margin: 0 0 4px; color: var(--ink); font-size: 16px; }
.app-shell .global-settings-section-heading p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.app-shell .payment-method-settings-summary { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding: 13px 15px; border-left: 3px solid #16865c; background: #f3fbf6; }
.app-shell .payment-method-settings-summary span { flex: 0 0 auto; color: #12633f; font-size: 13px; font-weight: 700; }
.app-shell .payment-method-settings-summary small { max-width: 680px; color: #5f6d65; font-size: 11px; line-height: 1.5; text-align: right; }
.app-shell .payment-method-settings-list { display: grid; gap: 14px; }
.app-shell .payment-method-setting { overflow: hidden; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; }
.app-shell .payment-method-setting > header { display: flex; min-height: 72px; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 16px; border-bottom: 1px solid var(--line); background: #fafafa; }
.app-shell .payment-method-identity { display: flex; min-width: 0; align-items: center; gap: 12px; }
.app-shell .payment-method-identity > span { display: grid; flex: 0 0 36px; width: 36px; height: 36px; place-items: center; border: 1px solid #d4d4d4; border-radius: 7px; background: #fff; color: #404040; }
.app-shell .payment-method-identity svg { width: 17px; height: 17px; }
.app-shell .payment-method-identity .payment-method-icon { width: 26px; height: 26px; }
.app-shell .payment-method-identity > div { display: grid; min-width: 0; gap: 4px; }
.app-shell .payment-method-identity strong { overflow: hidden; color: var(--ink); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .payment-method-identity small { color: var(--muted); font: 10px "Roboto Mono",monospace; }
.app-shell .payment-method-toggle { display: flex!important; flex: 0 0 auto; align-items: center; grid-template-columns: auto auto; gap: 10px!important; }
.app-shell .payment-method-toggle > span { color: #525252; font-size: 11px; }
.app-shell .payment-method-toggle input { width: 44px; min-height: 26px; height: 26px; margin: 0; appearance: none; border: 1px solid #bdbdbd; border-radius: 13px; background-color: #d4d4d4; background-image: radial-gradient(circle at 12px 50%,#fff 0 9px,transparent 10px); }
.app-shell .payment-method-toggle input:checked { border-color: #16865c; background-color: #16865c; background-image: radial-gradient(circle at 31px 50%,#fff 0 9px,transparent 10px); }
.app-shell .payment-method-setting-body { display: grid; gap: 18px; padding: 18px 16px 16px; }
.app-shell .payment-method-common-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.app-shell .payment-method-provider-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; padding-top: 18px; border-top: 1px solid var(--line); }
.app-shell .payment-method-provider-grid textarea { min-height: 100px; }
.app-shell .payment-method-url-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; padding-top: 18px; border-top: 1px solid var(--line); }
.app-shell .payment-method-url-grid input[readonly] { background: #f5f5f5; color: #525252; font: 10px "Roboto Mono",monospace; }
.app-shell .payment-secret-field > small { color: #737373; }
.app-shell .payment-clear-secret { display: flex; width: max-content; max-width: 100%; align-items: center; gap: 8px; color: #b42318; font-size: 11px; font-weight: 550; }
.app-shell .payment-clear-secret input { width: 16px; min-height: 16px; margin: 0; accent-color: #b42318; }
.app-shell .payment-method-setting-actions { display: flex; min-height: 44px; align-items: center; justify-content: space-between; gap: 14px; padding-top: 4px; }
.app-shell .payment-method-setting-actions > span { color: #525252; font-size: 11px; }
.app-shell .payment-method-setting-actions > span.error { color: #b42318; }
.app-shell .payment-method-setting-actions > span.pending { color: #075ea4; }
.app-shell .payment-method-setting-actions .secondary-button { display: inline-flex; min-height: 40px; align-items: center; gap: 7px; }
.app-shell .payment-method-setting-actions .secondary-button svg { width: 15px; height: 15px; }
.app-shell .payment-method-settings-empty { margin: 0; padding: 22px; border: 1px dashed var(--line-strong); color: var(--muted); font-size: 12px; text-align: center; }
.app-shell .global-sidebar-settings-heading > div { min-width: 0; }
.app-shell .global-sidebar-settings-heading .secondary-button { display: inline-flex; flex: 0 0 auto; min-height: 38px; align-items: center; gap: 7px; margin-left: auto; }
.app-shell .global-sidebar-settings-heading .secondary-button svg { width: 15px; height: 15px; }
.app-shell .global-sidebar-settings-toolbar { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; padding: 12px 15px; border-left: 3px solid #1687e8; background: #f5fbff; }
.app-shell .global-sidebar-settings-toolbar span { color: var(--ink); font-size: 13px; font-weight: 700; }
.app-shell .global-sidebar-settings-toolbar small { color: var(--muted); font-size: 11px; line-height: 1.45; text-align: right; }
.app-shell .global-sidebar-groups { display: grid; gap: 14px; }
.app-shell .global-sidebar-group { overflow: hidden; border: 1px solid var(--line-strong); border-radius: 8px; }
.app-shell .global-sidebar-group > header { display: flex; min-height: 72px; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 16px; background: #fafafa; }
.app-shell .global-sidebar-group > header > div { display: grid; min-width: 0; gap: 4px; }
.app-shell .global-sidebar-group > header > div strong { color: var(--ink); font-size: 14px; }
.app-shell .global-sidebar-group > header > div small { color: var(--muted); font-size: 11px; line-height: 1.4; }
.app-shell .global-sidebar-section-toggle { display: flex!important; flex: 0 0 auto; align-items: center; grid-template-columns: auto auto; gap: 10px!important; }
.app-shell .global-sidebar-section-toggle > span { color: #525252; font-size: 11px; }
.app-shell .global-sidebar-module-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 22px; padding: 0 16px 3px; border-top: 1px solid var(--line); }
.app-shell .global-sidebar-module { display: flex!important; min-height: 72px; align-items: center; justify-content: space-between; gap: 16px!important; padding: 12px 0; border-bottom: 1px solid var(--line); }
.app-shell .global-sidebar-module > span { display: grid; min-width: 0; gap: 4px; }
.app-shell .global-sidebar-module strong { color: var(--ink); font-size: 12px; }
.app-shell .global-sidebar-module input,
.app-shell .global-sidebar-section-toggle input { flex: 0 0 auto; width: 44px; min-height: 26px; height: 26px; margin: 0; appearance: none; border: 1px solid #bdbdbd; border-radius: 13px; background-color: #d4d4d4; background-image: radial-gradient(circle at 12px 50%,#fff 0 9px,transparent 10px); transition: opacity .16s,background-color .16s,border-color .16s; }
.app-shell .global-sidebar-module input:checked,
.app-shell .global-sidebar-section-toggle input:checked { border-color: #0a0a0a; background-color: #0a0a0a; background-image: radial-gradient(circle at 31px 50%,#fff 0 9px,transparent 10px); }
.app-shell .global-sidebar-module input:disabled { cursor: not-allowed; opacity: .42; }
.app-shell .global-settings-grid { display: grid; grid-template-columns: minmax(280px,1fr) minmax(220px,280px); align-items: stretch; gap: 18px; }
.app-shell .global-settings-grid-wide { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.app-shell .oauth-settings-list { display: grid; gap: 18px; }
.app-shell .oauth-provider-settings { display: grid; min-width: 0; gap: 16px; margin: 0; padding: 18px 0 20px; border: 0; border-top: 1px solid var(--line); }
.app-shell .oauth-provider-settings:last-child { padding-bottom: 0; }
.app-shell .oauth-provider-settings legend { display: inline-flex; align-items: center; gap: 8px; padding: 0 10px 0 0; color: var(--ink); font-size: 14px; font-weight: 700; }
.app-shell .oauth-provider-settings legend svg { width: 17px; height: 17px; }
.app-shell .oauth-provider-settings > label:last-child input { font-family: "Roboto Mono",monospace; font-size: 11px; }
.app-shell .oauth-clear-secret { display: flex!important; width: max-content; max-width: 100%; align-items: center; grid-template-columns: auto minmax(0,1fr); gap: 8px!important; color: #525252!important; font-size: 11px!important; font-weight: 500!important; }
.app-shell .oauth-clear-secret input { width: 16px; min-height: 16px; margin: 0; accent-color: #0a0a0a; }
.app-shell .global-email-settings { display: grid; gap: 18px; }
.app-shell .global-email-options { display: grid; grid-template-columns: minmax(300px,1fr) minmax(230px,.7fr); align-items: center; gap: 18px; }
.app-shell .global-email-test { display: grid; grid-template-columns: minmax(260px,1fr) auto minmax(170px,.6fr); align-items: end; gap: 14px; padding-top: 18px; border-top: 1px solid var(--line); }
.app-shell .global-email-test .secondary-button { display: inline-flex; min-height: 40px; align-items: center; gap: 7px; white-space: nowrap; }
.app-shell .global-email-test .secondary-button svg { width: 15px; height: 15px; }
.app-shell #global-email-test-status { min-height: 40px; align-content: center; color: var(--muted); font-size: 11px; }
.app-shell .global-onboarding-grid { display: grid; grid-template-columns: minmax(300px,1.2fr) minmax(230px,.8fr) minmax(220px,280px); align-items: stretch; gap: 18px; }
.app-shell .global-api-key-limit-grid { display: grid; grid-template-columns: minmax(300px,1fr) minmax(220px,280px); align-items: stretch; gap: 18px; }
.app-shell .global-request-limits-grid { display: grid; grid-template-columns: repeat(2,minmax(220px,1fr)) minmax(240px,300px); align-items: stretch; gap: 18px; }
.app-shell .global-model-rate-limit-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: stretch; gap: 18px; }
.app-shell .global-model-rate-limit-grid .global-registration-switch { grid-column: 1 / -1; }
.app-shell .global-model-rate-limit-grid .global-settings-status { grid-column: 1 / -1; min-height: 82px; }
.app-shell .global-model-rate-limit-groups-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; padding-top: 2px; }
.app-shell .global-model-rate-limit-groups-heading > div { display: grid; min-width: 0; gap: 4px; }
.app-shell .global-model-rate-limit-groups-heading strong { color: var(--ink); font-size: 13px; }
.app-shell .global-model-rate-limit-groups-heading span { color: var(--muted); font-size: 11px; line-height: 1.45; }
.app-shell .global-model-rate-limit-groups-heading > small { flex: 0 0 auto; color: #075ea4; font-size: 11px; font-weight: 600; }
.app-shell .global-model-rate-limit-groups { display: grid; border-top: 1px solid var(--line); }
.app-shell .global-model-rate-limit-group { display: grid; grid-template-columns: minmax(260px,1fr) minmax(150px,190px) minmax(150px,190px); align-items: center; gap: 18px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.app-shell .global-model-rate-limit-group > label { margin: 0; }
.app-shell .global-model-rate-limit-group-toggle { display: grid!important; grid-template-columns: 18px minmax(0,1fr); align-items: center; gap: 11px!important; }
.app-shell .global-model-rate-limit-group-toggle > input { width: 16px!important; min-height: 16px!important; height: 16px!important; margin: 0!important; padding: 0!important; appearance: auto!important; accent-color: #0a0a0a; }
.app-shell .global-model-rate-limit-group-toggle > span { display: grid; min-width: 0; gap: 3px; }
.app-shell .global-model-rate-limit-group-toggle strong { overflow: hidden; color: var(--ink); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .global-model-rate-limit-group-toggle small { overflow: hidden; color: var(--muted); font-size: 10px; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .global-model-rate-limit-empty { margin: 0; padding: 20px 0; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.app-shell .global-health-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: stretch; gap: 18px; }
.app-shell .global-health-schedule-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--line); }
.app-shell .global-health-schedule-heading strong { color: var(--ink); font-size: 14px; }
.app-shell .global-health-schedule-heading span { color: var(--muted); font-size: 12px; }
.app-shell .global-health-schedule-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: stretch; gap: 18px; margin-top: 14px; }
.app-shell .global-retry-grid { display: grid; grid-template-columns: minmax(280px,1fr) minmax(260px,340px); align-items: stretch; gap: 18px; }
.app-shell .global-affinity-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: stretch; gap: 18px; }
.app-shell .global-sensitive-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: stretch; gap: 18px; }
.app-shell .global-sensitive-grid .global-settings-status { grid-column: 1 / -1; }
.app-shell .global-settings-form .global-sensitive-words-field textarea { min-height: 190px; }
.app-shell .usage-cleanup-grid { display: grid; grid-template-columns: minmax(320px,1fr) minmax(300px,.85fr); align-items: stretch; gap: 22px; }
.app-shell .usage-cleanup-controls { display: grid; min-width: 0; align-content: start; gap: 13px; }
.app-shell .usage-cleanup-controls input[type="datetime-local"] { width: 100%; border-color: var(--line-strong); background: #fff; color: var(--ink); }
.app-shell .usage-cleanup-presets { display: flex; flex-wrap: wrap; gap: 7px; }
.app-shell .usage-cleanup-presets button { min-height: 32px; padding: 0 10px; border: 1px solid var(--line-strong); border-radius: 6px; background: #fff; color: #525252; font-size: 11px; font-weight: 600; }
.app-shell .usage-cleanup-presets button:hover { border-color: #a3a3a3; background: #f5f5f5; color: var(--ink); }
.app-shell .usage-cleanup-presets button:disabled { opacity: .48; }
.app-shell .usage-cleanup-request { display: inline-flex; width: max-content; min-height: 40px; align-items: center; gap: 7px; }
.app-shell .usage-cleanup-request svg { width: 15px; height: 15px; }
.app-shell .usage-cleanup-status { display: grid; min-width: 0; align-content: center; gap: 11px; padding: 18px 20px; border-left: 3px solid #a3a3a3; background: #fafafa; }
.app-shell .usage-cleanup-status[data-status="pending"],
.app-shell .usage-cleanup-status[data-status="running"] { border-left-color: #1687e8; background: #f5fbff; }
.app-shell .usage-cleanup-status[data-status="succeeded"] { border-left-color: #16865c; background: #f3fbf6; }
.app-shell .usage-cleanup-status[data-status="failed"] { border-left-color: #b42318; background: #fff7f6; }
.app-shell .usage-cleanup-status-heading { display: flex; min-width: 0; align-items: baseline; justify-content: space-between; gap: 14px; }
.app-shell .usage-cleanup-status-heading span,
.app-shell .usage-cleanup-count span { color: var(--muted); font-size: 10px; font-weight: 700; text-transform: uppercase; }
.app-shell .usage-cleanup-status-heading strong { color: var(--ink); font-size: 15px; }
.app-shell .usage-cleanup-status > small { min-height: 32px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.app-shell .usage-cleanup-progress { height: 6px; overflow: hidden; border-radius: 3px; background: #e5e5e5; }
.app-shell .usage-cleanup-progress span { display: block; width: 0; height: 100%; border-radius: inherit; background: #1687e8; transition: width .2s ease; }
.app-shell .usage-cleanup-status[data-status="succeeded"] .usage-cleanup-progress span { background: #16865c; }
.app-shell .usage-cleanup-status[data-status="failed"] .usage-cleanup-progress span { background: #b42318; }
.app-shell .usage-cleanup-count { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; }
.app-shell .usage-cleanup-count strong { color: var(--ink); font: 600 18px "Roboto Mono",monospace; }
.app-shell .global-settings-form label { display: grid; min-width: 0; gap: 8px; color: #404040; font-size: 12px; font-weight: 600; }
.app-shell .global-settings-form label small { color: var(--muted); font-size: 11px; font-weight: 400; line-height: 1.5; }
.app-shell .global-settings-form select,
.app-shell .global-settings-form input[type="text"],
.app-shell .global-settings-form input[type="email"],
.app-shell .global-settings-form input[type="password"],
.app-shell .global-settings-form input[type="url"],
.app-shell .global-settings-form input[type="number"],
.app-shell .global-settings-form textarea { width: 100%; border-color: var(--line-strong); background: #fff; color: var(--ink); }
.app-shell .global-settings-form textarea { min-height: 230px; resize: vertical; font: 12px/1.6 "Roboto Mono",monospace; }
.app-shell .global-registration-switch { display: flex!important; min-height: 92px; align-items: center; justify-content: space-between; gap: 18px!important; padding: 16px 17px; border: 1px solid var(--line-strong); border-radius: 8px; }
.app-shell .global-registration-switch > span { display: grid; gap: 5px; }
.app-shell .global-registration-switch strong { color: var(--ink); font-size: 14px; }
.app-shell .global-registration-switch input { flex: 0 0 auto; width: 44px; min-height: 26px; height: 26px; margin: 0; appearance: none; border: 1px solid #bdbdbd; border-radius: 13px; background-color: #d4d4d4; background-image: radial-gradient(circle at 12px 50%,#fff 0 9px,transparent 10px); transition: .16s; }
.app-shell .global-registration-switch input:checked { border-color: #0a0a0a; background-color: #0a0a0a; background-image: radial-gradient(circle at 31px 50%,#fff 0 9px,transparent 10px); }
.app-shell .global-settings-status { display: grid; align-content: center; gap: 6px; padding: 18px; border-left: 3px solid #1687e8; background: #f5fbff; }
.app-shell .global-settings-status span { color: var(--muted); font-size: 11px; font-weight: 600; text-transform: uppercase; }
.app-shell .global-settings-status strong { color: var(--ink); font-size: 20px; }
.app-shell .global-settings-status small { color: var(--muted); font-size: 11px; }
.app-shell .global-affinity-status { position: relative; min-height: 112px; padding-right: 74px; }
.app-shell .global-affinity-actions { position: absolute; top: 50%; right: 14px; display: flex; gap: 6px; transform: translateY(-50%); }
.app-shell .global-affinity-actions .icon-button { width: 34px; height: 34px; }
.app-shell .global-affinity-actions .icon-button.danger { color: #b42318; }
.app-shell .global-settings-actions { display: flex; min-height: 70px; align-items: center; justify-content: space-between; gap: 18px; padding: 13px 18px; border-top: 1px solid var(--line); background: #fafafa; }
.app-shell .global-settings-editor:has(> [data-global-settings-standalone]:not([hidden])) > .global-settings-actions { display: none; }
.app-shell .global-settings-actions > span { color: var(--muted); font-size: 12px; }
.app-shell .global-settings-actions .primary-button { display: inline-flex; min-height: 42px; align-items: center; gap: 7px; }
.app-shell .global-settings-actions .primary-button svg { width: 16px; height: 16px; }
.app-shell .logo-preview,
.app-shell .admin-table-logo { border-color: var(--line-strong); background: #fff; color: var(--ink); }
.app-shell .logo-preview img,
.app-shell .admin-table-logo img { background: #fff; }
.app-shell dialog { color: var(--ink); }
.app-shell + dialog .dialog-body,
dialog .dialog-body { border-color: #e5e5e5; border-radius: 8px; background: #fff; color: #0a0a0a; box-shadow: 0 25px 70px rgba(0,0,0,.18); }
dialog::backdrop { background: rgba(10,10,10,.42); }
dialog .dialog-heading h2 { color: #0a0a0a; font-size: 18px; }
dialog .dialog-heading button { border: 0; background: transparent; color: #737373; line-height: 0; }
dialog .dialog-heading button:hover { border-color: transparent; background: transparent; color: #171717; }
dialog .dialog-heading button svg { display: block; margin: 0; }
dialog .dialog-body label { color: #525252; font-size: 12px; }
dialog .dialog-body input { border-color: #d4d4d4; background: #fff; color: #0a0a0a; }
dialog .dialog-body select { border-color: #d4d4d4; background: #fff; color: #0a0a0a; }
#key-dialog { max-width: calc(100vw - 40px); max-height: calc(100dvh - 48px); overflow: hidden; border-radius: 16px; }
#key-dialog .key-budget-dialog { display: flex; flex-direction: column; width: min(700px,calc(100vw - 40px)); max-height: min(840px,calc(100dvh - 48px)); padding: 0; overflow: hidden; border: 1px solid #e4e7ec; border-radius: 16px; }
#key-dialog .key-editor-header { display: flex; flex: 0 0 auto; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 24px; border-bottom: 1px solid #edf0f3; }
#key-dialog .key-editor-title { display: flex; align-items: center; gap: 14px; min-width: 0; }
#key-dialog .key-editor-icon { display: grid; flex: 0 0 44px; place-items: center; width: 44px; height: 44px; border: 1px solid #dbeafe; border-radius: 12px; background: #eff6ff; color: #1379c8; }
#key-dialog .key-editor-icon svg { width: 21px; height: 21px; }
#key-dialog .key-editor-header h2 { margin: 0; color: #101828; font-size: 21px; line-height: 1.35; letter-spacing: -.3px; }
#key-dialog .key-editor-header p { margin: 5px 0 0; color: #667085; font-size: 12px; line-height: 1.6; }
#key-dialog .key-editor-close { display: grid; flex: 0 0 32px; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid #e4e7ec; border-radius: 8px; background: #fff; color: #667085; }
#key-dialog .key-editor-close:hover { background: #f2f4f7; color: #101828; }
#key-dialog .key-editor-close svg { width: 17px; height: 17px; }
#key-dialog .key-editor-content { flex: 1 1 auto; min-height: 0; padding: 24px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
#key-dialog h3 { margin: 0 0 14px; color: #344054; font-size: 12px; font-weight: 650; line-height: 1.5; }
#key-dialog label { gap: 8px; color: #344054; font-size: 12px; font-weight: 550; }
#key-dialog input:not([type="checkbox"]),#key-dialog textarea { width: 100%; min-width: 0; min-height: 42px; padding: 10px 12px; border: 1px solid #d0d5dd; border-radius: 8px; background: #fff; font-size: 13px; box-shadow: 0 1px 2px rgba(16,24,40,.025); }
#key-dialog input:focus,#key-dialog textarea:focus { border-color: #1687e8; outline: 2px solid #dbeefe; outline-offset: 1px; }
#key-dialog #key-name { min-height: 46px; font-size: 15px; font-weight: 500; }
#key-dialog .key-required-mark { margin-left: 3px; color: #d92d20; }
#key-dialog .key-basics-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); align-items: start; gap: 20px; margin-top: 18px; }
#key-dialog .key-basics-grid small { color: #667085; font-size: 11px; font-weight: 400; }
#key-dialog .key-expiry-presets { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
#key-dialog .key-expiry-presets button { min-height: 27px; padding: 4px 8px; border: 1px solid #e4e7ec; border-radius: 6px; background: #fff; color: #667085; font-size: 10px; line-height: 1.35; }
#key-dialog .key-expiry-presets button:hover { border-color: #9bcefa; background: #f5faff; color: #075ea4; }
#key-dialog .key-expiry-presets button[aria-pressed="true"] { border-color: #a6d2fa; background: #eaf5ff; color: #075ea4; font-weight: 650; }
#key-dialog .key-editor-help { margin: 14px 0 0; color: #667085; font-size: 11px; line-height: 1.6; }
#key-dialog .key-editor-access { display: grid; gap: 10px; margin-top: 24px; }
#key-dialog .key-editor-access > h3 { margin-bottom: 2px; }
#key-dialog .key-settings-section { min-width: 0; border: 1px solid #e4e7ec; border-radius: 10px; background: #fff; overflow: clip; }
#key-dialog .key-settings-section > summary { display: flex; align-items: center; gap: 10px; min-height: 60px; padding: 12px 14px; cursor: pointer; list-style: none; }
#key-dialog .key-settings-section > summary::-webkit-details-marker { display: none; }
#key-dialog .key-settings-section > summary:hover { background: #f8fafc; }
#key-dialog .key-settings-section > summary:focus-visible { outline: 2px solid #1687e8; outline-offset: -3px; border-radius: 9px; }
#key-dialog .key-settings-section[open] > summary { background: #f8fafc; border-bottom: 1px solid #edf0f3; }
#key-dialog .key-settings-icon { display: grid; flex: 0 0 30px; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: #f2f4f7; color: #667085; }
#key-dialog .key-settings-icon svg { width: 16px; height: 16px; }
#key-dialog .key-settings-title { min-width: 0; color: #344054; font-size: 13px; font-weight: 600; }
#key-dialog .key-settings-section > summary > small { flex: 0 1 auto; max-width: 45%; margin-left: auto; padding: 4px 8px; border-radius: 5px; background: #f2f4f7; color: #475467; font-size: 11px; line-height: 1.4; text-align: right; overflow-wrap: anywhere; }
#key-dialog .key-settings-chevron { flex: 0 0 15px; width: 15px; height: 15px; color: #98a2b3; transition: transform .15s; }
#key-dialog .key-settings-section[open] > summary > .key-settings-chevron { transform: rotate(180deg); }
#key-dialog .key-settings-content { display: grid; gap: 12px; padding: 16px; }
#key-dialog .key-settings-content > .key-editor-help { margin: 0; }
#key-dialog .key-settings-content .key-budget-grid { margin-top: 0; }
#key-dialog .key-settings-content .key-ip-access { margin-top: 4px; padding-top: 16px; border-top: 1px solid #edf0f3; }
#key-dialog .key-routing-help { color: #667085; font-size: 11px; line-height: 1.6; }
#key-dialog .key-routing-help summary { width: fit-content; cursor: pointer; }
#key-dialog .key-routing-help p { margin-top: 8px; }
#key-dialog .key-provider-toolbar { gap: 6px 12px; }
#key-dialog .key-provider-toolbar .text-button { font-size: 11px; }
#key-dialog .key-provider-toolbar > div { margin-left: auto; }
#key-dialog .key-model-list { max-height: 230px; scrollbar-gutter: stable; }
#key-dialog .key-model-row { padding: 10px; }
#key-dialog .key-model-row:has(input:checked) { background: #eff8ff; }
#key-dialog .key-model-row:focus-within { outline: 2px solid #1687e8; outline-offset: -2px; }
#key-dialog .key-editor-footer { flex: 0 0 auto; padding: 16px 24px; border-top: 1px solid #e4e7ec; background: #fcfcfd; }
#key-dialog .key-editor-footer .dialog-error { margin: 0 0 10px; padding: 9px 11px; border: 1px solid #fecdca; border-radius: 7px; background: #fff5f4; color: #b42318; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
#key-dialog .key-editor-footer .dialog-error:empty { display: none; }
#key-dialog .key-editor-footer-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
#key-dialog #key-created-hint { display: flex; align-items: center; gap: 6px; margin: 0; color: #667085; font-size: 11px; line-height: 1.5; }
#key-dialog #key-created-hint svg { flex: 0 0 15px; width: 15px; height: 15px; }
#key-dialog .dialog-actions { display: flex; flex: 0 0 auto; justify-content: flex-end; gap: 10px; margin: 0 0 0 auto; }
#key-dialog .dialog-actions button { min-height: 42px; min-width: 88px; padding: 10px 18px; border-radius: 8px; font-size: 13px; }
#key-dialog button:focus-visible { outline: 2px solid #1687e8; outline-offset: 2px; }
@media(max-width:600px){
  #key-dialog { inset: var(--mobile-editor-viewport-top,0px) 0 auto; width: calc(100vw - 16px); max-width: none; max-height: calc(min(100dvh,var(--mobile-editor-viewport-height,var(--mobile-dialog-height,100dvh))) - 16px); margin: 8px auto; border-radius: 12px; }
  #key-dialog .key-budget-dialog { width: 100%; max-height: calc(min(100dvh,var(--mobile-editor-viewport-height,var(--mobile-dialog-height,100dvh))) - 16px); padding: 0; border-radius: 12px; overflow: hidden; }
  #key-dialog .key-editor-header { padding: 18px 16px; gap: 10px; }
  #key-dialog .key-editor-title { gap: 10px; }
  #key-dialog .key-editor-header h2 { font-size: 18px; }
  #key-dialog .key-editor-header p { font-size: 11px; }
  #key-dialog .key-editor-icon { flex-basis: 36px; width: 36px; height: 36px; border-radius: 9px; }
  #key-dialog .key-editor-content { padding: 18px 16px; scrollbar-gutter: auto; }
  #key-dialog .key-basics-grid { grid-template-columns: minmax(0,1fr); gap: 14px; margin-top: 14px; }
  #key-dialog input:not([type="checkbox"]),#key-dialog #key-name,#key-dialog textarea { font-size: 16px; }
  #key-dialog .key-expiry-presets button { flex: 1; min-height: 32px; font-size: 11px; }
  #key-dialog .key-settings-section > summary { gap: 8px; padding: 11px 12px; }
  #key-dialog .key-settings-title { font-size: 12px; }
  #key-dialog .key-settings-section > summary > small { max-width: 42%; padding: 4px 6px; font-size: 10px; }
  #key-dialog .key-settings-content { padding: 12px; }
  #key-dialog .key-settings-content .key-budget-grid { grid-template-columns: minmax(0,1fr); }
  #key-dialog .key-editor-footer { padding: 12px 16px max(12px,env(safe-area-inset-bottom)); }
  #key-dialog .key-editor-footer-row { flex-direction: column; align-items: stretch; gap: 10px; }
  #key-dialog #key-created-hint { justify-content: center; font-size: 10px; }
  #key-dialog .dialog-actions { width: 100%; margin: 0; }
  #key-dialog .dialog-actions .secondary-button { flex: 1; }
  #key-dialog .dialog-actions .primary-button { flex: 2; }
  #key-dialog.mobile-editor-keyboard .key-editor-header { padding: 10px 14px; align-items: center; }
  #key-dialog.mobile-editor-keyboard .key-editor-header p,#key-dialog.mobile-editor-keyboard .key-editor-icon,#key-dialog.mobile-editor-keyboard #key-created-hint { display: none; }
  #key-dialog.mobile-editor-keyboard .key-editor-header h2 { font-size: 16px; }
  #key-dialog.mobile-editor-keyboard .key-editor-content { padding-top: 14px; padding-bottom: 14px; }
  #key-dialog.mobile-editor-keyboard .key-editor-footer { padding: 8px 14px; }
}
@media(prefers-reduced-motion:reduce){#key-dialog .key-settings-chevron{transition:none}}
.key-budget-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-top: 16px; }
.key-budget-grid small { color: #737373; font-size: 11px; font-weight: 400; line-height: 1.45; }
.key-budget-summary { margin: 16px 0 0!important; padding: 11px 13px; border-left: 3px solid #1687e8; background: #f5fbff; color: #404040!important; }
.key-model-access { display: grid; gap: 12px; margin-top: 18px; }
.admin-key-model-access { margin-top: 0; }
.key-model-access-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.key-model-access-heading > div { display: grid; min-width: 0; gap: 4px; }
.key-model-access-heading strong { color: #262626; font-size: 13px; }
.key-model-access-heading span { color: #737373; font-size: 11px; line-height: 1.45; }
.key-model-access-heading > small { flex: 0 0 auto; color: #075ea4; font-size: 11px; font-weight: 600; }
dialog .key-model-toggle { display: grid; grid-template-columns: 18px minmax(0,1fr); align-items: start; gap: 10px; padding: 11px 12px; border: 1px solid #d4d4d4; border-radius: 7px; background: #fafafa; }
dialog .key-model-toggle input,dialog .key-model-row input { width: 17px; height: 17px; min-height: 17px; margin: 1px 0 0; accent-color: #1687e8; }
.key-model-toggle > span { display: grid; gap: 3px; }
.key-model-toggle strong { color: #262626; font-size: 12px; }
.key-model-toggle small { color: #737373; font-size: 11px; font-weight: 400; line-height: 1.4; }
.key-model-list { display: grid; max-height: 245px; overflow-y: auto; border: 1px solid #e5e5e5; border-radius: 7px; background: #fff; }
dialog .key-model-row { display: grid; grid-template-columns: 18px minmax(0,1fr) auto; align-items: center; gap: 10px; min-height: 54px; padding: 8px 11px; border-bottom: 1px solid #ededed; font-weight: 400; }
dialog .key-model-row:last-child { border-bottom: 0; }
.key-model-row > span { display: grid; min-width: 0; gap: 3px; }
.key-model-row strong,.key-model-row code { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.key-model-row strong { color: #262626; font-size: 12px; }
.key-model-row code { color: #737373; font-size: 10px; }
.key-model-row > small { color: #737373; font-size: 10px; font-weight: 500; }
.key-model-row.inactive { background: #fafafa; }
.key-model-empty { margin: 0; padding: 18px; color: #737373; font-size: 12px; text-align: center; }
.key-model-supplier-hint { margin: 0!important; color: #075ea4!important; font-size: 11px; line-height: 1.5; }
.key-model-unavailable { padding: 10px 12px; border: 1px solid #f4d49a; border-radius: 7px; background: #fffbeb; color: #92400e; font-size: 11px; line-height: 1.5; }
.key-model-unavailable p { margin: 0 0 6px!important; color: inherit!important; font-size: inherit!important; }
.key-model-unavailable code { display: block; margin-bottom: 6px; overflow-wrap: anywhere; font-size: 10px; }
.key-model-unavailable .text-button { min-height: 32px; color: #92400e; font-size: 11px; }
.key-model-summary { display: grid; max-width: 180px; gap: 3px; }
.key-model-summary strong { color: #262626; font-size: 12px; }
.key-model-summary small { overflow: hidden; color: #737373; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.key-provider-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
.key-provider-toolbar > label { flex: 1 1 180px; min-width: 0; margin: 0; }
.key-provider-toolbar input { width: 100%; min-height: 38px; }
.key-provider-toolbar > div { display: flex; flex-wrap: wrap; gap: 12px; }
.key-provider-toolbar .text-button,.key-provider-feedback .text-button { min-height: 38px; padding: 4px 0; font-size: 12px; }
.key-provider-list { max-height: 216px; }
dialog .key-provider-row { cursor: pointer; }
dialog .key-provider-row.selected { background: #eff6ff; box-shadow: inset 3px 0 #1687e8; }
dialog .key-provider-row:focus-within { outline: 2px solid #1687e8; outline-offset: -2px; }
dialog .key-provider-row > span { pointer-events: none; }
.key-provider-feedback { display: flex; align-items: center; gap: 12px; }
.key-provider-feedback .key-provider-status { flex: 1; margin: 0; color: #075ea4; font-size: 11px; line-height: 1.5; }
.key-provider-feedback .key-provider-status.error { color: #b42318; }
.key-provider-access .key-provider-help,.provider-editor-section .key-provider-help { margin: 0; color: #737373; font-size: 11px; line-height: 1.6; }
.key-provider-summary { display: block; margin-top: 4px; color: #075ea4!important; font-size: 11px; }
@media(max-width:600px){.key-provider-toolbar > label{flex-basis:100%}.key-provider-toolbar > div{justify-content:space-between;width:100%}.key-provider-list{max-height:190px}.key-provider-access .key-model-access-heading{align-items:start;gap:10px}}
.key-ip-access { display: grid; gap: 9px; margin-top: 18px; }
.key-ip-access textarea { min-height: 78px; border-color: #d4d4d4; background: #fff; color: #0a0a0a; font: 11px/1.55 "Roboto Mono",monospace; resize: vertical; }
.key-ip-help,.key-ip-count { color: #737373; font-size: 11px; line-height: 1.4; }
.key-ip-count { color: #075ea4; font-weight: 600; }
.provider-editor-section > .key-ip-help { margin-top: -12px; }
dialog.provider-editor-dialog { width: min(1040px, 100vw); max-width: none; height: 100dvh; max-height: 100dvh; margin: 0 0 0 auto; padding: 0; border: 0; background: transparent; overflow: hidden; }
dialog.model-vendor-dialog { width: min(920px,100vw); }
.model-metadata-audit-dialog { width: min(980px,100vw); }
.model-metadata-audit { grid-template-rows: auto minmax(0,1fr) auto; }
.model-metadata-audit-content { display: grid; min-height: 0; overflow-y: auto; gap: 24px; padding: 20px 22px 30px; }
.model-metadata-audit-toolbar { display: flex; min-height: 40px; align-items: center; justify-content: space-between; gap: 16px; }
.model-metadata-audit-toolbar p { margin: 0; color: #737373; font-size: 12px; }
.model-metadata-audit-toolbar .secondary-button { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 7px; }
.model-metadata-audit-toolbar svg { width: 15px; height: 15px; }
.model-metadata-audit-summary { display: grid; overflow: hidden; grid-template-columns: repeat(6,minmax(0,1fr)); border: 1px solid #e5e5e5; border-radius: 8px; background: #fafafa; }
.model-metadata-audit-summary > div { display: grid; min-width: 0; min-height: 94px; align-content: center; gap: 5px; padding: 13px; border-right: 1px solid #e5e5e5; }
.model-metadata-audit-summary > div:last-child { border-right: 0; }
.model-metadata-audit-summary small { color: #737373; font-size: 10px; font-weight: 600; }
.model-metadata-audit-summary strong { color: #171717; font: 600 20px "Roboto Mono",monospace; }
.model-metadata-audit-summary span { overflow-wrap: anywhere; color: #737373; font-size: 10px; line-height: 1.35; }
.model-metadata-audit-section { display: grid; min-width: 0; gap: 12px; }
.model-metadata-audit-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; padding-bottom: 10px; border-bottom: 1px solid #e5e5e5; }
.model-metadata-audit-heading h3 { margin: 0 0 4px; color: #171717; font-size: 15px; }
.model-metadata-audit-heading p { margin: 0; color: #737373; font-size: 11px; }
.model-metadata-audit-heading > span { flex: 0 0 auto; color: #525252; font: 600 10px "Roboto Mono",monospace; }
.model-metadata-audit-list { display: grid; gap: 9px; }
.model-metadata-audit-item { display: grid; min-width: 0; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px 18px; padding: 13px 14px; border: 1px solid #e5e5e5; border-radius: 8px; background: #fff; }
.model-metadata-audit-item > .secondary-button { display: inline-flex; min-width: 84px; align-items: center; justify-content: center; gap: 6px; }
.model-metadata-audit-item > .secondary-button svg { width: 14px; height: 14px; }
.model-metadata-audit-item-main { display: flex; min-width: 0; align-items: flex-start; gap: 11px; }
.model-metadata-audit-item-main > div { display: grid; min-width: 0; gap: 5px; }
.model-metadata-audit-logo { position: relative; display: grid; flex: 0 0 38px; width: 38px; height: 38px; overflow: hidden; place-items: center; border: 1px solid #e5e5e5; border-radius: 7px; background: #fafafa; color: #525252; font-size: 10px; font-weight: 700; }
.model-metadata-audit-logo img { position: absolute; width: 25px; height: 25px; object-fit: contain; background: #fafafa; }
.model-metadata-audit-item-title { display: flex; min-width: 0; align-items: center; flex-wrap: wrap; gap: 7px; }
.model-metadata-audit-item-title strong { overflow-wrap: anywhere; color: #262626; font-size: 12px; }
.model-metadata-audit-item-title .status-pill { font-size: 9px; }
.model-metadata-audit-item-main code { overflow-wrap: anywhere; color: #737373; font: 10px "Roboto Mono",monospace; }
.model-metadata-audit-item-main small { color: #737373; font-size: 10px; }
.model-metadata-audit-fields { display: flex; flex-wrap: wrap; gap: 5px; }
.model-metadata-audit-fields span { padding: 3px 6px; border: 1px solid #bae6fd; border-radius: 5px; background: #f0f9ff; color: #0369a1; font-size: 9px; font-weight: 600; }
.model-metadata-audit-fields span.warning { border-color: #fed7aa; background: #fff7ed; color: #c2410c; }
.provider-catalog-audit-item { align-items: start; }
.model-metadata-audit-models { display: grid; grid-column: 1/-1; gap: 8px; padding: 10px 0 0 49px; border-top: 1px solid #ededed; }
.model-metadata-audit-model-group { display: grid; grid-template-columns: 105px minmax(0,1fr); align-items: start; gap: 10px; }
.model-metadata-audit-model-group > strong { color: #525252; font-size: 10px; }
.model-metadata-audit-model-group > div { display: flex; min-width: 0; flex-wrap: wrap; gap: 5px; }
.model-metadata-audit-model-group code { max-width: 100%; overflow-wrap: anywhere; padding: 3px 6px; border: 1px solid #d4d4d4; border-radius: 5px; background: #fafafa; color: #525252; font-size: 9px; }
.model-metadata-audit-model-group.add code { border-color: #bbf7d0; background: #f0fdf4; color: #15803d; }
.model-metadata-audit-model-group.remove code { border-color: #fecaca; background: #fef2f2; color: #b42318; }
.model-metadata-audit-error { margin: 3px 0 0; overflow-wrap: anywhere; color: #b42318; font-size: 10px; line-height: 1.45; }
.model-metadata-audit-empty { display: grid; min-height: 130px; place-items: center; align-content: center; gap: 7px; padding: 22px; border: 1px dashed #d4d4d4; border-radius: 8px; color: #737373; text-align: center; }
.model-metadata-audit-empty svg { width: 22px; height: 22px; color: #15803d; }
.model-metadata-audit-empty strong { color: #404040; font-size: 12px; }
.model-metadata-audit-empty span { font-size: 10px; }
.model-vendor-layout { display: grid; min-height: 0; grid-template-columns: 285px minmax(0,1fr); }
.model-vendor-sidebar { display: grid; min-height: 0; grid-template-rows: auto auto minmax(0,1fr); gap: 13px; padding: 18px 14px; border-right: 1px solid #e5e5e5; background: #fafafa; }
.model-vendor-sidebar-heading { display: flex; min-height: 36px; align-items: center; justify-content: space-between; gap: 12px; }
.model-vendor-sidebar-heading strong { color: #262626; font-size: 12px; }
.model-vendor-sidebar-heading .icon-button { width: 34px; height: 34px; }
.model-vendor-sidebar-heading .icon-button svg { width: 16px; height: 16px; }
.model-vendor-sidebar > label { display: grid; gap: 6px; color: #737373; font-size: 10px; font-weight: 600; }
.model-vendor-sidebar input { width: 100%; min-height: 38px; border-color: #d4d4d4; background: #fff; font-size: 12px; }
.model-vendor-list { display: grid; min-height: 0; align-content: start; gap: 4px; overflow-y: auto; }
.model-vendor-list > button { display: grid; width: 100%; grid-template-columns: 34px minmax(0,1fr) auto; align-items: center; gap: 9px; padding: 8px; border: 1px solid transparent; border-radius: 7px; background: transparent; color: #404040; text-align: left; }
.model-vendor-list > button:hover { background: #f0f0f0; }
.model-vendor-list > button.active { border-color: #b8dcf7; background: #eaf6ff; color: #075ea4; }
.model-vendor-list .logo-preview { width: 34px; height: 34px; border-radius: 7px; font-size: 11px; }
.model-vendor-list > button > span:nth-child(2) { display: grid; min-width: 0; gap: 3px; }
.model-vendor-list strong,.model-vendor-list small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.model-vendor-list strong { color: inherit; font-size: 12px; }
.model-vendor-list small { color: #737373; font-size: 10px; }
.model-vendor-list > button > em { min-width: 24px; color: #737373; font-size: 10px; font-style: normal; text-align: right; }
.model-vendor-list-empty { margin: 0; padding: 24px 10px; color: #737373; font-size: 11px; line-height: 1.5; text-align: center; }
.model-vendor-content .provider-editor-section { min-height: 100%; }
.agent-tools-sidebar { grid-template-rows: auto auto auto auto minmax(0,1fr); }
.agent-tools-search > span:first-child { display: block; margin-bottom: 6px; color: #737373; font-size: 10px; font-weight: 600; }
.agent-tools-search-box { position: relative; display: block; }
.agent-tools-search-box svg { position: absolute; top: 50%; left: 11px; width: 14px; height: 14px; color: #a3a3a3; pointer-events: none; transform: translateY(-50%); }
.agent-tools-search-box input { padding-left: 32px; }
.agent-tools-count { margin: -4px 0 0; color: #a3a3a3; font-size: 10px; }
.agent-tools-list > button { grid-template-columns: 34px minmax(0,1fr) auto 18px; transition: background .12s ease, border-color .12s ease, box-shadow .12s ease; }
.agent-tools-list > button.active { box-shadow: inset 2px 0 0 #1687e8; }
.agent-tool-grip { color: #8a96a3; font: 22px/1 sans-serif; cursor: grab; touch-action: none; user-select: none; }
.agent-tools-dragging { cursor: grabbing; user-select: none; }
.agent-tools-list > button.agent-tool-dragging { opacity: .45; }
.agent-tools-list > button.agent-tool-drop-before { box-shadow: 0 -2px 0 #1687e8; }
.agent-tools-list > button.agent-tool-drop-after { box-shadow: 0 2px 0 #1687e8; }
.agent-tools-list[aria-busy="true"] .agent-tool-grip { cursor: wait; opacity: .4; }
.agent-tool-order-info p { margin: 0; color: #737373; font-size: 10px; line-height: 1.5; }
#agent-tool-order-status { min-height: 15px; margin-top: 4px; color: #15803d; }
#agent-tool-order-status.error { color: #b42318; }
.agent-tool-list-pills { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; gap: 3px; }
.agent-tool-pill { padding: 2px 6px; border-radius: 999px; font-size: 9px; font-style: normal; font-weight: 600; line-height: 1.3; white-space: nowrap; }
.agent-tool-pill.system { border: 1px solid #cfe3f8; background: #eef6ff; color: #075ea4; }
.agent-tool-pill.disabled { border: 1px solid #e5e5e5; background: #f5f5f5; color: #737373; }
.agent-tools-fields { align-items: start; }
.agent-tools-icon-picker { align-items: center; }
.agent-tools-icon-picker .logo-preview { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 9px; }
.model-vendor-assignment-summary { min-height: 42px; padding: 11px 12px; border-left: 3px solid #1687e8; background: #f5fbff; color: #404040; font-size: 11px; line-height: 1.45; }
.model-vendor-cell { display: grid; min-width: 110px; gap: 3px; }
.model-vendor-cell strong { color: var(--ink); font-size: 11px; }
.model-vendor-cell small { color: var(--faint); font-size: 10px; }
.model-tag-list { display: flex; min-width: 110px; max-width: 200px; flex-wrap: wrap; gap: 4px; }
.model-tag-list span { max-width: 145px; overflow: hidden; padding: 3px 6px; border: 1px solid #d4d4d4; border-radius: 4px; background: #fafafa; color: #404040; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.provider-editor { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; width: 100%; height: 100%; background: #fff; color: #0a0a0a; box-shadow: -22px 0 60px rgba(0,0,0,.16); }
#admin-key-dialog { width: min(900px,100vw); }
.admin-key-editor-content { min-height: 0; overflow-y: auto; }
.admin-key-editor .provider-editor-section:last-child { min-height: 0; }
.admin-key-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border: 1px solid #e5e5e5; border-radius: 8px; overflow: hidden; }
.admin-key-metrics > div { display: grid; min-width: 0; gap: 7px; padding: 16px; border-right: 1px solid #e5e5e5; background: #fafafa; }
.admin-key-metrics > div:last-child { border-right: 0; }
.admin-key-metrics span { color: #737373; font-size: 11px; font-weight: 600; }
.admin-key-metrics strong { min-width: 0; overflow-wrap: anywhere; color: #171717; font-size: 15px; }
#redemption-dialog { width: min(760px,100vw); }
.redemption-editor-content { min-height: 0; overflow-y: auto; }
.redemption-created-body { width: min(680px,calc(100vw - 28px)); }
.redemption-created-body textarea { width: 100%; min-height: 230px; margin-top: 18px; border-color: #d4d4d4; background: #f7f7f7; color: #171717; font: 13px/1.65 "Roboto Mono", monospace; resize: vertical; }
.redemption-created-body .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.provider-editor-header { display: flex; min-height: 76px; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 22px; border-bottom: 1px solid #e5e5e5; }
.provider-editor-title { display: flex; min-width: 0; align-items: center; gap: 12px; }
.provider-editor-icon,.provider-section-heading > span { display: grid; flex: 0 0 auto; width: 36px; height: 36px; place-items: center; border: 1px solid #b8dcf7; border-radius: 8px; background: #eaf6ff; color: #075ea4; }
.provider-editor-icon svg,.provider-section-heading svg { width: 18px; height: 18px; }
.provider-editor-title h2 { margin: 0 0 4px; font-size: 19px; }
.provider-editor-title p { margin: 0; color: #737373; font-size: 12px; }
.provider-editor-close { display: grid; flex: 0 0 auto; width: 34px; height: 34px; padding: 0; place-items: center; border: 0; border-radius: 50%; background: transparent; color: #737373; line-height: 0; }
.provider-editor-close:hover { border-color: transparent; background: transparent; color: #0a0a0a; }
.provider-editor-close svg { display: block; width: 17px; height: 17px; margin: 0; }
.provider-editor-layout { display: grid; min-height: 0; grid-template-columns: 225px minmax(0, 1fr); }
.provider-editor-nav { display: flex; min-height: 0; flex-direction: column; gap: 4px; padding: 18px 12px; border-right: 1px solid #e5e5e5; background: #fafafa; }
.provider-editor-nav button { display: grid; width: 100%; grid-template-columns: 28px minmax(0, 1fr); align-items: start; gap: 9px; padding: 10px; border: 1px solid transparent; border-radius: 7px; background: transparent; color: #737373; text-align: left; }
.provider-editor-nav button:hover { background: #f0f0f0; color: #262626; }
.provider-editor-nav button.active { border-color: #b8dcf7; background: #eaf6ff; color: #075ea4; }
.provider-editor-nav button > svg { width: 17px; height: 17px; margin-top: 1px; }
.provider-editor-nav button span { display: grid; min-width: 0; gap: 3px; }
.provider-editor-nav button strong { color: inherit; font-size: 12px; font-weight: 600; }
.provider-editor-nav button small { overflow: hidden; color: #737373; font-size: 10px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.provider-editor-content { min-height: 0; overflow-y: auto; }
.provider-editor-section { display: grid; gap: 22px; padding: 28px 30px 32px; border-bottom: 1px solid #e5e5e5; scroll-margin-top: 0; }
.provider-editor-section[hidden] { display: none; }
.provider-editor-section:last-child { min-height: 340px; border-bottom: 0; }
.provider-section-heading { display: flex; align-items: center; gap: 12px; }
.provider-section-heading h3 { margin: 0 0 4px; font-size: 16px; }
.provider-section-heading p { margin: 0; color: #737373; font-size: 12px; line-height: 1.45; }
.provider-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.provider-remark-field textarea { min-height: 74px; resize: vertical; }
.provider-create-mode { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px 18px; padding: 14px; border: 1px solid #d4d4d4; border-radius: 8px; background: #fafafa; }
.provider-create-mode[hidden] { display: none; }
.provider-create-mode > div:first-child { display: grid; min-width: 0; gap: 4px; }
.provider-create-mode > div:first-child strong { color: #262626; font-size: 12px; }
.provider-create-mode > div:first-child small { color: #737373; font-size: 11px; line-height: 1.45; }
.provider-create-mode .segmented { display: grid; width: 250px; grid-template-columns: repeat(2,minmax(0,1fr)); }
.provider-batch-name-option { display: grid!important; grid-column: 1/-1; grid-template-columns: 18px minmax(0,1fr); align-items: start; gap: 10px!important; padding-top: 12px; border-top: 1px solid #e5e5e5; color: #404040!important; font-weight: 400!important; }
.provider-batch-name-option[hidden] { display: none!important; }
.provider-batch-name-option input { width: 17px!important; height: 17px!important; min-height: 17px!important; margin: 1px 0 0!important; accent-color: #0a0a0a; }
.provider-batch-name-option span { display: grid; gap: 3px; }
.provider-batch-name-option strong { color: #262626; font-size: 12px; }
.provider-batch-name-option small { color: #737373; font-size: 11px; line-height: 1.4; }
.provider-field-stack { display: grid; gap: 18px; }
.channel-url-preview { display: grid; gap: 10px; min-width: 0; padding: 14px; border-radius: 12px; background: #f7f8fa; color: #262626; }
.channel-url-preview[hidden] { display: none; }
.channel-url-preview > strong { font-size: 12px; }
.channel-url-preview > p { margin: 0; color: #737373; font-size: 11px; line-height: 1.5; }
.channel-url-preview-row { display: grid; grid-template-columns: minmax(0,1fr) 30px; align-items: start; gap: 5px 8px; padding-top: 10px; border-top: 1px solid #e5e7eb; min-width: 0; }
.channel-url-preview-row > span { grid-column: 1/-1; color: #525252; font-size: 11px; }
.channel-url-preview-row > code { display: block; min-width: 0; padding: 5px 0; color: #1d4e89; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; white-space: normal; }
.channel-url-preview-row .icon-button { width: 30px; height: 30px; min-height: 30px; }
.channel-url-preview-row .icon-button svg { width: 14px; height: 14px; }
.channel-url-preview-row > small { grid-column: 1/-1; color: #737373; font-size: 10px; overflow-wrap: anywhere; }
.channel-url-preview-row > .channel-url-preview-invalid { color: #737373; font-family: inherit; font-size: 11px; }
.provider-routing-heading { flex-wrap: wrap; }
.provider-routing-heading > div { flex: 1 1 240px; }
.provider-routing-heading .secondary-button { display: inline-flex; flex: 0 0 auto; min-height: 36px; align-items: center; gap: 7px; }
.provider-routing-heading .secondary-button svg { width: 15px; height: 15px; }
.provider-routing-toolbar { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 14px; padding: 0 12px; border-left: 3px solid #1687e8; background: #f5fbff; }
.provider-routing-toolbar strong { color: #171717; font-size: 12px; }
.provider-routing-toolbar span { color: #525252; font-size: 11px; }
.provider-routing-list { overflow: hidden; border: 1px solid #e5e5e5; border-radius: 8px; }
.provider-routing-list-head,
.provider-routing-row { display: grid; grid-template-columns: minmax(150px,1fr) 88px 270px; align-items: center; gap: 12px; padding: 10px 12px; }
.provider-routing-list-head { min-height: 36px; border-bottom: 1px solid #e5e5e5; background: #fafafa; color: #737373; font-size: 10px; font-weight: 600; }
.provider-routing-row { min-height: 62px; border-bottom: 1px solid #ededed; }
.provider-routing-row:last-child { border-bottom: 0; }
.provider-routing-row.disabled { background: #fcfcfc; }
.provider-routing-row > .status-pill { justify-self: start; }
.provider-routing-row > .status-pill.active { border-color: #a7e0b5; background: #eefbf1; color: #187a32; }
.provider-routing-row > .status-pill.inactive { border-color: #cbd5e1; background: #f1f5f9; color: #475569; }
.provider-routing-model { display: grid; min-width: 0; gap: 4px; }
.provider-routing-model strong { overflow: hidden; color: #262626; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.provider-routing-model code { min-width: 0; overflow: hidden; color: #737373; font: 10px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.provider-routing-policy { width: fit-content; padding: 4px 6px; border: 1px solid #d4d4d4; border-radius: 5px; background: #fff; color: #404040; font: 600 10px "Roboto Mono",monospace; white-space: nowrap; }
.provider-routing-row.disabled .provider-routing-policy { border-style: dashed; opacity: .65; }
.provider-routing-edit { justify-self: end; }
.provider-routing-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.provider-routing-test { display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
.provider-routing-test svg { width: 14px; height: 14px; }
.provider-routing-test:disabled { opacity: .45; cursor: not-allowed; }
.channel-model-mapping-retained { margin-top: 14px; border-top: 1px solid #e5e5e5; }
.channel-model-mapping-retained > summary { padding: 12px 0; color: #64748b; font-size: 12px; font-weight: 600; cursor: pointer; }
.channel-model-mapping-retained > summary:hover { color: #0f172a; }
.provider-model-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 36px; padding: 5px 9px; border: 1px solid #d4d4d4; border-radius: 7px; background: #f5f5f5; color: #525252; font: inherit; font-size: 11px; white-space: nowrap; cursor: pointer; }
.provider-model-toggle[aria-checked="true"] { border-color: #a7dfba; background: #effbf3; color: #166534; }
.provider-model-toggle-track { position: relative; width: 26px; height: 16px; flex: 0 0 26px; border-radius: 10px; background: #a3a3a3; }
.provider-model-toggle-track::after { content: ''; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%; background: #fff; transition: transform .15s; }
.provider-model-toggle[aria-checked="true"] .provider-model-toggle-track { background: #16a34a; }
.provider-model-toggle[aria-checked="true"] .provider-model-toggle-track::after { transform: translateX(10px); }
.provider-model-toggle:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
.provider-model-toggle:disabled { opacity: .6; cursor: wait; }
.provider-routing-empty { margin: 0; padding: 30px 16px; color: #737373; font-size: 12px; text-align: center; }
.provider-model-update-settings { display: grid; gap: 14px; margin: 4px 0 0; padding: 0; border: 0; }
.provider-model-update-settings[hidden] { display: none; }
.provider-model-update-settings legend { margin-bottom: 1px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-model-update-switches { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.provider-model-update-summary { display: grid; grid-template-columns: minmax(150px,1.6fr) repeat(3,minmax(86px,1fr)); overflow: hidden; border: 1px solid #e5e5e5; border-radius: 7px; background: #fff; }
.provider-model-update-summary > div { display: grid; min-width: 0; gap: 5px; padding: 12px; border-right: 1px solid #ededed; }
.provider-model-update-summary > div:last-child { border-right: 0; }
.provider-model-update-summary small { color: #737373; font-size: 10px; }
.provider-model-update-summary strong { overflow: hidden; color: #262626; font: 600 12px/1.35 "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.provider-model-update-items { display: flex; flex-wrap: wrap; gap: 6px; }
.provider-model-update-items[hidden] { display: none; }
.provider-model-update-items span { max-width: 220px; overflow: hidden; padding: 4px 7px; border: 1px solid #d4d4d4; border-radius: 5px; background: #fafafa; color: #525252; font: 500 10px/1.3 "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.provider-model-update-items span.removed { border-color: #f0b6b1; background: #fff7f6; color: #b42318; }
.provider-model-update-error { margin: 0!important; padding: 10px 11px; border: 1px solid #f0b6b1; border-radius: 7px; background: #fff7f6; color: #b42318!important; font-size: 11px!important; line-height: 1.45; overflow-wrap: anywhere; }
.provider-model-update-error[hidden] { display: none; }
.provider-model-update-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.provider-model-update-actions .secondary-button { display: inline-flex; min-height: 36px; align-items: center; gap: 7px; }
.provider-model-update-actions .secondary-button svg { width: 14px; height: 14px; }
.provider-advanced-routes-heading > div { flex: 1 1 260px; }
.provider-advanced-routes-toggle { flex: 0 0 190px; }
.provider-advanced-routes-toolbar { display: flex; min-height: 44px; align-items: center; justify-content: space-between; gap: 14px; padding: 0 12px; border-left: 3px solid #1687e8; background: #f5fbff; }
.provider-advanced-routes-toolbar > div { display: flex; min-width: 0; align-items: center; gap: 10px; }
.provider-advanced-routes-toolbar strong { color: #171717; font-size: 12px; }
.provider-advanced-routes-toolbar span { color: #737373; font-size: 11px; }
.provider-advanced-routes-toolbar .secondary-button { display: inline-flex; flex: 0 0 auto; min-height: 36px; align-items: center; gap: 7px; }
.provider-advanced-routes-toolbar .secondary-button svg { width: 15px; height: 15px; }
.provider-advanced-routes-list { display: grid; gap: 12px; }
.provider-advanced-routes-list.disabled { opacity: .55; }
.provider-advanced-routes-empty { margin: 0; padding: 34px 16px; border: 1px dashed #d4d4d4; border-radius: 7px; color: #737373; font-size: 12px; text-align: center; }
.provider-advanced-route { display: grid; gap: 16px; padding: 15px; border: 1px solid #dcdcdc; border-radius: 8px; background: #fff; }
.provider-advanced-route > header { display: flex; min-height: 38px; align-items: center; justify-content: space-between; gap: 14px; padding-bottom: 11px; border-bottom: 1px solid #ededed; }
.provider-advanced-route > header > div { display: flex; min-width: 0; align-items: center; gap: 8px; }
.provider-advanced-route > header > div:last-child { flex: 0 0 auto; gap: 5px; }
.provider-advanced-route > header strong { color: #262626; font-size: 12px; }
.provider-advanced-route > header code { min-width: 0; overflow: hidden; color: #737373; font: 10px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.provider-advanced-route > header .icon-button { width: 34px; height: 34px; border-color: #d4d4d4; background: #fff; }
.provider-advanced-route > header .icon-button svg { width: 14px; height: 14px; }
.provider-advanced-route > header .icon-button.danger { color: #b42318; }
.provider-advanced-route-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; }
.provider-advanced-route-grid > label,
.provider-advanced-auth-grid > label { display: grid; min-width: 0; gap: 6px; color: #525252; font-size: 11px; font-weight: 600; }
.provider-advanced-route-grid input,
.provider-advanced-route-grid select,
.provider-advanced-route-grid textarea,
.provider-advanced-auth-grid input,
.provider-advanced-auth-grid select { width: 100%; min-width: 0; border-color: #d4d4d4; background: #fff; color: #171717; font-size: 12px; }
.provider-advanced-route-grid textarea { min-height: 74px; font-family: "Roboto Mono",monospace; line-height: 1.45; resize: vertical; }
.provider-advanced-models { grid-column: 1/-1; }
.provider-advanced-models small { color: #737373; font-size: 10px; font-weight: 400; }
.provider-advanced-auth-grid { display: grid; grid-template-columns: minmax(150px,.75fr) repeat(2,minmax(0,1fr)); gap: 13px; padding-top: 14px; border-top: 1px solid #ededed; }
.provider-advanced-auth-grid[data-advanced-auth-mode="default"],
.provider-advanced-auth-grid[data-advanced-auth-mode="none"] { grid-template-columns: minmax(180px,320px); }
.provider-forwarding-settings { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.provider-forwarding-settings legend { margin-bottom: 10px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-forwarding-settings > .provider-pass-through-body { min-height: 72px; border-color: #cfe5f5; background: #f7fbfe; }
.provider-rate-limit-settings { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.provider-rate-limit-settings[hidden] { display: none; }
.provider-rate-limit-settings legend { margin-bottom: 10px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-rate-limit-settings textarea { min-height: 108px; font-family: "Roboto Mono",monospace; font-size: 12px; line-height: 1.55; }
.provider-response-compatibility { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.provider-response-compatibility legend { margin-bottom: 1px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-field-policy-settings { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.provider-field-policy-settings legend { margin-bottom: 10px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-request-options { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.provider-request-options legend { margin-bottom: 10px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-request-options textarea { min-height: 148px; font-family: "Roboto Mono",monospace; font-size: 12px; line-height: 1.55; }
.provider-request-header-field { display: grid; min-width: 0; align-content: start; gap: 8px; }
.provider-request-header-field > div:first-child { display: flex; min-height: 38px; align-items: center; justify-content: space-between; gap: 12px; color: #525252; font-size: 11px; font-weight: 600; }
.provider-request-header-field .secondary-button { display: inline-flex; min-height: 36px; align-items: center; gap: 7px; }
.provider-request-header-field .secondary-button svg { width: 15px; height: 15px; }
.provider-request-header-list { display: grid; min-height: 148px; overflow: hidden; align-content: start; border: 1px solid #d4d4d4; border-radius: 7px; background: #fafafa; }
.provider-request-header-row { display: grid; min-width: 0; grid-template-columns: minmax(125px,.72fr) minmax(180px,1.28fr) 36px; align-items: end; gap: 9px; padding: 10px; border-bottom: 1px solid #e5e5e5; background: #fff; }
.provider-request-header-row:last-child { border-bottom: 0; }
.provider-request-header-row label { display: grid; min-width: 0; gap: 5px; color: #737373; font-size: 10px; font-weight: 600; }
.provider-request-header-row input { width: 100%; min-width: 0; min-height: 36px; padding: 8px 9px; border: 1px solid #d4d4d4; border-radius: 6px; background: #fff; color: #171717; font: 11px "Roboto Mono",monospace; }
.provider-request-header-row input:focus { border-color: #1687e8; outline: 2px solid rgba(22,135,232,.12); }
.provider-request-header-row .icon-button { width: 36px; height: 36px; color: #b42318; }
.provider-request-header-row .icon-button svg { width: 15px; height: 15px; }
.provider-request-header-empty { display: grid; min-height: 146px; place-items: center; margin: 0; padding: 18px; color: #737373; font-size: 12px; text-align: center; }
.provider-param-override-field { display: grid; min-width: 0; align-content: start; gap: 8px; }
.provider-param-override-field > div:first-child { display: flex; min-height: 38px; align-items: center; justify-content: space-between; gap: 12px; color: #525252; font-size: 11px; font-weight: 600; }
.provider-param-override-field .secondary-button { display: inline-flex; min-height: 36px; align-items: center; gap: 7px; }
.provider-param-override-field .secondary-button svg { width: 15px; height: 15px; }
.provider-param-override-summary { display: grid; min-height: 148px; align-content: center; gap: 8px; padding: 18px; border: 1px solid #d4d4d4; border-radius: 7px; background: #fafafa; }
.provider-param-override-summary strong { color: #262626; font-size: 13px; }
.provider-param-override-summary code { overflow: hidden; color: #737373; font: 11px/1.5 "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
dialog.provider-param-override-dialog { width: min(1080px,100vw); }
.provider-param-override-editor { grid-template-rows: auto auto minmax(0,1fr) auto auto; }
.provider-param-override-toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; padding: 12px 18px; border-bottom: 1px solid #e5e5e5; background: #fafafa; }
.provider-param-editmode { flex: 0 0 auto; align-self: center; }
.provider-param-toolbar-field { flex: 0 1 auto; }
.provider-param-override-toolbar .provider-param-search { flex: 1 1 200px; min-width: 160px; }
.provider-param-override-toolbar label { display: grid; gap: 5px; color: #737373; font-size: 10px; font-weight: 600; }
.provider-param-override-toolbar select { min-height: 38px; border-color: #d4d4d4; background: #fff; }
.provider-param-override-toolbar .secondary-button { display: inline-flex; min-height: 38px; align-items: center; gap: 7px; }
.provider-param-override-toolbar .secondary-button svg { width: 15px; height: 15px; }
.provider-param-override-toolbar > span { align-self: center; justify-self: end; color: #525252; font: 600 11px "Roboto Mono",monospace; }
.provider-param-override-layout { display: grid; min-height: 0; grid-template-columns: 250px minmax(0,1fr); }
.provider-param-operation-sidebar { display: grid; min-height: 0; grid-template-rows: auto minmax(0,1fr); border-right: 1px solid #e5e5e5; background: #fafafa; }
.provider-param-operation-sidebar > div:first-child { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 12px; border-bottom: 1px solid #e5e5e5; }
.provider-param-operation-sidebar > div:first-child strong { color: #262626; font-size: 12px; }
.provider-param-operation-sidebar .icon-button { width: 34px; height: 34px; border-color: #d4d4d4; background: #fff; }
.provider-param-operation-sidebar .icon-button svg { width: 15px; height: 15px; }
.provider-param-operation-list { min-height: 0; overflow-y: auto; padding: 8px; }
.provider-param-operation-list > p { margin: 0; padding: 26px 10px; color: #737373; font-size: 11px; line-height: 1.5; text-align: center; }
.provider-param-operation-item { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 7px; margin-bottom: 5px; padding: 7px; border: 1px solid transparent; border-radius: 7px; }
.provider-param-operation-item:hover { background: #f0f0f0; }
.provider-param-operation-item.active { border-color: #b8dcf7; background: #eaf6ff; }
.provider-param-operation-select { display: grid; min-width: 0; gap: 3px; padding: 3px; border: 0; background: transparent; text-align: left; }
.provider-param-operation-select strong { overflow: hidden; color: #262626; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.provider-param-operation-select small { overflow: hidden; color: #737373; font: 10px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.provider-param-operation-actions { display: flex; gap: 2px; }
.provider-param-operation-actions button { display: grid; width: 26px; height: 26px; padding: 0; place-items: center; border: 0; border-radius: 5px; background: transparent; color: #737373; }
.provider-param-operation-actions button:hover { background: #fff; color: #171717; }
.provider-param-operation-actions button.danger:hover { color: #b42318; }
.provider-param-operation-actions svg { width: 13px; height: 13px; }
.provider-param-operation-item { position: relative; grid-template-columns: auto minmax(0,1fr) auto; }
.provider-param-operation-item.dragging { opacity: 0.5; }
.provider-param-operation-grip { display: grid; place-items: center; color: #a3a3a3; cursor: grab; }
.provider-param-operation-grip svg { width: 14px; height: 14px; }
.provider-param-operation-select { grid-template-areas: "badge title" "badge sub"; grid-template-columns: auto minmax(0,1fr); column-gap: 8px; align-items: center; }
.provider-param-mode-badge { grid-area: badge; display: inline-flex; align-items: center; padding: 3px 8px; border: 1px solid #e5e5e5; border-radius: 999px; background: #f5f5f5; color: #525252; font: 600 9px/1.4 "Roboto Mono",monospace; text-transform: uppercase; letter-spacing: 0.3px; white-space: nowrap; }
.provider-param-operation-select strong { grid-area: title; }
.provider-param-operation-select small { grid-area: sub; }
.provider-param-mode-badge[data-mode*="header"] { border-color: #a5f3fc; background: #ecfeff; color: #0e7490; }
.provider-param-mode-badge[data-mode*="replace"], .provider-param-mode-badge[data-mode*="trim"] { border-color: #ddd6fe; background: #f5f3ff; color: #6d28d9; }
.provider-param-mode-badge[data-mode*="copy"], .provider-param-mode-badge[data-mode*="move"] { border-color: #bfdbfe; background: #eff6ff; color: #1d4ed8; }
.provider-param-mode-badge[data-mode*="error"], .provider-param-mode-badge[data-mode*="prune"] { border-color: #fecaca; background: #fef2f2; color: #b91c1c; }
.provider-param-mode-badge[data-mode*="sync"] { border-color: #bbf7d0; background: #f0fdf4; color: #15803d; }
.provider-param-search { position: relative; display: grid; gap: 5px; color: #737373; font-size: 10px; font-weight: 600; }
.provider-param-search svg { position: absolute; bottom: 11px; left: 10px; width: 14px; height: 14px; color: #a3a3a3; pointer-events: none; }
.provider-param-search input { min-height: 38px; padding-left: 30px; border-color: #d4d4d4; background: #fff; }
.provider-param-json-editor { display: grid; gap: 10px; padding: 14px 18px; }
.provider-param-json-editor p { margin: 0; color: #737373; font-size: 11px; }
.provider-param-json-editor textarea { width: 100%; min-height: 320px; border-color: #d4d4d4; background: #fff; font: 11px/1.55 "Roboto Mono",monospace; }
.provider-param-json-editor .secondary-button { display: inline-flex; min-height: 36px; align-items: center; justify-self: start; gap: 7px; }
.provider-param-json-editor .secondary-button svg { width: 14px; height: 14px; }
.provider-param-operation-editor { min-height: 0; overflow-y: auto; padding: 22px 24px 30px; }
.provider-param-operation-empty { margin: 0; padding: 70px 20px; color: #737373; font-size: 12px; text-align: center; }
.provider-param-operation-form { display: grid; gap: 20px; }
.provider-param-operation-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding-bottom: 12px; border-bottom: 1px solid #e5e5e5; }
.provider-param-operation-heading div { display: grid; gap: 4px; }
.provider-param-operation-heading strong { color: #171717; font-size: 15px; }
.provider-param-operation-heading span { color: #737373; font-size: 11px; }
.provider-param-operation-heading code { color: #075ea4; font: 600 10px "Roboto Mono",monospace; }
.provider-param-operation-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.provider-param-operation-grid > label,.provider-param-operation-description { display: grid; min-width: 0; gap: 6px; color: #525252; font-size: 11px; font-weight: 600; }
.provider-param-operation-grid input,.provider-param-operation-grid select,.provider-param-operation-grid textarea,.provider-param-operation-description input { width: 100%; min-width: 0; border-color: #d4d4d4; background: #fff; font-size: 12px; }
.provider-param-operation-grid textarea { min-height: 78px; font: 11px/1.5 "Roboto Mono",monospace; resize: vertical; }
.provider-param-operation-value { grid-column: 1/-1; }
.provider-param-keep-origin { display: grid!important; grid-column: 1/-1; grid-template-columns: 18px minmax(0,1fr); align-items: start; gap: 9px!important; padding: 11px 12px; border: 1px solid #e5e5e5; border-radius: 7px; background: #fafafa; font-weight: 400!important; }
.provider-param-keep-origin input { width: 17px!important; height: 17px!important; min-height: 17px!important; margin-top: 1px; accent-color: #1687e8; }
.provider-param-keep-origin span { display: grid; gap: 3px; }
.provider-param-keep-origin strong { color: #262626; font-size: 11px; }
.provider-param-keep-origin small { color: #737373; font-size: 10px; line-height: 1.4; }
.provider-param-conditions { display: grid; gap: 10px; }
.provider-param-condition-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.provider-param-condition-heading > div { display: flex; align-items: center; gap: 9px; }
.provider-param-condition-heading strong { color: #262626; font-size: 12px; }
.provider-param-condition-heading select { min-height: 34px; border-color: #d4d4d4; background: #fff; font-size: 11px; }
.provider-param-condition-heading .secondary-button { display: inline-flex; min-height: 34px; align-items: center; gap: 6px; }
.provider-param-condition-heading svg { width: 14px; height: 14px; }
.provider-param-condition-list { display: grid; gap: 8px; }
.provider-param-condition-list > p { margin: 0; padding: 18px; border: 1px dashed #d4d4d4; border-radius: 7px; color: #737373; font-size: 11px; text-align: center; }
.provider-param-condition-row { display: grid; grid-template-columns: minmax(120px,1.2fr) minmax(105px,.8fr) minmax(120px,1fr) auto; align-items: end; gap: 8px; padding: 10px; border: 1px solid #e5e5e5; border-radius: 7px; }
.provider-param-condition-row > label { display: grid; min-width: 0; gap: 5px; color: #737373; font-size: 10px; font-weight: 600; }
.provider-param-condition-row input,.provider-param-condition-row select { min-width: 0; border-color: #d4d4d4; background: #fff; font-size: 11px; }
.provider-param-condition-flags { display: flex; grid-column: 1/-1; flex-wrap: wrap; gap: 12px; padding-top: 2px; }
.provider-param-condition-flags label { display: flex; align-items: center; gap: 6px; color: #525252; font-size: 10px; }
.provider-param-condition-flags input { width: 15px; height: 15px; min-height: 15px; accent-color: #1687e8; }
.provider-param-condition-row .icon-button { width: 36px; height: 38px; border-color: #d4d4d4; background: #fff; color: #b42318; }
.provider-param-condition-row .icon-button svg { width: 14px; height: 14px; }
.provider-param-raw-editor { padding: 10px 18px; border-top: 1px solid #e5e5e5; background: #fafafa; }
.provider-param-raw-editor summary { cursor: pointer; color: #404040; font-size: 11px; font-weight: 600; }
.provider-param-raw-editor p { margin: 7px 0; color: #737373; font-size: 10px; }
.provider-param-raw-editor textarea { width: 100%; max-height: 180px; min-height: 100px; border-color: #d4d4d4; background: #fff; font: 11px/1.5 "Roboto Mono",monospace; resize: vertical; }
.provider-param-raw-editor .secondary-button { display: inline-flex; min-height: 34px; align-items: center; gap: 7px; margin-top: 8px; }
.provider-param-raw-editor .secondary-button svg { width: 14px; height: 14px; }
.provider-status-mapping-settings { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.provider-status-mapping-settings legend { margin-bottom: 1px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-status-mapping-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.provider-status-mapping-heading > div { display: grid; min-width: 0; gap: 3px; }
.provider-status-mapping-heading strong { color: #262626; font-size: 12px; }
.provider-status-mapping-heading span { color: #737373; font-size: 11px; line-height: 1.4; }
.provider-status-mapping-heading .secondary-button { display: inline-flex; flex: 0 0 auto; min-height: 36px; align-items: center; gap: 7px; }
.provider-status-mapping-heading .secondary-button svg { width: 15px; height: 15px; }
.provider-status-code-mappings { display: grid; overflow: hidden; border: 1px solid #e5e5e5; border-radius: 7px; background: #fff; }
.provider-status-code-row { display: grid; grid-template-columns: minmax(0,1fr) 18px minmax(0,1fr) 36px; align-items: end; gap: 10px; min-height: 72px; padding: 10px 11px; border-bottom: 1px solid #ededed; }
.provider-status-code-row:last-child { border-bottom: 0; }
.provider-status-code-row > label { gap: 5px; color: #737373; font-size: 10px; }
.provider-status-code-row input { min-width: 0; min-height: 38px; font-family: "Roboto Mono",monospace; }
.provider-status-code-row > svg { align-self: center; width: 16px; height: 16px; margin-top: 17px; color: #a3a3a3; }
.provider-status-code-row > .icon-button { align-self: end; width: 36px; height: 38px; border-color: #d4d4d4; border-radius: 7px; background: #fff; color: #b42318; }
.provider-status-code-row > .icon-button svg { width: 15px; height: 15px; }
.provider-status-code-empty { margin: 0; padding: 22px 14px; color: #737373; font-size: 12px; text-align: center; }
.provider-model-discount-settings { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.provider-model-discount-settings legend { margin-bottom: 1px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-model-discount-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.provider-model-discount-heading > div { display: grid; min-width: 0; gap: 3px; }
.provider-model-discount-heading strong { color: #262626; font-size: 12px; }
.provider-model-discount-heading span { color: #737373; font-size: 11px; line-height: 1.4; }
.provider-model-discount-heading .secondary-button { display: inline-flex; flex: 0 0 auto; min-height: 36px; align-items: center; gap: 7px; }
.provider-model-discount-heading .secondary-button svg { width: 15px; height: 15px; }
.provider-model-discount-list { display: grid; overflow: hidden; border: 1px solid #e5e5e5; border-radius: 7px; background: #fff; }
.provider-model-discount-list:empty { display: none; }
.provider-model-discount-row { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(0,1fr) 36px; align-items: end; gap: 10px; min-height: 72px; padding: 10px 11px; border-bottom: 1px solid #ededed; }
.provider-model-discount-row:last-child { border-bottom: 0; }
.provider-model-discount-row > label { gap: 5px; color: #737373; font-size: 10px; }
.provider-model-discount-row select,.provider-model-discount-row input { min-width: 0; min-height: 38px; }
.provider-model-discount-row input { font-family: "Roboto Mono",monospace; }
.provider-model-discount-row > .icon-button { align-self: end; width: 36px; height: 38px; border-color: #d4d4d4; border-radius: 7px; background: #fff; color: #b42318; }
.provider-model-discount-row > .icon-button svg { width: 15px; height: 15px; }
.provider-model-discount-empty { margin: 0; padding: 22px 14px; color: #737373; font-size: 12px; text-align: center; }
.provider-balance-settings { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.provider-balance-settings legend { margin-bottom: 10px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-azure-settings { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.provider-azure-settings legend { margin-bottom: 10px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-network-settings { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.provider-network-settings legend { margin-bottom: 1px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-customer-groups { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.provider-customer-groups legend { margin-bottom: 1px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-customer-group-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.provider-customer-group-heading > div { display: grid; min-width: 0; gap: 3px; }
.provider-customer-group-heading strong { color: #262626; font-size: 12px; }
.provider-customer-group-heading span { color: #737373; font-size: 11px; line-height: 1.4; }
.provider-customer-group-heading > small { flex: 0 0 auto; color: #075ea4; font-size: 11px; font-weight: 600; }
.provider-customer-group-list { display: grid; max-height: 224px; overflow-y: auto; border: 1px solid #e5e5e5; border-radius: 7px; background: #fff; }
.provider-customer-group-row { display: grid!important; grid-template-columns: 17px minmax(0,1fr) auto; min-height: 54px; align-items: center; gap: 10px!important; padding: 8px 11px; border-bottom: 1px solid #ededed; color: #404040!important; font-weight: 400!important; }
.provider-customer-group-row:last-child { border-bottom: 0; }
.provider-customer-group-row:hover { background: #fafafa; }
.provider-customer-group-row input { width: 16px!important; min-height: 16px!important; height: 16px!important; margin: 0!important; padding: 0!important; appearance: auto!important; accent-color: #0a0a0a; }
.provider-customer-group-row > span { display: grid; min-width: 0; gap: 3px; }
.provider-customer-group-row strong,.provider-customer-group-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.provider-customer-group-row strong { color: #262626; font-size: 12px; }
.provider-customer-group-row small,.provider-customer-group-row em { color: #737373; font-size: 10px; font-style: normal; font-weight: 400; }
.provider-customer-group-row em { white-space: nowrap; }
.provider-customer-group-empty { margin: 0; padding: 18px; color: #737373; font-size: 12px; text-align: center; }
.provider-system-prompt-settings { display: grid; gap: 12px; margin: 0; padding: 0; border: 0; }
.provider-system-prompt-settings legend { margin-bottom: 1px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-system-prompt-settings textarea { min-height: 108px; }
.provider-bulk-clone-dialog { width: min(560px,calc(100vw - 32px)); }
.provider-bulk-clone-dialog .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.provider-bulk-clone-suffix { margin-top: 18px; }
.provider-bulk-clone-suffix small { color: #737373; font-size: 11px; font-weight: 400; line-height: 1.4; }
.provider-bulk-clone-enabled { margin-top: 14px; }
.provider-groups-dialog { width: min(620px,calc(100vw - 32px)); }
.provider-groups-dialog .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.provider-groups-dialog .provider-groups-unrestricted { margin-top: 16px; }
.provider-groups-dialog .provider-customer-group-heading { margin-top: 17px; }
.provider-groups-dialog .bulk-provider-group-list { max-height: 280px; }
.provider-groups-dialog .bulk-provider-group-list.disabled { opacity: .52; }
.provider-columns-dialog { width: min(620px,calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: hidden; }
.provider-columns-dialog .dialog-heading { align-items: flex-start; margin-bottom: 17px; }
.provider-columns-dialog .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.provider-columns-dialog .dialog-heading button { display: grid; flex: 0 0 28px; place-items: center; }
.provider-columns-dialog .dialog-heading button svg { width: 15px; height: 15px; }
dialog .provider-columns-select-all { display: grid; grid-template-columns: 18px minmax(0,1fr); align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid #d4d4d4; border-radius: 7px; background: #fafafa; }
dialog .provider-columns-select-all input,dialog .provider-column-option input { width: 17px; min-height: 17px; height: 17px; margin: 0; padding: 0; appearance: auto; accent-color: #0a0a0a; }
.provider-columns-select-all > span,.provider-column-option > span { display: grid; min-width: 0; gap: 3px; }
.provider-columns-select-all strong,.provider-column-option strong { color: #262626; font-size: 12px; }
.provider-columns-select-all small,.provider-column-option small { color: #737373; font-size: 10px; font-weight: 400; }
.provider-columns-list { display: grid; max-height: min(390px,calc(100dvh - 285px)); grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 14px; overflow-y: auto; border-block: 1px solid #e5e5e5; }
dialog .provider-column-option { display: grid; min-width: 0; min-height: 58px; grid-template-columns: 18px minmax(0,1fr); align-items: center; gap: 10px; padding: 9px 11px; border-bottom: 1px solid #ededed; font-weight: 400; }
dialog .provider-column-option:nth-child(odd) { border-right: 1px solid #ededed; }
dialog .provider-column-option.locked { background: #fafafa; }
dialog .provider-column-option.locked input { opacity: .5; }
.provider-columns-actions { display: grid; grid-template-columns: auto minmax(0,1fr) auto auto; align-items: center; }
.provider-columns-actions .secondary-button { display: inline-flex; align-items: center; gap: 7px; }
.provider-columns-actions svg { width: 15px; height: 15px; }
.provider-tag-policy-dialog { display: grid; width: min(780px,calc(100vw - 32px)); max-height: calc(100dvh - 32px); grid-template-rows: auto minmax(0,1fr) auto auto auto; overflow: hidden; }
.provider-tag-policy-dialog .dialog-heading { align-items: flex-start; margin-bottom: 0; }
.provider-tag-policy-dialog .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.provider-tag-policy-dialog .dialog-heading button { display: grid; flex: 0 0 28px; place-items: center; }
.provider-tag-policy-dialog .dialog-heading button svg { width: 15px; height: 15px; }
.provider-tag-policy-scroll { display: grid; min-height: 0; gap: 0; margin: 18px -5px 0 0; padding-right: 5px; overflow-y: auto; border-top: 1px solid #e5e5e5; }
.provider-tag-policy-current { padding: 17px 0; border-bottom: 1px solid #e5e5e5; }
.provider-tag-policy-current input[readonly] { background: #f5f5f5; color: #737373; }
.provider-tag-policy-section { display: grid; gap: 13px; padding: 17px 0; border-bottom: 1px solid #e5e5e5; }
.provider-tag-policy-section:last-child { border-bottom: 0; }
.provider-tag-policy-section .provider-switch-field { min-height: 60px; padding: 10px 12px; }
.provider-tag-policy-control { display: grid; min-width: 0; gap: 7px; }
.provider-tag-policy-control.disabled { opacity: .46; }
.provider-tag-policy-control input,.provider-tag-policy-control textarea { width: 100%; }
.provider-tag-policy-control textarea { min-height: 116px; border: 1px solid #d4d4d4; border-radius: 6px; background: #fff; color: #171717; font: 12px/1.55 "Roboto Mono",monospace; resize: vertical; }
.provider-tag-policy-control textarea:disabled,.provider-tag-policy-control input:disabled { cursor: not-allowed; background: #f5f5f5; color: #a3a3a3; }
.provider-tag-policy-unrestricted { min-height: 58px!important; margin-bottom: 12px; }
.provider-tag-policy-group-list { max-height: 210px; }
.provider-tag-policy-group-list.disabled { opacity: .46; }
.provider-tag-policy-impact { margin: 14px 0 0!important; padding: 11px 12px; border: 1px solid #e5e5e5; border-radius: 7px; background: #fafafa; color: #404040!important; }
.provider-tag-policy-dialog .dialog-error { min-height: 18px; margin: 9px 0 0; }
.provider-tag-policy-dialog .dialog-actions { margin-top: 10px; padding-top: 14px; border-top: 1px solid #e5e5e5; }
.provider-route-policy-impact { margin: 15px 0 0!important; padding: 11px 12px; border: 1px solid #e5e5e5; border-radius: 7px; background: #fafafa; color: #404040!important; }
.model-bulk-pricing-dialog { width: min(640px,calc(100vw - 32px)); }
.model-bulk-pricing-dialog .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.model-bulk-pricing-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 18px; }
.provider-balance-dialog { width: min(560px,calc(100vw - 32px)); }
.provider-balance-dialog .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.provider-balance-summary { display: flex; align-items: center; gap: 15px; margin-top: 20px; padding: 18px 0; border-block: 1px solid #e5e5e5; }
.provider-balance-summary > span { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border-radius: 7px; background: #eaf6ff; color: #075ea4; }
.provider-balance-summary > span svg { width: 20px; height: 20px; }
.provider-balance-summary > div { display: grid; min-width: 0; gap: 4px; }
.provider-balance-summary small,.provider-balance-summary time { color: #737373; font-size: 11px; }
.provider-balance-summary strong { overflow: hidden; color: #0a0a0a; font: 600 28px/1.1 "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.provider-balance-note { min-height: 18px; margin: 14px 0 0!important; color: #525252!important; font-size: 12px!important; line-height: 1.5; }
.provider-balance-dialog .dialog-error { min-height: 18px; }
.provider-balance-dialog .primary-button { display: inline-flex; align-items: center; gap: 8px; }
.provider-balance-dialog .primary-button svg { width: 16px; height: 16px; }
.provider-balance-batch-dialog { width: min(680px,calc(100vw - 32px)); }
.provider-balance-batch-dialog .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.provider-balance-batch-list { overflow-y: auto; max-height: min(55vh,520px); margin-top: 16px; border-block: 1px solid #e5e5e5; }
.provider-balance-batch-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(220px,.85fr); gap: 18px; align-items: center; min-height: 72px; padding: 12px 2px; border-bottom: 1px solid #ededed; }
.provider-balance-batch-row:last-child { border-bottom: 0; }
.provider-balance-batch-row > div:first-child { display: grid; min-width: 0; gap: 4px; }
.provider-balance-batch-row > div:first-child > strong { overflow: hidden; color: #171717; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.provider-balance-batch-row code { overflow: hidden; color: #737373; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.provider-balance-batch-result { display: grid; min-width: 0; justify-items: end; gap: 4px; text-align: right; }
.provider-balance-batch-result > strong { overflow-wrap: anywhere; color: #171717; font: 600 12px "Roboto Mono",monospace; }
.provider-balance-batch-result > small { color: #737373; font-size: 10px; line-height: 1.35; }
.provider-balance-batch-result.failed > strong { color: #b42318; }
.provider-row-actions-dialog { width: min(460px,100vw); }
.provider-row-actions-list { display: grid; gap: 6px; }
.provider-row-actions-list > button { display: grid; width: 100%; min-height: 58px; grid-template-columns: 34px minmax(0,1fr); align-items: center; gap: 10px; padding: 9px 11px; border: 1px solid #e5e5e5; border-radius: 7px; background: #fff; color: #404040; text-align: left; }
.provider-row-actions-list > button:hover,
.provider-row-actions-list > button:focus-visible { border-color: #a3a3a3; background: #fafafa; color: #171717; }
.provider-row-actions-list > button[hidden] { display: none; }
.provider-row-actions-list > button > svg { width: 18px; height: 18px; justify-self: center; color: #737373; }
.provider-row-actions-list > button > span { display: grid; min-width: 0; gap: 3px; }
.provider-row-actions-list > button strong { font-size: 12px; }
.provider-row-actions-list > button small { color: #737373; font-size: 10px; font-weight: 400; line-height: 1.35; }
.provider-row-actions-list > button.danger { border-color: #fecaca; color: #b42318; }
.provider-row-actions-list > button.danger > svg { color: #d92d20; }
.provider-row-actions-list > button.danger:hover,
.provider-row-actions-list > button.danger:focus-visible { border-color: #f87171; background: #fff1f0; color: #912018; }
.provider-row-actions-list > button:disabled { border-color: #e5e5e5; background: #fafafa; color: #a3a3a3; cursor: not-allowed; opacity: .72; }
.provider-row-actions-list > button:disabled > svg,
.provider-row-actions-list > button:disabled small { color: #a3a3a3; }
.admin-user-row-actions-dialog { width: min(480px,100vw); }
.admin-key-row-actions-dialog { width: min(480px,100vw); }
.model-row-actions-dialog { width: min(480px,100vw); }
.redemption-row-actions-dialog { width: min(480px,100vw); }
.ollama-models-dialog { width: min(820px,100vw)!important; }
.ollama-model-manager { grid-template-rows: auto minmax(0,1fr) auto; }
.ollama-model-content { min-height: 0; overflow-y: auto; padding: 0 24px 28px; }
.ollama-pull-section,.ollama-installed-section { display: grid; gap: 16px; padding: 24px 0; }
.ollama-pull-section { border-bottom: 1px solid #e5e5e5; }
.ollama-section-heading { display: flex; min-width: 0; align-items: flex-end; justify-content: space-between; gap: 18px; }
.ollama-section-heading h3 { margin: 0 0 4px; color: #171717; font-size: 15px; }
.ollama-section-heading p { margin: 0; color: #737373; font-size: 11px; line-height: 1.45; }
.ollama-pull-control { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 10px; }
.ollama-pull-control label { display: grid; min-width: 0; gap: 7px; color: #525252; font-size: 11px; font-weight: 600; }
.ollama-pull-control input { width: 100%; min-width: 0; height: 40px; border-color: #d4d4d4; background: #fff; font-family: "Roboto Mono",monospace; }
.ollama-pull-control .primary-button { display: inline-flex; min-width: 94px; height: 40px; align-items: center; justify-content: center; gap: 7px; }
.ollama-pull-control .primary-button svg { width: 15px; height: 15px; }
.ollama-pull-progress { display: grid; gap: 8px; }
.ollama-pull-progress > div { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 14px; color: #525252; font-size: 11px; }
.ollama-pull-progress strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ollama-pull-progress > div span { flex: 0 0 auto; color: #075ea4; font: 600 10px "Roboto Mono",monospace; }
.ollama-pull-progress > span { display: block; width: 100%; height: 7px; overflow: hidden; border-radius: 4px; background: #e5e5e5; }
.ollama-pull-progress > span i { display: block; width: 0; height: 100%; border-radius: inherit; background: #1683d8; transition: width .18s ease; }
.ollama-pull-progress.indeterminate > span i { animation: ollama-progress 1.2s ease-in-out infinite alternate; }
@keyframes ollama-progress { from { transform: translateX(-70%); } to { transform: translateX(185%); } }
.ollama-pull-section .dialog-error { min-height: 16px; margin: -4px 0 0; }
.ollama-installed-heading > div:last-child { display: flex; flex: 0 0 auto; align-items: center; gap: 7px; }
.ollama-model-search { position: relative; display: block; width: min(250px,32vw); }
.ollama-model-search svg { position: absolute; top: 50%; left: 10px; width: 14px; height: 14px; color: #737373; transform: translateY(-50%); pointer-events: none; }
.ollama-model-search input { width: 100%; height: 36px; padding-left: 31px; border-color: #d4d4d4; background: #fff; font-size: 11px; }
.ollama-installed-heading .icon-button { width: 36px; height: 36px; }
.ollama-installed-heading .secondary-button { display: inline-flex; height: 36px; align-items: center; gap: 6px; white-space: nowrap; }
.ollama-installed-heading button svg { width: 14px; height: 14px; }
.ollama-model-list { display: grid; min-height: 110px; border-top: 1px solid #e5e5e5; }
.ollama-model-list > p { margin: 0; padding: 36px 18px; border-bottom: 1px solid #e5e5e5; color: #737373; font-size: 12px; text-align: center; }
.ollama-model-row { display: grid; min-width: 0; grid-template-columns: 38px minmax(0,1fr) 34px; align-items: center; gap: 12px; padding: 12px 4px; border-bottom: 1px solid #e5e5e5; }
.ollama-model-icon { display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid #d4d4d4; border-radius: 7px; background: #fafafa; color: #525252; }
.ollama-model-icon svg { width: 17px; height: 17px; }
.ollama-model-row > div { display: grid; min-width: 0; grid-template-columns: minmax(0,1fr) auto; gap: 4px 14px; }
.ollama-model-row strong { min-width: 0; overflow: hidden; color: #262626; font: 600 12px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.ollama-model-row small { color: #737373; font-size: 10px; white-space: nowrap; }
.ollama-model-row code { grid-column: 1/-1; min-width: 0; overflow: hidden; color: #737373; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.ollama-model-row > .icon-button { width: 32px; height: 32px; }
.ollama-model-row > .icon-button svg { width: 15px; height: 15px; }
.provider-test-dialog { display: flex; flex-direction: column; width: min(740px,calc(100vw - 32px)); max-height: min(880px,calc(100dvh - 32px)); padding: 0; overflow: hidden; }
#provider-test-form { padding: 0; overflow: hidden; max-height: min(880px,calc(min(100dvh,var(--mobile-dialog-height,100dvh)) - 20px)); }
.provider-test-dialog .dialog-heading { flex: 0 0 auto; padding: 18px 22px; border-bottom: 1px solid #e5e5e5; }
.provider-test-content { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 22px; scrollbar-gutter: stable; }
.provider-test-dialog .dialog-actions { flex: 0 0 auto; margin: 0; padding: 14px 22px; border-top: 1px solid #e5e5e5; background: #fff; }
.provider-test-routing { margin-top: 20px; padding-top: 16px; border-top: 1px solid #e5e5e5; }
.provider-test-routing[hidden] { display: none; }
.provider-test-routing h3 { margin: 0; font-size: 14px; }
.provider-test-routing > p { margin: 5px 0 12px; color: #737373; font-size: 12px; }
.provider-test-dialog .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.provider-test-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 18px; }
.provider-test-grid label small { color: #737373; font-size: 11px; font-weight: 400; line-height: 1.4; }
.provider-test-stream { margin-top: 14px; }
.provider-test-result { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: start; gap: 12px; margin-top: 14px; padding: 13px; border: 1px solid #e5e5e5; border-radius: 7px; background: #fafafa; }
.provider-test-result[hidden] { display: none; }
.provider-test-result > span { padding: 4px 7px; border-radius: 5px; background: #e5e5e5; color: #525252; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.provider-test-result > div { display: grid; min-width: 0; gap: 4px; }
.provider-test-result strong { color: #262626; font-size: 13px; }
.provider-test-result small { overflow-wrap: anywhere; color: #737373; font: 500 10px/1.5 "Roboto Mono",monospace; }
.provider-test-result p { margin: 2px 0 0!important; color: #525252!important; font-size: 11px!important; line-height: 1.5; }
.provider-test-result.success { border-color: #b8dec9; background: #f3fbf6; }
.provider-test-result.success > span { background: #dff4e8; color: #167044; }
.provider-test-result.failed { border-color: #f0b6b1; background: #fff7f6; }
.provider-test-result.failed > span { background: #fee4e2; color: #b42318; }
.provider-test-dialog .dialog-error { min-height: 18px; }
.provider-test-dialog .primary-button { display: inline-flex; align-items: center; gap: 8px; }
.provider-test-dialog .primary-button svg { width: 16px; height: 16px; }
@media(max-width:600px) {
  .provider-test-dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); }
  .provider-test-dialog .dialog-heading, .provider-test-dialog .dialog-actions { padding: 12px 14px; }
  .provider-test-content { padding: 0 14px; }
  .provider-test-dialog select { min-height: 44px; font-size: 16px; }
  .provider-test-dialog .dialog-heading button, .provider-test-dialog .dialog-actions button { min-width: 44px; min-height: 44px; }
}
.provider-model-import-dialog { width: min(820px,calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow-y: auto; }
.provider-model-import-dialog .dialog-heading p { margin: 5px 0 0; color: #737373; font-size: 12px; }
.provider-model-import-toolbar { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 14px; margin-top: 18px; }
.provider-model-import-select-all { display: flex!important; min-height: 40px; align-items: center; gap: 8px!important; padding: 0 4px; color: #404040!important; white-space: nowrap; }
.provider-model-import-select-all input { width: 16px!important; min-height: 16px!important; height: 16px!important; margin: 0; accent-color: #0a0a0a; }
.provider-model-sync-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 100%; margin-top: 14px; }
.provider-model-sync-tabs button { display: flex; min-width: 0; align-items: center; justify-content: center; gap: 7px; }
.provider-model-sync-tabs button[hidden] { display: none; }
.provider-model-sync-tabs button svg { width: 14px; height: 14px; }
.provider-model-sync-tabs button small { min-width: 18px; color: inherit; font-size: 10px; text-align: center; }
.provider-model-import-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; }
.provider-model-import-heading strong { color: #262626; font-size: 12px; }
.provider-model-import-heading span { color: #075ea4; font-size: 11px; font-weight: 600; }
.provider-model-import-list { display: grid; max-height: 260px; overflow-y: auto; margin-top: 8px; border: 1px solid #e5e5e5; border-radius: 7px; }
.provider-model-import-list > p { margin: 0; padding: 24px; color: #737373; font-size: 12px; text-align: center; }
.provider-model-import-row { display: grid!important; grid-template-columns: 17px minmax(0,1fr) auto; min-height: 54px; align-items: center; gap: 10px!important; padding: 8px 11px; border-bottom: 1px solid #ededed; color: #404040!important; font-weight: 400!important; }
.provider-model-import-row:last-child { border-bottom: 0; }
.provider-model-import-row:hover { background: #fafafa; }
.provider-model-import-row.disabled { background: #fafafa; opacity: .62; }
.provider-model-import-row input { width: 16px!important; min-height: 16px!important; height: 16px!important; margin: 0; accent-color: #0a0a0a; }
.provider-model-import-row > span { display: grid; min-width: 0; gap: 3px; }
.provider-model-import-row strong,.provider-model-import-row code { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.provider-model-import-row strong { color: #262626; font-size: 12px; }
.provider-model-import-row code { color: #737373; font-size: 10px; }
.provider-model-import-row em { color: #737373; font-size: 10px; font-style: normal; white-space: nowrap; }
.provider-model-import-row.removal:not(.disabled) em { color: #b42318; font-weight: 600; }
.provider-model-sync-warning { margin: 10px 0 0; padding-left: 10px; border-left: 3px solid #f04438; color: #7a271a; font-size: 11px; line-height: 1.5; }
.provider-model-import-settings { display: grid; gap: 12px; margin: 18px 0 0; padding: 15px; border: 1px solid #e5e5e5; border-radius: 7px; }
.provider-model-import-settings[hidden] { display: none; }
.provider-model-import-settings legend { padding: 0 5px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-model-import-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)) minmax(210px,1.15fr); gap: 12px; }
.provider-model-import-grid .provider-switch-field { min-height: 64px; }
.provider-model-import-pricing { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.provider-editor label { display: grid; gap: 8px; color: #525252; font-size: 12px; font-weight: 600; }
.provider-editor .provider-field-help { color: #737373; font-size: 11px; font-weight: 400; line-height: 1.45; }
.provider-editor input,.provider-editor select,.provider-editor textarea { border-color: #d4d4d4; background: #fff; color: #0a0a0a; }
.provider-editor textarea { min-height: 96px; resize: vertical; }
.provider-editor .logo-picker-control { min-width: 0; }
.provider-key-pool { display: grid; gap: 10px; padding-top: 2px; }
.provider-key-pool-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.provider-key-pool-heading > div { display: grid; gap: 3px; }
.provider-key-pool-heading strong { color: #262626; font-size: 12px; }
.provider-key-pool-heading span { color: #737373; font-size: 10px; line-height: 1.4; }
.provider-key-pool-heading small { flex: 0 0 auto; color: #075ea4; font-size: 10px; font-weight: 600; white-space: nowrap; }
.provider-key-statistics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.provider-key-statistics button { display: grid; min-width: 0; min-height: 74px; gap: 8px; padding: 11px; border: 1px solid #dedede; border-radius: 7px; background: #fff; text-align: left; }
.provider-key-statistics button:hover { border-color: #a3a3a3; background: #fafafa; }
.provider-key-statistics button.active { border-color: #262626; box-shadow: inset 0 0 0 1px #262626; }
.provider-key-statistics button small { overflow: hidden; color: #737373; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.provider-key-statistics button span { display: flex; min-width: 0; align-items: baseline; gap: 5px; }
.provider-key-statistics button strong { color: #171717; font-size: 20px; line-height: 1; }
.provider-key-statistics button em { overflow: hidden; color: #a3a3a3; font-size: 10px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.provider-key-statistics button:nth-child(2) strong { color: #9a6700; }
.provider-key-statistics button:nth-child(3) strong,.provider-key-statistics button:nth-child(4) strong { color: #b42318; }
.provider-key-pool-toolbar { display: grid; grid-template-columns: minmax(130px,160px) auto minmax(0,1fr); align-items: end; gap: 10px; }
.provider-key-pool-toolbar > label { gap: 5px; font-size: 10px; }
.provider-key-pool-toolbar select { min-height: 36px; height: 36px; }
.provider-key-pool-toolbar > small { align-self: center; color: #737373; font-size: 10px; white-space: nowrap; }
.provider-key-pool-toolbar > div { display: flex; justify-content: flex-end; gap: 7px; }
.provider-key-pool-toolbar .secondary-button { display: inline-flex; min-height: 36px; align-items: center; gap: 6px; padding-inline: 10px; font-size: 10px; }
.provider-key-pool-toolbar .secondary-button svg { width: 13px; height: 13px; }
.provider-key-pool-list { display: grid; gap: 8px; }
.provider-key-pool-row { display: grid; grid-template-columns: minmax(0,1fr) 36px; align-items: stretch; gap: 8px; }
.provider-key-pool-row[hidden] { display: none; }
.provider-key-pool-toggle { min-height: 76px!important; }
.provider-key-pool-row code { overflow-wrap: anywhere; color: #262626; font: 600 11px "Roboto Mono",monospace; }
.provider-key-health { display: flex; min-width: 0; align-items: center; gap: 5px; overflow: hidden; color: #737373; font-size: 10px; font-weight: 500; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.provider-key-health svg { flex: 0 0 auto; width: 12px; height: 12px; }
.provider-key-health.healthy { color: #167044; }
.provider-key-health.failed { color: #b42318; }
.provider-key-health.auto-disabled { color: #b42318; }
.provider-key-pool-actions { display: grid; align-content: stretch; gap: 4px; }
.provider-key-pool-actions .icon-button { width: 36px; min-height: 36px; height: auto; }
.provider-key-remove-button { color: #b42318; background: #fff7f6; border-color: #f0b7b3; }
.provider-key-pool-row.pending-removal .provider-key-pool-toggle { background: #fff7f6; border-color: #f0b7b3; }
.provider-key-pool-row.pending-removal code { text-decoration: line-through; color: #8e463f; }
.provider-key-pool-heading .channel-key-removal-note { color: #b42318; font-weight: 600; }
.provider-key-restore-button { border-color: #f0b7b3; background: #fff7f6; color: #b42318; }
.provider-key-test-button { align-self: stretch; width: 36px; height: auto; min-height: 36px; border-color: #d4d4d4; border-radius: 7px; background: #fff; }
.provider-key-test-button svg { width: 15px; height: 15px; }
.provider-key-test-button.testing svg { animation: provider-key-test-pulse .8s ease-in-out infinite alternate; }
@keyframes provider-key-test-pulse { to { opacity: .25; transform: scale(.82); } }
.provider-key-manage-dialog { width: min(1080px,calc(100vw - 28px)); max-width: none; padding: 0; }
.provider-key-manage-shell { display: grid; grid-template-rows: auto minmax(0,1fr); height: min(780px,calc(100vh - 36px)); background: #fff; }
.provider-key-manage-content { display: grid; min-height: 0; grid-template-rows: auto auto minmax(0,1fr) auto; gap: 14px; padding: 20px 22px 16px; }
.provider-key-manage-stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.provider-key-manage-stats button { display: grid; grid-template-columns: 1fr auto; min-width: 0; min-height: 72px; align-items: end; gap: 5px 10px; padding: 12px 14px; border: 1px solid #dedede; border-radius: 7px; background: #fff; text-align: left; }
.provider-key-manage-stats button:hover { border-color: #a3a3a3; background: #fafafa; }
.provider-key-manage-stats button.active { border-color: #262626; box-shadow: inset 0 0 0 1px #262626; }
.provider-key-manage-stats small { grid-column: 1/-1; color: #737373; font-size: 10px; font-weight: 650; }
.provider-key-manage-stats strong { color: #171717; font-size: 24px; line-height: 1; }
.provider-key-manage-stats span { align-self: end; color: #a3a3a3; font-size: 10px; }
.provider-key-manage-stats button:nth-child(2) strong { color: #9a6700; }
.provider-key-manage-stats button:nth-child(3) strong { color: #b42318; }
.provider-key-manage-toolbar { display: grid; grid-template-columns: minmax(150px,190px) auto minmax(0,1fr); align-items: end; gap: 10px; }
.provider-key-manage-toolbar label { display: grid; gap: 5px; color: #525252; font-size: 10px; font-weight: 600; }
.provider-key-manage-toolbar select { min-height: 38px; border-color: #d4d4d4; background: #fff; }
.provider-key-manage-toolbar > span { align-self: center; padding: 4px 7px; border: 1px solid #d4d4d4; border-radius: 4px; background: #fafafa; color: #525252; font: 600 10px "Roboto Mono",monospace; white-space: nowrap; }
.provider-key-manage-toolbar > div { display: flex; min-width: 0; justify-content: flex-end; flex-wrap: wrap; gap: 7px; }
.provider-key-manage-toolbar .secondary-button { display: inline-flex; min-height: 38px; align-items: center; gap: 6px; font-size: 10px; }
.provider-key-manage-toolbar .secondary-button svg { width: 14px; height: 14px; }
.provider-key-manage-toolbar .secondary-button.danger { border-color: #fecaca; color: #b42318; }
.provider-key-manage-toolbar .secondary-button.danger:hover { border-color: #f0aaaa; background: #fef2f2; }
.provider-key-manage-table-wrap { position: relative; min-height: 0; overflow: auto; border: 1px solid #dedede; border-radius: 7px; }
.provider-key-manage-table { width: 100%; min-width: 920px; border-collapse: collapse; }
.provider-key-manage-table th { position: sticky; z-index: 1; top: 0; height: 38px; padding: 8px 10px; border-bottom: 1px solid #dedede; background: #fafafa; color: #737373; font-size: 10px; font-weight: 650; text-align: left; }
.provider-key-manage-table td { height: 58px; padding: 9px 10px; border-bottom: 1px solid #ededed; color: #404040; font-size: 11px; vertical-align: middle; }
.provider-key-manage-table tr:last-child td { border-bottom: 0; }
.provider-key-manage-table td:nth-child(1) { width: 48px; color: #737373; font-family: "Roboto Mono",monospace; }
.provider-key-manage-table td:nth-child(2) code { overflow-wrap: anywhere; color: #171717; font: 600 11px "Roboto Mono",monospace; }
.provider-key-manage-table td:nth-child(4) { max-width: 230px; }
.provider-key-manage-table td:nth-child(4) span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.provider-key-manage-table time { color: #737373; font-size: 10px; white-space: nowrap; }
.provider-key-manage-row-actions { display: flex; justify-content: flex-end; gap: 5px; }
.provider-key-manage-row-actions .icon-button { width: 30px; height: 30px; border-color: #d4d4d4; background: #fff; }
.provider-key-manage-row-actions .icon-button.danger { border-color: #fecaca; color: #b42318; }
.provider-key-manage-loading { position: absolute; inset: 38px 0 0; display: grid; place-content: center; justify-items: center; gap: 8px; background: rgba(255,255,255,.86); color: #737373; font-size: 11px; }
.provider-key-manage-loading[hidden] { display: none; }
.provider-key-manage-loading svg { width: 22px; height: 22px; animation: provider-key-manage-spin .8s linear infinite; }
@keyframes provider-key-manage-spin { to { transform: rotate(360deg); } }
.provider-key-manage-pagination { display: flex; min-height: 40px; align-items: center; justify-content: space-between; gap: 16px; color: #737373; font-size: 11px; }
.provider-key-manage-pagination > div,.provider-key-manage-pagination label { display: flex; align-items: center; gap: 7px; }
.provider-key-manage-pagination select { width: 66px; min-height: 34px; border-color: #d4d4d4; background: #fff; }
.provider-key-manage-pagination .icon-button { width: 34px; height: 34px; }
.provider-switch-field { display: flex!important; min-height: 66px; align-items: center; justify-content: space-between; gap: 18px!important; padding: 11px 13px; border: 1px solid #e5e5e5; border-radius: 8px; }
.provider-switch-field > span { display: grid; gap: 3px; }
.provider-switch-field strong { color: #262626; font-size: 12px; }
.provider-switch-field small { color: #737373; font-size: 10px; font-weight: 400; line-height: 1.4; }
.provider-switch-field input { flex: 0 0 auto; width: 42px; min-height: 24px; height: 24px; margin: 0; appearance: none; border: 1px solid #d4d4d4; border-radius: 12px; background-color: #d4d4d4; background-image: radial-gradient(circle at 11px 50%,#fff 0 8px,transparent 9px); transition: .16s; }
.provider-switch-field input:checked { border-color: #0a0a0a; background-color: #0a0a0a; background-image: radial-gradient(circle at 30px 50%,#fff 0 8px,transparent 9px); }
.provider-switch-field input:disabled { cursor: not-allowed; opacity: .45; }
.provider-endpoint-access-settings { display: grid; gap: 12px; margin: 0; padding: 16px; border: 1px solid #e5e5e5; border-radius: 10px; background: #fafafa; }
.provider-endpoint-access-settings legend { padding: 0 4px; color: #262626; font-size: 13px; font-weight: 650; }
.provider-endpoint-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.provider-endpoint-grid > .provider-endpoint-option { display: flex; min-height: 56px; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid #e5e5e5; border-radius: 8px; background: #fff; cursor: pointer; }
.provider-endpoint-option:hover { border-color: #b8dcf7; background: #f8fcff; }
.provider-endpoint-option > span { display: grid; min-width: 0; gap: 3px; }
.provider-endpoint-option strong { color: #262626; font-size: 12px; }
.provider-endpoint-option small { color: #737373; font: 10px/1.4 'Roboto Mono',monospace; overflow-wrap: anywhere; }
.provider-endpoint-option input { flex: 0 0 auto; width: 16px; min-height: 16px; height: 16px; margin: 0; accent-color: #0a0a0a; }
.provider-config-field textarea { min-height: 190px; font-family: "Roboto Mono",monospace; font-size: 12px; line-height: 1.55; }
.model-source-field { max-width: 520px; display: grid; gap: 7px; color: #737373; font-size: 11px; font-weight: 600; }
.model-bind-picker { position: relative; }
.model-bind-trigger { display: flex; width: 100%; min-height: 40px; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 12px 6px 14px; border: 1px solid #d4d4d4; border-radius: 8px; background: #fff; color: #262626; font-size: 13px; font-weight: 500; text-align: left; cursor: pointer; }
.model-bind-trigger:hover { border-color: #b8dcf7; background: #f8fcff; }
.model-bind-trigger[aria-expanded="true"] { border-color: #1687e8; box-shadow: 0 0 0 3px rgba(22,135,232,.14); }
.model-bind-trigger.empty { color: #a3a3a3; font-weight: 400; }
.model-bind-trigger .model-bind-value { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.model-bind-trigger svg { flex: 0 0 auto; width: 15px; height: 15px; color: #737373; }
.model-bind-dropdown { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; right: 0; display: grid; overflow: hidden; border: 1px solid #e5e5e5; border-radius: 10px; background: #fff; box-shadow: 0 12px 32px rgba(15,23,42,.16), 0 2px 6px rgba(15,23,42,.08); }
.model-bind-search { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid #ededed; }
.model-bind-search svg { flex: 0 0 auto; width: 14px; height: 14px; color: #a3a3a3; }
.model-bind-search input { flex: 1 1 auto; min-width: 0; min-height: 0; padding: 0; border: 0; background: transparent; font-size: 13px; }
.model-bind-search input:focus { outline: none; }
.model-bind-options { display: grid; max-height: 264px; overflow-y: auto; padding: 5px; }
.model-bind-option { display: flex; align-items: center; gap: 10px; padding: 7px 9px; border: 0; border-radius: 7px; background: transparent; text-align: left; cursor: pointer; }
.model-bind-option:hover { background: #f5fbff; }
.model-bind-option.active { background: #eaf4fd; }
.model-bind-logo { display: grid; flex: 0 0 auto; width: 28px; height: 28px; place-items: center; overflow: hidden; border: 1px solid #e5e5e5; border-radius: 7px; background: #fafafa; color: #525252; font-size: 10px; font-weight: 700; }
.model-bind-logo img { width: 18px; height: 18px; }
.model-bind-text { display: grid; min-width: 0; gap: 1px; }
.model-bind-text strong { overflow: hidden; color: #262626; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.model-bind-text code { overflow: hidden; color: #737373; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.model-bind-option em { flex: 0 0 auto; margin-left: auto; padding: 2px 7px; border-radius: 999px; background: #f0f9ff; color: #1687e8; font-size: 10px; font-style: normal; }
.model-bind-empty { margin: 0; padding: 18px 12px; color: #737373; font-size: 12px; text-align: center; }
.model-bind-create { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border: 0; border-top: 1px solid #ededed; background: #fafafa; color: #1687e8; font-size: 12px; font-weight: 600; text-align: left; cursor: pointer; }
.model-bind-create:hover { background: #f0f8ff; }
.model-bind-create svg { width: 14px; height: 14px; }
.model-bind-label { color: inherit; }
#admin-model-form[data-mode="bind-route"] #model-basic-section > :not(#admin-model-bind-field):not(.provider-section-heading) { display: none; }
.model-binding-context { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; padding: 16px; border: 1px solid #bfdbfe; border-radius: 10px; background: #f5faff; }
.model-binding-context[hidden] { display: none; }
.model-binding-supplier { display: flex; align-items: center; gap: 10px; min-width: 0; }
.model-binding-supplier > span:last-child, .model-binding-selection { display: grid; gap: 4px; min-width: 0; }
.model-binding-supplier small, .model-binding-prompt { color: #64748b; font-size: 12px; }
.model-binding-context strong { color: #1e293b; font-size: 13px; }
.model-binding-selection code { color: #64748b; font-size: 11px; overflow-wrap: anywhere; }
.model-binding-arrow { color: #64748b; }
.model-binding-context .secondary-button { margin-left: auto; flex: 0 0 auto; }
.model-bind-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border-bottom: 1px solid #ededed; }
.model-bind-filters { display: flex; gap: 5px; flex-wrap: wrap; }
.model-bind-filters button { padding: 6px 10px; border: 1px solid transparent; border-radius: 6px; background: #f5f5f5; color: #525252; font: inherit; font-size: 11px; cursor: pointer; }
.model-bind-filters button[aria-pressed="true"] { border-color: #bfdbfe; background: #eff6ff; color: #1d4ed8; }
#model-bind-result-count { color: #737373; font-size: 11px; white-space: nowrap; }
.model-bind-text small { color: #737373; font-size: 10px; }
.model-bind-option em.available { background: #eefbf1; color: #187a32; }
.model-bind-option em.bound { background: #f5f5f5; color: #737373; }
.model-bind-option:focus-visible { outline: 2px solid #1687e8; outline-offset: -2px; }
#admin-model-form[data-mode="bind-route"] .model-bind-trigger { display: none; }
#admin-model-form[data-mode="bind-route"] .admin-section-search { display: none !important; }
#admin-model-form[data-mode="bind-route"] .model-source-field { max-width: none; }
#admin-model-form[data-mode="bind-route"] .model-bind-dropdown { position: static; box-shadow: none; }
#admin-model-form[data-mode="bind-route"] .model-bind-search { padding: 14px; background: #fafafa; }
#admin-model-form[data-mode="bind-route"] .model-bind-options { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 12px; max-height: 400px; }
#admin-model-form[data-mode="bind-route"] .model-bind-option { min-width: 0; min-height: 88px; padding: 12px; border: 1px solid #e5e5e5; }
#admin-model-form[data-mode="bind-route"] .model-bind-option.active { border-color: #60a5fa; }
#admin-model-form[data-mode="bind-route"] .model-bind-empty { grid-column: 1/-1; }
#admin-model-form[data-mode="bind-route"] .provider-editor-nav button:disabled { opacity: .45; cursor: default; }
@media (max-width: 760px) {
  .model-binding-context { flex-wrap: wrap; gap: 10px; }
  .model-binding-prompt { flex-basis: 100%; }
  .model-bind-toolbar { flex-wrap: wrap; }
  #admin-model-form[data-mode="bind-route"] .model-bind-options { grid-template-columns: minmax(0,1fr); }
}
.model-route-effective-pricing { display: grid; grid-column: 1 / -1; gap: 2px; padding: 12px 14px; border: 1px solid #dcebf8; border-radius: 8px; background: #f5fbff; }
.model-route-effective-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-bottom: 8px; }
.model-route-effective-head strong { color: #262626; font-size: 12px; }
.model-route-effective-head span { color: #1687e8; font-size: 10px; font-weight: 600; }
.model-route-effective-row { display: grid; grid-template-columns: minmax(90px,1fr) minmax(0,1fr) minmax(0,1.2fr); align-items: center; gap: 10px; padding: 5px 0; border-top: 1px solid #e3f0fa; }
.model-route-effective-row > span:first-child { color: #525252; font-size: 11px; font-weight: 600; }
.model-route-effective-base { color: #737373; font: 11px "Roboto Mono",monospace; }
.model-route-effective-final { display: grid; justify-items: end; }
.model-route-effective-final strong { color: #0b6cbd; font: 600 12px "Roboto Mono",monospace; }
.model-route-effective-final small { color: #a3a3a3; font: 10px "Roboto Mono",monospace; text-decoration: line-through; }
.model-upstream-field { display: grid; min-width: 0; gap: 8px; color: #525252; font-size: 12px; font-weight: 600; }
.model-upstream-field > div { display: flex; min-height: 18px; align-items: center; justify-content: space-between; gap: 8px; }
.model-upstream-field label { display: block; color: inherit; font: inherit; }
.model-upstream-field .icon-button { width: 28px; height: 28px; }
.model-upstream-field .icon-button svg { width: 15px; height: 15px; }
.model-description-field textarea { min-height: 112px; }
.model-description-locales { display: grid; min-width: 0; gap: 10px; margin: 0; border: 1px solid #e5e5e5; border-radius: 8px; padding: 14px 16px 16px; }
.model-description-locales legend { padding: 0 6px; color: #262626; font-size: 12px; font-weight: 600; }
.model-description-locales > p { margin: 0; color: #737373; font-size: 10px; font-weight: 400; line-height: 1.45; }
.model-description-locale-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.model-description-locale-grid label { display: grid; min-width: 0; gap: 6px; color: #525252; font-size: 12px; font-weight: 600; }
.model-description-locale-grid textarea { min-height: 84px; font-size: 12px; }
.model-supported-parameters,.model-route-request-rules { display: grid; min-width: 0; gap: 12px; }
.model-route-control-heading { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 16px; }
.model-route-control-heading > div { display: grid; min-width: 0; gap: 4px; }
.model-route-control-heading strong { color: #262626; font-size: 12px; }
.model-route-control-heading small { color: #737373; font-size: 10px; font-weight: 400; line-height: 1.45; }
.model-route-control-heading .secondary-button { display: inline-flex; min-height: 36px; flex: 0 0 auto; align-items: center; gap: 7px; }
.model-route-control-heading .secondary-button svg { width: 15px; height: 15px; }
.model-supported-parameter-list { display: grid; overflow: hidden; border: 1px solid #e5e5e5; border-radius: 8px; }
.model-supported-parameter-row { display: grid; min-width: 0; grid-template-columns: 28px minmax(150px,.8fr) minmax(140px,.65fr) minmax(260px,1.4fr) 36px; align-items: start; gap: 10px; padding: 12px; border-bottom: 1px solid #ededed; background: #fff; }
.model-supported-parameter-row:last-child { border-bottom: 0; }
.model-supported-parameter-row > label,.model-supported-parameter-enum,.model-supported-parameter-range label { display: grid; min-width: 0; gap: 6px; color: #525252; font-size: 10px; font-weight: 600; }
.model-supported-parameter-row input,.model-supported-parameter-row select,.model-supported-parameter-row textarea { width: 100%; min-width: 0; min-height: 38px; border-color: #d4d4d4; background: #fff; }
.model-supported-parameter-row textarea { min-height: 64px; resize: vertical; font: 11px/1.45 "Roboto Mono",monospace; }
.model-supported-parameter-row .icon-button { width: 36px; height: 36px; margin-top: 19px; color: #b42318; }
.model-supported-parameter-index { display: grid; width: 24px; height: 24px; place-items: center; margin-top: 25px; border: 1px solid #d4d4d4; border-radius: 6px; color: #737373; font: 600 10px "Roboto Mono",monospace; }
.model-supported-parameter-constraint { min-width: 0; }
.model-supported-parameter-range { display: grid; grid-template-columns: minmax(90px,1fr) auto minmax(90px,1fr); align-items: end; gap: 8px; }
.model-supported-parameter-range > span { padding-bottom: 11px; color: #a3a3a3; font-size: 10px; }
.model-supported-parameter-enum small { color: #737373; font-size: 9px; font-weight: 400; line-height: 1.4; }
.model-supported-parameter-any { display: grid; min-height: 58px; align-content: center; gap: 4px; padding: 8px 11px; border: 1px dashed #d4d4d4; border-radius: 7px; background: #fafafa; }
.model-supported-parameter-any strong { color: #404040; font-size: 11px; }
.model-supported-parameter-any small { color: #737373; font-size: 9px; line-height: 1.4; }
.model-supported-parameter-empty { min-height: 76px; margin: 0; padding: 24px; color: #737373; font-size: 11px; text-align: center; }
.model-route-rule-summary { display: grid; min-height: 74px; align-content: center; gap: 5px; padding: 12px 14px; border: 1px solid #e5e5e5; border-radius: 8px; background: #fafafa; }
.model-route-rule-summary strong { color: #262626; font-size: 12px; }
.model-route-rule-summary code { overflow: hidden; color: #737373; font: 10px/1.5 "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.model-capability-fieldset,.model-endpoint-fieldset { display: grid; gap: 11px; margin: 0; padding: 0; border: 0; }
.model-capability-fieldset legend,.model-endpoint-fieldset legend { margin-bottom: 2px; color: #525252; font-size: 12px; font-weight: 600; }
.model-capability-help { margin: 0; color: #737373; font-size: 10px; line-height: 1.5; }
.model-capability-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.model-capability-grid label { display: flex; min-width: 0; min-height: 48px; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid #e5e5e5; border-radius: 7px; background: #fafafa; color: #404040; font-size: 12px; font-weight: 500; }
.model-capability-grid label:hover { border-color: #b8dcf7; background: #f5fbff; }
.model-capability-grid input { flex: 0 0 auto; width: 16px; min-height: 16px; height: 16px; margin: 0; padding: 0; accent-color: #0a0a0a; }
.model-capability-grid span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.model-endpoint-fieldset { margin-top: 4px; padding-top: 20px; border-top: 1px solid #e5e5e5; }
.model-endpoint-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.model-endpoint-grid label { display: flex; min-width: 0; min-height: 58px; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 12px; border: 1px solid #e5e5e5; border-radius: 7px; background: #fafafa; cursor: pointer; }
.model-endpoint-grid label:hover { border-color: #b8dcf7; background: #f5fbff; }
.model-endpoint-grid label > span { display: grid; min-width: 0; gap: 3px; }
.model-endpoint-grid strong { color: #404040; font-size: 12px; font-weight: 600; }
.model-endpoint-grid small { overflow: hidden; color: #737373; font: 10px/1.4 "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.model-endpoint-grid input { flex: 0 0 auto; width: 16px; min-height: 16px; height: 16px; margin: 0; accent-color: #0a0a0a; }
.route-policy-list { display: flex; flex-wrap: wrap; gap: 6px; min-width: 180px; }
.route-policy-button { display: inline-flex; max-width: 280px; min-height: 44px; flex-direction: column; align-items: flex-start; gap: 2px; padding: 5px 7px; border: 1px solid #d4d4d4; border-radius: 6px; background: #fff; color: #262626; text-align: left; }
.route-policy-button:hover { border-color: #84bce5; background: #f5fbff; }
.route-policy-button .route-policy-main { display: flex; max-width: 100%; align-items: center; gap: 6px; }
.route-policy-button .route-policy-main strong { max-width: 150px; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.route-policy-button span { color: #737373; font: 500 10px "Roboto Mono",monospace; }
.route-policy-button .route-policy-main strong { color: #262626; font-family: "DM Sans",sans-serif; font-weight: 600; }
.route-policy-button .route-cache-hit { display: block; color: #737373; font-size: 11px; font-weight: 500; line-height: 14px; white-space: nowrap; }
.route-policy-button.disabled { border-style: dashed; opacity: .55; }
#model-dialog { width: min(1180px,100vw); }
.model-routes-section { align-content: start; }
.model-routes-heading { flex-wrap: wrap; }
.model-routes-heading > div { flex: 1 1 300px; }
.model-routes-heading .secondary-button { display: inline-flex; flex: 0 0 auto; min-height: 36px; align-items: center; gap: 7px; }
.model-routes-heading .secondary-button svg { width: 15px; height: 15px; }
.model-route-list,.model-auto-routing-list { max-width: 100%; overflow-x: auto; border: 1px solid #e5e5e5; border-radius: 8px; }
.model-route-list:empty,.model-auto-routing-list:empty { display: none; }
.model-route-list-head,.model-route-row { display: grid; min-width: 680px; grid-template-columns: minmax(150px,1.1fr) 62px minmax(210px,1.4fr) 100px 34px; align-items: center; gap: 10px; padding: 10px 12px; }
.model-route-list-head { min-height: 38px; border-bottom: 1px solid #e5e5e5; background: #fafafa; color: #737373; font-size: 10px; font-weight: 600; }
.model-route-list-head > *,.model-route-row > * { min-width: 0; }
.model-route-list-head > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.model-route-row { min-height: 64px; border-bottom: 1px solid #ededed; color: #404040; font-size: 11px; }
.model-route-row:last-child { border-bottom: 0; }
.model-route-row.disabled { background: #fcfcfc; opacity: .68; }
.model-route-provider { display: flex; min-width: 0; align-items: center; gap: 9px; }
.model-route-provider .logo-preview { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 7px; font-size: 10px; }
.model-route-provider > span:last-child { display: grid; min-width: 0; gap: 3px; }
.model-route-provider strong,.model-route-provider small,.model-route-row > code { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.model-route-provider strong { color: #262626; font-size: 12px; }
.model-route-provider small { color: #737373; font-size: 10px; }
.model-route-row > code { color: #525252; font: 10px "Roboto Mono",monospace; }
.model-route-price,.model-route-policy { overflow: hidden; color: #404040; font: 600 10px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.model-route-row .icon-button { justify-self: end; }
.model-route-editor { display: grid; gap: 22px; padding-top: 4px; }
.model-route-editor[hidden] { display: none; }
.model-route-editor-heading { display: flex; min-height: 50px; align-items: center; justify-content: space-between; gap: 16px; padding: 0 0 13px; border-bottom: 1px solid #e5e5e5; }
.model-route-editor-heading > div { display: grid; min-width: 0; gap: 4px; }
.model-route-editor-heading strong { color: #171717; font-size: 14px; }
.model-route-editor-heading small { overflow: hidden; color: #737373; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.model-route-pricing { display: grid; gap: 16px; margin: 0; padding: 18px; border: 1px solid #e5e5e5; border-radius: 8px; background: #fafafa; }
.model-route-pricing legend { padding: 0 5px; color: #404040; font-size: 12px; font-weight: 650; }
.context-price-tier-settings { display: grid; gap: 12px; padding-top: 16px; border-top: 1px solid #e5e5e5; }
.context-price-tier-settings .model-route-control-heading { align-items: center; }
.context-price-tier-settings .model-route-control-heading small { max-width: 560px; }
.context-price-tier-list { display: grid; overflow-x: auto; border: 1px solid #e5e5e5; border-radius: 7px; background: #fff; }
.context-price-tier-row { display: grid; min-width: 790px; grid-template-columns: minmax(145px,1.15fr) repeat(4,minmax(118px,1fr)) 36px; align-items: end; gap: 10px; padding: 12px; border-bottom: 1px solid #ededed; }
.context-price-tier-row:last-child { border-bottom: 0; }
.context-price-tier-row label { display: grid; min-width: 0; gap: 5px; color: #525252; font-size: 10px; font-weight: 600; }
.context-price-tier-row input { width: 100%; min-width: 0; min-height: 36px; background: #fff; font: 11px "Roboto Mono",monospace; }
.context-price-tier-row .icon-button { width: 36px; height: 36px; color: #b42318; }
.context-price-tier-ttl { display: grid; grid-column: 1/-1; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 10px; padding-top: 10px; border-top: 1px solid #ededed; }
.context-price-tier-ttl > small { grid-column: 1/-1; color: #737373; font-size: 10px; line-height: 1.5; }
.context-price-tier-empty { margin: 0; padding: 18px; color: #737373; font-size: 11px; text-align: center; }
.time-price-tier-list { display: grid; overflow-x: auto; border: 1px solid #e5e5e5; border-radius: 7px; background: #fff; }
.time-price-tier-list:empty { display: none; }
.time-price-tier-row { display: grid; min-width: 790px; grid-template-columns: minmax(96px,0.8fr) minmax(96px,0.8fr) repeat(4,minmax(112px,1fr)) 36px; align-items: end; gap: 10px; padding: 12px; border-bottom: 1px solid #f0f0f0; }
.time-price-tier-row:last-child { border-bottom: 0; }
.time-price-tier-row label { display: grid; min-width: 0; gap: 5px; color: #525252; font-size: 10px; font-weight: 600; }
.time-price-tier-row input { width: 100%; min-width: 0; min-height: 36px; background: #fff; font: 11px "Roboto Mono",monospace; }
.time-price-tier-row .icon-button { width: 36px; height: 36px; color: #b42318; }
.time-price-weekdays { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; border: 0; }
.time-price-weekdays legend { padding: 0 0 6px; color: #737373; font-size: 11px; }
.time-price-weekdays label { display: flex; align-items: center; gap: 6px; padding: 7px 10px; border: 1px solid #e5e5e5; border-radius: 7px; cursor: pointer; }
.time-price-weekdays label:has(input:checked) { border-color: #93c5fd; background: #eff6ff; color: #1d4ed8; }
.time-price-weekdays input { width: 14px; height: 14px; min-height: 0; margin: 0; accent-color: #2563eb; }
.time-price-weekdays label:focus-within { outline: 2px solid #60a5fa; outline-offset: 2px; }
.time-price-tier-empty { margin: 0; padding: 18px; color: #737373; font-size: 11px; text-align: center; }
.model-route-extra-pricing-toggle { display: inline-flex; align-items: center; justify-self: start; gap: 7px; }
.model-route-extra-pricing-toggle svg { width: 15px; height: 15px; transition: transform 0.18s ease; }
.model-route-extra-pricing-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.model-route-extra-pricing { padding-top: 2px; }
.model-auto-routing-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); overflow: hidden; border: 1px solid #e5e5e5; border-radius: 8px; background: #fafafa; }
.model-auto-routing-summary > div { display: grid; min-width: 0; gap: 5px; padding: 13px 15px; border-right: 1px solid #e5e5e5; }
.model-auto-routing-summary > div:last-child { border-right: 0; }
.model-auto-routing-summary span { color: #737373; font-size: 10px; }
.model-auto-routing-summary strong { color: #171717; font-size: 17px; }
.model-auto-routing-head,.model-auto-routing-row { display: grid; min-width: 780px; grid-template-columns: 52px minmax(180px,1.5fr) 120px 120px 92px 62px; align-items: center; gap: 12px; padding: 10px 12px; }
.model-auto-routing-head { min-height: 38px; border-bottom: 1px solid #e5e5e5; background: #fafafa; color: #737373; font-size: 10px; font-weight: 600; }
.model-auto-routing-row { min-height: 68px; border-bottom: 1px solid #ededed; }
.model-auto-routing-row:last-child { border-bottom: 0; }
.model-route-order { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid #b8dcf7; border-radius: 6px; background: #eaf6ff; color: #075ea4; font-size: 11px; }
.model-auto-route-name { display: grid; min-width: 0; gap: 4px; }
.model-auto-route-name strong,.model-auto-route-name code { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.model-auto-route-name strong { color: #262626; font-size: 12px; }
.model-auto-route-name code { color: #737373; font: 10px "Roboto Mono",monospace; }
.model-auto-routing-row input[type="number"] { width: 100%; min-height: 36px; }
.model-auto-routing-row > span[data-routing-share] { color: #525252; font: 600 11px "Roboto Mono",monospace; }
.model-routing-enabled { display: grid; place-items: center; }
.model-routing-enabled input { width: 17px; min-height: 17px; height: 17px; accent-color: #0a0a0a; }
.provider-editor-footer { display: flex; min-height: 72px; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 22px; border-top: 1px solid #e5e5e5; background: #fff; }
.provider-editor-footer .dialog-error { flex: 1; min-height: 18px; margin: 0; }
.provider-editor-footer > div { display: flex; flex: 0 0 auto; gap: 8px; }
.provider-editor-footer .provider-editor-left-actions { flex-wrap: wrap; }
.provider-editor-footer .provider-editor-left-actions[hidden] { display: none; }
.provider-editor-footer .provider-editor-left-actions .secondary-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.provider-editor-footer .provider-editor-left-actions svg { width: 16px; height: 16px; }
.provider-editor-footer .primary-button,.provider-editor-footer .secondary-button { min-height: 40px; }
.provider-editor-footer .model-delete-button { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 7px; border-color: #f0aaaa; background: #fff; color: var(--danger); }
.provider-editor-footer .model-delete-button:hover { border-color: var(--danger); background: #fef2f2; }
.provider-editor-footer .model-delete-button[hidden] { display: none; }
.provider-editor-footer .model-delete-button svg { width: 16px; height: 16px; }
dialog .dialog-body > p { color: #737373; font-size: 12px; }
dialog .secret-key { border-color: #b8dcf7; background: #eaf6ff; }
dialog .secret-key code { color: #075ea4; }
dialog .secret-key button { border-color: #d4d4d4; background: #fff; color: #404040; }
.app-shell .toast,
.toast { border-color: #0a0a0a; border-radius: 8px; background: #0a0a0a; color: #fff; box-shadow: 0 14px 35px rgba(0,0,0,.18); font-size: 12px; }

@media (max-width: 1500px) {
  .app-shell .provider-filter-bar { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .app-shell .provider-filter-search,
  .app-shell .provider-filter-summary { grid-column: span 2; }
  .app-shell .model-filter-bar { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .app-shell .model-filter-search,
  .app-shell .model-filter-summary { grid-column: span 2; }
}

@media (max-width: 820px) {
  .app-shell .sidebar { box-shadow: 12px 0 35px rgba(0,0,0,.12); }
  .app-shell .console-main { margin-left: 0; }
  .app-shell .topbar { padding-inline: 18px; }
  body.sidebar-open::after { background: rgba(10,10,10,.32); }
  .app-shell .content-shell { padding: 30px 18px 55px; }
  .app-shell .global-settings-layout { grid-template-columns: 1fr; gap: 12px; }
  .app-shell .global-settings-nav { position: sticky; top: 66px; z-index: 3; display: flex; overflow-x: auto; padding: 6px; scrollbar-width: none; }
  .app-shell .global-settings-nav::-webkit-scrollbar { display: none; }
  .app-shell .global-settings-nav button { flex: 0 0 auto; width: auto; min-width: 150px; }
  .app-shell .global-settings-section { min-height: 0; scroll-margin-top: 126px; }
  .app-shell .provider-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .provider-model-import-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .provider-model-import-grid .provider-switch-field { grid-column: 1/-1; }
  .provider-model-import-pricing { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ollama-installed-heading { align-items: stretch; flex-direction: column; }
  .ollama-installed-heading > div:last-child { flex-wrap: wrap; }
  .ollama-model-search { flex: 1 1 220px; width: auto; }
  .app-shell .model-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .model-metadata-audit-summary { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .model-metadata-audit-summary > div:nth-child(3) { border-right: 0; }
  .model-metadata-audit-summary > div:nth-child(-n+3) { border-bottom: 1px solid #e5e5e5; }
  .app-shell .admin-user-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .recharge-log-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .recharge-log-search,
  .app-shell .recharge-log-filter-summary { grid-column: 1/-1; }
  .app-shell .admin-key-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .admin-key-search,
  .app-shell .admin-key-filter-summary { grid-column: 1/-1; }
  .app-shell .redemption-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .redemption-filter-search,
  .app-shell .redemption-filter-summary { grid-column: 1/-1; }
  .app-shell .billing-ledger-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .billing-ledger-search,
  .app-shell .billing-ledger-filter-summary { grid-column: 1/-1; }
  .app-shell .admin-user-search,
  .app-shell .admin-user-filter-summary { grid-column: 1/-1; }
  .app-shell .provider-filter-search,
  .app-shell .provider-filter-summary { grid-column: 1 / -1; }
  .app-shell .model-filter-search,
  .app-shell .model-filter-summary { grid-column: 1 / -1; }
  .app-shell .provider-bulk-bar { align-items: flex-start; flex-direction: column; }
  .app-shell .provider-bulk-bar > div { width: 100%; }
  .app-shell .provider-bulk-bar .secondary-button { flex: 1 1 0; justify-content: center; }
  .app-shell .audit-log-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .audit-action-filter,
  .app-shell .audit-log-filter-summary { grid-column: 1 / -1; }
  .app-shell .admin-usage-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .admin-usage-filter-summary { grid-column: 1/-1; }
  .app-shell .admin-usage-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .admin-usage-summary > div:last-child { grid-column: 1/-1; }
  .admin-usage-detail-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-usage-detail-metrics > div { border-bottom: 1px solid #e5e5e5; }
  .admin-usage-detail-metrics > div:nth-child(2n) { border-right: 0; }
  .admin-usage-detail-metrics > div:last-child { grid-column: 1/-1; border-bottom: 0; }
  .admin-usage-detail-metrics.billing { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .admin-usage-detail-metrics.billing > div { grid-column: auto; border-bottom: 0; border-right: 1px solid #e5e5e5; }
  .admin-usage-detail-metrics.billing > div:last-child { border-right: 0; }
  .app-shell .admin-failure-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .admin-failure-summary > div:nth-child(2n) { border-right: 0; }
  .app-shell .admin-failure-summary > div:last-child { grid-column: 1/-1; }
  .app-shell .admin-performance-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .admin-performance-summary > div:nth-child(2n) { border-right: 0; }
  .app-shell .admin-overview-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .admin-system-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .admin-system-grid { grid-template-columns: 1fr; }
  .app-shell .admin-system-grid > section:last-child { grid-column: auto; }
  .app-shell .admin-system-tasks-heading { align-items: flex-start; flex-direction: column; }
  .app-shell .admin-system-task-actions { width: 100%; justify-content: space-between; }
  .app-shell .admin-overview-chart-grid,
  .app-shell .admin-overview-breakdowns,
  .app-shell .admin-failure-breakdowns,
  .app-shell .admin-performance-breakdowns { grid-template-columns: 1fr; }
  .app-shell .admin-overview-chart:first-child,
  .app-shell .admin-overview-breakdowns > section:first-child,
  .app-shell .admin-failure-breakdowns > section:not(:last-child),
  .app-shell .admin-performance-breakdowns > section:not(:last-child) { padding-right: 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .app-shell .global-settings-grid { grid-template-columns: 1fr; }
  .app-shell .global-settings-grid-wide { grid-template-columns: 1fr; }
  .app-shell .payment-method-common-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .payment-method-provider-grid,
  .app-shell .payment-method-url-grid { grid-template-columns: 1fr; }
  .app-shell .global-email-options { grid-template-columns: 1fr; }
  .app-shell .global-email-test { grid-template-columns: minmax(0,1fr) auto; }
  .app-shell #global-email-test-status { grid-column: 1 / -1; min-height: 20px; }
  .app-shell .global-sidebar-module-grid { grid-template-columns: 1fr; }
  .app-shell .global-onboarding-grid { grid-template-columns: 1fr; }
  .app-shell .global-api-key-limit-grid { grid-template-columns: 1fr; }
  .app-shell .global-request-limits-grid { grid-template-columns: 1fr; }
  .app-shell .global-model-rate-limit-grid { grid-template-columns: 1fr 1fr; }
  .app-shell .global-model-rate-limit-grid .global-registration-switch,
  .app-shell .global-model-rate-limit-grid .global-settings-status { grid-column: 1 / -1; }
  .app-shell .global-model-rate-limit-group { grid-template-columns: minmax(220px,1fr) minmax(140px,180px) minmax(140px,180px); }
  .app-shell .global-health-grid,
  .app-shell .global-health-schedule-grid { grid-template-columns: 1fr; }
  .app-shell .global-health-schedule-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
  .app-shell .global-retry-grid { grid-template-columns: 1fr; }
  .app-shell .global-affinity-grid { grid-template-columns: 1fr; }
  .app-shell .global-sensitive-grid { grid-template-columns: 1fr; }
  .app-shell .usage-cleanup-grid { grid-template-columns: 1fr; }
  .provider-editor-layout { grid-template-columns: 1fr; grid-template-rows: auto minmax(0,1fr); }
  .provider-param-override-layout { grid-template-columns: 210px minmax(0,1fr); }
  .provider-param-override-toolbar { grid-template-columns: minmax(180px,1fr) auto; }
  .provider-param-override-toolbar > span { display: none; }
  .provider-param-operation-grid { grid-template-columns: 1fr; }
  .provider-param-operation-value,.provider-param-keep-origin { grid-column: auto; }
  .provider-param-condition-row { grid-template-columns: 1fr 1fr 36px; }
  .provider-param-condition-row > label:first-child { grid-column: 1/-1; }
  .model-supported-parameter-row { grid-template-columns: 28px repeat(2,minmax(0,1fr)) 36px; }
  .model-supported-parameter-constraint { grid-column: 2/4; }
  .model-supported-parameter-row .icon-button { grid-column: 4; grid-row: 1; }
  .model-vendor-layout { grid-template-columns: 225px minmax(0,1fr); }
  .provider-editor-nav { overflow-x: auto; flex-direction: row; padding: 9px 12px; border-right: 0; border-bottom: 1px solid #e5e5e5; }
  .provider-editor-nav button { min-width: 158px; }
  .provider-editor-nav button small { display: none; }
  .provider-editor-section { padding: 24px 20px 28px; }
  .model-capability-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-key-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-key-metrics > div:nth-child(2) { border-right: 0; }
  .admin-key-metrics > div:nth-child(-n+2) { border-bottom: 1px solid #e5e5e5; }
  .provider-routing-list-head { display: none; }
  .provider-routing-row { grid-template-columns: minmax(0,1fr) auto; gap: 9px 12px; }
  .provider-routing-model { grid-column: 1; grid-row: 1; }
  .provider-routing-edit { grid-column: 2; grid-row: 1; }
  .provider-routing-actions { grid-column: 2; grid-row: 1 / span 2; flex-direction: column; align-items: stretch; gap: 5px; }
  .provider-routing-actions .provider-model-toggle { min-height: 40px; }
  .provider-routing-row > .status-pill { grid-column: 1; grid-row: 2; justify-self: start; }
  .provider-request-header-row { grid-template-columns: minmax(0,1fr) 36px; align-items: end; }
  .provider-request-header-row label { grid-column: 1; }
  .provider-request-header-row .icon-button { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
  .provider-model-update-switches { grid-template-columns: 1fr; }
  .provider-model-update-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .provider-model-update-summary > div:nth-child(2) { border-right: 0; }
  .provider-model-update-summary > div:nth-child(-n+2) { border-bottom: 1px solid #ededed; }
  .provider-advanced-routes-heading { align-items: flex-start; flex-wrap: wrap; }
  .provider-advanced-routes-toggle { flex: 1 1 100%; }
  .provider-advanced-route-grid,
  .provider-advanced-auth-grid { grid-template-columns: 1fr; }
  .provider-advanced-models { grid-column: auto; }
  .provider-key-manage-toolbar { grid-template-columns: minmax(140px,1fr) auto; }
  .provider-key-manage-toolbar > div { grid-column: 1/-1; justify-content: flex-start; }
}
@media (max-width: 560px) {
  .app-shell { font-size: 14px; }
  .app-shell .topbar { min-height: 58px; padding-inline: 13px; }
  .app-shell .user-button .user-chevron { display: none; }
  .app-shell .content-shell { padding: 26px 13px 34px; }
  .ollama-model-content { padding: 0 14px 22px; }
  .ollama-pull-control { grid-template-columns: 1fr; }
  .ollama-pull-control .primary-button { width: 100%; }
  .ollama-installed-heading > div:last-child { align-items: stretch; }
  .ollama-model-search { flex-basis: 100%; }
  .ollama-model-row { grid-template-columns: 34px minmax(0,1fr) 32px; gap: 9px; }
  .ollama-model-row > div { grid-template-columns: 1fr; }
  .provider-param-override-editor { grid-template-rows: auto auto minmax(0,1fr) auto auto; }
  .provider-param-override-toolbar { grid-template-columns: 1fr; align-items: stretch; }
  .provider-param-override-layout { grid-template-columns: 1fr; grid-template-rows: 190px minmax(0,1fr); }
  .provider-param-operation-sidebar { border-right: 0; border-bottom: 1px solid #e5e5e5; }
  .provider-param-operation-editor { padding: 18px 14px 24px; }
  .provider-param-condition-row { grid-template-columns: 1fr 36px; }
  .provider-param-condition-row > label { grid-column: 1/-1; }
  .provider-param-condition-row > .icon-button { grid-column: 2; grid-row: 1; }
  .model-route-control-heading { align-items: stretch; flex-direction: column; }
  .model-route-control-heading .secondary-button { justify-content: center; }
  .model-supported-parameter-row { grid-template-columns: 24px minmax(0,1fr) 36px; }
  .model-supported-parameter-row > label,.model-supported-parameter-constraint { grid-column: 2; }
  .model-supported-parameter-row .icon-button { grid-column: 3; grid-row: 1; }
  .model-supported-parameter-range { grid-template-columns: 1fr; align-items: stretch; }
  .model-supported-parameter-range > span { display: none; }
  .ollama-model-row code { grid-column: auto; }
  .app-shell .view-heading h1,
  .app-shell .workspace-heading h1 { font-size: 28px; }
  .app-shell .metrics-grid article { min-height: 116px; }
  .app-shell .admin-panel-heading { align-items: stretch; flex-direction: column; }
  .app-shell .admin-panel-actions { width: 100%; flex-wrap: wrap; }
  .app-shell .provider-view-toggle { width: 100%; }
  .app-shell .provider-view-toggle button { flex: 1 1 0; }
  .app-shell .admin-panel-heading .primary-button,
  .app-shell .admin-panel-heading .secondary-button { flex: 1 1 0; }
  .model-vendor-layout { grid-template-columns: 1fr; grid-template-rows: 220px minmax(0,1fr); }
  .model-vendor-sidebar { border-right: 0; border-bottom: 1px solid #e5e5e5; }
  .model-metadata-audit-content { gap: 20px; padding: 16px 13px 24px; }
  .model-metadata-audit-toolbar { align-items: stretch; flex-direction: column; gap: 9px; }
  .model-metadata-audit-toolbar .secondary-button { justify-content: center; }
  .model-metadata-audit-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .model-metadata-audit-summary > div { min-height: 86px; border-bottom: 1px solid #e5e5e5; }
  .model-metadata-audit-summary > div:nth-child(2n) { border-right: 0; }
  .model-metadata-audit-summary > div:nth-last-child(-n+2) { border-bottom: 0; }
  .model-metadata-audit-heading { align-items: flex-start; flex-direction: column; gap: 7px; }
  .model-metadata-audit-item { grid-template-columns: 1fr; }
  .model-metadata-audit-item > .secondary-button { width: 100%; }
  .model-metadata-audit-models { padding-left: 0; }
  .model-metadata-audit-model-group { grid-template-columns: 1fr; gap: 5px; }
  .app-shell .provider-filter-bar { grid-template-columns: 1fr; }
  .app-shell .model-filter-bar { grid-template-columns: 1fr; }
  .app-shell .admin-user-filter-bar { grid-template-columns: 1fr; }
  .app-shell .admin-user-filter-bar > * { grid-column: 1; }
  .app-shell .recharge-log-filter-bar { grid-template-columns: 1fr; }
  .app-shell .recharge-log-filter-bar > * { grid-column: 1; }
  .app-shell .recharge-log-total { align-items: flex-start; flex-direction: column; justify-content: center; gap: 4px; }
  .app-shell .admin-key-filter-bar { grid-template-columns: 1fr; }
  .app-shell .admin-key-filter-bar > * { grid-column: 1; }
  .app-shell .redemption-filter-bar { grid-template-columns: 1fr; }
  .app-shell .redemption-filter-bar > * { grid-column: 1; }
  .app-shell .billing-balance-band { grid-template-columns: 1fr; gap: 20px; padding: 22px; }
  .app-shell .overview-balance-band { grid-template-columns: 1fr; gap: 20px; padding: 22px; }
  .app-shell .overview-recharge { justify-items: stretch; }
  .app-shell .overview-recharge-amounts { justify-content: flex-start; }
  .app-shell .billing-balance-actions { align-items: stretch; flex-direction: column; }
  .app-shell .billing-recharge-trigger,
  .app-shell .billing-redeem-trigger { width: 100%; }
  .recharge-method-list { grid-template-columns: 1fr; }
  .app-shell .billing-ledger-section .section-title { padding: 22px 18px; }
  .app-shell .billing-ledger-filter-bar { padding: 20px 18px 22px; }
  .app-shell .billing-ledger-filter-bar { grid-template-columns: 1fr; }
  .app-shell .billing-ledger-filter-bar > * { grid-column: 1; }
  .app-shell .provider-filter-bar > * { grid-column: 1; }
  .app-shell .model-filter-bar > * { grid-column: 1; }
  .app-shell .admin-table-pagination { align-items: stretch; flex-direction: column; padding: 12px 0; }
  .app-shell .admin-table-pagination.billing-ledger-pagination { padding: 14px 16px; }
  .app-shell .admin-table-pagination > div { justify-content: space-between; }
  .app-shell .admin-pagination-controls { width: 100%; }
  .app-shell .admin-pagination-controls label { margin-right: auto; }
  .app-shell .admin-pagination-edge,
  .app-shell .admin-page-ellipsis,
  .app-shell .admin-page-number:not(.active) { display: none; }
  .app-shell .audit-log-filter-bar { grid-template-columns: 1fr; }
  .app-shell .audit-log-filter-bar > * { grid-column: 1; }
  .app-shell .audit-log-pagination { align-items: stretch; flex-direction: column; padding: 12px 0; }
  .app-shell .audit-log-pagination > div { justify-content: space-between; }
  .app-shell .admin-usage-filter-bar { grid-template-columns: 1fr; }
  .app-shell .admin-usage-filter-bar > * { grid-column: 1; }
  .app-shell .admin-usage-pagination { align-items: stretch; flex-direction: column; padding: 12px 0; }
  .app-shell .admin-usage-pagination > div { justify-content: space-between; }
  .admin-usage-detail-hero { padding: 18px; }
  .admin-usage-detail-section { padding: 22px 18px; }
  .admin-usage-detail-list > div { grid-template-columns: 1fr; gap: 5px; }
  .admin-usage-detail-list dd { text-align: left; }
  .audit-log-detail-hero { align-items: flex-start; flex-direction: column; padding: 18px; }
  .audit-log-detail-section { padding: 22px 18px; }
  .audit-log-detail-list > div { grid-template-columns: 1fr; gap: 5px; }
  .audit-log-detail-list dd { text-align: left; }
  .admin-usage-detail-metrics.billing { grid-template-columns: 1fr; }
  .admin-usage-detail-metrics.billing > div { border-right: 0; border-bottom: 1px solid #e5e5e5; }
  .admin-usage-detail-metrics.billing > div:last-child { border-bottom: 0; }
  .app-shell .admin-failure-actions { width: 100%; justify-content: space-between; }
  .app-shell .admin-failure-summary { grid-template-columns: 1fr; }
  .app-shell .admin-failure-summary > div,
  .app-shell .admin-failure-summary > div:nth-child(2n) { grid-column: auto; border-right: 0; border-bottom: 1px solid var(--line); }
  .app-shell .admin-failure-summary > div:last-child { grid-column: auto; border-bottom: 0; }
  .app-shell .admin-performance-actions { width: 100%; justify-content: space-between; }
  .app-shell .admin-performance-summary { grid-template-columns: 1fr; }
  .app-shell .admin-performance-summary > div,
  .app-shell .admin-performance-summary > div:nth-child(2n) { border-right: 0; border-bottom: 1px solid var(--line); }
  .app-shell .admin-performance-summary > div:last-child { border-bottom: 0; }
  .app-shell .admin-overview-metrics { grid-template-columns: 1fr; gap: 8px; }
  .app-shell .admin-overview-metrics article { min-height: 98px; }
  .app-shell .admin-system-metrics { grid-template-columns: 1fr; gap: 8px; }
  .app-shell .admin-system-metrics article { min-height: 98px; }
  .app-shell .admin-system-task-actions { align-items: stretch; flex-direction: column; }
  .app-shell .admin-system-task-actions .secondary-button { justify-content: center; width: 100%; }
  .app-shell .admin-overview-chart .section-title { align-items: flex-start; flex-direction: column; }
  .app-shell .global-settings-actions { align-items: stretch; flex-direction: column; }
  .app-shell .global-settings-actions .primary-button { justify-content: center; width: 100%; }
  .app-shell .global-sidebar-settings-heading { align-items: flex-start; flex-wrap: wrap; }
  .app-shell .global-sidebar-settings-heading > div { flex: 1 1 calc(100% - 54px); }
  .app-shell .global-sidebar-settings-heading .secondary-button { width: 100%; justify-content: center; margin-left: 0; }
  .app-shell .global-sidebar-settings-toolbar { align-items: flex-start; flex-direction: column; gap: 5px; }
  .app-shell .global-sidebar-settings-toolbar small { text-align: left; }
  .app-shell .payment-method-settings-summary { align-items: flex-start; flex-direction: column; gap: 6px; }
  .app-shell .payment-method-settings-summary small { text-align: left; }
  .app-shell .payment-method-setting > header { align-items: flex-start; }
  .app-shell .payment-method-common-grid { grid-template-columns: 1fr; }
  .app-shell .payment-method-setting-actions { align-items: stretch; flex-direction: column; }
  .app-shell .payment-method-setting-actions .secondary-button { width: 100%; justify-content: center; }
  .app-shell .global-sidebar-group > header { align-items: flex-start; }
  .app-shell .global-settings-section { padding: 20px 14px 24px; }
  .app-shell .global-settings-nav button { min-width: 142px; }
  .app-shell .global-model-rate-limit-grid { grid-template-columns: 1fr; }
  .app-shell .global-model-rate-limit-grid .global-registration-switch,
  .app-shell .global-model-rate-limit-grid .global-settings-status { grid-column: auto; }
  .app-shell .global-model-rate-limit-groups-heading { align-items: flex-start; flex-direction: column; gap: 6px; }
  .app-shell .global-model-rate-limit-group { grid-template-columns: 1fr 1fr; gap: 10px; }
  .app-shell .global-model-rate-limit-group-toggle { grid-column: 1 / -1; }
  .app-shell .metrics-grid strong { font-size: 24px; }
  .provider-editor-header { min-height: 66px; padding: 12px 14px; }
  .provider-editor-title p { display: none; }
  .provider-field-grid { grid-template-columns: 1fr; }
  .user-credit-line-grid { grid-template-columns: 1fr; }
  .model-description-locale-grid { grid-template-columns: 1fr; }
  .provider-create-mode { grid-template-columns: 1fr; align-items: stretch; }
  .provider-create-mode .segmented { width: 100%; }
  .provider-key-statistics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .provider-key-manage-content { padding: 16px 13px 12px; }
  .provider-key-manage-stats { grid-template-columns: 1fr; }
  .provider-key-manage-stats button { min-height: 58px; }
  .provider-key-manage-toolbar { grid-template-columns: 1fr; }
  .provider-key-manage-toolbar > span,.provider-key-manage-toolbar > div { grid-column: 1; }
  .provider-key-manage-toolbar .secondary-button { flex: 1 1 140px; justify-content: center; }
  .provider-key-manage-pagination { align-items: flex-start; flex-direction: column; }
  .provider-key-manage-pagination > div { width: 100%; justify-content: space-between; }
  .provider-key-pool-toolbar { grid-template-columns: 1fr auto; }
  .provider-key-pool-toolbar > div { grid-column: 1/-1; justify-content: stretch; }
  .provider-key-pool-toolbar .secondary-button { flex: 1 1 0; justify-content: center; }
  .model-bulk-pricing-grid { grid-template-columns: 1fr; }
  .provider-model-import-toolbar,.provider-model-sync-tabs,.provider-model-import-grid,.provider-model-import-pricing { grid-template-columns: 1fr; }
  .provider-model-import-select-all { min-height: 28px; }
  .provider-model-import-grid .provider-switch-field { grid-column: auto; }
  .model-capability-grid { grid-template-columns: 1fr 1fr; }
  .model-endpoint-grid { grid-template-columns: 1fr; }
  .provider-endpoint-grid { grid-template-columns: 1fr; }
  .provider-editor-footer { align-items: stretch; flex-direction: column; gap: 8px; padding: 11px 14px; }
  .provider-editor-footer > div { width: 100%; }
  .provider-editor-footer .model-delete-button { width: 100%; }
  .provider-editor-footer button { flex: 1; }
  .provider-routing-heading .secondary-button { width: 100%; justify-content: center; }
  .provider-routing-toolbar { align-items: flex-start; flex-direction: column; gap: 3px; padding-block: 10px; }
  .app-shell .table-wrap:has(> .provider-admin-table) { overflow: visible; border: 0; }
  .app-shell .provider-admin-table { display: block; min-width: 0; }
  .app-shell .provider-admin-table thead { display: none; }
  .app-shell .provider-admin-table tbody { display: grid; gap: 10px; }
  .app-shell .provider-admin-table tbody tr { display: grid; grid-template-columns: 28px minmax(0,1fr) auto; gap: 6px 10px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
  .app-shell .provider-admin-table tbody td { display: block; min-width: 0; padding: 0; border: 0; }
  .app-shell .provider-admin-table tbody td:nth-child(1) { grid-column: 1; grid-row: 1/3; padding-top: 3px; }
  .app-shell .provider-admin-table tbody td:nth-child(2) { grid-column: 2/-1; grid-row: 2; align-self: center; }
  .app-shell .provider-admin-table tbody td:nth-child(3) { grid-column: 2; grid-row: 1; align-self: center; }
  .app-shell .provider-admin-table tbody td:nth-child(4) { grid-column: 3; grid-row: 1; }
  .app-shell .provider-admin-table tbody td:nth-child(n+5):nth-child(-n+11) { display: grid; grid-column: 2/-1; grid-template-columns: 84px minmax(0,1fr); align-items: start; gap: 10px; padding-top: 8px; border-top: 1px solid var(--line); }
  .app-shell .provider-admin-table tbody td:nth-child(n+5):nth-child(-n+11)::before { color: var(--faint); font: 600 9px/1.4 "Roboto Mono",monospace; text-transform: uppercase; }
  .app-shell .provider-admin-table tbody td:nth-child(5)::before { content: "Tags"; }
  .app-shell .provider-admin-table tbody td:nth-child(6)::before { content: "Access"; }
  .app-shell .provider-admin-table tbody td:nth-child(7)::before { content: "Discount"; }
  .app-shell .provider-admin-table tbody td:nth-child(8)::before { content: "Total billed"; }
  .app-shell .provider-admin-table tbody td:nth-child(9)::before { content: "Routes"; }
  .app-shell .provider-admin-table tbody td:nth-child(10)::before { content: "24h activity"; }
  .app-shell .provider-admin-table tbody td:nth-child(11)::before { content: "Enabled"; }
  .app-shell .provider-admin-table tbody td:nth-child(12) { grid-column: 2/-1; padding-top: 8px; }
  .app-shell .provider-admin-table tbody td:nth-child(12) .row-actions { width: 100%; max-width: none; flex-wrap: wrap; }
  .app-shell .provider-admin-table tbody td:nth-child(12) .row-button { flex: 1 1 120px; justify-content: center; }
  .app-shell .provider-admin-table .provider-id-cell { max-width: 100%; }
  .app-shell .provider-admin-table .provider-name-column { width: auto; max-width: none; }
  .app-shell .provider-admin-table .provider-name-cell { max-width: 100%; }
  .app-shell .provider-admin-table .provider-routing-input { width: min(112px,100%); min-height: 38px; text-align: left; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(2) { grid-column: 2; grid-row: 1; align-self: center; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(3) { grid-column: 3; grid-row: 1; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(n+4):nth-child(-n+10) { display: grid; grid-column: 2/-1; grid-template-columns: 84px minmax(0,1fr); align-items: start; gap: 10px; padding-top: 8px; border-top: 1px solid var(--line); }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(n+4):nth-child(-n+10)::before { color: var(--faint); font: 600 9px/1.4 "Roboto Mono",monospace; text-transform: uppercase; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(4)::before { content: "Types"; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(5)::before { content: "Models"; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(6)::before { content: "Routing"; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(7)::before { content: "Health"; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(8)::before { content: "Total billed"; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(9)::before { content: "24h activity"; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(10)::before { content: "Status"; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(11) { display: block; grid-column: 2/-1; padding-top: 8px; border-top: 1px solid var(--line); }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(11)::before { content: none; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(11) .row-actions { width: 100%; max-width: none; flex-wrap: wrap; }
  .app-shell .provider-admin-table.tag-view tbody td:nth-child(11) .row-button { flex: 1 1 120px; justify-content: center; }
  .app-shell .provider-admin-table .provider-health,
  .app-shell .provider-admin-table .provider-runtime,
  .app-shell .provider-admin-table .provider-used-quota { min-width: 0; }
  .app-shell .provider-admin-table .provider-balance-button { min-width: 0; }
  .provider-balance-batch-row { grid-template-columns: 1fr; gap: 8px; }
  .provider-balance-batch-result { justify-items: start; text-align: left; }
  .app-shell .chat-workspace { box-shadow: none; }
}
/* Authenticated console final state fixes. */
.app-shell .settings-form input:disabled { border-color: #e5e5e5; background: #f5f5f5; color: #737373; }
dialog .primary-button { min-height: 42px; border-color: #0a0a0a; border-radius: 8px; background: #0a0a0a; color: #fff; font-size: 14px; }
dialog .primary-button:hover { background: #262626; }
dialog .secondary-button { min-height: 40px; border-color: #d4d4d4; border-radius: 8px; background: #fff; color: #0a0a0a; font-size: 14px; }
dialog .secondary-button:hover { border-color: #a3a3a3; background: #f5f5f5; }
dialog .dialog-error { color: #b42318; }
.usage-cleanup-dialog { width: min(560px,calc(100vw - 32px)); }
.usage-cleanup-dialog .dialog-heading p { margin: 5px 0 0; color: #b42318; font-size: 12px; }
.usage-cleanup-confirmation { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: start; gap: 12px; margin-top: 18px; padding: 14px; border: 1px solid #f0b6b1; border-radius: 7px; background: #fff7f6; }
.usage-cleanup-confirmation > span { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 6px; background: #fee4e2; color: #b42318; }
.usage-cleanup-confirmation svg { width: 16px; height: 16px; }
.usage-cleanup-confirmation p { margin: 3px 0 0; color: #4a2724; font-size: 12px; line-height: 1.55; }
.usage-cleanup-preserved { margin: 13px 0 0; color: #737373; font-size: 11px; line-height: 1.55; }
.usage-cleanup-dialog .dialog-error { min-height: 18px; margin-top: 8px; }
.usage-cleanup-dialog .primary-button.danger { border-color: #b42318; background: #b42318; }
.usage-cleanup-dialog .primary-button.danger:hover { background: #912018; }
.redemption-cleanup-dialog { width: min(560px,calc(100vw - 32px)); }
.redemption-cleanup-dialog .dialog-heading p { margin: 5px 0 0; color: #b42318; font-size: 12px; }
.redemption-cleanup-confirmation { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: start; gap: 12px; margin-top: 18px; padding: 14px; border: 1px solid #f0b6b1; border-radius: 7px; background: #fff7f6; }
.redemption-cleanup-confirmation > span { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 6px; background: #fee4e2; color: #b42318; }
.redemption-cleanup-confirmation svg { width: 16px; height: 16px; }
.redemption-cleanup-confirmation p { margin: 3px 0 0; color: #4a2724; font-size: 12px; line-height: 1.55; }
.redemption-cleanup-preserved { margin: 13px 0 0; color: #737373; font-size: 11px; line-height: 1.55; }
.redemption-cleanup-dialog .dialog-error { min-height: 18px; margin-top: 8px; }
.redemption-cleanup-dialog .primary-button.danger { border-color: #b42318; background: #b42318; }
.redemption-cleanup-dialog .primary-button.danger:hover { background: #912018; }
/* Usage analytics workspace. */
.app-shell .usage-filters-panel { margin: 0 20px 20px; overflow: hidden; border: 1px solid #e5e7eb; border-radius: 12px; background: #fafafa; }
.app-shell .usage-filter-bar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin: 0; padding: 16px; border: 0; border-bottom: 1px solid #e5e7eb; border-radius: 0; background: transparent; }
.app-shell .usage-filter-bar label { display: grid; flex: 1 1 145px; gap: 7px; min-width: 135px; color: #525252; font-size: 11px; font-weight: 600; }
.app-shell .usage-filter-bar label:has(input[type="datetime-local"]) { flex-basis: 190px; }
.app-shell .usage-filter-bar label > span { display: flex; align-items: center; gap: 6px; min-height: 16px; }
.app-shell .usage-filter-bar label svg { width: 15px; height: 15px; color: var(--muted); }
.app-shell .usage-filter-bar select,
.app-shell .usage-filter-bar input { min-height: 40px; padding-inline: 11px; font-size: 12px; }
.app-shell .usage-filter-bar .usage-reset { flex: 0 0 auto; min-height: 40px; }
.app-shell .usage-metrics-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.app-shell .usage-live-panel { display: grid; grid-template-columns: minmax(210px,1.3fr) repeat(2,minmax(140px,1fr)); gap: 18px 28px; margin: 0 0 16px; padding: 22px 24px 16px; border: 1px solid #e5e7eb; border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(16,24,40,.025); }
.app-shell .usage-live-heading > div { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.app-shell .usage-live-heading h2 { margin: 0; color: #172b40; font-size: 15px; font-weight: 650; }
.app-shell .usage-live-heading p { margin: 7px 0 4px; color: #45586d; font-size: 12px; }
.app-shell .usage-live-heading > small { color: #64748b; font-size: 11px; }
.app-shell .usage-live-status { display: inline-flex; align-items: center; gap: 5px; padding: 3px 7px; border-radius: 20px; background: #f1f5f9; color: #526276; font-size: 10px; font-weight: 600; }
.app-shell .usage-live-status i { width: 5px; height: 5px; flex: 0 0 5px; border-radius: 50%; background: currentColor; }
.app-shell .usage-live-panel[data-state="live"] .usage-live-status { background: #edf9f3; color: #147a4d; }
.app-shell .usage-live-panel:is([data-state="stale"],[data-state="unavailable"]) .usage-live-status { background: #fff6e5; color: #8c5915; }
.app-shell .usage-live-metric { display: grid; min-width: 0; align-content: start; gap: 5px; padding-left: 24px; border-left: 1px solid #edf0f3; }
.app-shell .usage-live-metric > span { color: #45586d; font-size: 12px; }
.app-shell .usage-live-metric > strong { color: #172b40; font: 600 26px/1.3 "Roboto Mono",monospace; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.app-shell .usage-live-metric > small { color: #64748b; font-size: 11px; }
.app-shell .usage-live-panel[data-state="stale"] .usage-live-metric > strong { color: #75634a; }
.app-shell .usage-live-note { grid-column: 1/-1; margin: 0; padding-top: 11px; border-top: 1px solid #edf0f3; color: #64748b; font-size: 11px; line-height: 1.6; }
@media(max-width:700px) {
  .app-shell .usage-live-panel { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; padding: 16px; }
  .app-shell .usage-live-heading { grid-column: 1/-1; }
  .app-shell .usage-live-heading > small { display: inline-block; margin-top: 2px; }
  .app-shell .usage-live-metric { padding-left: 0; border-left: 0; }
  .app-shell .usage-live-metric > strong { font-size: 23px; }
}
.app-shell .usage-metrics-grid article { display: flex; min-width: 0; min-height: 124px; align-items: flex-start; gap: 14px; padding: 20px; border: 1px solid #e5e7eb; border-radius: 16px; background: #fff; box-shadow: 0 1px 2px rgba(16,24,40,.025); }
.app-shell .usage-metric-icon { display: grid; flex: 0 0 38px; width: 38px; height: 38px; place-items: center; border: 1px solid #ededed; border-radius: 10px; background: #fafafa; color: #525252; }
.app-shell .usage-metric-icon svg { width: 18px; height: 18px; stroke-width: 1.7; }
.app-shell .usage-metrics-grid article > div { display: grid; min-width: 0; gap: 8px; }
.app-shell .usage-metrics-grid small { color: #737373; font-size: 12px; }
.app-shell .usage-metrics-grid strong { overflow: hidden; color: #171717; font: 600 24px/1.15 "Roboto Mono", monospace; letter-spacing: -.03em; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .usage-metrics-grid em { color: #a3a3a3; font-size: 11px; font-style: normal; }
.app-shell .usage-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.app-shell .usage-chart-card { min-width: 0; }
.app-shell .usage-chart-card .section-title { align-items: center; }
.app-shell .usage-chart-legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px; color: var(--muted); font-size: 10px; }
.app-shell .usage-chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.app-shell .usage-chart-legend span::before { width: 8px; height: 8px; border-radius: 2px; background: #1687e8; content: ""; }
.app-shell .usage-chart-legend .output::before { background: #7cc5f5; }
.app-shell .usage-chart-legend .requests::before { background: #1687e8; }
.app-shell .usage-chart-legend .latency::before { background: #0a0a0a; }
.app-shell .usage-analytics-chart { min-height: 310px; padding: 24px 20px 18px; }
.app-shell .usage-chart-plot { display: flex; height: 262px; align-items: stretch; gap: 8px; border-bottom: 1px solid var(--line-strong); }
.app-shell .usage-chart-column { display: flex; min-width: 12px; flex: 1 1 0; align-items: stretch; flex-direction: column; justify-content: flex-end; gap: 9px; }
.app-shell .usage-chart-bars { display: flex; height: 220px; align-items: flex-end; justify-content: center; gap: 3px; }
.app-shell .usage-chart-bars i { width: min(12px, 42%); min-height: 2px; border-radius: 3px 3px 0 0; background: #1687e8; }
.app-shell .usage-chart-bars i.output { background: #7cc5f5; }
.app-shell .usage-chart-bars i.requests { background: #1687e8; }
.app-shell .usage-chart-bars i.latency { background: #0a0a0a; }
.app-shell .usage-chart-column > span { overflow: hidden; color: var(--faint); font: 9px "Roboto Mono", monospace; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.app-shell button.usage-chart-column { min-width: 0; padding: 8px 4px 4px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: inherit; cursor: pointer; transition: background .15s,border-color .15s,box-shadow .15s,opacity .15s; }
.app-shell button.usage-chart-column .usage-chart-bars { flex: 1; min-height: 0; overflow: visible; }
.app-shell button.usage-chart-column > span:last-child { flex: 0 0 auto; padding: 3px 2px; border-radius: 4px; color: var(--muted); line-height: 16px; }
.app-shell button.usage-chart-column:hover,.app-shell button.usage-chart-column.is-preview { border-color: #93c5fd; background: #eff6ff; }
.app-shell button.usage-chart-column.is-selected { border-color: #1687e8; background: linear-gradient(#eaf4ff,#f7fbff); box-shadow: inset 0 0 0 1px #1687e8,0 2px 8px #1687e81a; }
.app-shell button.usage-chart-column:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; }
.app-shell .has-active-period button.usage-chart-column:not(.is-selected):not(.is-preview) .usage-chart-bars { opacity: .45; }
.app-shell button.usage-chart-column.is-selected > span:last-child,.app-shell button.usage-chart-column.is-preview > span:last-child { background: #dbeafe; color: #075ea4; font-weight: 700; }
.app-shell button.usage-chart-column.is-selected .usage-chart-bars i { filter: drop-shadow(0 0 2px #1687e84d); }
.app-shell .usage-chart-readout { min-height: 20px; margin: 12px 0 0; padding: 9px 12px; border: 1px solid var(--line); border-radius: 6px; background: #fafafa; color: var(--muted); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.app-shell .usage-chart-readout[data-active="true"] { border-color: #bfdbfe; background: #eff6ff; color: #075ea4; font-weight: 600; }
@media(prefers-reduced-motion:reduce){.app-shell button.usage-chart-column{transition:none}}
.app-shell .usage-chart-empty { display: grid; min-height: 262px; place-items: center; color: var(--faint); font-size: 13px; text-align: center; }
.app-shell .usage-detail-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin: 0; padding: 16px; border: 0; }
.app-shell .usage-detail-filters label { display: grid; flex: 1 1 160px; min-width: 0; gap: 7px; color: #525252; font-size: 11px; font-weight: 600; }
.app-shell .usage-detail-filters .usage-detail-search { flex: 3 1 320px; }
.app-shell .usage-detail-filters label > span { display: flex; align-items: center; gap: 6px; }
.app-shell .usage-detail-filters svg { width: 15px; height: 15px; flex-shrink: 0; color: var(--muted); }
.app-shell .usage-detail-filters input,.app-shell .usage-detail-filters select { width: 100%; min-width: 0; min-height: 40px; padding-inline: 11px; font-size: 14px; }
.app-shell .usage-detail-filter-actions { display: flex; align-items: center; gap: 8px; }
.app-shell .usage-detail-filter-actions button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; }
.app-shell .usage-detail-filter-actions .icon-button { width: 40px; }
.app-shell .usage-detail-filters p { flex: 1 1 100%; margin: 0; color: #8a8a8a; font-size: 11px; line-height: 1.6; }
@media (max-width: 560px) {
  .app-shell .usage-filters-panel { margin: 0 12px 12px; }
  .app-shell .usage-detail-filters { padding: 14px; }
  .app-shell .usage-detail-filters label,.app-shell .usage-detail-filters .usage-detail-search { flex-basis: 100%; }
  .app-shell .usage-detail-filter-actions { flex: 1 1 100%; }
  .app-shell .usage-detail-filter-actions .secondary-button { flex: 1; }
}
.app-shell .usage-detail-section #usage-table { min-width: var(--usage-table-min-width,1220px); }
.app-shell #usage-table [data-usage-column][hidden] { display: none!important; }
.app-shell #usage-columns-button { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.app-shell #usage-columns-button svg { width: 15px; height: 15px; }
#usage-columns-dialog .provider-column-option { cursor: pointer; color: var(--glass-ink,#262626); font-size: 12px; }
#usage-columns-dialog .provider-column-option:has(input:checked) { background: rgba(235,240,246,.65); }
#usage-columns-dialog .provider-column-option:hover { background: rgba(222,232,242,.6); }
#usage-columns-error { margin: 12px 0 0; color: #a32929; font-size: 12px; }
#usage-columns-save:disabled { opacity: .5; cursor: not-allowed; }
.app-shell .usage-supplier-name { display: block; min-width: 80px; max-width: 180px; overflow-wrap: anywhere; }
.usage-supplier-identity { display: flex; align-items: center; gap: 8px; min-width: 100px; max-width: 210px; margin-block: 2px; }
.usage-supplier-identity .usage-supplier-logo { flex: 0 0 24px; width: 24px; height: 24px; border-radius: 6px; font-size: 9px; }
.usage-supplier-identity .usage-supplier-logo img { padding: 3px; }
.app-shell .usage-supplier-identity .usage-supplier-name { flex: 1; min-width: 0; max-width: none; font-weight: 500; line-height: 1.45; }
.usage-model-identity { display: flex; align-items: center; gap: 8px; min-width: 150px; max-width: 300px; margin-block: 2px; }
.usage-model-identity .usage-model-logo { flex: 0 0 24px; width: 24px; height: 24px; border-radius: 6px; font-size: 9px; }
.usage-model-identity .usage-model-logo img { padding: 3px; }
.usage-model-name { min-width: 0; line-height: 1.45; white-space: normal; overflow-wrap: anywhere; }
.app-shell .usage-detail-section .status-pill.error { border-color: #fecaca; background: #fef2f2; color: #b42318; }
.app-shell .usage-detail-section > .table-wrap > table > tbody > tr > td:is([data-usage-column="created"],:nth-last-child(-n+5)) { white-space: nowrap; }
.app-shell .usage-error-detail { display: block; min-width: 130px; max-width: 240px; margin-top: 6px; color: #b42318; font-size: 12px; line-height: 1.5; white-space: normal; overflow-wrap: anywhere; }

@media (max-width: 1180px) {
  .app-shell .usage-metrics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .app-shell .usage-chart-grid { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .app-shell .usage-filter-bar label { flex-basis: calc(50% - 8px); }
  .app-shell .usage-filter-bar label:has(input[type="datetime-local"]) { flex-basis: calc(50% - 8px); }
  .app-shell .usage-filter-bar .usage-reset { flex: 1 1 100%; }
}
@media (max-width: 560px) {
  .app-shell .usage-filter-bar { padding: 12px; }
  .app-shell .usage-filter-bar label,
  .app-shell .usage-filter-bar label:has(input[type="datetime-local"]) { flex-basis: 100%; }
  .app-shell .usage-metrics-grid { gap: 8px; }
  .app-shell .usage-metrics-grid article { min-height: 116px; gap: 10px; padding: 14px; }
  .app-shell .usage-metric-icon { flex-basis: 34px; width: 34px; height: 34px; }
  .app-shell .usage-metrics-grid strong { font-size: 19px; }
  .app-shell .usage-chart-card .section-title { align-items: flex-start; flex-direction: column; }
  .app-shell .usage-chart-legend { justify-content: flex-start; }
  .app-shell .usage-analytics-chart { min-height: 270px; padding-inline: 12px; }
  .app-shell .usage-chart-plot { height: 230px; gap: 4px; }
  .app-shell .usage-chart-bars { height: 190px; gap: 2px; }
}
/* Larger authenticated console typography. */
.app-shell { font-size: 16px; }
.app-shell .eyebrow { font-size: 12px; }
.app-shell .new-chat-button { font-size: 15px; }
.app-shell .console-nav p { font-size: 12px; }
.app-shell .console-nav button,
.app-shell .console-nav a { font-size: 15px; }
.app-shell .sidebar-status strong { font-size: 12px; }
.app-shell .sidebar-status small { font-size: 11px; }
.app-shell .breadcrumb { font-size: 12px; }
.app-shell .topbar-location > strong { font-size: 15px; }
.app-shell .balance-chip { font-size: 13px; }
.app-shell .balance-chip b { font-size: 13px; }
.app-shell .user-button b,
.app-shell .user-menu button { font-size: 14px; }
.app-shell .view-heading h1,
.app-shell .workspace-heading h1 { font-size: 34px; }
.app-shell .view-heading p:not(.eyebrow),
.app-shell .workspace-heading p:not(.eyebrow) { font-size: 16px; }
.app-shell .live-indicator { font-size: 14px; }
.app-shell input,
.app-shell select,
.app-shell textarea,
.app-shell .primary-button,
.app-shell .secondary-button { font-size: 15px; }
.app-shell .text-button,
.app-shell .icon-text-button { font-size: 14px; }
.app-shell .field-caption { font-size: 11px; }
.app-shell .model-picker select { font-size: 14px; }
.app-shell .segmented button { font-size: 13px; }
.app-shell .welcome-message p,
.app-shell .prompt-suggestions button { font-size: 15px; }
.app-shell .message-content,
.app-shell .composer-row textarea { font-size: 15px; }
.app-shell .message-meta { font-size: 11px; }
.app-shell .composer-footer { font-size: 12px; }
.app-shell .settings-panel-heading h2 { font-size: 18px; }
.app-shell .chat-settings-panel label { font-size: 14px; }
.app-shell .chat-settings-panel > p { font-size: 13px; }
.app-shell .metrics-grid article span { font-size: 14px; }
.app-shell .metrics-grid strong { font-size: 31px; }
.app-shell .metrics-grid small { font-size: 12px; }
.app-shell .section-title h2,
.app-shell .admin-form h2 { font-size: 18px; }
.app-shell .section-title p { font-size: 13px; }
.app-shell .quickstart-section > code { font-size: 12px; }
.app-shell .quickstart-section ol { font-size: 14px; }
.app-shell .notice { font-size: 14px; }
.app-shell th { font-size: 12px; }
.app-shell td { font-size: 14px; }
.app-shell td code { font-size: 12px; }
.app-shell .capability-pill,
.app-shell .status-pill { font-size: 11px; }
.app-shell .row-button { font-size: 12px; }
.app-shell .search-field { font-size: 13px; }
.app-shell .balance-band span { font-size: 14px; }
.app-shell .balance-band small { font-size: 13px; }
.app-shell .settings-form label,
.app-shell .admin-form label { font-size: 13px; }
.app-shell #profile-status { font-size: 12px; }
.app-shell .usage-filter-bar label { font-size: 12px; }
.app-shell .usage-filter-bar select,
.app-shell .usage-filter-bar input { font-size: 14px; }
.app-shell .usage-metrics-grid small { font-size: 13px; }
.app-shell .usage-metrics-grid strong { font-size: 25px; }
.app-shell .usage-metrics-grid em { font-size: 12px; }
.app-shell .usage-chart-legend { font-size: 11px; }
.app-shell .usage-chart-column > span { font-size: 10px; }
.app-shell .usage-chart-empty { font-size: 14px; }
dialog .dialog-heading h2 { font-size: 20px; }
dialog .dialog-body label,
dialog .dialog-body > p { font-size: 13px; }
dialog .primary-button,
dialog .secondary-button { font-size: 15px; }
.app-shell .toast,
.toast { font-size: 13px; }

@media (max-width: 560px) {
  .app-shell { font-size: 15px; }
  .app-shell .view-heading h1,
  .app-shell .workspace-heading h1 { font-size: 30px; }
  .app-shell .usage-metrics-grid strong { font-size: 21px; }
}
/* Customer access policy administration. */
.app-shell .customer-group-filter-bar { display: grid; grid-template-columns: minmax(260px,1fr) minmax(160px,220px) auto; align-items: end; gap: 12px; margin-bottom: 12px; }
.app-shell .customer-group-filter-bar label { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .customer-group-filter-bar input,
.app-shell .customer-group-filter-bar select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .customer-group-filter-summary { display: flex; min-height: 40px; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.app-shell .customer-group-filter-summary .icon-button { width: 40px; height: 40px; }
.app-shell .customer-group-table { min-width: 980px; }
.app-shell .group-default-limit-summary { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 4px; }
.app-shell .group-default-limit-summary > span { display: inline-flex; align-items: center; gap: 6px; padding: 4px 7px; border: 1px solid var(--line); border-radius: 5px; background: #fafafa; }
.app-shell .group-default-limit-summary small { color: var(--muted); font-size: 10px; }
.app-shell .group-default-limit-summary b { font-family: "Roboto Mono", monospace; font-size: 11px; }
.app-shell .customer-group-default-pill { margin-left: 5px; text-transform: none; }
.app-shell .customer-group-override-summary { display: flex; align-items: baseline; gap: 8px; margin-bottom: 5px; }
.app-shell .customer-group-override-summary strong { color: var(--ink); font-size: 12px; }
.app-shell .customer-group-override-summary span { color: var(--muted); font-size: 10px; }
.app-shell .policy-model-pill { display: inline-flex; max-width: 190px; align-items: center; gap: 5px; margin: 2px 4px 2px 0; padding: 4px 7px; border: 1px solid #b8dcf7; border-radius: 5px; background: #eef8ff; color: #075ea4; font-size: 11px; white-space: nowrap; }
.app-shell .policy-model-pill { overflow: hidden; text-overflow: ellipsis; }
.app-shell .policy-model-pill b { font-family: "Roboto Mono", monospace; font-weight: 600; }
.app-shell .customer-pricing-table { min-width: 860px; }
.app-shell .customer-pricing-table .row-actions { min-width: 72px; justify-content: flex-end; }
.app-shell .customer-pricing-table .row-actions .icon-button { width: 32px; height: 32px; flex: 0 0 32px; }
.customer-discount-dialog { --ink: #171717; --muted: #525252; --line: #d4d4d4; --line-strong: #a3a3a3; width: min(520px,calc(100vw - 32px)); color: var(--ink); }
.customer-discount-edit-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 18px 0; border: 1px solid var(--line); border-radius: 6px; background: #f7f8fa; }
.customer-discount-edit-summary > div { display: grid; min-width: 0; gap: 5px; padding: 13px 12px; border-right: 1px solid var(--line); }
.customer-discount-edit-summary > div:last-child { border-right: 0; }
.customer-discount-edit-summary dt { color: var(--muted); font-size: 10px; font-weight: 600; }
.customer-discount-edit-summary dd { margin: 0; overflow: hidden; color: var(--ink); font-size: 12px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.customer-discount-dialog label { display: grid; gap: 7px; color: var(--muted); font-size: 11px; font-weight: 600; }
.customer-discount-dialog label small { color: var(--muted); font-size: 10px; font-weight: 400; line-height: 1.4; }
.customer-discount-dialog input { width: 100%; min-height: 42px; }
.customer-discount-dialog .dialog-error { min-height: 18px; }
.app-shell .customer-group-pagination { margin-top: 12px; }

dialog.customer-group-drawer { width: min(920px,100vw); height: 100dvh; max-width: 100vw; max-height: 100dvh; margin: 0 0 0 auto; padding: 0; overflow: hidden; border: 0; border-left: 1px solid #e5e7eb; border-radius: 0; background: #fff; color: var(--ink); box-shadow: -18px 0 48px rgba(15,23,42,.12); }
dialog.customer-group-drawer[open] { display: block; animation: customer-group-drawer-enter .18s ease-out; }
dialog.customer-group-drawer::backdrop { background: rgba(15,23,42,.34); }
@keyframes customer-group-drawer-enter { from { transform: translateX(32px); opacity: .72; } to { transform: translateX(0); opacity: 1; } }
.customer-group-drawer .customer-group-form { display: grid; grid-template-rows: auto minmax(0,1fr) auto; width: 100%; height: 100%; min-height: 0; margin: 0; }
.customer-group-drawer-header { display: flex; min-height: 82px; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 17px 22px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.96); }
.customer-group-drawer-title { display: flex; min-width: 0; align-items: flex-start; gap: 12px; }
.customer-group-drawer-title > span,
.customer-group-section-heading > span { display: grid; flex: 0 0 auto; width: 36px; height: 36px; place-items: center; border: 1px solid #b8dcf7; border-radius: 7px; background: #eef8ff; color: #075ea4; }
.customer-group-drawer-title svg,
.customer-group-section-heading svg { width: 18px; height: 18px; }
.customer-group-drawer-title > div { min-width: 0; }
.customer-group-drawer-title h2 { margin: 0; font-size: 18px; line-height: 1.25; }
.customer-group-drawer-title p { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.customer-group-drawer-header > .icon-button { flex: 0 0 auto; width: 36px; height: 36px; }
.customer-group-drawer-content { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 20px 22px 28px; }
.customer-group-drawer-section { display: grid; gap: 16px; padding: 0 0 22px; border-bottom: 1px solid var(--line); }
.customer-group-drawer-section + .customer-group-drawer-section { padding-top: 22px; }
.customer-group-drawer-section:last-child { padding-bottom: 0; border-bottom: 0; }
.customer-group-section-heading { display: flex; min-width: 0; align-items: flex-start; gap: 11px; }
.customer-group-section-heading > div { min-width: 0; flex: 1; }
.customer-group-section-heading h3 { margin: 1px 0 0; font-size: 14px; }
.customer-group-section-heading p { margin: 4px 0 0; color: var(--muted); font-size: 11px; line-height: 1.45; }
.customer-group-section-heading > strong { flex: 0 0 auto; align-self: center; color: #075ea4; font-size: 11px; }
.customer-group-identity-grid { display: grid; grid-template-columns: minmax(220px,.8fr) minmax(0,1.2fr); gap: 12px; }
.customer-group-drawer label { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.customer-group-drawer input,
.customer-group-drawer select,
.customer-group-drawer textarea { width: 100%; min-width: 0; border-color: var(--line-strong); background: #fff; color: var(--ink); }
.customer-group-drawer input,
.customer-group-drawer select { min-height: 40px; }
.customer-group-drawer textarea { min-height: 78px; padding: 10px 11px; resize: vertical; }
.customer-group-drawer label small { color: var(--muted); font-size: 9px; font-weight: 400; line-height: 1.35; }
.customer-group-drawer .group-default-limit-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.group-model-workspace { display: grid; grid-template-columns: minmax(270px,320px) minmax(0,1fr); min-height: 520px; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.group-model-browser { display: grid; grid-template-rows: auto minmax(0,1fr) auto; min-width: 0; border-right: 1px solid var(--line); background: #fafafa; }
.group-model-browser-toolbar { display: grid; gap: 10px; padding: 12px; border-bottom: 1px solid var(--line); background: #fff; }
.group-model-browser-toolbar .segmented { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); padding: 3px; border: 1px solid var(--line); border-radius: 6px; background: #f5f5f5; }
.group-model-browser-toolbar .segmented button { min-height: 30px; padding: 5px 9px; border: 0; border-radius: 4px; background: transparent; color: var(--muted); font-size: 11px; font-weight: 600; }
.group-model-browser-toolbar .segmented button.active { background: #fff; color: var(--ink); box-shadow: 0 1px 2px rgba(15,23,42,.08); }
.group-model-search,
.group-provider-search { position: relative; }
.group-model-search svg,
.group-provider-search svg { position: absolute; z-index: 1; left: 11px; top: 50%; width: 15px; height: 15px; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.customer-group-drawer .group-model-search input,
.customer-group-drawer .group-provider-search input { min-height: 36px; padding-left: 34px; font-size: 11px; }
.group-model-policy-list { min-height: 0; overflow-y: auto; }
.group-model-option { display: grid; grid-template-columns: minmax(0,1fr) 34px; align-items: center; min-height: 66px; border-bottom: 1px solid var(--line); }
.group-model-option:last-child { border-bottom: 0; }
.group-model-option.active { background: #eef8ff; box-shadow: inset 3px 0 #0b75bd; }
.group-model-option-main { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; min-width: 0; min-height: 65px; align-items: center; gap: 9px; padding: 8px 7px 8px 11px; border: 0; background: transparent; color: inherit; text-align: left; }
.group-model-option:not(.active) .group-model-option-main:hover { background: #f5faff; }
.group-model-option-logo,
.group-model-editor-logo { display: grid; width: 34px; height: 34px; place-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.group-model-option-logo .logo-preview,
.group-model-editor-logo .logo-preview { width: 23px; height: 23px; border: 0; border-radius: 4px; }
.group-model-option-copy,
.group-model-editor-header > div,
.group-provider-option-name { display: grid; min-width: 0; gap: 3px; }
.group-model-option-copy strong,
.group-model-option-copy code,
.group-model-editor-header strong,
.group-model-editor-header code,
.group-provider-option-name strong,
.group-provider-option-name code { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.group-model-option-copy strong,
.group-model-editor-header strong,
.group-provider-option-name strong { color: var(--ink); font-size: 12px; }
.group-model-option-copy code,
.group-model-editor-header code,
.group-provider-option-name code { color: var(--muted); font-size: 9px; }
.group-model-option-meta { display: grid; justify-items: end; gap: 3px; white-space: nowrap; }
.group-model-option-meta small { color: var(--muted); font-size: 9px; }
.group-model-option-meta b { color: #075ea4; font-size: 9px; }
.group-model-option > .icon-button { width: 30px; min-width: 30px; height: 30px; margin-right: 4px; }
.group-model-pagination,
.group-provider-pagination { display: flex; min-height: 48px; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 11px; border-top: 1px solid var(--line); background: #fff; color: var(--muted); font-size: 10px; }
.group-model-pagination > div,
.group-provider-pagination > div { display: flex; gap: 5px; }
.group-model-pagination .icon-button,
.group-provider-pagination .icon-button { width: 32px; height: 32px; }
.group-model-browser-empty,
.group-provider-browser-empty,
.group-model-editor-empty { display: grid; min-height: 180px; place-items: center; align-content: center; gap: 7px; padding: 24px; color: var(--muted); text-align: center; }
.group-model-browser-empty svg,
.group-provider-browser-empty svg,
.group-model-editor-empty svg { width: 24px; height: 24px; color: #9ca3af; }
.group-model-browser-empty strong,
.group-provider-browser-empty strong,
.group-model-editor-empty strong { color: var(--ink); font-size: 12px; }
.group-model-browser-empty span,
.group-provider-browser-empty span,
.group-model-editor-empty span { max-width: 270px; font-size: 10px; line-height: 1.45; }
.group-model-policy-editor { min-width: 0; background: #fff; }
.group-model-editor-header { display: grid; grid-template-columns: 38px minmax(0,1fr) 34px; align-items: center; gap: 10px; min-height: 70px; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.group-model-editor-header > .icon-button { width: 34px; height: 34px; }
.group-model-policy-controls { display: grid; grid-template-columns: minmax(90px,.7fr) minmax(120px,1fr) minmax(110px,.8fr) minmax(130px,1fr); gap: 10px; padding: 14px; border-bottom: 1px solid var(--line); background: #fafafa; }
.group-provider-browser { display: grid; }
.group-provider-browser-heading { display: grid; grid-template-columns: minmax(0,1fr) minmax(180px,240px); align-items: end; gap: 12px; padding: 14px; border-bottom: 1px solid var(--line); }
.group-provider-browser-heading > div { display: grid; gap: 3px; }
.group-provider-browser-heading strong { font-size: 12px; }
.group-provider-browser-heading span { color: var(--muted); font-size: 10px; line-height: 1.4; }
.group-provider-discount-list { min-height: 300px; }
.group-provider-option { display: grid; grid-template-columns: minmax(0,1fr) 112px 34px; min-height: 64px; align-items: end; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--line); }
.group-provider-option.configured { background: #f5fbff; }
.group-provider-option > label { gap: 3px; }
.customer-group-drawer .group-provider-option input { min-height: 34px; padding: 7px 8px; font-size: 11px; }
.group-provider-option > .icon-button { width: 34px; height: 34px; }
.customer-group-drawer-footer { display: flex; min-height: 72px; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 22px; border-top: 1px solid var(--line); background: rgba(255,255,255,.97); }
.customer-group-drawer-footer .dialog-error { min-width: 0; margin: 0; color: #b42318; font-size: 11px; }
.customer-group-drawer-footer > div { display: flex; flex: 0 0 auto; gap: 8px; }
.customer-group-drawer-footer button { min-height: 38px; }
.app-shell .customer-pricing-filter-bar { display: grid; grid-template-columns: minmax(250px,1.4fr) repeat(3,minmax(140px,1fr)) auto; align-items: end; gap: 12px; margin-bottom: 12px; }
.app-shell .customer-pricing-filter-bar label { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .customer-pricing-filter-bar input,
.app-shell .customer-pricing-filter-bar select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .customer-pricing-filter-summary { display: flex; min-height: 40px; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.app-shell .customer-pricing-filter-summary .icon-button { flex: 0 0 auto; width: 40px; height: 40px; }
.app-shell .customer-pricing-filter-summary .icon-button svg { width: 16px; height: 16px; }
.app-shell .model-discounts-table { min-width: 1120px; }
.app-shell .model-discounts-filter-bar { display: grid; grid-template-columns: minmax(240px,2fr) repeat(2,minmax(140px,1fr)); align-items: end; gap: 14px; padding: 18px 20px; }
.app-shell .model-discounts-filter-bar > label { display: grid; min-width: 0; gap: 7px; font-size: 12px; color: var(--muted); }
.app-shell .model-discounts-filter-bar input,.app-shell .model-discounts-filter-bar select { width: 100%; min-width: 0; min-height: 40px; }
.app-shell .model-discounts-search-input { position: relative; display: flex; align-items: center; }
.app-shell .model-discounts-search-input > svg { position: absolute; left: 12px; width: 16px; height: 16px; pointer-events: none; }
.app-shell .model-discounts-search-input > input { padding-left: 37px; }
.app-shell .model-discounts-filter-summary { display: flex; grid-column: 1/-1; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; font-size: 12px; color: var(--muted); }
.app-shell .model-discounts-filter-summary .secondary-button { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; }
.app-shell .model-discounts-filter-summary svg { width: 15px; height: 15px; }
.app-shell .model-discount-supplier { display: flex; align-items: center; gap: 10px; }
.app-shell .model-discount-supplier > .admin-table-logo { flex: 0 0 30px; width: 30px; height: 30px; }
.app-shell .model-discount-supplier > span:last-child { display: grid; gap: 4px; min-width: 0; }
.app-shell .model-discounts-section .empty-row p { margin: 8px 0 0; color: var(--muted); }
@media (max-width: 1180px) {
  .app-shell .model-discounts-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .model-discounts-search { grid-column: 1/-1; }
}
@media (max-width: 560px) {
  .app-shell .model-discounts-filter-bar { grid-template-columns: minmax(0,1fr); padding-inline: 14px; }
  .app-shell .model-discounts-filter-bar input,.app-shell .model-discounts-filter-bar select { min-height: 44px; font-size: 16px; }
}
.app-shell .model-price-stack { display: grid; gap: 2px; white-space: nowrap; }
.app-shell .model-price-stack strong { color: var(--ink); font-family: "Roboto Mono", monospace; font-size: 12px; }
.app-shell .model-price-stack small { color: var(--muted); font-size: 10px; text-decoration: line-through; }
.app-shell .model-discounts-section .status-pill { white-space: nowrap; }
.app-shell .model-discount-sources { display: grid; gap: 9px; }
.app-shell .model-discount-sources > div { display: grid; justify-items: start; gap: 3px; }
@media (max-width: 1180px) {
  .app-shell .customer-pricing-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .customer-pricing-search,
  .app-shell .customer-pricing-filter-summary { grid-column: 1/-1; }
}
@media (max-width: 820px) {
  .app-shell .customer-group-filter-bar { grid-template-columns: 1fr 180px; }
  .app-shell .customer-group-filter-summary { grid-column: 1/-1; }
  dialog.customer-group-drawer { width: 100vw; }
  .group-model-workspace { grid-template-columns: 1fr; }
  .group-model-browser { min-height: 390px; border-right: 0; border-bottom: 1px solid var(--line); }
  .group-model-policy-editor { min-height: 480px; }
}
@media (max-width: 560px) {
  .app-shell .customer-group-filter-bar { grid-template-columns: 1fr; }
  .app-shell .customer-group-filter-bar > * { grid-column: 1; }
  .customer-group-drawer-header,
  .customer-group-drawer-footer { padding-inline: 14px; }
  .customer-group-drawer-content { padding-inline: 14px; }
  .customer-group-identity-grid,
  .customer-group-drawer .group-default-limit-grid,
  .group-model-policy-controls,
  .group-provider-browser-heading { grid-template-columns: 1fr; }
  .group-model-workspace { min-height: 0; }
  .group-provider-option { grid-template-columns: minmax(0,1fr) 96px 34px; }
  .customer-group-drawer-footer { align-items: stretch; flex-direction: column; }
  .customer-group-drawer-footer > div { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .customer-pricing-filter-bar { grid-template-columns: 1fr; }
  .app-shell .customer-pricing-filter-bar > * { grid-column: 1; }
  .customer-discount-edit-summary { grid-template-columns: 1fr; }
  .customer-discount-edit-summary > div { padding: 10px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .customer-discount-edit-summary > div:last-child { border-bottom: 0; }
}
.app-shell .key-list-section table { min-width: 1320px; }

/* Subscription plan and customer entitlement administration. */
.app-shell .subscription-plan-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.app-shell .subscription-plan-summary { padding-bottom: 11px; color: var(--muted); font-size: 13px; white-space: nowrap; }
.app-shell .subscription-plan-sort-control { display: grid; width: min(100%,280px); min-width: 0; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .subscription-plan-sort-input { display: grid; grid-template-columns: minmax(0,1fr) 40px; gap: 6px; }
.app-shell .subscription-plan-sort-input select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .subscription-plan-sort-input .icon-button { width: 40px; height: 40px; border-color: var(--line-strong); background: #fff; }
.app-shell .subscription-plan-sort-input .icon-button:hover { border-color: #a7d3f2; background: #f5fbff; color: var(--accent); }
.app-shell .subscription-plan-sort-input .icon-button svg { width: 16px; height: 16px; }
.app-shell .subscription-plan-table { min-width: var(--subscription-plan-table-min-width,1440px); }
.app-shell .subscription-plan-table .subscription-plan-column-hidden { display: none!important; }
.app-shell .subscription-plan-table td[data-subscription-plan-column="plan"] { min-width: 210px; }
.app-shell .subscription-plan-table td[data-subscription-plan-column="id"],
.app-shell .subscription-plan-table td[data-subscription-plan-column="price"],
.app-shell .subscription-plan-table td[data-subscription-plan-column="type"],
.app-shell .subscription-plan-table td[data-subscription-plan-column="quota"],
.app-shell .subscription-plan-table td[data-subscription-plan-column="models"],
.app-shell .subscription-plan-table td[data-subscription-plan-column="duration"],
.app-shell .subscription-plan-table td[data-subscription-plan-column="priority"],
.app-shell .subscription-plan-table td[data-subscription-plan-column="assignments"] { white-space: nowrap; }
.app-shell .subscription-quota-stack { display: grid; gap: 4px; }
.app-shell .subscription-quota-stack > span { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.app-shell .subscription-quota-stack small { color: var(--muted); font-size: 10px; font-weight: 650; text-transform: uppercase; }
.app-shell .subscription-quota-stack b { font: 600 11px "Roboto Mono",monospace; }
.app-shell .subscription-billing-pill.usage { border-color: #bae6fd; background: #f0f9ff; color: #075985; }
.app-shell .subscription-billing-pill.request { border-color: #bbf7d0; background: #f0fdf4; color: #166534; }
.app-shell .subscription-plan-id-cell { display: inline-block; overflow: hidden; max-width: 175px; text-overflow: ellipsis; vertical-align: bottom; }
.app-shell .subscription-plan-row-quick-actions { justify-content: flex-end; }
.app-shell .subscription-plan-row-quick-actions .icon-button { width: 34px; height: 34px; }
.app-shell .subscription-plan-row-quick-actions .icon-button svg { width: 16px; height: 16px; }
.app-shell .subscription-plan-pagination { display: flex; min-height: 54px; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.app-shell .subscription-plan-pagination > div { display: flex; align-items: center; gap: 7px; }
.app-shell .subscription-plan-pagination label { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; font-weight: 600; }
.app-shell .subscription-plan-pagination select { width: 70px; min-height: 36px; border-color: var(--line-strong); background: #fff; font-size: 12px; }
.app-shell .subscription-plan-pagination .icon-button { width: 36px; height: 36px; }
dialog.subscription-plan-dialog { width: min(920px,100vw); }
dialog.user-subscriptions-dialog { width: min(820px,100vw); }
.subscription-plan-row-actions-dialog { width: min(480px,100vw); }
.subscription-billing-mode { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; margin-bottom: 18px; padding: 5px; border: 1px solid #e5e5e5; border-radius: 7px; background: #f5f5f5; }
.subscription-billing-mode label { position: relative; min-width: 0; cursor: pointer; }
.subscription-billing-mode input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.subscription-billing-mode span { display: grid; min-height: 64px; align-content: center; gap: 3px; padding: 10px 13px; border: 1px solid transparent; border-radius: 5px; color: #737373; }
.subscription-billing-mode strong { color: inherit; font-size: 13px; }
.subscription-billing-mode small { color: inherit; font-size: 11px; font-weight: 450; }
.subscription-billing-mode input:checked + span { border-color: #0a0a0a; background: #fff; color: #0a0a0a; box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.subscription-billing-mode input:focus-visible + span { outline: 3px solid rgba(11,132,220,.18); outline-offset: 1px; }
.subscription-commercial-grid .provider-switch-field { grid-column: 1/-1; }
.subscription-quota-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 20px 0 9px; }
.subscription-quota-heading strong { font-size: 12px; }
.subscription-quota-heading small { color: #737373; font-size: 11px; text-align: right; }
.subscription-quota-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.subscription-quota-grid label { display: grid; min-width: 0; gap: 7px; color: #737373; font-size: 12px; font-weight: 600; }
.subscription-quota-grid input { width: 100%; min-width: 0; }
.subscription-model-access { margin-top: 0; }
.subscription-model-access .key-model-list { max-height: 280px; overflow-y: auto; }
.user-subscriptions-content { display: grid; align-content: start; gap: 18px; padding: 24px; }
.subscription-assignment-form { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 10px; padding-bottom: 18px; border-bottom: 1px solid #e5e5e5; }
.subscription-assignment-form label { display: grid; gap: 7px; color: #525252; font-size: 12px; font-weight: 600; }
.subscription-assignment-form select { min-height: 42px; border-color: #d4d4d4; background: #fff; }
.subscription-assignment-form .primary-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.subscription-assignment-form svg { width: 16px; height: 16px; }
.user-subscription-list { display: grid; gap: 10px; }
.user-subscription-item { display: grid; gap: 14px; padding: 16px; border: 1px solid #d4d4d4; border-radius: 8px; background: #fff; }
.user-subscription-item.inactive { background: #fafafa; opacity: .78; }
.user-subscription-heading { display: flex; min-width: 0; align-items: flex-start; justify-content: space-between; gap: 14px; }
.user-subscription-heading > div { display: flex; min-width: 0; align-items: center; gap: 8px; }
.user-subscription-heading strong { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.user-subscription-heading code { overflow: hidden; max-width: 240px; color: #737373; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.user-subscription-quota-list { display: grid; border-block: 1px solid #e5e5e5; }
.user-subscription-quota-row { display: grid; grid-template-columns: minmax(0,1fr) 150px 155px; align-items: center; gap: 14px; padding: 10px 0; }
.user-subscription-quota-row + .user-subscription-quota-row { border-top: 1px solid #e5e5e5; }
.user-subscription-quota-row > span { display: grid; min-width: 0; gap: 2px; }
.user-subscription-quota-row small { color: #737373; font-size: 9px; font-weight: 700; text-transform: uppercase; }
.user-subscription-quota-row b { font-size: 12px; }
.user-subscription-quota-row em { overflow: hidden; color: #737373; font-size: 10px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.user-subscription-quota-row > i { display: block; height: 7px; overflow: hidden; border-radius: 4px; background: #e5e5e5; }
.user-subscription-quota-row > i > b { display: block; height: 100%; border-radius: inherit; background: #1687e8; }
.user-subscription-quota-row time { color: #737373; font-size: 10px; text-align: right; }
.user-subscription-unlimited { display: grid; gap: 3px; padding: 12px 0; }
.user-subscription-unlimited strong { font-size: 12px; }
.user-subscription-unlimited small { color: #737373; font-size: 11px; }
.user-subscription-item dl { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin: 0; }
.user-subscription-item dl > div { display: grid; min-width: 0; gap: 3px; }
.user-subscription-item dt { color: #737373; font-size: 10px; text-transform: uppercase; }
.user-subscription-item dd { overflow: hidden; margin: 0; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.user-subscription-item > .row-actions { justify-content: flex-end; }

@media (max-width: 700px) {
  .app-shell .subscription-plan-toolbar { align-items: stretch; flex-direction: column; }
  .app-shell .subscription-plan-sort-control { width: 100%; }
  .app-shell .subscription-plan-summary { padding-bottom: 0; }
  .app-shell .subscription-plan-pagination { align-items: stretch; flex-direction: column; padding: 12px 0; }
  .app-shell .subscription-plan-pagination > div { justify-content: space-between; }
  .user-subscriptions-content { padding: 18px 14px; }
  .subscription-quota-grid { grid-template-columns: 1fr; }
  .subscription-quota-heading { align-items: flex-start; flex-direction: column; gap: 4px; }
  .subscription-quota-heading small { text-align: left; }
  .subscription-assignment-form { grid-template-columns: 1fr; }
  .subscription-assignment-form .primary-button { width: 100%; }
  .user-subscription-heading { flex-direction: column; gap: 6px; }
  .user-subscription-heading code { max-width: 100%; }
  .user-subscription-quota-row { grid-template-columns: 1fr; gap: 7px; }
  .user-subscription-quota-row time { text-align: left; }
  .user-subscription-item dl { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 560px) {
  .provider-test-grid { grid-template-columns: 1fr; }
  .provider-columns-list { grid-template-columns: 1fr; }
  dialog .provider-column-option:nth-child(odd) { border-right: 0; }
  .provider-columns-actions { grid-template-columns: 1fr 1fr; }
  .provider-columns-actions > span { display: none; }
  .provider-columns-actions button { width: 100%; justify-content: center; }
  .provider-key-pool-toolbar { grid-template-columns: minmax(0,1fr) auto; }
  .provider-key-pool-toolbar > div { grid-column: 1/-1; }
  .provider-key-pool-toolbar .secondary-button { flex: 1; justify-content: center; }
  .key-budget-grid { grid-template-columns: 1fr; }
  .user-balance-summary > div { align-items: stretch; flex-direction: column; }
  .user-balance-summary button { width: 100%; justify-content: center; }
  .user-balance-preview { grid-template-columns: 1fr; }
}

/* Expanded AI workspace with persistent request parameters. */
.app-shell .playground-split-workspace {
  display: grid;
  height: calc(100vh - 245px);
  height: calc(100dvh - 245px);
  min-height: 600px;
  max-height: 900px;
  grid-template-columns: 330px minmax(0,1fr);
}
.app-shell .playground-parameters {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-rows: auto minmax(0,1fr) auto;
  border-right: 1px solid var(--line);
  background: #fafafa;
}
.app-shell .playground-parameters-heading {
  display: flex;
  min-height: 74px;
  align-items: center;
  gap: 11px;
  padding: 14px 17px;
  border-bottom: 1px solid var(--line);
}
.app-shell .playground-parameters-heading > span {
  display: grid;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid #b8dcf7;
  border-radius: 7px;
  background: #eaf6ff;
  color: #075ea4;
}
.app-shell .playground-parameters-heading svg { width: 17px; height: 17px; }
.app-shell .playground-parameters-heading h2 { margin: 3px 0 0; font-size: 15px; letter-spacing: 0; }
.app-shell .playground-parameters-heading p { margin: 0; }
.app-shell .playground-parameters-body { min-height: 0; overflow-y: auto; scrollbar-color: #d4d4d4 transparent; }
.app-shell .playground-parameter-section {
  display: grid;
  min-width: 0;
  gap: 15px;
  margin: 0;
  padding: 18px 17px;
  border: 0;
  border-bottom: 1px solid var(--line);
}
.app-shell fieldset.playground-parameter-section { padding-top: 15px; }
.app-shell .playground-parameter-section legend {
  padding: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.app-shell .playground-parameter-section label,
.app-shell .playground-parameter-section .protocol-picker {
  display: grid;
  width: 100%;
  min-width: 0;
  gap: 7px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
}
.app-shell .playground-parameter-section input,
.app-shell .playground-parameter-section select,
.app-shell .playground-parameter-section textarea {
  width: 100%;
  min-width: 0;
  border-color: var(--line-strong);
  background: #fff;
  color: var(--ink);
}
.app-shell .playground-parameter-section input,
.app-shell .playground-parameter-section select { min-height: 40px; }
.app-shell .playground-parameter-section textarea { min-height: 112px; resize: vertical; }
.app-shell .playground-parameter-section .segmented { display: flex; width: 100%; overflow: hidden; background: #f0f0f0; }
.app-shell .playground-parameter-section .segmented button { flex: 1; min-width: 0; padding-inline: 5px; }
.app-shell .playground-parameter-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.app-shell .playground-parameter-grid input { font-size: 10px; }
.app-shell .playground-authentication p { margin: -4px 0 0; color: var(--faint); font-size: 10px; line-height: 1.5; }
.app-shell .playground-parameter-status {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 11px 17px;
  border-top: 1px solid var(--line);
  background: #fff;
}
.app-shell .playground-parameter-status span {
  overflow: hidden;
  color: var(--muted);
  font: 10px "Roboto Mono",monospace;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.app-shell .playground-parameter-status strong { color: #08745f; font-size: 11px; white-space: nowrap; }
.app-shell .playground-conversation {
  display: grid;
  min-width: 0;
  min-height: 0;
  grid-template-rows: auto minmax(0,1fr) auto;
  background: #fff;
}
.app-shell .playground-conversation-toolbar {
  display: flex;
  min-height: 58px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 18px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}
.app-shell .playground-conversation-toolbar > strong { font-size: 13px; }
.app-shell .playground-conversation-toolbar .icon-text-button { display: inline-flex; align-items: center; gap: 7px; }
.app-shell .playground-conversation-toolbar svg { width: 15px; height: 15px; }
.app-shell .playground-conversation .chat-stage {
  height: auto;
  min-height: 0;
  max-height: none;
  padding: 30px clamp(24px,6vw,92px) 38px;
}
.app-shell .playground-conversation .welcome-message { min-height: 100%; }
.app-shell .playground-conversation .composer-shell { padding: 15px 18px 17px; }
.app-shell .playground-conversation .composer-row { width: 100%; max-width: 1040px; min-height: 96px; padding: 12px 12px 10px 15px; }
.app-shell .playground-conversation .composer-row textarea { min-height: 70px; line-height: 1.55; }

@media (max-width: 1100px) {
  .app-shell .playground-split-workspace { height: auto; max-height: none; grid-template-columns: 1fr; }
  .app-shell .playground-parameters { border-right: 0; border-bottom: 1px solid var(--line); }
  .app-shell .playground-parameters-body { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); overflow: visible; }
  .app-shell .playground-parameter-section { border-right: 1px solid var(--line); }
  .app-shell .playground-parameter-section:nth-child(even) { border-right: 0; }
  .app-shell .playground-parameter-status { border-top: 0; }
  .app-shell .playground-conversation { min-height: 620px; }
}

@media (max-width: 620px) {
  .app-shell .playground-parameters-body { grid-template-columns: 1fr; }
  .app-shell .playground-parameter-section { border-right: 0; }
  .app-shell .playground-parameter-grid { grid-template-columns: 1fr; }
  .app-shell .playground-conversation { min-height: 560px; }
  .app-shell .playground-conversation-toolbar { padding-inline: 13px; }
  .app-shell .playground-conversation .chat-stage { padding: 22px 13px 28px; }
  .app-shell .playground-conversation .composer-shell { padding: 12px; }
  .app-shell .playground-conversation .composer-row { min-height: 88px; }
}

/* Desktop sidebar collapse control and icon-only state. */
.app-shell .sidebar-header {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
}
.app-shell .sidebar-header .console-brand {
  min-width: 0;
  min-height: 44px;
  flex: 1 1 auto;
  padding: 0;
}
.app-shell .sidebar-collapse-button {
  display: grid;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: #fff;
  color: var(--muted);
}
.app-shell .sidebar-collapse-button:hover { border-color: #a3a3a3; background: #f5f5f5; color: var(--ink); }
.app-shell .sidebar-collapse-button svg { width: 17px; height: 17px; }
.app-shell .sidebar-collapse-button .sidebar-collapse-collapsed { display: none; }

.app-shell .sidebar-footer { flex: 0 0 auto; margin-top: auto; padding-top: 18px; }
.app-shell .sidebar-community-link { display: flex; align-items: center; gap: 9px; min-height: 42px; padding: 6px 9px; border: 1px solid #e5e7eb; border-radius: 10px; background: #fafafa; color: #525252; font-size: 12px; font-weight: 500; text-decoration: none; cursor: pointer; }
.app-shell .sidebar-community-link:hover { border-color: #d4d4d4; background: #f5f5f5; color: #171717; }
.app-shell .sidebar-community-link:focus-visible { outline: 2px solid #525252; outline-offset: 3px; }
.app-shell .sidebar-community-icon { display: grid; flex: 0 0 28px; width: 28px; height: 28px; place-items: center; border: 1px solid #ededed; border-radius: 8px; background: #fff; }
.app-shell .sidebar-community-icon img { display: block; width: 17px; height: 17px; }
.app-shell .sidebar-community-label { min-width: 0; overflow-wrap: anywhere; }
.app-shell .sidebar-community-external { flex: 0 0 13px; width: 13px; height: 13px; margin-left: auto; color: #a3a3a3; }
.app-shell .sidebar-footer .sidebar-status { margin-top: 12px; padding: 14px 9px 3px; }

@media (min-width: 821px) {
  .app-shell .sidebar { transition: width .2s ease,padding .2s ease; }
  .app-shell .console-main { transition: margin-left .2s ease; }
  body.sidebar-collapsed .app-shell { --sidebar: 78px; }
  body.sidebar-collapsed .app-shell .sidebar { padding-inline: 10px; }
  body.sidebar-collapsed .app-shell .sidebar-header { justify-content: center; gap: 4px; }
  body.sidebar-collapsed .app-shell .sidebar-header .console-brand { flex: 0 0 28px; justify-content: center; }
  body.sidebar-collapsed .app-shell .console-brand strong,
  body.sidebar-collapsed .app-shell .console-brand span:last-child,
  body.sidebar-collapsed .app-shell .console-nav p,
  body.sidebar-collapsed .app-shell .console-nav .admin-nav-toggle > span,
  body.sidebar-collapsed .app-shell .console-nav .admin-nav-chevron,
  body.sidebar-collapsed .app-shell .sidebar-status span { display: none; }
  body.sidebar-collapsed .app-shell .sidebar-collapse-button { flex-basis: 30px; width: 30px; height: 34px; }
  body.sidebar-collapsed .app-shell .sidebar-collapse-button .sidebar-collapse-expanded { display: none; }
  body.sidebar-collapsed .app-shell .sidebar-collapse-button .sidebar-collapse-collapsed { display: block; }
  body.sidebar-collapsed .app-shell .new-chat-button {
    width: 44px;
    min-height: 44px;
    justify-content: center;
    gap: 0;
    margin-inline: auto;
    padding: 0;
    font-size: 0;
  }
  body.sidebar-collapsed .app-shell .console-nav { margin-top: 18px; }
  body.sidebar-collapsed .app-shell .console-nav button,
  body.sidebar-collapsed .app-shell .console-nav a {
    min-height: 42px;
    justify-content: center;
    gap: 0;
    padding-inline: 0;
    font-size: 0;
  }
  body.sidebar-collapsed .app-shell .console-nav button svg,
  body.sidebar-collapsed .app-shell .console-nav a svg { width: 19px; height: 19px; }
  body.sidebar-collapsed .app-shell .admin-subnav {
    margin: 2px 0 5px;
    padding: 3px 0;
    border-left: 0;
  }
  body.sidebar-collapsed .app-shell .console-nav .admin-subnav button { min-height: 38px; padding: 0; font-size: 0; }
  body.sidebar-collapsed .app-shell .console-nav .admin-subnav button svg { width: 17px; height: 17px; }
  body.sidebar-collapsed .app-shell .sidebar-status { justify-content: center; gap: 0; padding-inline: 0; }
  body.sidebar-collapsed .app-shell .sidebar-status i { flex: 0 0 7px; }
  body.sidebar-collapsed .app-shell .sidebar-community-link { justify-content: center; width: 44px; margin-inline: auto; gap: 0; padding: 7px; }
  body.sidebar-collapsed .app-shell .sidebar-community-label,
  body.sidebar-collapsed .app-shell .sidebar-community-external { display: none; }
}

@media (max-width: 820px) {
  .app-shell .sidebar-header { margin-bottom: 18px; }
  .app-shell .sidebar-collapse-button { display: none; }
}

/* Searchable and paginated user preference modules. */
.app-shell .user-settings-form { display: grid; min-width: 0; gap: 16px; }
.app-shell .user-settings-layout { display: grid; grid-template-columns: minmax(210px,240px) minmax(0,1fr); align-items: start; gap: 22px; }
.app-shell .user-settings-sidebar { position: sticky; top: 92px; display: grid; gap: 10px; min-width: 0; padding: 13px 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.03); }
.app-shell .user-settings-sidebar > p { margin: 0 5px 3px; color: var(--muted); font-size: 11px; font-weight: 750; text-transform: uppercase; }
.app-shell .user-settings-sidebar nav { display: grid; gap: 6px; }
.app-shell .user-settings-sidebar button { display: grid; grid-template-columns: 22px minmax(0,1fr) auto; min-width: 0; min-height: 48px; align-items: center; gap: 11px; padding: 10px 9px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: #525252; font: inherit; text-align: left; cursor: pointer; }
.app-shell .user-settings-sidebar button:hover { background: #f4f6f8; color: var(--ink); }
.app-shell .user-settings-sidebar button.active { border-color: #cbe5f8; background: #edf6fc; color: #075ea4; box-shadow: inset 3px 0 #1687e8; }
.app-shell .user-settings-sidebar button svg { width: 17px; height: 17px; }
.app-shell .user-settings-sidebar button span { min-width: 0; overflow-wrap: anywhere; font-size: 12px; font-weight: 650; line-height: 1.35; }
.app-shell .user-settings-sidebar button b { display: grid; min-width: 22px; height: 22px; place-items: center; padding: 0 5px; border-radius: 11px; background: #e9edf0; color: #5d666d; font-size: 10px; }
.app-shell .user-settings-sidebar button.active b { background: #d4eaf9; color: #075ea4; }
.app-shell .user-settings-content { display: grid; min-width: 0; gap: 18px; scroll-margin-top: 92px; }
.app-shell .user-settings-toolbar {
  display: grid;
  grid-template-columns: minmax(280px,1fr) auto;
  align-items: end;
  gap: 14px;
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.app-shell .user-settings-toolbar label { display: grid; min-width: 0; gap: 9px; color: var(--muted); font-size: 12px; font-weight: 650; }
.app-shell .user-settings-toolbar input,
.app-shell .user-settings-toolbar select { width: 100%; min-width: 0; min-height: 42px; }
.app-shell .user-settings-toolbar-summary { display: flex; min-height: 42px; align-items: center; justify-content: flex-end; gap: 10px; color: var(--muted); font-size: 13px; white-space: nowrap; }
.app-shell .user-settings-toolbar-summary .icon-button { flex: 0 0 42px; width: 42px; height: 42px; }
.app-shell .user-settings-category-field { display: none!important; }
.app-shell .user-settings-module-list { display: grid; gap: 14px; }
.app-shell .user-settings-module {
  display: grid;
  min-width: 0;
  gap: 24px;
  padding: 24px 26px 28px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.app-shell .user-settings-module[hidden] { display: none; }
.app-shell .user-settings-module-heading { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; align-items: start; gap: 16px; }
.app-shell .user-settings-module-heading > span { display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid #b8dcf7; border-radius: 7px; background: #eaf6ff; color: #075ea4; }
.app-shell .user-settings-module-heading > span svg { width: 19px; height: 19px; }
.app-shell .user-settings-module-heading > div { display: grid; min-width: 0; gap: 7px; }
.app-shell .user-settings-module-heading p { margin: 0; color: #0879d1; font-size: 11px; font-weight: 750; text-transform: uppercase; }
.app-shell .user-settings-module-heading h2 { margin: 0; color: var(--ink); font-size: 17px; letter-spacing: 0; }
.app-shell .user-settings-module-heading small { color: var(--muted); font-size: 12px; line-height: 1.55; }
.app-shell .user-settings-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; padding-left: 58px; }
.app-shell .user-settings-field-grid.single { grid-template-columns: minmax(240px,520px); }
.app-shell .user-settings-field-grid label { display: grid; min-width: 0; gap: 10px; color: #404040; font-size: 12px; font-weight: 650; }
.app-shell .user-settings-field-grid input,
.app-shell .user-settings-field-grid select { width: 100%; min-width: 0; min-height: 42px; }
.app-shell .user-settings-field-grid label > small { color: var(--muted); font-size: 11px; font-weight: 400; line-height: 1.5; }
.app-shell .oauth-bindings { display: grid; gap: 12px; margin-left: 58px; padding-top: 4px; }
.app-shell .oauth-bindings-heading { display: flex; align-items: end; justify-content: space-between; gap: 14px; }
.app-shell .oauth-bindings-heading > div { display: grid; min-width: 0; gap: 4px; }
.app-shell .oauth-bindings-heading strong { color: #262626; font-size: 13px; }
.app-shell .oauth-bindings-heading small { color: var(--muted); font-size: 11px; line-height: 1.45; }
.app-shell .oauth-bind-list { display: grid; overflow: hidden; border: 1px solid #e2e5e8; border-radius: 7px; background: #fafafa; }
.app-shell .oauth-bind-row { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; align-items: center; gap: 11px; min-width: 0; padding: 11px 12px; border-bottom: 1px solid #e8eaec; background: #fff; }
.app-shell .oauth-bind-row:last-child { border-bottom: 0; }
.app-shell .oauth-bind-row.connected { background: #f8fcff; }
.app-shell .oauth-bind-icon { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid #d7dadd; border-radius: 6px; background: #fff; color: #171717; }
.app-shell .oauth-bind-icon svg { width: 17px; height: 17px; }
.app-shell .oauth-bind-github { background: #171717; color: #fff; }
.app-shell .oauth-bind-provider { display: grid; min-width: 0; gap: 3px; }
.app-shell .oauth-bind-provider strong { color: #262626; font-size: 12px; }
.app-shell .oauth-bind-provider small { min-width: 0; overflow: hidden; color: var(--muted); font-size: 10px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .oauth-bind-action { display: flex; min-width: 0; align-items: center; justify-content: flex-end; gap: 10px; }
.app-shell .oauth-bind-action > span { color: #168048; font-size: 10px; font-weight: 700; white-space: nowrap; }
.app-shell .oauth-bind-row:not(.connected) .oauth-bind-action > span { color: var(--muted); }
.app-shell .oauth-bind-action .secondary-button { display: inline-flex; min-height: 34px; align-items: center; gap: 6px; padding: 7px 10px; font-size: 11px; }
.app-shell .oauth-bind-action .secondary-button svg { width: 14px; height: 14px; }
.app-shell .user-settings-switch { display: inline-flex; align-self: center; cursor: pointer; }
.app-shell .user-settings-switch input { position: absolute; width: 1px; height: 1px; min-height: 0; margin: 0; opacity: 0; pointer-events: none; }
.app-shell .user-settings-switch > span { position: relative; width: 44px; height: 24px; border: 1px solid #b5b5b5; border-radius: 12px; background: #e5e5e5; transition: .16s; }
.app-shell .user-settings-switch > span::after { position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); content: ""; transition: .16s; }
.app-shell .user-settings-switch input:checked + span { border-color: #075ea4; background: #1687e8; }
.app-shell .user-settings-switch input:checked + span::after { transform: translateX(20px); }
.app-shell .user-settings-switch input:focus-visible + span { outline: 3px solid rgba(22,135,232,.18); outline-offset: 2px; }
.app-shell .user-settings-switch input:disabled + span { cursor: not-allowed; opacity: .55; }
.app-shell .user-settings-callout { display: flex; align-items: flex-start; gap: 9px; margin-left: 55px; padding: 11px 13px; border-left: 3px solid #1687e8; background: #f5fbff; color: #3f6078; font-size: 12px; line-height: 1.55; }
.app-shell .user-settings-callout.neutral { border-left-color: #737373; background: #fafafa; color: #525252; }
.app-shell .user-settings-callout svg { flex: 0 0 16px; width: 16px; height: 16px; margin-top: 1px; }
.app-shell .user-settings-empty { display: grid; min-height: 220px; place-items: center; align-content: center; gap: 8px; border: 1px dashed var(--line-strong); border-radius: 8px; background: #fff; color: var(--muted); text-align: center; }
.app-shell .user-settings-empty[hidden] { display: none; }
.app-shell .user-settings-empty svg { width: 28px; height: 28px; }
.app-shell .user-settings-empty strong { color: var(--ink); font-size: 15px; }
.app-shell .user-settings-empty span { font-size: 12px; }
.app-shell .user-settings-pagination { padding: 0 16px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.app-shell .user-settings-pagination > span { line-height: 1.5; }
.app-shell .user-settings-actions { display: flex; min-height: 66px; align-items: center; justify-content: flex-end; gap: 13px; padding: 12px 14px 12px 20px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.app-shell .user-settings-actions #profile-status { margin-right: auto; }
.app-shell .user-settings-actions #user-settings-updated { color: var(--muted); font-size: 12px; }
.app-shell .user-settings-actions .primary-button { display: inline-flex; align-items: center; gap: 8px; }
.app-shell .user-settings-actions .primary-button svg { width: 16px; height: 16px; }

@media (max-width: 960px) {
  .app-shell .user-settings-layout { grid-template-columns: 1fr; }
  .app-shell .user-settings-sidebar { display: none; }
  .app-shell .user-settings-category-field { display: grid!important; }
  .app-shell .user-settings-toolbar { grid-template-columns: minmax(260px,1fr) minmax(180px,.65fr) auto; }
}
@media (max-width: 820px) {
  .app-shell .user-settings-content { scroll-margin-top: 12px; }
  .app-shell .user-settings-toolbar { grid-template-columns: 1fr 1fr; }
  .app-shell .user-settings-toolbar-summary { grid-column: 1/-1; justify-content: space-between; }
  .app-shell .user-settings-field-grid { grid-template-columns: 1fr; padding-left: 0; }
  .app-shell .user-settings-callout { margin-left: 0; }
  .app-shell .oauth-bindings { margin-left: 0; }
  .app-shell .user-settings-pagination { gap: 12px; padding: 14px 16px; }
}
@media (max-width: 600px) {
  .app-shell .user-settings-toolbar { grid-template-columns: 1fr; padding: 15px; }
  .app-shell .user-settings-toolbar-summary { grid-column: auto; }
  .app-shell .user-settings-module { padding: 18px 16px 20px; }
  .app-shell .user-settings-module-heading { grid-template-columns: 38px minmax(0,1fr) auto; gap: 10px; }
  .app-shell .user-settings-module-heading > span { width: 38px; height: 38px; }
  .app-shell .user-settings-pagination { align-items: flex-start; flex-direction: column; }
  .app-shell .user-settings-pagination .admin-pagination-controls { width: 100%; justify-content: space-between; }
  .app-shell .user-settings-pagination .admin-pagination-edge { display: none; }
  .app-shell .user-settings-actions { align-items: stretch; flex-direction: column; }
  .app-shell .user-settings-actions #profile-status { margin-right: 0; }
  .app-shell .user-settings-actions .primary-button { justify-content: center; }
  .app-shell .oauth-bind-row { grid-template-columns: 32px minmax(0,1fr); }
  .app-shell .oauth-bind-action { grid-column: 2; justify-content: flex-start; }
}

/* Supplier channels */
.app-shell .channel-filter-bar { display: grid; grid-template-columns: minmax(260px,1.7fr) repeat(3,minmax(150px,.75fr)) auto; align-items: end; gap: 10px; margin-bottom: 14px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #fafafa; }
.app-shell .channel-filter-bar label { display: grid; min-width: 0; gap: 6px; color: var(--muted); font-size: 10px; font-weight: 650; }
.app-shell .channel-filter-bar input,.app-shell .channel-filter-bar select { width: 100%; min-width: 0; min-height: 40px; border-color: var(--line-strong); background: #fff; color: var(--ink); font-size: 12px; }
.app-shell .channel-filter-summary { display: flex; min-height: 40px; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.app-shell .channel-filter-summary .icon-button { flex: 0 0 40px; width: 40px; height: 40px; }
.app-shell .channel-summary-values { display: grid; justify-items: end; gap: 4px; }
.app-shell .channel-filter-total { display: flex; align-items: baseline; gap: 6px; font-size: 10px; }
.app-shell .channel-filter-total strong { color: var(--ink); font: 600 11px "Roboto Mono",monospace; font-variant-numeric: tabular-nums; }
.app-shell .channel-billing-note { margin: -4px 0 14px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.app-shell .channel-admin-table { min-width: 1300px; }
.app-shell .channel-admin-table td { vertical-align: middle; }
.app-shell .channel-admin-table .channel-billed-cell { min-width: 110px; text-align: right; white-space: nowrap; }
.app-shell .channel-billed-cell strong { color: var(--ink); font: 600 11px "Roboto Mono",monospace; font-variant-numeric: tabular-nums; }
.app-shell .channel-name-cell,.app-shell .channel-connection-cell { display: grid; min-width: 150px; gap: 4px; }
.app-shell .channel-name-cell strong,.app-shell .channel-connection-cell strong { color: var(--ink); font-size: 12px; }
.app-shell .channel-name-cell code,.app-shell .channel-connection-cell code { max-width: 230px; overflow: hidden; color: var(--muted); font: 10px "Roboto Mono",monospace; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .channel-default-badge { width: max-content; padding: 3px 6px; border: 1px solid #bae6fd; border-radius: 5px; background: #f0f9ff; color: #0369a1; font-size: 9px; font-weight: 700; }
.app-shell .channel-supplier-list { display: flex; min-width: 160px; max-width: 260px; flex-wrap: wrap; gap: 5px; }
.app-shell .channel-supplier-list span { max-width: 170px; overflow: hidden; padding: 3px 6px; border: 1px solid #d4d4d4; border-radius: 5px; background: #fafafa; color: #404040; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.app-shell .channel-supplier-list small { align-self: center; color: var(--muted); font-size: 9px; }
.app-shell .channel-routing-list { display: flex; min-width: 130px; flex-wrap: wrap; gap: 5px; }
.app-shell .channel-routing-list > span { display: inline-flex; align-items: center; gap: 4px; padding: 3px 6px; border: 1px solid #bbf7d0; border-radius: 5px; background: #f0fdf4; }
.app-shell .channel-routing-list > span.disabled { border-color: #e5e5e5; background: #fafafa; opacity: .62; }
.app-shell .channel-routing-list strong,.app-shell .channel-routing-list small,.app-shell .channel-routing-list em { font: 600 9px "Roboto Mono",monospace; }
.app-shell .channel-routing-list strong { color: #166534; }
.app-shell .channel-routing-list small,.app-shell .channel-routing-list em { color: var(--muted); font-style: normal; }
.app-shell .channel-credential-cell { display: flex; min-width: 110px; align-items: center; gap: 6px; color: var(--muted); font-size: 10px; }
.app-shell .channel-credential-cell svg { flex: 0 0 14px; width: 14px; height: 14px; }
.app-shell .channel-managed-note { display: block; width: max-content; max-width: 120px; margin-top: 5px; color: var(--muted); font-size: 9px; }
.app-shell .channel-row-actions { min-width: 148px; flex-wrap: nowrap; }
.app-shell .channel-row-actions .icon-button { flex: 0 0 32px; width: 32px; height: 32px; }
.app-shell .channel-row-actions .icon-button svg { width: 15px; height: 15px; }
.app-shell .channel-row-actions .icon-button.danger { color: #b42318; }

dialog.channel-editor-dialog { width: min(920px,100vw); }
.channel-editor-layout { min-height: 0; }
.channel-editor-nav button { min-height: 58px; }
.channel-editor-content { min-height: 0; overflow-y: auto; }
.channel-editor-content .provider-editor-section { padding: 24px 26px 28px; border-bottom: 1px solid #ededed; }
.channel-editor-content .provider-editor-section:last-child { border-bottom: 0; }
.channel-editor-content textarea { width: 100%; resize: vertical; }
.channel-credential-summary { padding: 10px 12px; border-left: 3px solid #737373; background: #fafafa; color: #525252; font-size: 11px; line-height: 1.45; }
dialog .channel-clear-keys { max-width: 420px; }
.channel-binding-heading { grid-template-columns: 36px minmax(0,1fr) auto; }
.channel-binding-heading > strong { align-self: center; color: #075ea4; font-size: 11px; white-space: nowrap; }
.channel-binding-toolbar { display: flex; min-width: 0; align-items: end; justify-content: space-between; gap: 14px; }
.channel-binding-toolbar .channel-binding-search { display: grid; width: min(100%,420px); min-width: 0; gap: 6px; color: #737373; font-size: 10px; font-weight: 600; }
.channel-binding-search-input { position: relative; display: block; }
.channel-binding-search-input svg { position: absolute; z-index: 1; left: 11px; top: 50%; width: 15px; height: 15px; color: #737373; transform: translateY(-50%); pointer-events: none; }
dialog .channel-binding-search-input input { width: 100%; min-height: 38px; padding-left: 34px; }
.channel-binding-toolbar > span { flex: 0 0 auto; min-height: 38px; align-content: center; color: #737373; font-size: 10px; white-space: nowrap; }
.channel-binding-legend { display: grid; grid-template-columns: minmax(230px,1fr) 110px 110px 120px; gap: 12px; padding: 0 13px 7px; color: #737373; font-size: 9px; font-weight: 700; }
.channel-binding-list { display: grid; overflow: hidden; border: 1px solid #e5e5e5; border-radius: 8px; background: #fafafa; }
.channel-binding-row { display: grid; min-width: 0; grid-template-columns: minmax(230px,1fr) 110px 110px 120px; align-items: center; gap: 12px; padding: 10px 12px; border-bottom: 1px solid #e8e8e8; background: #fff; opacity: .72; }
.channel-binding-row:last-child { border-bottom: 0; }
.channel-binding-row.selected { background: #f8fcff; opacity: 1; }
dialog .channel-binding-provider { display: grid; min-width: 0; grid-template-columns: 18px minmax(0,1fr); align-items: center; gap: 10px; cursor: pointer; }
dialog .channel-binding-provider > input { width: 17px; height: 17px; min-height: 17px; margin: 0; accent-color: #1687e8; }
.channel-binding-provider > span { display: grid; min-width: 0; gap: 3px; }
.channel-binding-provider strong,.channel-binding-provider code { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.channel-binding-provider strong { color: #262626; font-size: 12px; }
.channel-binding-provider code { color: #737373; font: 9px "Roboto Mono",monospace; }
dialog .channel-binding-row > label:not(.channel-binding-provider) { display: grid; min-width: 0; gap: 4px; color: #737373; font-size: 9px; }
dialog .channel-binding-row input[type="number"] { width: 100%; min-width: 0; min-height: 36px; padding: 7px 8px; font: 11px "Roboto Mono",monospace; }
dialog .channel-binding-enabled { justify-items: start; }
dialog .channel-binding-enabled input { width: 18px; height: 18px; min-height: 18px; margin: 4px 0 0; accent-color: #1687e8; }
.channel-binding-row input:disabled { cursor: not-allowed; opacity: .55; }
.channel-binding-model-scope { grid-column: 1/-1; min-width: 0; padding: 14px 0 2px; border-top: 1px solid #dce8f2; }
.channel-scope-heading,.channel-scope-actions,.supplier-channel-model-scope { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
dialog .channel-scope-heading > label { display: flex; align-items: center; gap: 10px; color: #525252; font-size: 11px; }
dialog .channel-scope-heading select { width: auto; min-width: 170px; max-width: 100%; min-height: 36px; }
.channel-scope-heading > strong { padding: 4px 8px; border-radius: 5px; background: #e0f2fe; color: #075985; font-size: 10px; }
.channel-scope-help,.channel-scope-warning { margin: 9px 0; color: #737373; font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
.channel-scope-warning:not(:empty) { padding: 8px 10px; border: 1px solid #f6d58a; border-radius: 6px; background: #fffbeb; color: #92400e; }
.channel-scope-warning:empty { display: none; }
dialog .channel-scope-search { display: grid; gap: 5px; color: #525252; font-size: 11px; }
dialog .channel-scope-search input { width: 100%; min-height: 38px; }
.channel-scope-actions { justify-content: flex-end; margin: 8px 0; }
.channel-scope-actions .secondary-button { min-height: 32px; font-size: 10px; }
.channel-scope-model-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); max-height: 280px; overflow: auto; overscroll-behavior: contain; border: 1px solid #e2e8f0; border-radius: 7px; background: #fff; }
dialog .channel-scope-model { display: flex; align-items: center; min-width: 0; gap: 8px; padding: 10px; border: 1px solid transparent; cursor: pointer; }
dialog .channel-scope-model:hover { background: #f1f8ff; }
dialog .channel-scope-model:focus-within { outline: 2px solid #1687e8; outline-offset: -2px; }
dialog .channel-scope-model.selected { border-color: #bfdbfe; background: #eff6ff; }
dialog .channel-scope-model input { flex: 0 0 auto; width: 16px; height: 16px; min-height: 16px; margin: 0; accent-color: #1687e8; }
.channel-scope-model > span { display: grid; flex: 1; min-width: 0; gap: 3px; }
.channel-scope-model strong,.channel-scope-model code { overflow-wrap: anywhere; font-size: 11px; }
.channel-scope-model code { color: #737373; font-size: 9px; }
.channel-scope-model small { flex: 0 0 auto; color: #92400e; font-size: 9px; }
.channel-scope-model-list > .channel-binding-empty { grid-column: 1/-1; }
.supplier-channel-model-scope { margin: 12px 0; padding: 10px 12px; border: 1px solid #e2e8f0; border-radius: 7px; background: #f8fafc; font-size: 11px; }
.supplier-channel-model-scope strong { color: #075985; }
#supplier-routing-editor .routing-card-detail { margin: 9px 0; color: #075985; font-size: 11px; overflow-wrap: anywhere; }
.channel-binding-empty { margin: 0; padding: 28px 18px; color: #737373; font-size: 12px; text-align: center; }
.channel-binding-pagination { display: flex; min-height: 38px; align-items: center; justify-content: space-between; gap: 12px; color: #737373; font-size: 10px; }
.channel-binding-pagination > div { display: flex; gap: 6px; }
.channel-binding-pagination .icon-button { width: 34px; height: 34px; }
.supplier-channel-toolbar,.supplier-channel-card-heading,.supplier-channel-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.supplier-channel-toolbar > strong { color: #525252; font-size: 12px; }
.supplier-channel-help { margin: 12px 0; color: #737373; font-size: 12px; line-height: 1.6; }
.supplier-channel-list { display: grid; gap: 12px; }
.supplier-channel-card { min-width: 0; padding: 18px; border: 1px solid #e5e5e5; border-radius: 12px; background: #fff; }
.supplier-channel-card-heading > div { display: grid; min-width: 0; gap: 4px; }
.supplier-channel-card-heading strong { overflow-wrap: anywhere; font-size: 14px; }
.supplier-channel-card-heading small { color: #737373; font-size: 11px; }
.supplier-channel-endpoint { display: block; margin: 14px 0; color: #525252; font-size: 11px; overflow-wrap: anywhere; }
.supplier-channel-policy { display: flex; flex-wrap: wrap; gap: 8px; color: #737373; font-size: 11px; }
.supplier-channel-policy span { padding: 5px 8px; border-radius: 6px; background: #f5f5f5; }
.supplier-channel-policy strong { margin-left: 4px; color: #262626; }
.supplier-channel-card-footer { flex-wrap: wrap; }
.supplier-channel-card-footer .row-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.supplier-channel-empty { display: grid; justify-items: center; gap: 10px; padding: 40px 20px; border: 1px dashed #d4d4d4; border-radius: 12px; color: #525252; text-align: center; }
.supplier-channel-empty > svg { width: 28px; height: 28px; color: #737373; }
.supplier-channel-empty p { max-width: 360px; margin: 0; color: #737373; font-size: 12px; line-height: 1.6; }
.app-shell .supplier-channel-link { align-self: start; width: fit-content; padding: 3px 0; border: 0; background: transparent; color: #075ea4; font-size: 11px; text-align: left; cursor: pointer; }
.app-shell .supplier-channel-link:hover { text-decoration: underline; }
@media (max-width: 600px) {
  .supplier-channel-card { padding: 14px; }
  .supplier-channel-card-footer { align-items: flex-start; flex-direction: column; }
  .supplier-channel-toolbar { flex-wrap: wrap; }
}
.channel-model-mapping-heading { grid-template-columns: 36px minmax(0,1fr) auto; }
.channel-catalog-dialog { width: min(780px,calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: 0; border: 1px solid #e2e8f0; border-radius: 14px; overflow: auto; color: #1e293b; background: #fff; }
.channel-catalog-heading { display: flex; align-items: center; gap: 12px; padding: 22px 24px; border-bottom: 1px solid #e2e8f0; }
.channel-catalog-heading h2 { margin: 0; font-size: 20px; }
.channel-catalog-heading p { margin: 5px 0 0; color: #64748b; font-size: 12px; }
.channel-catalog-heading > button { margin-left: auto; flex: 0 0 auto; }
.channel-catalog-identity { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 20px 24px 8px; }
.channel-catalog-identity code { color: #64748b; font-size: 11px; overflow-wrap: anywhere; }
.channel-catalog-help { margin: 0 24px 16px; color: #64748b; font-size: 12px; }
.channel-catalog-toolbar { display: flex; gap: 10px; margin: 0 24px; }
.channel-catalog-search { display: flex; align-items: center; flex: 1; min-width: 0; gap: 8px; padding: 0 12px; border: 1px solid #cbd5e1; border-radius: 8px; }
.channel-catalog-search svg { width: 16px; height: 16px; color: #64748b; flex: 0 0 auto; }
.channel-catalog-search input { min-width: 0; width: 100%; padding: 11px 0; border: 0; background: transparent; font: inherit; font-size: 13px; }
.channel-catalog-search:focus-within { outline: 2px solid #93c5fd; }
#channel-models-search:focus { outline: none; box-shadow: none; border: 0; }
#channel-models-error { margin: 12px 24px 0; }
.channel-catalog-summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 16px 24px 10px; font-size: 12px; color: #64748b; }
.channel-catalog-list { max-height: min(420px,40vh); overflow: auto; margin: 0 24px 20px; border: 1px solid #e2e8f0; border-radius: 10px; }
.channel-catalog-row { display: flex; align-items: center; gap: 16px; padding: 12px 14px; border-bottom: 1px solid #e2e8f0; }
.channel-catalog-row:last-child { border-bottom: 0; }
.channel-catalog-row > span { display: grid; flex: 1; min-width: 0; gap: 4px; }
.channel-catalog-row code { font-size: 12px; overflow-wrap: anywhere; }
.channel-catalog-row small { color: #64748b; font-size: 11px; }
.channel-catalog-row button { flex: 0 0 auto; }
.channel-catalog-empty { padding: 25px 14px; text-align: center; color: #64748b; font-size: 13px; }
.channel-catalog-footer { display: flex; justify-content: flex-end; padding: 14px 24px; border-top: 1px solid #e2e8f0; background: #f8fafc; }
@media (max-width: 600px) {
  .channel-catalog-heading { padding: 16px; }
  .channel-catalog-identity,.channel-catalog-help,.channel-catalog-toolbar,.channel-catalog-summary,.channel-catalog-list { margin-left: 16px; margin-right: 16px; }
}
.channel-model-mapping-heading > strong { align-self: center; color: #075ea4; font-size: 11px; white-space: nowrap; }
.channel-model-mapping-legend,.channel-model-mapping-row { display: grid; grid-template-columns: minmax(190px,1fr) minmax(230px,1.2fr); align-items: center; gap: 12px; }
.channel-model-mapping-legend { padding: 0 13px 7px; color: #737373; font-size: 9px; font-weight: 700; }
.channel-model-mapping-list { display: grid; gap: 18px; }
.channel-supplier-mappings { min-width: 0; overflow: hidden; border: 1px solid #e5e5e5; border-radius: 10px; background: #fff; }
.channel-supplier-mappings-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px; background: #fafafa; }
.channel-supplier-mappings-heading > span { flex-shrink: 0; color: #737373; font-size: 11px; }
.channel-supplier-parameters { display: grid; gap: 7px; margin: 0; padding: 16px; border-bottom: 1px solid #e8e8e8; }
.channel-supplier-parameters > span,.channel-model-mapping-options label > span { font-size: 12px; font-weight: 600; }
.channel-supplier-parameters textarea { width: 100%; min-width: 0; padding: 10px; border: 1px solid #d4d4d4; border-radius: 7px; font: 11px/1.6 "Roboto Mono",monospace; resize: vertical; }
.channel-supplier-parameters textarea:focus { border-color: #075ea4; outline: 2px solid #dbeafe; }
.channel-supplier-parameters small,.channel-parameter-help { color: #737373; font-size: 12px; line-height: 1.6; }
.channel-parameter-help { display: grid; gap: 6px; margin: 0; }
.channel-parameter-help p { margin: 0; color: inherit; font: inherit; }
.channel-supplier-mappings .channel-model-mapping-legend { margin-top: 14px; }
.channel-model-mapping-row { min-height: 66px; padding: 10px 12px; border-bottom: 1px solid #e8e8e8; background: #fff; }
.channel-model-mapping-row:last-child { border-bottom: 0; }
.channel-model-mapping-supplier,.channel-model-mapping-model { display: grid; min-width: 0; gap: 3px; }
.channel-model-mapping-supplier strong,.channel-model-mapping-model strong,.channel-model-mapping-supplier code,.channel-model-mapping-model code { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.channel-model-mapping-supplier strong,.channel-model-mapping-model strong { color: #262626; font-size: 12px; }
.channel-model-mapping-supplier code,.channel-model-mapping-model code { color: #737373; font: 9px "Roboto Mono",monospace; }
.channel-model-mapping-row label { min-width: 0; }
.channel-model-mapping-row input { width: 100%; min-width: 0; min-height: 38px; font: 11px "Roboto Mono",monospace; }
.channel-model-mapping-entry { background: #fff; border-bottom: 1px solid #e8e8e8; }
.channel-model-mapping-entry:last-child { border-bottom: 0; }
.channel-model-mapping-entry .channel-model-mapping-row { border-bottom: 0; }
.channel-model-mapping-toggle { grid-column: 1 / -1; align-self: center; justify-self: start; display: inline-flex; align-items: center; gap: 5px; min-height: 30px; padding: 0 10px; border: 1px solid #e0e0e0; border-radius: 7px; background: #fff; color: #525252; font-size: 11px; font-weight: 600; white-space: nowrap; transition: border-color .15s ease, background .15s ease; }
.channel-model-mapping-toggle:hover { border-color: #bdbdbd; background: #f8f8f8; }
.channel-model-mapping-toggle::before { content: ""; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-1px); transition: transform .15s ease; }
.channel-model-mapping-toggle.active { border-color: #a9ccf7; background: #eaf3ff; color: #075ea4; }
.channel-model-mapping-toggle.active::before { transform: rotate(225deg) translateY(-1px); }
.channel-model-mapping-options { padding: 0 12px 12px; background: #fff; }
.channel-model-mapping-options textarea { width: 100%; min-width: 0; padding: 8px 10px; border: 1px solid #e0e0e0; border-radius: 7px; font: 11px/1.5 "Roboto Mono",monospace; resize: vertical; }
.channel-model-mapping-options textarea:focus { border-color: #8f8f8f; outline: none; }
.channel-model-mapping-options small { display: block; margin-top: 5px; color: #8a8a8a; font-size: 10px; }

@media (max-width: 1100px) {
  .app-shell .channel-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .channel-filter-summary { justify-content: space-between; }
  .app-shell .channel-summary-values { justify-items: start; }
}
@media (max-width: 720px) {
  .app-shell .channel-filter-bar { grid-template-columns: 1fr; }
  .channel-editor-content .provider-editor-section { padding: 20px 16px 24px; }
  .channel-binding-legend { display: none; }
  .channel-binding-row { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .channel-scope-model-list { grid-template-columns: minmax(0,1fr); max-height: 240px; }
  dialog .channel-scope-heading > label { flex: 1 1 100%; justify-content: space-between; }
  .channel-scope-actions { justify-content: stretch; }
  .channel-scope-actions > button { flex: 1; }
  dialog .channel-binding-provider { grid-column: 1/-1; padding-bottom: 5px; }
  dialog .channel-binding-enabled { justify-items: end; }
  .channel-binding-heading { grid-template-columns: 34px minmax(0,1fr); }
  .channel-binding-heading > strong { grid-column: 2; }
  .channel-binding-toolbar { align-items: stretch; flex-direction: column; }
  .channel-binding-toolbar .channel-binding-search { width: 100%; }
  .channel-binding-toolbar > span { min-height: 0; }
  .channel-model-mapping-heading { grid-template-columns: 34px minmax(0,1fr); }
  .channel-model-mapping-heading > strong { grid-column: 2; }
  .channel-model-mapping-legend { display: none; }
  .channel-model-mapping-row { grid-template-columns: minmax(0,1fr); gap: 10px; }
  .channel-model-mapping-row label { grid-column: 1/-1; }
}
.provider-model-import-time-pricing{display:grid;gap:8px;margin-top:16px}.provider-model-import-time-pricing textarea{width:100%;min-height:84px;font-family:"Roboto Mono",monospace;font-size:12px;line-height:1.5}
.channel-sniff-toolbar{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end;margin-bottom:12px}
.channel-sniff-toolbar .secondary-button{display:inline-flex;min-height:38px;flex:0 0 auto;align-items:center;justify-content:center;gap:7px;white-space:nowrap}
.channel-sniff-toolbar .secondary-button svg{width:15px;height:15px;flex:0 0 auto}
.channel-sniff-model{display:flex;flex-direction:column;gap:6px;min-width:220px}
.channel-sniff-model select{min-height:38px}
.channel-sniff-apply{flex:1;min-width:220px}
.channel-sniff-summary{font-weight:600;margin:8px 0}
.channel-sniff-results{display:flex;flex-direction:column;gap:2px;max-height:420px;overflow:auto;border:1px solid var(--border,#e5e7eb);border-radius:8px}
.channel-sniff-legend,.channel-sniff-row{display:grid;grid-template-columns:minmax(160px,1fr) 110px minmax(180px,2fr);gap:12px;align-items:center;padding:8px 12px}
.channel-sniff-legend{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted,#6b7280);border-bottom:1px solid var(--border,#e5e7eb)}
.channel-sniff-row{border-bottom:1px solid var(--border-soft,#f1f5f9)}
.channel-sniff-row:last-child{border-bottom:none}
.channel-sniff-name{font-family:ui-monospace,monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.channel-sniff-badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:600;text-align:center}
.channel-sniff-badge.supported{background:#dcfce7;color:#15803d}
.channel-sniff-badge.unsupported{background:#fee2e2;color:#b91c1c}
.channel-sniff-badge.unknown{background:#e5e7eb;color:#4b5563}
.channel-sniff-detail{font-size:12px;color:var(--muted,#6b7280);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.channel-sniff-empty{padding:16px;color:var(--muted,#6b7280)}
/* Model agent compatibility options */
.model-agent-compat-field{display:flex;flex-direction:column;gap:8px}
.model-agent-compat-field>span{font-size:13px;font-weight:500;color:#262626}
.model-agent-compat-options{display:flex;flex-wrap:wrap;gap:8px 14px;padding:10px 12px;border:1px solid #e5e5e5;border-radius:8px;background:#fafafa;min-height:44px}
.model-agent-compat-options label{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#262626;cursor:pointer;white-space:nowrap}
.model-agent-compat-options input[type=checkbox]{flex:0 0 auto;width:16px;min-height:16px;height:16px;margin:0;padding:0;border-color:#c8d1cb;cursor:pointer;accent-color:#1687e8}
.model-agent-compat-empty{color:#737373;font-size:13px}

/* Model route billing mode */
.model-route-billing-mode{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 14px;margin-bottom:4px}
.model-route-billing-mode select{width:100%}
.model-request-price-field{transition:opacity .15s ease}
.model-billing-dimmed>label{opacity:.45;filter:grayscale(.4);transition:opacity .15s ease}
.model-billing-dimmed>label input{pointer-events:none}
/* Subscriptions page */
.subscription-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.subscription-card{border:1px solid #e5e5e5;border-radius:10px;padding:14px;background:#fff;display:flex;flex-direction:column;gap:10px}
.subscription-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.subscription-quota{display:flex;flex-direction:column;gap:6px}
.subscription-quota-bar{height:8px;border-radius:6px;background:#eef1f3;overflow:hidden}
.subscription-quota-bar span{display:block;height:100%;background:#3b82f6;border-radius:6px}
.subscription-quota-text{font-size:12px;color:#6b7280}
.subscription-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;margin:0}
.subscription-meta div{display:flex;flex-direction:column;gap:2px}
.subscription-meta dt{font-size:11px;color:#9ca3af;text-transform:uppercase;letter-spacing:.04em}
.subscription-meta dd{margin:0;font-size:13px;color:#262626}
.subscription-status-active{background:#dcfce7;color:#166534}
.subscription-status-expired,.subscription-status-cancelled{background:#fee2e2;color:#991b1b}
.subscription-plan-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.subscription-plan-card{border:1px solid #e5e5e5;border-radius:10px;padding:14px;background:#fff;display:flex;flex-direction:column;gap:10px}
.subscription-plan-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.subscription-plan-price{font-weight:600;color:#047857}
.subscription-plan-sub{margin:0;font-size:13px;color:#6b7280}
.subscription-buy-button{align-self:flex-start}


/* Base URL bar (API keys / subscriptions) */
.base-url-section{padding:12px 14px}
.base-url-row{display:flex;align-items:center;gap:10px}
.base-url-label{flex:0 0 auto;font-size:12px;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.04em}
.base-url-value{flex:1;min-width:0;overflow-x:auto;padding:7px 10px;background:#f5f6f7;border:1px solid #e5e5e5;border-radius:6px;font-size:13px;white-space:nowrap;color:#111827}

/* Section empty-state */
.section-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:36px 16px;text-align:center}
.section-empty svg{width:28px;height:28px;color:#c3cbd2}
.section-empty p{margin:0;font-size:13px;color:#8d9aa6;line-height:1.5;max-width:46ch}

/* Paired request timings stay together without widening the log table. */
.usage-timing{display:grid;gap:5px;margin:0;min-width:148px;font-size:12px}
.usage-timing>div{display:flex;align-items:baseline;justify-content:space-between;gap:12px;white-space:nowrap}
.usage-timing dt{color:var(--muted,#64748b);font-weight:400}
.usage-timing dd{margin:0;font-variant-numeric:tabular-nums;font-weight:500}
.usage-timing .usage-timing-value{display:inline-flex;align-items:center;gap:7px;line-height:1.5}
.usage-timing-bar{display:inline-block;flex:0 0 4px;width:4px;height:14px;border-radius:2px;background:var(--usage-timing-color,#cbd5e1)}
.usage-timing-value.is-fast{--usage-timing-color:#22a06b}
.usage-timing-value.is-moderate{--usage-timing-color:#e6a117}
.usage-timing-value.is-slow{--usage-timing-color:#e5484d}
.usage-timing-value.is-unavailable{--usage-timing-color:#cbd5e1}
.usage-output-speed{display:inline-flex;flex-direction:column;gap:3px;white-space:nowrap;font-variant-numeric:tabular-nums}
.usage-output-speed strong{font:600 13px "Roboto Mono",monospace}
.usage-output-speed strong small{color:var(--muted,#64748b);font-size:10px;font-weight:400}
.usage-output-speed.unavailable{color:var(--muted,#64748b)}

.app-shell .admin-table-pagination.usage-pagination{padding:12px 16px}

.usage-mode-badge{display:block;width:max-content;max-width:100%;margin-top:6px;padding:2px 7px;border:1px solid #e2e8f0;border-radius:5px;color:#64748b;background:#f8fafc;font-size:11px;line-height:1.6;white-space:nowrap}
.usage-mode-badge.streaming{color:#1d4ed8;background:#eff6ff;border-color:#bfdbfe}
.usage-mode-badge.non-streaming{color:#475569;background:#f1f5f9;border-color:#cbd5e1}

.app-shell .user-settings-layout { gap: 20px; }
.app-shell .user-settings-sidebar { gap: 8px; padding: 12px; border-color: #e5e7eb; border-radius: 14px; box-shadow: 0 1px 2px rgba(16,24,40,.025); }
.app-shell .user-settings-sidebar > p { color: #8a8a8a; font-size: 10px; letter-spacing: .06em; }
.app-shell .user-settings-sidebar nav { gap: 4px; }
.app-shell .user-settings-sidebar button { min-height: 46px; border-radius: 9px; color: #525252; }
.app-shell .user-settings-sidebar button:hover { background: #f5f5f5; color: #171717; }
.app-shell .user-settings-sidebar button.active { border-color: rgba(173,181,229,.85); background: rgba(238,240,255,.72); color: #4d5bc0; box-shadow: inset 2px 0 #5968ce; }
.app-shell .user-settings-sidebar button.active b { background: rgba(89,104,206,.12); color: #4d5bc0; }
.app-shell .user-settings-toolbar { gap: 12px; padding: 16px 18px; border-color: #e5e7eb; border-radius: 12px; }
.app-shell .user-settings-toolbar label { gap: 7px; color: #525252; font-size: 11px; }
.app-shell .user-settings-toolbar input,.app-shell .user-settings-toolbar select { min-height: 44px; }
.app-shell .user-settings-content { gap: 16px; }
.app-shell .user-settings-module-list { gap: 16px; }
.app-shell .user-settings-module { gap: 20px; padding: 22px 24px 24px; border-color: #e5e7eb; border-radius: 14px; }
.app-shell .user-settings-module-heading { gap: 14px; }
.app-shell .user-settings-module-heading > span { border-color: rgba(173,181,229,.7); border-radius: 10px; background: rgba(238,240,255,.72); color: #5968ce; }
.app-shell .user-settings-module-heading p { color: #5968ce; font-size: 10px; letter-spacing: .04em; }
.app-shell .user-settings-module-heading h2 { color: #171717; font-size: 17px; font-weight: 650; letter-spacing: -.015em; }
.app-shell .user-settings-module-heading small { color: #737373; line-height: 1.6; }
.app-shell .user-settings-field-grid { gap: 18px; }
.app-shell .user-settings-field-grid label { gap: 8px; color: #525252; }
.app-shell .user-settings-field-grid input,.app-shell .user-settings-field-grid select { min-height: 44px; }
.app-shell .oauth-bind-list { border-color: #e5e7eb; border-radius: 10px; }
.app-shell .oauth-bind-row { min-height: 58px; }
.app-shell .oauth-bind-action .secondary-button { min-height: 38px; }
.app-shell .user-settings-switch > span { width: 46px; height: 26px; border-color: #d4d4d4; background: #e5e5e5; }
.app-shell .user-settings-switch > span::after { top: 4px; left: 4px; }
.app-shell .user-settings-switch input:checked + span { border-color: #5968ce; background: #5968ce; }
.app-shell .user-settings-switch input:focus-visible + span { outline: 2px solid #5968ce; outline-offset: 3px; }
.app-shell .user-settings-callout { border-left-color: #5968ce; border-radius: 0 8px 8px 0; background: rgba(238,240,255,.55); color: #52617a; }
.app-shell .user-settings-actions { position: static; min-height: 68px; padding: 12px 14px 12px 18px; border-color: #e5e7eb; border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgba(16,24,40,.025); }
.app-shell .user-settings-actions .primary-button { min-height: 42px; }
@media(max-width:1180px) and (min-width:821px) {
  .app-shell .user-settings-field-grid { grid-template-columns: minmax(0,1fr); }
  .app-shell .user-settings-pagination { align-items: flex-start; flex-wrap: wrap; }
  .app-shell .user-settings-pagination .admin-pagination-controls { flex-wrap: wrap; row-gap: 10px; }
  .app-shell .user-settings-pagination .admin-page-numbers { flex-wrap: wrap; }
}
@media(max-width:600px) {
  .app-shell .user-settings-module { padding: 18px 16px 20px; border-radius: 12px; }
  .app-shell .user-settings-actions { padding: 12px; }
  .app-shell .user-settings-actions .primary-button { min-height: 44px; }
  .app-shell .oauth-bind-action .secondary-button { min-height: 40px; }
}
.app-shell .oauth-bind-provider small { white-space: normal; overflow-wrap: anywhere; text-overflow: clip; }

.provider-key-pool-identity { display: flex; min-width: 0; align-items: center; flex-wrap: wrap; gap: 6px 8px; }
.provider-key-current-status { flex: 0 0 auto; padding: 2px 6px; border: 1px solid #d9e9df; border-radius: 5px; background: #f0f9f3; color: #167044; font-size: 9px; font-weight: 600; line-height: 1.4; white-space: nowrap; }
.provider-key-current-status[data-state="manual_disabled"] { border-color: #ece2c7; background: #fff9e9; color: #8a5a00; }
.provider-key-current-status[data-state="auto_disabled"],.provider-key-current-status[data-state="pending_removal"] { border-color: #f1d3d0; background: #fff4f2; color: #a9342b; }
.provider-key-pool-toggle > span > .provider-key-added-at { color: #8a8a8a; font-size: 9px; line-height: 1.45; }
@media(max-width:520px) {
  .provider-key-pool-identity { align-items: flex-start; flex-direction: column; gap: 5px; }
  .provider-key-current-status { white-space: normal; }
}