:root{--bg:#f3f7fc;--panel:#ffffff;--panel-soft:#f8fbff;--line:#d7e3f1;--line-strong:#b9cee5;--text:#10233f;--muted:#667990;--blue:#1769e0;--blue-dark:#0d4fae;--blue-soft:#eaf3ff;--blue-pale:#f4f8ff;--shadow:0 12px 36px rgba(26,76,132,.08);font-family:Inter,"Segoe UI",system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 82% -12%,#dcecff 0,transparent 34%),linear-gradient(180deg,#f8fbff 0,var(--bg) 44%,#eef5fc 100%);color:var(--text);min-height:100vh}.shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
aside{border-right:1px solid var(--line);padding:28px 18px;display:flex;flex-direction:column;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);position:sticky;top:0;height:100vh;box-shadow:8px 0 28px rgba(30,79,135,.04)}.brand{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:750;margin:0 8px 34px}.brand>span{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;color:#fff;background:linear-gradient(135deg,#2f80ed,var(--blue-dark));box-shadow:0 8px 18px rgba(23,105,224,.24)}.brand small{display:block;color:var(--muted);font-size:11px;font-weight:500;margin-top:2px}
nav{display:grid;gap:7px}button{font:inherit;border:0;border-radius:9px;color:#fff;background:linear-gradient(135deg,#2477e8,var(--blue-dark));padding:10px 14px;font-weight:700;cursor:pointer;box-shadow:0 5px 12px rgba(23,105,224,.14);transition:background .16s ease,border-color .16s ease,transform .16s ease}button:hover{transform:translateY(-1px)}button:focus-visible{outline:3px solid #9bc6f5;outline-offset:2px}nav button{background:transparent;color:var(--muted);text-align:left;font-weight:600;padding:11px 13px;box-shadow:none}nav button:hover,nav button.active{background:var(--blue-soft);color:var(--blue-dark);transform:none}nav button.active{box-shadow:inset 3px 0 0 var(--blue)}.secondary{background:#fff;color:var(--blue-dark);border:1px solid var(--line-strong);box-shadow:none}.secondary:hover{background:var(--blue-pale);border-color:#8db4df}.connection{margin-top:auto;padding:12px;color:var(--muted);font-size:12px;display:flex;gap:8px;align-items:center}.connection i{width:8px;height:8px;border-radius:50%;background:#a9b9ca}.connection i.live{background:var(--blue);box-shadow:0 0 0 4px #dcecff}
main{padding:34px 42px;min-width:0}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}header p{margin:0 0 6px;color:var(--blue);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}h1{font-size:30px;margin:0;color:#0d2646}h2{margin:0 0 10px;color:#183653}h3{color:#284c73;margin:22px 0 10px}.header-actions{display:flex;align-items:center;gap:10px}.role-chip{display:inline-flex;align-items:center;padding:7px 11px;border:1px solid #bdd4ed;border-radius:999px;background:#eaf3ff;color:#165ba8;font-size:12px;font-weight:700}#notice{min-height:22px;color:#1b5fae;font-size:13px;font-weight:600;margin-bottom:8px}
.cards{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:14px}.card,.panel{background:linear-gradient(145deg,#fff,var(--panel-soft));border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.card{padding:20px;position:relative;overflow:hidden}.card::after{content:"";position:absolute;right:-18px;bottom:-28px;width:74px;height:74px;border-radius:50%;background:#e7f1ff}.card small{color:var(--muted);position:relative;z-index:1}.card strong{display:block;font-size:28px;margin-top:10px;color:#123f75;position:relative;z-index:1}.panel{padding:18px;margin-top:18px;overflow:auto}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.panel-head h2{font-size:16px}.filters{display:flex;gap:8px;flex-wrap:wrap}
table{width:100%;border-collapse:collapse;white-space:nowrap}th,td{text-align:left;padding:12px 10px;border-bottom:1px solid #e3ecf6;font-size:13px}tbody tr:hover{background:#f6faff}th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em;background:#f8fbff}td code{color:#315b88}.badge{display:inline-flex;align-items:center;padding:4px 8px;border:1px solid #cedded;border-radius:20px;background:#f4f8fc;color:#587089;font-size:11px}.badge.active,.badge.succeeded,.badge.capture{background:#e8f3ff;border-color:#b9d8fb;color:#0b61c7}.badge.failed,.badge.frozen,.badge.disabled,.badge.revoked{background:#edf2f8;border-color:#c4d1df;color:#344e6e}.badge.processing,.badge.dispatching,.badge.queued,.badge.reserve{background:#f2f7ff;border-color:#cadcf2;color:#2d5e99}.badge.unknown,.badge.adjustment{background:#e2edfc;border-color:#abc8ea;color:#174f91}
input,select,textarea{font:inherit;color:var(--text);background:#fff;border:1px solid var(--line-strong);border-radius:8px;padding:10px;outline:none}input:disabled{background:#edf3f9;color:#6e8094}input::placeholder,textarea::placeholder{color:#9aabbd}input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px #dfeeff}dialog{color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:24px;min-width:min(430px,90vw);box-shadow:0 24px 70px rgba(10,47,91,.22)}dialog::backdrop{background:rgba(13,38,70,.28);backdrop-filter:blur(4px)}dialog p{color:var(--muted);font-size:13px}label{display:grid;gap:7px;font-size:13px;margin:14px 0}textarea{min-height:90px;resize:vertical}.switch{display:flex;align-items:center}.switch input{width:auto}.actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.danger-safe{background:linear-gradient(135deg,#3d88ed,#1769e0);color:#fff}.empty{color:var(--muted);text-align:center;padding:44px}.link{color:var(--blue);background:none;padding:0;box-shadow:none}.mono{font-family:"Cascadia Code",monospace}.json-editor{min-height:220px;font-size:12px;line-height:1.55}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}.toolbar .filters{flex:1}.toolbar input,.toolbar select{min-width:150px}.small{padding:7px 10px;font-size:12px}.metric-inline{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:12px}.metric-inline strong{color:#174f91}.detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:18px}.detail-item{padding:12px;border:1px solid var(--line);border-radius:10px;background:#f8fbff}.detail-item small{display:block;color:var(--muted);margin-bottom:5px}.detail-item strong,.detail-item code{font-size:13px;color:#183d69}
dialog.wide{width:min(900px,94vw)}td .secondary+ .secondary{margin-left:6px}
.model-summary{margin-bottom:18px}.model-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}.model-toolbar input{min-width:280px;flex:0 1 380px}.model-tabs button.active{background:var(--blue);border-color:var(--blue);color:#fff}.catalog-note{margin:14px 0 18px;padding:12px 14px;border:1px solid #c8dcf3;border-radius:10px;background:#f1f7ff;color:#496680;font-size:13px}.vendor-block{border:1px solid var(--line);border-radius:13px;background:#fff;margin:14px 0;overflow:hidden}.vendor-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px;background:linear-gradient(135deg,#f2f7ff,#fff);border-bottom:1px solid var(--line)}.vendor-head h2{font-size:20px;margin:3px 0 0;color:#123f75}.vendor-kicker{color:var(--blue);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.vendor-meta{display:flex;align-items:flex-end;gap:7px;flex-direction:column;color:var(--muted);font-size:12px}.vendor-meta code{color:#174f91;background:#eaf3ff;border-radius:6px;padding:4px 7px}.model-category{padding:16px 18px 4px}.model-category+.model-category{border-top:1px solid var(--line)}.category-title{display:flex;align-items:center;gap:8px;margin-bottom:10px}.category-title h3{font-size:14px;margin:0}.category-title b{background:var(--blue-soft);color:var(--blue-dark);border-radius:999px;padding:2px 8px;font-size:11px}.modality-dot{width:9px;height:9px;border-radius:50%;background:#7ea8d6}.modality-dot.language{background:#1769e0}.modality-dot.image{background:#4b8fe8}.modality-dot.video{background:#0d4fae}.modality-dot.audio{background:#67a4ef}.modality-dot.other{background:#8aa5c2}.alias-list,.endpoint-list{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}.alias-list span,.source-chip{display:inline-block;border:1px solid var(--line);background:#f7faff;color:#587089;border-radius:999px;padding:3px 7px;font-size:11px;margin:2px}.endpoint-list code{display:inline-block;color:#587089;font-size:11px}.model-note{color:#7b6544;font-size:11px;margin:7px 2px 0}.badge.imported{background:#eaf3ff;color:#1769e0}
@media(max-width:900px){.shell{grid-template-columns:1fr}aside{height:auto;position:static;border-right:0;border-bottom:1px solid var(--line);padding:16px}.brand{margin-bottom:12px}nav{display:flex;overflow:auto}nav button{white-space:nowrap;flex:0 0 auto}.connection{display:none}main{padding:24px 16px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}header{gap:12px;align-items:flex-start}header button{font-size:12px}.detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){header{flex-direction:column}.header-actions{width:100%;justify-content:space-between}.cards,.form-grid,.detail-grid{grid-template-columns:1fr}.card strong{font-size:24px}main{padding:20px 14px}h1{font-size:27px}}
.route-model-picker{border:1px solid var(--line);border-radius:14px;padding:14px;background:#f7fbff;margin:12px 0}
.picker-head{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:10px}
.picker-head small{display:block;color:var(--muted);margin-top:4px}
.route-model-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:10px;max-height:300px;overflow:auto}
.route-model-choices fieldset{border:1px solid var(--line);border-radius:10px;padding:9px;background:#fff}
.route-model-choices legend{color:var(--primary);font-weight:700;padding:0 6px}
.route-model-option{display:flex!important;flex-direction:row!important;align-items:flex-start;gap:8px;padding:7px;border-radius:8px}
.route-model-option:hover{background:#eef6ff}
.route-model-option input{width:auto;margin-top:3px}
.route-model-option span{display:grid;gap:2px}
.route-model-option code{font-size:11px;color:var(--muted)}
.route-category{margin-top:18px}
.route-category>.category-title{margin-bottom:8px}
.client-route-summary{margin-bottom:18px}
.client-route-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.client-route-toolbar input{min-width:260px;flex:0 1 360px}
.client-route-tabs button.active{background:var(--blue);border-color:var(--blue);color:#fff}
.client-route-list{display:grid;gap:16px}
.client-route-card{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden;box-shadow:0 7px 22px rgba(26,76,132,.05)}
.client-route-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:18px;background:linear-gradient(135deg,#f0f6ff,#fff);border-bottom:1px solid var(--line)}
.client-route-head h3{font-size:20px;margin:4px 0 2px;color:#123f75}
.client-route-head p{margin:0;color:var(--muted);font-size:12px}
.route-kicker{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);font-weight:800}
.route-head-state{display:grid;justify-items:end;gap:7px;color:var(--muted);font-size:12px}
.route-head-state strong{color:#315b88}
.client-candidate-list{list-style:none;margin:0;padding:8px 18px}
.client-candidate{display:grid;grid-template-columns:34px minmax(220px,1fr) auto;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #e7eef7}
.client-candidate:last-child{border-bottom:0}
.client-candidate.candidate-disabled{opacity:.58}
.candidate-rank{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--blue-soft);color:var(--blue-dark);font-weight:800;font-size:12px}
.candidate-copy{display:grid;gap:4px;min-width:0}
.candidate-copy>span{display:flex;align-items:center;gap:8px;min-width:0}
.candidate-copy b{font-size:11px;color:var(--blue);background:#edf5ff;border-radius:99px;padding:2px 7px}
.candidate-copy code{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis}
.candidate-copy small{color:var(--muted);font-size:11px}
.candidate-controls{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.candidate-switch{display:flex!important;align-items:center;gap:5px;margin:0!important;color:var(--muted);font-size:11px}
.candidate-switch input{width:auto}
.client-route-add{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:14px 18px;border-top:1px solid var(--line);background:#f8fbff}
.client-route-settings{display:flex;gap:24px;align-items:end;padding:10px 18px}
.client-route-settings label{margin:0;min-width:160px}
.client-route-settings input[type=number]{max-width:130px}
.client-route-enabled{padding-bottom:9px}
.client-route-save{display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:10px;padding:12px 18px 18px}
.empty-candidates{padding:22px;text-align:center;color:var(--muted);font-size:12px}
button:disabled{opacity:.45;cursor:not-allowed;transform:none}
@media(max-width:800px){.client-candidate{grid-template-columns:34px 1fr}.candidate-controls{grid-column:2;justify-content:flex-start}.client-route-add,.client-route-save{grid-template-columns:1fr}.client-route-settings{align-items:stretch;flex-direction:column;gap:12px}.route-head-state{justify-items:start}.client-route-head{flex-direction:column}}
.badge.captured{background:#e8f3ff;border-color:#b9d8fb;color:#0b61c7}
.badge.cancelled{background:#edf2f8;border-color:#c4d1df;color:#344e6e}
.badge.held{background:#f2f7ff;border-color:#cadcf2;color:#2d5e99}
.badge.released,.badge.release{background:#e2edfc;border-color:#abc8ea;color:#174f91}
.status-stack{display:grid;gap:7px;min-width:150px}
.progress-view{grid-column:1/-1;min-width:0}
.progress-view.compact{width:150px}
.progress-copy{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:11px;margin-bottom:6px}
.progress-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.progress-copy strong{color:var(--blue-dark)}
.progress-track{height:7px;border-radius:99px;background:#dce8f5;overflow:hidden}
.progress-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#56a0f4,var(--blue));transition:width .25s ease}
.job-status-card{display:grid;grid-template-columns:1fr auto;gap:18px;padding:20px;margin-bottom:16px;border:1px solid #c5daf1;border-radius:14px;background:linear-gradient(135deg,#f1f7ff,#fff)}
.job-status-card h2{font-size:25px;margin:4px 0}
.job-status-card p{margin:0;color:var(--muted)}
.job-status-card>div>small{color:var(--muted)}
.job-status-card.succeeded{border-color:#acd0f6;background:linear-gradient(135deg,#eaf4ff,#fff)}
.job-status-card.failed{border-color:#c5d2e1;background:linear-gradient(135deg,#f0f4f8,#fff)}
.job-status-side{display:grid;justify-items:end;align-content:start;gap:5px}
.job-status-side>strong{font-size:20px;color:#174f91;margin-top:7px}
.job-status-side>small{font-size:11px}
.job-status-card .progress-view{align-self:end}
.response-block,.result-section,.attempt-section{margin-top:18px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:15px}
.response-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:10px}
.response-head h3{font-size:15px;margin:0}
.response-head p{font-size:12px;color:var(--muted);margin:4px 0 0}
.json-view{margin:0;max-height:390px;overflow:auto;padding:14px;border-radius:9px;background:#10233f;color:#d9eaff;font:12px/1.62 "Cascadia Code","SFMono-Regular",Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}
.attempt-body{margin-top:8px;border:1px solid var(--line);border-radius:9px;background:#f8fbff}
.attempt-body summary{padding:11px 13px;cursor:pointer;color:#315b88;font-size:12px;font-weight:700}
.attempt-body .json-view{border-radius:0 0 8px 8px}
.output-item{display:grid;gap:7px;padding:12px;margin-top:8px;border:1px solid #d4e4f5;border-radius:9px;background:#f7fbff}
.output-item a{color:var(--blue);font-size:12px;overflow-wrap:anywhere;white-space:normal}
.output-item pre{white-space:pre-wrap;margin:0}
.output-item small{color:var(--muted)}
.error-card{margin:16px 0;padding:15px;border:1px solid #c4d3e3;border-radius:11px;background:#f3f6fa}
.error-card>div{display:flex;align-items:center;gap:10px}
.error-card p{margin:9px 0;color:#334c68}
.error-card small{color:var(--muted)}
small.wrap{display:inline-block;max-width:360px;white-space:normal;overflow-wrap:anywhere;line-height:1.45}
dialog#jobDialog.wide{width:min(1180px,96vw);max-height:94vh}
.copy-json{white-space:nowrap}
@media(max-width:700px){.job-status-card{grid-template-columns:1fr}.job-status-side{justify-items:start}.response-head{align-items:stretch;flex-direction:column}.copy-json{justify-self:start}}
