:root{color-scheme:light dark;--bg:light-dark(#f5f7fb,#111820);--panel:light-dark(#fff,#1b2530);--text:light-dark(#1d2b3c,#eef3fa);--muted:light-dark(#53647a,#a6b6c9);--line:light-dark(#dce3ed,#354253);--brand:light-dark(#345bc7,#a6bcff);--soft:light-dark(#edf2ff,#293957);--warn:light-dark(#fff4dc,#362c1a);--warn-text:light-dark(#865400,#f4cf87)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}header{padding:20px 28px;background:var(--panel);border-bottom:1px solid var(--line);display:flex;gap:14px;align-items:center;flex-wrap:wrap}.brand{font-size:18px;font-weight:650;letter-spacing:-.4px}.identity{margin-left:auto;display:flex;gap:12px;align-items:center;font-size:12px}.badge{border-radius:6px;background:var(--soft);color:var(--brand);padding:4px 8px;font-size:12px}.production{background:var(--warn);color:var(--warn-text)}nav{padding:10px 24px;display:flex;flex-wrap:wrap;gap:4px;background:var(--panel);border-bottom:1px solid var(--line)}button,.button{font:inherit;color:inherit;padding:9px 13px;border:1px solid var(--line);border-radius:7px;background:var(--panel);cursor:pointer;text-decoration:none;display:inline-block}button:hover,.button:hover{background:var(--soft)}button:disabled{cursor:not-allowed;opacity:.55}nav button{border:0;background:transparent}nav button[aria-pressed=true]{background:var(--soft);color:var(--brand)}button.primary,.button.primary{background:var(--brand);color:light-dark(#fff,#10213c);border-color:transparent}main{max-width:1440px;margin:auto;padding:22px 28px 40px}.toolbar,.heading{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:18px}h1{font-size:26px;letter-spacing:-.7px;line-height:1.2;margin:14px 0 7px}h2{font-size:16px;margin:0 0 14px}h3{font-size:14px;margin:0 0 9px}p{margin:6px 0 14px}.muted{color:var(--muted)}.small{font-size:12px}.grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,1fr);gap:18px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px;margin-bottom:16px;min-width:0}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.cards .panel{margin:0}.filters{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--line)}label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--muted);margin-bottom:12px}select,input{font:inherit;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:9px;max-width:100%;font-size:14px}.filters label{flex:1;min-width:145px;margin:0}select{width:100%}.notice,#error{padding:12px 14px;background:var(--warn);color:var(--warn-text);border-radius:8px;margin:14px 0}.weight{display:grid;grid-template-columns:1fr 80px;gap:12px;align-items:center;margin:12px 0}.weight label{margin:0}.weight input{width:100%}.check{flex-direction:row;align-items:center;font-size:13px}.route{padding:14px 0;border-bottom:1px solid var(--line)}.route .row,.row{display:flex;align-items:center;gap:10px;justify-content:space-between;flex-wrap:wrap}.pill{display:inline-block;padding:3px 7px;font-size:11px;background:var(--soft);border-radius:5px;margin-right:5px}.path{padding:14px;background:var(--bg);border-radius:8px;margin:10px 0;overflow-wrap:anywhere}details{margin-top:18px}summary{cursor:pointer;color:var(--brand)}table{width:100%;border-collapse:collapse;font-size:12px}th{text-align:left;color:var(--muted);font-weight:500}th,td{padding:13px 10px;border-bottom:1px solid var(--line);vertical-align:top}td{font-variant-numeric:tabular-nums}td b,td small{display:block}small{font-size:12px;color:var(--muted)}.table-wrap{overflow-x:auto}.table-wrap table{min-width:660px}pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px}code{font-size:12px;overflow-wrap:anywhere}dl{display:grid;grid-template-columns:120px 1fr;gap:9px;font-size:12px}dt{color:var(--muted)}dd{margin:0;overflow-wrap:anywhere}.stat{font-size:30px;font-variant-numeric:tabular-nums;margin:8px 0}.actions{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0}#preview{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}footer{padding:20px 28px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}[hidden]{display:none!important}.login-page{display:grid;place-items:center;min-height:100vh;padding:24px}.login-panel{max-width:480px;padding:38px;background:var(--panel);border:1px solid var(--line);border-radius:18px}.login-panel h1{font-size:32px;margin:28px 0 20px}.login-panel .button{margin:12px 0 20px}@media(max-width:800px){.grid{grid-template-columns:1fr}main{padding:16px}.identity{margin-left:0}.cards{grid-template-columns:1fr}header{padding:16px}nav{padding:8px}h1{font-size:23px}}@media(max-width:400px){.panel{padding:14px}.filters label{min-width:120px}dl{grid-template-columns:1fr;gap:4px}input,select{font-size:16px}.login-panel{padding:25px}}

/* Routing is a readable flow first, with the proposed allocation kept explicit. */
:root{--map-secondary:light-dark(#89a5bd,#658aa7);--map-draft:light-dark(#8760bf,#c6a4fb)}
.routing-layout{grid-template-columns:minmax(0,1fr) 330px;align-items:start}.routing-panel{padding:24px}.map-toolbar{display:flex;justify-content:space-between;align-items:start;gap:16px}.map-toolbar h2{margin-bottom:3px}.map-toolbar label{width:140px;margin-bottom:0}.map-mode{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:18px}.map-mode button{padding:7px 12px;font-size:12px}.map-mode button[aria-pressed=true]{background:var(--soft);border-color:var(--brand);color:var(--brand)}.map-mode span{margin-left:auto}.map-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:18px 0 0}.map-status>span:last-child{margin-left:auto}.map-canvas{--map-edge:var(--brand);position:relative;display:grid;grid-template-columns:minmax(130px,1fr) 42px minmax(145px,1fr) 58px minmax(165px,1.2fr);align-items:center;padding:26px 0;min-height:350px}.map-canvas.is-draft{--map-edge:var(--map-draft)}.map-wires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.map-input{grid-column:1}.map-rule{grid-column:3}.map-targets{grid-column:5;display:flex;flex-direction:column;gap:18px}.map-input,.map-rule,.map-targets{position:relative;z-index:1;min-width:0}.map-node{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:15px;overflow-wrap:anywhere}.map-node h3{margin:9px 0 5px;font-size:16px}.map-node p{margin:7px 0}.map-node .map-node-title{font-size:12px;font-weight:600}.map-step{font-size:10px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted)}.rule-node{border-color:var(--brand);background:var(--soft)}.map-target{display:block;text-align:left;width:100%;padding:14px;border-left:3px solid var(--map-edge)}.map-target:hover{border-color:var(--map-edge);background:var(--bg)}.target-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.target-head h3{margin:0}.map-percentage{font-size:21px;line-height:1.2;color:var(--map-edge)}.map-percentage:only-child{font-size:16px}.target-off{border-style:dashed}.allocation-delta{display:block;color:var(--map-draft);font-size:12px;font-weight:600;margin:9px 0}.map-legend{display:flex;gap:15px;flex-wrap:wrap;padding:16px 0;border-top:1px solid var(--line);color:var(--muted)}.map-legend span{display:flex;align-items:center;gap:6px}.legend-line{display:inline-block;width:20px;height:0;border-top:3px solid var(--brand)}.legend-line.draft{border-color:var(--map-draft)}.legend-line.unknown{border-top-style:dashed;border-top-width:2px}.map-inspector{background:var(--bg);padding:16px;border-radius:10px;margin-bottom:16px;border:1px solid var(--line)}.unrouted-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}.unrouted-node{display:flex;flex-direction:column;gap:3px;text-align:left;border-style:dashed}.split-label{margin-top:18px}input[type=range]{width:100%;padding:0;accent-color:var(--brand)}.text-button{border:0;background:transparent;color:var(--brand);padding:4px 0;font-size:12px}.allocation-comparison{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}.allocation-comparison svg{width:100%;height:14px;border-radius:4px}.allocation-comparison h3{font-size:12px}.allocation-comparison p{margin:5px 0}button:focus-visible,summary:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
@media(max-width:1200px){.routing-layout{grid-template-columns:1fr}.routing-layout>article:last-child{max-width:none}.map-canvas{grid-template-columns:minmax(130px,1fr) 60px minmax(145px,1fr) 90px minmax(165px,1.2fr)}}
@media(max-width:700px){.routing-panel{padding:18px}.map-canvas{grid-template-columns:1fr;gap:44px;min-height:0}.map-input,.map-rule,.map-targets{grid-column:1}.map-targets{gap:16px}.map-input,.map-rule{width:100%}.map-mode span{margin-left:0;width:100%;margin-top:5px}.map-status>span:last-child{margin-left:0}.map-targets{display:grid;grid-template-columns:1fr 1fr}.map-percentage{font-size:19px}.unrouted-list{grid-template-columns:1fr}.map-node{padding:12px}}
@media(max-width:420px){.map-targets{gap:10px}.map-target .target-head{align-items:start;flex-direction:column}.map-target h3{font-size:14px}.map-toolbar label{width:110px}.map-step{font-size:9px}}

/* Official Inferact colors; appearance and density are independent preferences. */
:root {
  --font-body: "STK Bureau Sans", "Geist", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-label: "STK Bureau Sans Semi-Mono", "Geist Mono", ui-monospace, monospace;
  --bg: light-dark(#E2F1FB, #323842);
  --panel: light-dark(#FAFAFD, #323842);
  --text: light-dark(#323842, #FAFAFD);
  --muted: light-dark(#536170, #bfd0de);
  --line: light-dark(#bdcfdd, #647180);
  --brand: light-dark(#323842, #70C1FF);
  --soft: light-dark(#E2F1FB, #404f60);
  --warn: light-dark(#f7f6ca, #414132);
  --warn-text: light-dark(#555526, #F0EE82);
  --map-secondary: light-dark(#7092ab, #91acc1);
  --map-draft: light-dark(#7053a7, #C4B5FD);
}
:root[data-theme=light] { color-scheme: light; }
:root[data-theme=dark] { color-scheme: dark; }
body { font-family: var(--font-body); }
#currentVersions, #versionDiff { overflow-wrap: anywhere; }
.brand { display: flex; align-items: center; gap: 22px; flex-shrink: 0; }
.brand img { display: block; width: 149px; height: 36px; }
.brand .logo-night { display: none; }
:root[data-theme=dark] .brand .logo-day { display: none; }
:root[data-theme=dark] .brand .logo-night { display: block; }
.product-name { border-left: 1px solid var(--line); padding-left: 18px; font-size: 13px; font-weight: 500; letter-spacing: 0; }
header { gap: 12px; padding-block: 18px; }
.appearance { display: flex; align-items: center; gap: 18px; margin-left: auto; flex-wrap: wrap; }
.theme-choices { display: flex; border: 1px solid var(--line); border-radius: 7px; padding: 2px; }
.theme-choices button { border: 0; background: transparent; padding: 5px 9px; font-size: 12px; border-radius: 4px; }
.theme-choices button[aria-pressed=true] { background: var(--text); color: var(--panel); }
.style-toggle { flex-direction: row; align-items: center; gap: 8px; margin: 0; color: var(--text); cursor: pointer; white-space: nowrap; }
.style-toggle input { appearance: none; position: relative; width: 30px; height: 18px; border: 1px solid var(--muted); border-radius: 20px; padding: 0; margin: 0; background: var(--panel); cursor: pointer; }
.style-toggle input::after { content: ""; position: absolute; width: 10px; height: 10px; top: 3px; left: 3px; border-radius: 50%; background: var(--muted); }
.style-toggle input:checked { background: var(--text); border-color: var(--text); }
.style-toggle input:checked::after { left: 15px; background: var(--panel); }
.identity { margin-left: 8px; }
input:focus-visible, select:focus-visible, .button:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
input[type=checkbox] { accent-color: var(--brand); }
.login-page { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 36px; }
.login-appearance { width: min(100%, 650px); display: flex; justify-content: flex-end; }
.login-panel { width: min(100%, 650px); max-width: 650px; margin: 0; padding: 48px; }
.login-panel h1 { font-size: 40px; line-height: 1.15; max-width: 490px; margin-block: 38px 24px; }
.login-panel .brand { flex-wrap: wrap; }

/* Unsloppify: hard edges, restrained emphasis, and a denser working surface. */
:root[data-style=plain] { --bg: light-dark(#FAFAFD, #323842); --line: light-dark(#8d9da9, #7c8b9a); }
[data-style=plain] :is(button,.button,.panel,.badge,.pill,.notice,#error,input,select,.path,.map-node,.map-inspector,.theme-choices,.allocation-comparison svg,.login-panel) { border-radius: 0; box-shadow: none; }
[data-style=plain] body { font-size: 13px; }
[data-style=plain] header { padding-block: 12px; }
[data-style=plain] nav { padding-block: 0; gap: 18px; }
[data-style=plain] nav button { padding: 14px 2px 11px; border-bottom: 3px solid transparent; }
[data-style=plain] nav button[aria-pressed=true] { border-bottom-color: var(--text); background: transparent; color: var(--text); }
[data-style=plain] :is(nav button,.badge,.pill,.map-step,.product-name,th,.theme-choices button,.style-toggle) { font-family: var(--font-label); }
[data-style=plain] :is(.badge,.pill) { background: transparent; border: 1px solid var(--line); color: var(--text); padding: 2px 6px; }
[data-style=plain] :is(.badge.production,.notice,#error) { background: var(--warn); color: var(--warn-text); }
[data-style=plain] .panel { padding: 16px; }
[data-style=plain] .grid { gap: 14px; }
[data-style=plain] .routing-panel { padding: 20px; }
[data-style=plain] .heading { margin-bottom: 12px; }
[data-style=plain] h1 { font-size: 28px; letter-spacing: -.9px; }
[data-style=plain] h2 { font-size: 15px; }
[data-style=plain] .filters { gap: 14px; margin-bottom: 16px; padding-bottom: 14px; }
[data-style=plain] :is(select,input:not([type=range]):not([type=checkbox])) { padding: 7px 9px; }
[data-style=plain] :is(th,td) { padding-block: 10px; }
[data-style=plain] .map-node { padding: 12px; }
[data-style=plain] .rule-node { background: var(--panel); border-color: var(--text); border-top: 3px solid var(--text); }
[data-style=plain] .map-canvas { min-height: 320px; padding-block: 22px; }
[data-style=plain] .style-toggle input::after { border-radius: 0; }
[data-style=plain] .style-toggle input:checked { background: #F0EE82; border-color: var(--text); }
[data-style=plain] .style-toggle input:checked::after { background: #323842; }
[data-style=plain] .login-panel { border-top: 4px solid var(--text); padding: 40px; }
[data-style=plain] .login-panel h1 { font-size: 38px; }
@media (max-width: 1100px) {
  header .identity { margin-left: auto; }
}
@media (max-width: 800px) {
  header .appearance { margin-left: 0; }
  header .identity { margin-left: 0; }
  [data-style=plain] nav { gap: 12px; }
  [data-style=plain] nav button { padding-block: 10px 8px; }
  [data-style=plain] h1 { font-size: 25px; }
}
@media (max-width: 480px) {
  .brand { gap: 16px; }
  .brand img { width: 132.5px; height: 32px; }
  .product-name { padding-left: 14px; font-size: 12px; }
  .appearance { gap: 14px; width: 100%; justify-content: space-between; }
  header .identity { width: 100%; justify-content: space-between; }
  .login-page { padding: 18px; gap: 24px; }
  .login-panel, [data-style=plain] .login-panel { padding: 24px; }
  .login-panel .product-name { border: 0; padding-left: 0; }
  .login-panel h1, [data-style=plain] .login-panel h1 { font-size: 30px; }
  [data-style=plain] .routing-panel { padding: 14px; }
}

/* Identity management shares both appearance modes with the routing console. */
.keys-toolbar{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin:20px 0}
.keys-toolbar label{min-width:200px;flex:1;max-width:480px}
#identityKeys td:first-child{min-width:220px}
#identityKeys td:first-child small{font-family:monospace;overflow-wrap:anywhere}
#identityKeys td:last-child{min-width:180px}
#identityKeys td button{margin:2px 6px 2px 0}
#keysEmpty{padding:16px}
#tenantSummary{overflow-wrap:anywhere}
#identityReceipt{overflow-wrap:anywhere;margin:18px 0}
dialog{color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:12px;width:min(520px,calc(100vw - 40px));max-height:85vh;padding:24px;box-shadow:0 16px 64px #0004}
dialog::backdrop{background:#0007}
dialog h2{margin-top:0}
dialog label{display:block;margin:14px 0}
dialog input,dialog select{width:100%;box-sizing:border-box}
dialog .actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:22px}
#identityFormError{color:var(--danger,#b42318);overflow-wrap:anywhere}
#keySecret{font-family:monospace}
html[data-style="plain"] dialog{border-radius:0;box-shadow:none;padding:18px}
@media(max-width:640px){.keys-toolbar label{max-width:none;flex-basis:100%}.keys-toolbar button{flex:1}dialog{padding:18px}}

/* Global topology keeps totals fixed while category focus highlights routes. */
.topology-controls{display:flex;gap:14px;min-width:420px}.topology-controls label{flex:1;margin:0}.topology-scroll{overflow-x:auto;margin-top:18px}.topology-canvas{position:relative;min-width:900px;padding:0 2px}.topology-canvas>div{position:relative;z-index:1}#topologyWires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.topology-wire{fill:none;stroke:var(--brand);stroke-width:1.5;opacity:.55}.topology-wire.stale{stroke-dasharray:5 5}.topology-wire.dim{opacity:.1}.topology-wire.selected{stroke-width:3;opacity:1}.topology-global-card{width:62%;margin:0 auto;padding:20px 24px}.topology-global-card h2{margin:7px 0}.topology-stats{display:flex;gap:22px;margin:13px 0}.topology-stats>div{flex:1;min-width:0}.topology-stats strong{display:block;font:600 23px/1.2 var(--font-label);font-variant-numeric:tabular-nums}.topology-stats small{font-size:10px;text-transform:uppercase;letter-spacing:.5px}.topology-global-card .topology-stats strong{font-size:32px}.topology-breakdown{display:flex;flex-wrap:wrap;gap:5px;max-height:135px;overflow:auto;margin-top:12px}.category-chip{display:flex;gap:8px;justify-content:space-between;align-items:center;text-align:left;font-size:10px;padding:4px 7px;max-width:100%;overflow-wrap:anywhere}.category-chip span{white-space:nowrap;font-size:10px}.topology-entry-labels,.topology-regions,.topology-edge-labels,.topology-clusters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.topology-entry-labels{height:105px;align-items:center;pointer-events:none}.topology-entry-label{background:var(--panel);border:1px solid var(--line);padding:5px 10px;justify-self:center;text-align:center}.topology-entry-label strong,.topology-entry-label small{display:block}.topology-region{margin:0;padding:18px}.topology-region h2{font-size:18px;margin:8px 0}.topology-region details{margin-top:8px;font-size:11px}.topology-region details p{margin:6px 0}.topology-region .topology-stats{gap:10px}.topology-region .topology-stats strong{font-size:19px}.topology-region .topology-breakdown{max-height:105px}.topology-edge-labels{padding:26px 0 54px;min-height:195px;align-items:start;pointer-events:none}.topology-edge-lane{display:flex;flex-direction:column;align-items:center;gap:5px}.topology-edge-lane>small{background:var(--bg);padding:0 5px}.topology-edge-label{pointer-events:auto;display:flex;gap:16px;justify-content:space-between;width:85%;font-size:10px;padding:5px 9px;background:var(--panel)}.topology-edge-label strong{min-width:35px;text-align:right}.topology-cluster{padding:17px;margin:0;align-self:start}.topology-cluster h2{font-size:17px;margin:6px 0}.topology-models{display:grid;gap:9px}.topology-model{display:flex;flex-direction:column;align-items:start;text-align:left;gap:4px;padding:12px;width:100%;overflow-wrap:anywhere;background:var(--bg)}.topology-model b{font-size:12px}.topology-model small{font-size:10px}.topology-model .pill{font-size:9px;padding:2px 5px}.is-muted{opacity:.4}.topology-legend{display:flex;gap:20px;flex-wrap:wrap;color:var(--muted);margin:22px 0}.topology-wrap{overflow-wrap:anywhere}.topology-healthy{border:1px solid var(--brand)}.query-layout{grid-template-columns:minmax(300px,.9fr) minmax(0,1.3fr);align-items:start}.query-parameters{display:grid;grid-template-columns:1fr 1fr;gap:14px}textarea{font:inherit;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:10px;resize:vertical;width:100%}.query-response{min-height:180px;max-height:600px;overflow:auto;line-height:1.7}.query-hop{padding:12px;border:1px solid var(--line);background:var(--bg);margin:8px 0;overflow-wrap:anywhere}.query-hop small{display:block}.query-hop-arrow{text-align:center;color:var(--muted)}:root[data-style=plain] .topology-model,:root[data-style=plain] textarea{border-radius:0}@media(max-width:800px){.topology-controls{min-width:0;width:100%}.query-layout{grid-template-columns:1fr}.topology-scroll{padding-bottom:16px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.topology-edge-label{flex-wrap:wrap}.topology-edge-label>small{flex-basis:100%;text-align:left;font-size:9px}.topology-entry-label{max-width:95%;overflow-wrap:anywhere}.topology-model{gap:3px;padding:10px}.topology-models{gap:8px}
