/* Dark is the default trading-desk theme; [data-theme="light"] swaps the same tokens. */
:root {
  color-scheme: dark;
  --paper: #05080c;
  --surface: #0d141b;
  --surface-raised: #131c25;
  --surface-muted: #1a242e;
  --surface-sunken: #0a1017;
  --inset: #080e14;
  --control: #131c26;
  --rail: #090f15;
  --header: #101822;
  --subheader: #0c131a;
  --hover: #16212c;
  --line: #22303d;
  --line-soft: #1a2530;
  --line-strong: #374c5e;
  --ink: #e9f0f5;
  --ink-soft: #b3c2cd;
  --graphite: #7f929f;
  --graphite-dim: #61737f;
  --accent: #52cfe2;
  --accent-strong: #8ce7f5;
  --accent-soft: #0e2b33;
  --accent-line: #1a4450;
  --accent-glow: rgb(82 207 226 / 18%);
  --on-accent: #04141a;
  --green: #3fd894;
  --green-dim: #8ecdb1;
  --green-soft: #0c2620;
  --green-line: #205946;
  --green-glow: rgb(63 216 148 / 15%);
  --amber: #ecb44e;
  --amber-ink: #f6dcab;
  --amber-soft: #2b2314;
  --amber-line: #5b4622;
  --amber-glow: rgb(236 180 78 / 13%);
  --red: #ff6f7d;
  --red-ink: #ffc7cd;
  --red-soft: #2c1a1f;
  --red-line: #63313b;
  --red-glow: rgb(255 111 125 / 14%);
  --danger-bg: #b8404e;
  --danger-line: #e0707c;
  --danger-surface: #191218;
  --on-danger: #fff6f7;
  --blue: #7c9bff;
  --blue-soft: #161f38;
  --blue-line: #2e3f68;
  --blue-raised: #273662;
  --blue-ink: #dde6ff;
  --backdrop: rgb(2 5 8 / 80%);
  --shadow: 0 18px 44px rgb(0 0 0 / 45%);
  --panel-shadow: inset 0 1px 0 rgb(255 255 255 / 4%);
  --radius: 6px;
  --sidebar: 222px;
  --font-display: "Avenir Next Condensed", "DIN Alternate", "Arial Narrow", sans-serif;
  --font-body: "Avenir Next", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-data: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

:root[data-theme="light"] {
  color-scheme: light;
  --paper: #eaeef4;
  --surface: #ffffff;
  --surface-raised: #f6f8fc;
  --surface-muted: #e6ebf2;
  --surface-sunken: #e9eff6;
  --inset: #f4f7fa;
  --control: #f7f9fc;
  --rail: #ffffff;
  --header: #eef2f8;
  --subheader: #edf2f7;
  --hover: #eaf1f8;
  --line: #d7dfe8;
  --line-soft: #dfe6ee;
  --line-strong: #b3c1cf;
  --ink: #0c1922;
  --ink-soft: #3b4b5a;
  --graphite: #647688;
  --graphite-dim: #6d7d8c;
  --accent: #0a7c8f;
  --accent-strong: #075e6d;
  --accent-soft: #e0f3f7;
  --accent-line: #b2dee6;
  --accent-glow: rgb(10 124 143 / 16%);
  --on-accent: #ffffff;
  --green: #0d8a5c;
  --green-dim: #2c7a5b;
  --green-soft: #e2f4ea;
  --green-line: #a6d8bd;
  --green-glow: rgb(13 138 92 / 16%);
  --amber: #9a6a08;
  --amber-ink: #6a4805;
  --amber-soft: #fbf1da;
  --amber-line: #e3cb95;
  --amber-glow: rgb(154 106 8 / 14%);
  --red: #cb2a3e;
  --red-ink: #8d1a2a;
  --red-soft: #fceaec;
  --red-line: #eebec5;
  --red-glow: rgb(203 42 62 / 14%);
  --danger-bg: #c02b3f;
  --danger-line: #a01f31;
  --danger-surface: #fdeff1;
  --on-danger: #ffffff;
  --blue: #2c50d6;
  --blue-soft: #e7ecfd;
  --blue-line: #bbc9f6;
  --blue-raised: #dde5fc;
  --blue-ink: #1f3596;
  --backdrop: rgb(16 26 38 / 45%);
  --shadow: 0 14px 34px rgb(20 35 55 / 14%);
  --panel-shadow: 0 1px 2px rgb(16 32 48 / 6%);
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--paper); }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--font-body); font-size: 14px; letter-spacing: 0; font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased; }
button, input, select { font: inherit; letter-spacing: 0; }
button { color: inherit; }
button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
[hidden] { display: none !important; }
/* Keeps the light/dark swap from snapping; only colour properties transition. */
*, *::before, *::after { transition: background-color 130ms linear, border-color 130ms linear, color 130ms linear, fill 130ms linear, stroke 130ms linear; }
h1, h2, p { margin: 0; }
h1, h2 { font-family: var(--font-display); }
h1 { font-size: 25px; line-height: 1.1; font-weight: 700; }
h2 { font-size: 17px; line-height: 1.25; font-weight: 650; }
code { color: var(--ink-soft); font-family: var(--font-data); }
.utility-label { color: var(--graphite); font-family: var(--font-data); font-size: 9px; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; }
.numeric, td.numeric { text-align: right; font-family: var(--font-data); white-space: nowrap; }

.brand-mark { width: 28px; height: 28px; display: grid; grid-template-columns: repeat(3, 1fr); align-items: end; gap: 3px; padding: 4px; color: var(--accent); border: 1px solid currentColor; border-radius: 3px; }
.brand-mark span { background: currentColor; }
.brand-mark span:nth-child(1) { height: 35%; }
.brand-mark span:nth-child(2) { height: 80%; }
.brand-mark span:nth-child(3) { height: 55%; }

.login-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: var(--paper); }
.login-shell { width: min(900px, 100%); min-height: 540px; display: grid; grid-template-columns: 1.05fr .95fr; overflow: hidden; background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow); }
.login-brand { position: relative; isolation: isolate; padding: 48px; display: flex; flex-direction: column; justify-content: flex-end; gap: 14px; overflow: hidden; color: var(--ink); background: linear-gradient(160deg, var(--surface-sunken), var(--inset) 55%, var(--accent-soft)); border-right: 1px solid var(--line); }
.login-brand::before { content: ""; position: absolute; inset: 96px 48px auto; z-index: -1; height: 1px; background: var(--line); box-shadow: 0 38px 0 var(--line), 0 76px 0 var(--line); }
.login-brand::after { content: ""; position: absolute; top: 95px; left: 48px; z-index: -1; width: 42px; height: 3px; background: var(--accent); animation: rail-scan 3.6s ease-in-out infinite alternate; }
.login-brand .brand-mark { margin-bottom: auto; }
.login-brand .utility-label { color: var(--graphite); }
.login-brand h1 { max-width: 6em; font-size: 44px; }
.login-status { display: flex; align-items: center; gap: 8px; color: var(--ink-soft); font-family: var(--font-data); font-size: 10px; }
.status-separator { color: var(--graphite-dim); }
.status-dot { width: 7px; height: 7px; display: inline-block; flex: none; border-radius: 50%; }
.status-ready { background: var(--green); box-shadow: 0 0 0 3px var(--green-glow); }
.status-warning-dot { background: var(--amber); box-shadow: 0 0 0 3px var(--amber-glow); }
.status-danger-dot { background: var(--red); box-shadow: 0 0 0 3px var(--red-glow); }
.login-form-wrap { display: grid; place-items: center; padding: 48px; }
.login-form { width: min(320px, 100%); display: grid; gap: 18px; }
.form-heading { margin-bottom: 8px; display: grid; gap: 6px; }
.login-form label { display: grid; gap: 7px; color: var(--ink-soft); font-size: 12px; font-weight: 500; }
.login-form label small { color: var(--graphite); font-weight: 400; }
.login-form input, .filter-bar select { width: 100%; height: 40px; padding: 0 11px; color: var(--ink); background: var(--inset); border: 1px solid var(--line); border-radius: 4px; }
.login-form input:hover, .filter-bar select:hover { border-color: var(--line-strong); }
.login-form input:focus { border-color: var(--accent); }
.form-error { padding: 10px 12px; color: var(--red-ink); background: var(--red-soft); border-left: 3px solid var(--red); font-size: 12px; }
.command-button { height: 42px; padding: 0 14px; display: flex; justify-content: space-between; align-items: center; color: var(--on-accent); background: var(--accent); border: 0; border-radius: 4px; cursor: pointer; font-weight: 700; }
.command-button:hover { background: var(--accent-strong); }
.command-button:disabled { opacity: .55; cursor: wait; }

.app-shell { min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 20; width: var(--sidebar); padding: 18px 12px 14px; display: flex; flex-direction: column; color: var(--ink-soft); background: var(--rail); border-right: 1px solid var(--line); }
.sidebar-brand { height: 50px; padding: 0 9px; display: flex; align-items: center; gap: 11px; color: var(--ink); }
.sidebar-brand > div:last-child { display: grid; line-height: 1.05; }
.sidebar-brand strong { font-family: var(--font-display); font-size: 18px; }
.sidebar-brand span { color: var(--graphite-dim); font-family: var(--font-data); font-size: 9px; text-transform: uppercase; }
.primary-nav { display: grid; gap: 3px; margin-top: 24px; }
.nav-item { position: relative; width: 100%; height: 40px; padding: 0 10px; display: flex; align-items: center; gap: 10px; color: var(--graphite); background: transparent; border: 1px solid transparent; border-radius: 5px; cursor: pointer; text-align: left; }
.nav-item svg { width: 16px; height: 16px; flex: none; }
.nav-item:hover { color: var(--ink); background: var(--surface-raised); border-color: var(--line); }
.nav-item.is-active { color: var(--blue-ink); background: var(--blue-soft); border-color: var(--blue-line); }
.nav-item.is-active::before { content: ""; position: absolute; inset: 9px auto 9px -1px; width: 2px; background: var(--blue); }
.sidebar-foot { margin-top: auto; padding: 14px 8px 0; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); }
.mode-badge { max-width: 136px; padding: 4px 7px; overflow: hidden; color: var(--green); background: var(--green-soft); border: 1px solid var(--green-line); border-radius: 3px; font-family: var(--font-data); font-size: 9px; font-weight: 700; white-space: nowrap; text-overflow: ellipsis; }
.icon-command { width: 34px; height: 34px; padding: 0; display: inline-grid; place-items: center; color: var(--ink-soft); background: var(--control); border: 1px solid var(--line); border-radius: 4px; cursor: pointer; }
.icon-command:hover { color: var(--ink); background: var(--surface-muted); border-color: var(--line-strong); }
.icon-command svg { width: 16px; height: 16px; }
.sidebar .icon-command { background: transparent; }
.theme-toggle svg { grid-area: 1 / 1; }
.theme-toggle .icon-moon, :root[data-theme="light"] .theme-toggle .icon-sun { display: none; }
:root[data-theme="light"] .theme-toggle .icon-moon { display: block; }
.page-theme-switch { position: fixed; top: 18px; right: 18px; z-index: 30; }

.workspace { min-height: 100vh; margin-left: var(--sidebar); padding: 0 28px 42px; }
.workspace-header { position: relative; height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); }
.workspace-header::before { content: ""; position: absolute; right: 0; bottom: -1px; left: 0; height: 1px; background: var(--line); }
.workspace-header::after { content: ""; position: absolute; bottom: -2px; left: 0; width: 48px; height: 3px; background: var(--accent); animation: rail-scan 4.8s ease-in-out infinite alternate; }
.workspace-header > div:first-child { display: grid; gap: 5px; }
.header-actions { display: flex; align-items: center; gap: 8px; }
.system-clock { min-width: 88px; display: grid; justify-items: end; margin-right: 6px; }
.system-clock span { color: var(--graphite); font-family: var(--font-data); font-size: 8px; }
.system-clock strong { font-family: var(--font-data); font-size: 12px; font-weight: 500; }
.user-chip { height: 38px; margin-left: 6px; display: flex; align-items: center; gap: 9px; }
.user-chip > span { width: 30px; height: 30px; display: grid; place-items: center; color: var(--blue-ink); background: var(--blue-raised); border: 1px solid var(--blue-line); border-radius: 4px; font-weight: 700; }
.user-chip > div { display: grid; line-height: 1.2; }
.user-chip small { color: var(--graphite); text-transform: capitalize; }

.spread-tape { min-height: 54px; margin: 18px 0; display: grid; grid-template-columns: 132px minmax(0, 1fr); overflow: hidden; background: var(--inset); border: 1px solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--panel-shadow); }
.tape-title { padding: 9px 12px; display: grid; align-content: center; color: var(--ink); background: var(--surface-raised); border-right: 1px solid var(--line); font-family: var(--font-data); }
.tape-title span { color: var(--accent); font-size: 9px; font-weight: 700; }
.tape-title small { margin-top: 3px; color: var(--graphite-dim); font-size: 8px; }
.tape-items { min-width: 0; display: flex; overflow-x: auto; }
.tape-item { min-width: 188px; padding: 7px 12px; display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; color: var(--ink); background: transparent; border: 0; border-right: 1px solid var(--line); cursor: pointer; text-align: left; }
.tape-item:hover { background: var(--accent-soft); }
.tape-item strong { font-size: 12px; }
.tape-item b { font-family: var(--font-data); font-size: 11px; }
.tape-item small { color: var(--graphite); font-size: 9px; white-space: nowrap; }
.empty-inline { margin: auto 14px; color: var(--graphite); font-size: 12px; }

.view { display: none; }
.view.is-active { display: block; animation: view-in 160ms ease-out; }
@keyframes view-in { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }
@keyframes rail-scan { from { transform: translateX(0); } to { transform: translateX(min(42vw, 520px)); } }
.metrics-band { min-height: 86px; margin-bottom: 18px; display: grid; grid-template-columns: repeat(7, minmax(110px, 1fr)); overflow-x: auto; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--panel-shadow); }
.metric-cell { min-width: 112px; padding: 14px 16px; display: grid; align-content: center; gap: 4px; border-right: 1px solid var(--line); }
.metric-cell:last-child { border-right: 0; }
.metric-cell span { color: var(--graphite); font-size: 10px; }
.metric-cell strong { font-family: var(--font-data); font-size: 22px; font-weight: 500; letter-spacing: -.015em; }
.metric-cell.is-alert strong { color: var(--red); }

.split-layout { display: grid; grid-template-columns: minmax(0, 1fr) 292px; gap: 18px; margin-bottom: 18px; }
.work-panel { min-width: 0; margin-bottom: 18px; overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--panel-shadow); }
.split-layout .work-panel { margin-bottom: 0; }
.panel-header { min-height: 58px; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: var(--header); border-bottom: 1px solid var(--line); }
.panel-header > div:first-child { display: grid; gap: 3px; }
.panel-actions, .access-summary-actions { display: flex; align-items: center; gap: 8px; }
.text-command { padding: 6px; display: inline-flex; align-items: center; gap: 7px; color: var(--accent); background: transparent; border: 0; cursor: pointer; font-size: 12px; }
.text-command:hover { color: var(--accent-strong); }
.text-command svg { width: 14px; height: 14px; }
.count-label { color: var(--graphite); font-family: var(--font-data); font-size: 10px; }
.table-scroll { max-width: 100%; overflow: auto; }
table { width: 100%; border-collapse: collapse; white-space: nowrap; }
th { position: sticky; top: 0; z-index: 1; height: 34px; padding: 0 12px; color: var(--graphite); background: var(--surface-sunken); border-bottom: 1px solid var(--line); text-align: left; font-family: var(--font-data); font-size: 9px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; }
td { height: 44px; padding: 0 12px; border-bottom: 1px solid var(--line-soft); font-size: 12px; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: var(--hover); }
.route-pair { display: inline-flex; align-items: center; gap: 6px; }
.route-pair span { color: var(--graphite); }
.positive { color: var(--green); }
.negative { color: var(--red); }
.muted { color: var(--graphite); }
.status-tag { display: inline-flex; align-items: center; gap: 5px; padding: 3px 6px; border: 1px solid transparent; border-radius: 3px; font-family: var(--font-data); font-size: 9px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.status-ok { color: var(--green); background: var(--green-soft); border-color: var(--green-line); }
.status-warning { color: var(--amber); background: var(--amber-soft); border-color: var(--amber-line); }
.status-blocked { color: var(--red); background: var(--red-soft); border-color: var(--red-line); }
.risk-score { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-data); }
.risk-score::before { content: ""; width: 7px; height: 7px; flex: none; border-radius: 50%; background: var(--green); }
.risk-score.medium::before { background: var(--amber); }
.risk-score.high::before { background: var(--red); }
.row-command { width: 28px; height: 28px; color: var(--ink); background: var(--control); border: 1px solid var(--line); border-radius: 3px; cursor: pointer; }
.row-command:hover { border-color: var(--blue); }
.row-command svg { width: 13px; height: 13px; }
.exchange-rail { display: grid; }
.exchange-row { min-height: 61px; padding: 10px 14px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; border-bottom: 1px solid var(--line-soft); }
.exchange-row:last-child { border-bottom: 0; }
.exchange-row > div { display: grid; }
.exchange-row small, .exchange-row code { color: var(--graphite); }
.exchange-row code { font-family: var(--font-data); font-size: 10px; }
.risk-strip { display: grid; grid-template-columns: repeat(3, 1fr); }
.risk-item { min-height: 72px; padding: 13px 16px; display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; border-right: 1px solid var(--line); }
.risk-item:last-child { border-right: 0; }
.risk-item .status-tag { grid-row: span 2; align-self: start; }
.risk-item small { color: var(--graphite); }
.empty-state { padding: 28px; color: var(--graphite); text-align: center; }

.filter-bar { margin-bottom: 12px; padding: 12px 14px; display: flex; flex-wrap: wrap; gap: 10px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--panel-shadow); }
.filter-bar label { min-width: 145px; display: grid; gap: 4px; color: var(--graphite); font-family: var(--font-data); font-size: 9px; text-transform: uppercase; }
.filter-bar select { height: 34px; min-width: 145px; }
.ledger-filter-bar, .listing-filter-bar { align-items: end; }
.ledger-filter-bar label, .listing-filter-bar label { min-width: 132px; flex: 1 1 132px; }
.ledger-filter-bar input, .listing-filter-bar input { width: 100%; height: 34px; min-width: 132px; padding: 0 9px; color: var(--ink); background: var(--inset); border: 1px solid var(--line); border-radius: 4px; }
.ledger-filter-bar input:hover, .ledger-filter-bar input:focus, .listing-filter-bar input:hover, .listing-filter-bar input:focus { border-color: var(--line-strong); }
.embedded-filter-bar { margin: 0; border-width: 0 0 1px; border-radius: 0; }
.ledger-filter-actions { height: 34px; margin-left: auto; display: flex; align-items: center; gap: 6px; }
.ledger-panel { min-height: 426px; }
.ledger-data-slot, .ledger-table-scroll { min-height: 318px; }
.ledger-table { min-width: 1040px; }
.ledger-primary, .ledger-stacked { min-width: 0; display: grid; gap: 3px; }
.ledger-primary strong, .ledger-stacked strong { font-size: 11px; font-weight: 600; }
.ledger-primary code, .ledger-stacked code, .ledger-stacked small { color: var(--graphite); font-family: var(--font-data); font-size: 8px; font-weight: 400; }
.ledger-identifier { display: block; max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; user-select: all; }
.ledger-tabs button { display: inline-flex; align-items: center; gap: 7px; }
.ledger-tabs button svg { width: 14px; height: 14px; }
.pager { min-height: 48px; padding: 8px 12px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; border-top: 1px solid var(--line); }
.pager button { width: 30px; height: 30px; padding: 0; display: inline-grid; place-items: center; color: var(--ink); background: var(--control); border: 1px solid var(--line); border-radius: 3px; cursor: pointer; }
.pager button:disabled { opacity: .4; cursor: default; }
.pager button svg { width: 14px; height: 14px; }
.pager-summary { margin-right: auto; color: var(--graphite); font-family: var(--font-data); font-size: 9px; }
.pager-actions { display: flex; align-items: center; gap: 8px; }

.segmented-control { display: inline-flex; padding: 2px; background: var(--inset); border: 1px solid var(--line); border-radius: 4px; }
.segmented-control button { min-width: 46px; height: 28px; padding: 0 9px; color: var(--graphite); background: transparent; border: 0; border-radius: 2px; cursor: pointer; font-family: var(--font-data); font-size: 9px; }
.segmented-control button:hover { color: var(--ink); }
.segmented-control button.is-active { color: var(--blue-ink); background: var(--blue-raised); }
.exchange-runtime-boundary { min-height: 64px; margin-bottom: 14px; padding: 10px 14px; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: var(--green-soft); border: 1px solid var(--green-line); border-left: 3px solid var(--green); border-radius: var(--radius); }
.exchange-runtime-boundary.is-error { background: var(--amber-soft); border-color: var(--amber-line); border-left-color: var(--amber); }
.exchange-runtime-boundary > div { min-width: 0; display: grid; gap: 3px; }
.exchange-runtime-boundary strong { overflow-wrap: anywhere; font-size: 12px; }
.exchange-runtime-boundary small { color: var(--graphite); font-size: 9px; }
.exchange-monitor-grid { display: grid; grid-template-columns: minmax(520px, .95fr) minmax(480px, 1.05fr); gap: 14px; }
.exchange-monitor-grid > .work-panel { margin-bottom: 14px; }
.exchange-status-table td { vertical-align: middle; }
.exchange-status-table td small { display: block; margin-top: 3px; color: var(--graphite); font-family: var(--font-data); font-size: 8px; }
.exchange-status-table tr.is-selected { background: var(--blue-soft); box-shadow: inset 3px 0 var(--blue); }
.exchange-select { min-width: 108px; padding: 5px 0; display: grid; gap: 2px; color: var(--ink); background: transparent; border: 0; cursor: pointer; text-align: left; }
.exchange-select strong { font-size: 12px; }
.exchange-select small { color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.exchange-trend { min-height: 326px; }
.exchange-trend-metrics { display: grid; grid-template-columns: repeat(3, minmax(90px, 1fr)); border-bottom: 1px solid var(--line); }
.exchange-trend-metrics .detail-metric { min-height: 58px; padding: 9px 11px; }
.telemetry-chart { min-width: 0; overflow: hidden; background: var(--inset); border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
.telemetry-chart svg { width: 100%; height: 176px; display: block; }
.chart-legend { min-height: 36px; padding: 7px 11px; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.chart-legend strong { margin-right: auto; color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.chart-legend span { display: inline-flex; align-items: center; gap: 5px; color: var(--ink-soft); font-family: var(--font-data); font-size: 8px; }
.chart-legend i { width: 12px; height: 2px; }
.chart-legend i.series-0 { background: var(--accent); }
.chart-legend i.series-1 { background: var(--blue); }
.chart-legend i.series-2 { background: var(--green); }
.chart-legend i.series-3 { background: var(--amber); }
.telemetry-chart path.series-0 { stroke: var(--accent); }
.telemetry-chart path.series-1 { stroke: var(--blue); }
.telemetry-chart path.series-2 { stroke: var(--green); }
.telemetry-chart path.series-3 { stroke: var(--amber); }
.chart-grid { stroke: var(--line); stroke-width: 1; vector-effect: non-scaling-stroke; }
.chart-axis { fill: var(--graphite-dim); font-family: var(--font-data); font-size: 8px; }
.chart-empty { min-height: 212px; display: grid; place-items: center; color: var(--graphite); background: var(--inset); border: 1px solid var(--line-soft); font-size: 11px; }
.trend-foot { min-height: 36px; padding: 7px 11px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--graphite); font-family: var(--font-data); font-size: 8px; }
.trend-foot span { min-width: 0; overflow-wrap: anywhere; }
.data-slot { min-height: 140px; }
.tab-bar { display: flex; gap: 2px; margin-bottom: 12px; border-bottom: 1px solid var(--line); }
.tab-bar button { padding: 10px 14px; color: var(--graphite); background: transparent; border: 0; border-bottom: 2px solid transparent; cursor: pointer; }
.tab-bar button.is-active { color: var(--accent); border-bottom-color: var(--accent); }
.risk-control-bar { min-height: 70px; margin-bottom: 14px; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; color: var(--ink); background: var(--danger-surface); border: 1px solid var(--red-line); border-left: 3px solid var(--red); border-radius: var(--radius); }
.risk-control-bar > div { display: grid; gap: 4px; }
.risk-control-bar .utility-label { color: var(--graphite); }
.danger-command { height: 36px; padding: 0 12px; display: inline-flex; align-items: center; gap: 8px; color: var(--on-danger); background: var(--danger-bg); border: 1px solid var(--danger-line); border-radius: 4px; cursor: pointer; }
.danger-command svg { width: 15px; }
.danger-command:disabled, .secondary-command:disabled, .row-command:disabled { opacity: .45; cursor: not-allowed; }
.config-list { display: grid; }
.config-row { min-height: 68px; padding: 10px 16px; display: grid; grid-template-columns: minmax(190px, 1.2fr) minmax(150px, .8fr) minmax(150px, .8fr) 34px; align-items: center; gap: 10px; border-bottom: 1px solid var(--line-soft); }
.config-row:last-child { border-bottom: 0; }
.config-row > div { display: grid; gap: 2px; }
.config-row small { color: var(--graphite); }
.config-row input { height: 34px; padding: 0 9px; color: var(--ink); background: var(--inset); border: 1px solid var(--line); border-radius: 3px; font-family: var(--font-data); }
.config-row input:disabled { color: var(--graphite-dim); background: var(--paper); }

.stage-console { margin-bottom: 14px; overflow: hidden; background: var(--surface-sunken); border: 1px solid var(--line-strong); border-radius: var(--radius); }
.stage-console-header { min-height: 68px; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); }
.stage-console-header > div:first-child { display: grid; gap: 3px; }
.stage-console-meta { min-width: 210px; display: grid; justify-items: end; gap: 2px; font-family: var(--font-data); }
.stage-console-meta span, .stage-console-meta small { color: var(--graphite); font-size: 9px; }
.stage-console-meta strong { font-size: 11px; text-transform: uppercase; }
.promotion-track { min-width: 720px; margin: 0; padding: 0 10px; display: grid; grid-template-columns: repeat(5, minmax(128px, 1fr)); overflow: visible; list-style: none; background: var(--paper); }
.stage-console { overflow-x: auto; }
.promotion-track li { position: relative; min-height: 86px; padding: 17px 14px 13px 28px; display: grid; align-content: center; gap: 3px; color: var(--graphite-dim); border-right: 1px solid var(--line-soft); }
.promotion-track li:last-child { border-right: 0; }
.promotion-track li::before { content: ""; position: absolute; top: 27px; left: 11px; width: 8px; height: 8px; z-index: 1; background: var(--line); border: 2px solid var(--paper); border-radius: 50%; box-shadow: 0 0 0 1px var(--line-strong); }
.promotion-track li::after { content: ""; position: absolute; top: 31px; right: -1px; left: 18px; height: 1px; background: var(--line); }
.promotion-track li:last-child::after { right: 14px; }
.promotion-track li span, .promotion-track li small { padding-left: 1px; font-family: var(--font-data); font-size: 8px; }
.promotion-track li strong { position: relative; z-index: 1; width: max-content; max-width: 100%; padding: 2px 6px 2px 0; overflow-wrap: anywhere; background: var(--paper); font-family: var(--font-display); font-size: 14px; }
.promotion-track li.is-complete { color: var(--green-dim); }
.promotion-track li.is-complete::before { background: var(--green); box-shadow: 0 0 0 2px var(--green-glow); }
.promotion-track li.is-complete::after { background: var(--green-line); }
.promotion-track li.is-current { color: var(--ink); background: var(--surface-raised); }
.promotion-track li.is-current::before { width: 10px; height: 10px; top: 26px; left: 10px; background: var(--accent); box-shadow: 0 0 0 3px var(--accent-glow); }
.promotion-track li.is-current::after { background: var(--accent); }
.promotion-track li.is-current strong { color: var(--accent); background: var(--surface-raised); }
.promotion-track li.is-current::marker { color: var(--accent); }
.evidence-strip { min-width: 720px; display: grid; grid-template-columns: repeat(6, minmax(118px, 1fr)); border-top: 1px solid var(--line); }
.evidence-cell { min-height: 52px; padding: 9px 12px; display: grid; gap: 3px; border-right: 1px solid var(--line); }
.evidence-cell:last-child { border-right: 0; }
.evidence-cell span { color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.evidence-cell strong { font-family: var(--font-data); font-size: 10px; font-weight: 600; text-transform: uppercase; }
.evidence-cell.is-pass strong { color: var(--green); }
.evidence-cell.is-fail strong { color: var(--red); }
.evidence-cell.is-unknown strong { color: var(--amber); }
.evidence-strip > .resource-state, .readiness-decision > .resource-state, .control-facts > .resource-state { grid-column: 1 / -1; min-width: 0; }

.readiness-decision { min-height: 80px; margin-bottom: 14px; display: grid; grid-template-columns: minmax(180px, .75fr) repeat(2, minmax(170px, .65fr)) minmax(260px, 1.8fr); overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--amber); border-radius: var(--radius); }
.readiness-decision.is-ready { border-left-color: var(--green); }
.readiness-decision.is-blocked, .readiness-decision.is-error { border-left-color: var(--red); }
.decision-cell { min-width: 0; padding: 12px 15px; display: grid; align-content: center; gap: 4px; border-right: 1px solid var(--line); }
.decision-cell:last-child { border-right: 0; }
.decision-cell span { color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.decision-cell strong { overflow-wrap: anywhere; font-family: var(--font-data); font-size: 12px; font-weight: 600; }
.decision-cell small { color: var(--graphite); overflow-wrap: anywhere; }
.decision-cell.is-allowed strong { color: var(--green); }
.decision-cell.is-denied strong { color: var(--red); }

.control-grid { display: grid; gap: 14px; }
.control-grid > .work-panel { margin-bottom: 0; }
.control-grid-primary { grid-template-columns: minmax(0, 1.65fr) minmax(290px, .85fr); margin-bottom: 14px; }
.control-grid-command { grid-template-columns: minmax(340px, .95fr) minmax(0, 1.25fr); margin-bottom: 14px; }
.control-facts { min-height: 150px; display: grid; grid-template-columns: 1fr 1fr; align-content: start; }
.control-fact { min-width: 0; min-height: 58px; padding: 10px 13px; display: grid; align-content: center; gap: 3px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line-soft); }
.control-fact:nth-child(2n) { border-right: 0; }
.control-fact span { color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.control-fact strong { overflow-wrap: anywhere; font-family: var(--font-data); font-size: 10px; font-weight: 500; }

.command-workbench { border-color: var(--red-line); }
.kill-command-form { padding: 14px; display: grid; gap: 14px; }
.action-segments { min-width: 0; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: 4px; }
.action-segments legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.action-segments button { min-width: 0; min-height: 54px; padding: 7px 5px; display: grid; place-items: center; align-content: center; gap: 4px; color: var(--graphite); background: var(--inset); border: 0; border-right: 1px solid var(--line); cursor: pointer; font-size: 9px; }
.action-segments button:last-child { border-right: 0; }
.action-segments button svg { width: 15px; height: 15px; }
.action-segments button span { max-width: 100%; overflow-wrap: anywhere; }
.action-segments button:hover { color: var(--ink); background: var(--hover); }
.action-segments button.is-active { color: var(--red-ink); background: var(--red-soft); box-shadow: inset 0 -2px var(--red); }
.command-fields { display: grid; grid-template-columns: minmax(110px, .65fr) minmax(130px, .85fr) minmax(170px, 1.25fr) auto; align-items: end; gap: 9px; }
.command-fields label, .command-dialog-body label { min-width: 0; display: grid; gap: 5px; color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.command-fields input, .command-fields select, .command-dialog-body input, .command-dialog-body select, .compact-select { width: 100%; height: 36px; padding: 0 9px; color: var(--ink); background: var(--inset); border: 1px solid var(--line); border-radius: 3px; }
.command-fields .danger-command { height: 36px; white-space: nowrap; }
.inline-feedback { min-width: 0; margin: 0; padding: 9px 11px; color: var(--ink-soft); background: var(--accent-soft); border-left: 3px solid var(--accent); font-size: 11px; overflow-wrap: anywhere; }
.inline-feedback.is-error { color: var(--red-ink); background: var(--red-soft); border-left-color: var(--red); }
.inline-feedback.is-warning { color: var(--amber-ink); background: var(--amber-soft); border-left-color: var(--amber); }
.panel-feedback { margin: 0 14px 14px; }
.toggle-control { position: relative; width: 34px; height: 20px; display: inline-block; }
.toggle-control input { position: absolute; opacity: 0; pointer-events: none; }
.toggle-control span { position: absolute; inset: 0; background: var(--surface-muted); border: 1px solid var(--line-strong); border-radius: 10px; cursor: pointer; }
.toggle-control span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; background: var(--graphite); border-radius: 50%; transition: transform 140ms ease, background 140ms ease; }
.toggle-control input:checked + span { background: var(--green-soft); border-color: var(--green-line); }
.toggle-control input:checked + span::after { background: var(--green); transform: translateX(14px); }
.toggle-control input:disabled + span { opacity: .45; cursor: not-allowed; }

.runtime-config-summary, .access-summary { min-height: 64px; margin-bottom: 14px; padding: 11px 15px; display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var(--control); border: 1px solid var(--line); border-left: 3px solid var(--blue); border-radius: var(--radius); }
.runtime-config-summary.is-error, .access-summary.is-error { border-left-color: var(--red); }
.runtime-config-summary > div, .access-summary > div { min-width: 0; display: grid; gap: 3px; }
.runtime-config-summary strong, .access-summary strong { overflow-wrap: anywhere; font-family: var(--font-data); font-size: 11px; }
.runtime-config-summary small { color: var(--graphite); overflow-wrap: anywhere; }
.config-layout { display: grid; grid-template-columns: minmax(440px, 1.25fr) minmax(360px, .95fr); gap: 14px; }
.config-layout > .work-panel { margin-bottom: 0; }
.compact-select { width: min(210px, 42vw); height: 32px; color: var(--ink-soft); font-family: var(--font-data); font-size: 9px; }
.access-summary { border-left-color: var(--amber); }
.table-action-set { display: inline-flex; align-items: center; gap: 5px; }
.table-select { height: 30px; padding: 0 6px; color: var(--ink); background: var(--inset); border: 1px solid var(--line); border-radius: 3px; font-family: var(--font-data); font-size: 9px; }
.icon-row-command { width: 28px; height: 28px; padding: 0; display: inline-grid; place-items: center; color: var(--ink-soft); background: var(--control); border: 1px solid var(--line); border-radius: 3px; cursor: pointer; }
.icon-row-command:hover { color: var(--ink); border-color: var(--blue); }
.icon-row-command.is-danger:hover { color: var(--red-ink); border-color: var(--red); }
.icon-row-command:disabled { opacity: .42; cursor: not-allowed; }
.icon-row-command svg { width: 13px; height: 13px; }
.icon-row-command.is-spinning svg { animation: latency-spin 850ms linear infinite; }

.resource-state { min-height: 124px; padding: 24px 18px; display: grid; grid-template-columns: auto minmax(0, 1fr); place-content: center; align-items: center; gap: 12px; color: var(--ink-soft); }
.resource-state svg { width: 18px; color: var(--amber); }
.resource-state > div { min-width: 0; display: grid; gap: 4px; }
.resource-state strong { font-size: 12px; }
.resource-state span, .resource-state code { color: var(--graphite); font-size: 10px; overflow-wrap: anywhere; }
.resource-state.is-error svg { color: var(--red); }
.resource-state.is-empty svg { color: var(--graphite); }

.command-dialog { width: min(540px, calc(100% - 24px)); max-height: calc(100vh - 28px); padding: 0; overflow: auto; color: var(--ink); background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow); }
.command-dialog::backdrop { background: var(--backdrop); }
.command-dialog .dialog-close { position: absolute; top: 12px; right: 12px; z-index: 1; }
.command-dialog-body { padding: 24px; display: grid; gap: 16px; }
.command-dialog-body > div:first-child { padding-right: 42px; display: grid; gap: 4px; }
.command-confirm-summary { margin: 0; display: grid; grid-template-columns: 110px minmax(0, 1fr); border: 1px solid var(--line); }
.command-confirm-summary dt, .command-confirm-summary dd { min-height: 38px; margin: 0; padding: 9px 11px; border-bottom: 1px solid var(--line); }
.command-confirm-summary dt { color: var(--graphite); background: var(--inset); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.command-confirm-summary dd { overflow-wrap: anywhere; font-family: var(--font-data); font-size: 10px; }
.command-confirm-summary code { overflow-wrap: anywhere; user-select: all; }
.command-confirm-summary dt:last-of-type, .command-confirm-summary dd:last-of-type { border-bottom: 0; }
.dialog-warning { margin: 0; padding: 10px 11px; display: flex; align-items: flex-start; gap: 9px; color: var(--amber-ink); background: var(--amber-soft); border-left: 3px solid var(--amber); font-size: 11px; }
.dialog-warning svg { width: 15px; height: 15px; flex: none; }
.dialog-copy { margin: 0; color: var(--graphite); font-size: 12px; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; }
.secondary-command { height: 36px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; color: var(--ink-soft); background: var(--control); border: 1px solid var(--line); border-radius: 4px; cursor: pointer; }
.secondary-command svg { width: 14px; height: 14px; }
.command-dialog .command-button { min-width: 190px; gap: 16px; }
.command-dialog .command-button svg { width: 15px; }

.latency-toolbar { min-height: 64px; margin-bottom: 14px; padding: 11px 14px; display: flex; align-items: center; justify-content: space-between; gap: 18px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.latency-toolbar > div:first-child { min-width: 0; display: grid; gap: 4px; }
.latency-toolbar h2 { overflow-wrap: anywhere; }
.latency-toolbar-actions { display: flex; align-items: center; gap: 10px; flex: none; }
.latency-stack { display: grid; gap: 10px; }
.latency-venue { min-width: 0; overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--accent); border-radius: var(--radius); }
.latency-venue.status-degraded { border-left-color: var(--amber); }
.latency-venue.status-error { border-left-color: var(--red); }
.latency-venue.status-no_data, .latency-venue.is-loading { border-left-color: var(--line-strong); }
.latency-venue[open] { border-color: var(--line-strong); border-left-color: var(--accent); box-shadow: var(--shadow); }
.latency-venue.status-degraded[open] { border-left-color: var(--amber); }
.latency-venue.status-error[open] { border-left-color: var(--red); }
.latency-venue-summary { position: relative; min-height: 74px; padding: 11px 40px 11px 14px; display: grid; grid-template-columns: minmax(175px, .85fr) minmax(470px, 2.4fr) auto; align-items: center; gap: 16px; list-style: none; background: var(--control); cursor: pointer; }
.latency-venue-summary::-webkit-details-marker { display: none; }
.latency-venue-summary::after { content: "+"; position: absolute; right: 15px; top: 50%; color: var(--graphite); font-family: var(--font-data); font-size: 18px; transform: translateY(-50%); }
.latency-venue[open] > .latency-venue-summary::after { content: "−"; color: var(--accent); }
.latency-venue-summary:hover { background: var(--hover); }
.latency-summary-primary { min-width: 0; display: flex; align-items: center; gap: 10px; }
.latency-summary-primary > span:last-child { min-width: 0; display: grid; gap: 2px; }
.latency-summary-primary strong { overflow: hidden; font-family: var(--font-display); font-size: 17px; text-overflow: ellipsis; }
.latency-summary-primary small { overflow: hidden; color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.latency-summary-metrics { min-width: 0; display: grid; grid-template-columns: repeat(3, minmax(62px, .55fr)) minmax(286px, 2fr); align-items: center; gap: 8px; }
.latency-summary-metric { min-width: 0; padding-left: 9px; display: grid; gap: 3px; border-left: 1px solid var(--line); }
.latency-summary-metric > span, .latency-summary-queue > span { color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.latency-summary-metric strong, .latency-summary-queue strong { overflow: hidden; font-family: var(--font-data); font-size: 11px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.latency-summary-metric.is-alert strong, .latency-summary-queue.is-alert strong, .latency-summary-queue.is-alert small { color: var(--red); }
.latency-summary-queues { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(128px, 1fr)); gap: 8px; }
.latency-summary-queue { min-width: 0; padding-left: 9px; display: grid; gap: 2px; border-left: 1px solid var(--line); }
.latency-summary-queue small { overflow: hidden; color: var(--graphite); font-family: var(--font-data); font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.latency-summary-status { justify-self: end; }
.latency-venue-detail { border-top: 1px solid var(--line); }
.latency-profile-scroll, .latency-stage-scroll { max-width: 100%; overflow-x: auto; }
.latency-profile { min-width: 720px; display: grid; grid-template-columns: minmax(172px, 1.25fr) repeat(5, minmax(98px, 1fr)); border-bottom: 1px solid var(--line); }
.latency-total-label { min-height: 84px; padding: 13px 16px; display: grid; align-content: center; gap: 3px; color: var(--ink); background: var(--inset); }
.latency-total-label span, .latency-percentile span { font-family: var(--font-data); font-size: 8px; font-weight: 600; text-transform: uppercase; }
.latency-total-label strong { color: var(--accent); font-family: var(--font-data); font-size: 19px; font-weight: 500; white-space: nowrap; }
.latency-total-label small { color: var(--graphite); font-size: 8px; }
.latency-percentile { min-height: 84px; padding: 12px; display: grid; align-content: center; gap: 7px; border-right: 1px solid var(--line); }
.latency-percentile:last-child { border-right: 0; }
.latency-percentile span { color: var(--graphite); }
.latency-percentile strong { font-family: var(--font-data); font-size: 14px; font-weight: 500; white-space: nowrap; }
.latency-percentile.is-tail { background: var(--amber-soft); }
.latency-health-group { display: grid; grid-template-columns: 132px minmax(0, 1fr); background: var(--surface-sunken); border-bottom: 1px solid var(--line); }
.latency-health-label { padding: 10px 12px; display: grid; align-content: center; gap: 3px; background: var(--control); border-right: 1px solid var(--line); }
.latency-health-label strong { font-family: var(--font-data); font-size: 9px; font-weight: 600; text-transform: uppercase; }
.latency-health-label span { color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.latency-health { min-width: 0; max-width: 100%; display: flex; overflow-x: auto; }
.latency-health-cell { min-width: 118px; min-height: 60px; padding: 10px 12px; display: grid; align-content: center; gap: 4px; border-right: 1px solid var(--line); }
.latency-health-cell:last-child { border-right: 0; }
.latency-health-cell span { color: var(--graphite); font-size: 8px; text-transform: uppercase; }
.latency-health-cell strong { font-family: var(--font-data); font-size: 11px; font-weight: 500; white-space: nowrap; }
.latency-health-cell.is-alert strong { color: var(--red); }
.latency-stage-table { min-width: 760px; }
.latency-stage-table td:first-child { min-width: 270px; }
.latency-stage-table td:first-child strong, .latency-stage-table td:first-child small { display: block; }
.latency-stage-table td:first-child small { margin-top: 2px; color: var(--graphite); font-family: var(--font-data); font-size: 8px; }
.latency-stage-name { display: flex; align-items: center; gap: 8px; }
.latency-stage-name .status-tag { flex: none; }
.latency-stage-table tr.stage-not_implemented td, .latency-stage-table tr.stage-not_applicable td { color: var(--graphite); }
.latency-stage-table .tail-column { background: var(--amber-soft); }
.latency-stage-empty { min-height: 86px; padding: 26px 16px; display: grid; place-items: center; color: var(--graphite); font-size: 12px; }
.latency-venue-error { min-height: 42px; padding: 9px 14px; display: flex; align-items: center; gap: 9px; color: var(--red-ink); background: var(--red-soft); border-bottom: 1px solid var(--red-line); font-size: 12px; }
.latency-venue-error svg { width: 15px; height: 15px; flex: none; }
.latency-request-error { min-height: 180px; padding: 28px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--red); border-radius: var(--radius); }
.latency-request-error > svg { width: 20px; color: var(--red); }
.latency-request-error > div { min-width: 0; display: grid; gap: 4px; }
.latency-request-error span { color: var(--graphite); overflow-wrap: anywhere; }
.latency-request-error .text-command { display: inline-flex; align-items: center; gap: 7px; }
.latency-request-error .text-command svg { width: 14px; }
.latency-pulse { width: 9px; height: 9px; flex: none; border-radius: 50%; background: var(--line-strong); animation: latency-pulse 1.2s ease-in-out infinite; }
.latency-loading-lines { min-height: 148px; padding: 18px 14px; display: grid; align-content: start; gap: 12px; border-top: 1px solid var(--line); }
.latency-loading-lines span { height: 18px; background: var(--surface-muted); border-radius: 2px; animation: latency-pulse 1.2s ease-in-out infinite; }
.latency-loading-lines span:nth-child(1) { width: 82%; }
.latency-loading-lines span:nth-child(2) { width: 64%; }
.latency-loading-lines span:nth-child(3) { width: 72%; }
.icon-command:disabled { opacity: .48; cursor: wait; }
.icon-command.is-spinning svg { animation: latency-spin 850ms linear infinite; }
@keyframes latency-pulse { 50% { opacity: .42; } }
@keyframes latency-spin { to { transform: rotate(360deg); } }

.detail-dialog { width: min(720px, calc(100% - 28px)); max-height: calc(100vh - 40px); padding: 0; color: var(--ink); background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--radius); box-shadow: var(--shadow); }
.opportunity-dialog { width: min(1120px, calc(100% - 28px)); }
.timeline-dialog { width: min(920px, calc(100% - 28px)); }
.detail-dialog::backdrop { background: var(--backdrop); }
.dialog-close { position: absolute; top: 12px; right: 12px; }
.detail-body { padding: 24px; display: grid; gap: 20px; }
.detail-body header { padding-right: 44px; display: grid; gap: 6px; }
.detail-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); }
.detail-metric { padding: 12px; display: grid; gap: 3px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.detail-metric:nth-child(3n) { border-right: 0; }
.detail-metric span { color: var(--graphite); font-size: 10px; }
.detail-metric strong { font-family: var(--font-data); }
.reason-list { margin: 0; padding-left: 18px; color: var(--ink-soft); }
.detail-actions { display: flex; justify-content: flex-end; gap: 8px; }
.detail-actions .command-button, .detail-actions .secondary-command { min-width: 172px; }
.detail-actions .command-button { justify-content: center; gap: 8px; }
.shadow-run-dialog { width: min(920px, calc(100% - 28px)); }
.shadow-run-body { gap: 16px; }
.shadow-run-body > header { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
.shadow-run-body > header > p, .shadow-run-body > header > h2 { grid-column: 1; }
.shadow-run-body > header > .status-tag { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
.shadow-proof-rail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; background: var(--red-soft); border: 1px solid var(--red-line); border-left: 3px solid var(--red); }
.shadow-proof-rail.is-safe { background: var(--green-soft); border-color: var(--green-line); border-left-color: var(--green); }
.shadow-proof-rail .shadow-evidence-fact { border-right: 1px solid var(--red-line); }
.shadow-proof-rail.is-safe .shadow-evidence-fact { border-color: var(--green-line); }
.shadow-proof-rail .shadow-evidence-fact:last-child { border-right: 0; }
.shadow-evidence-fact { min-width: 0; min-height: 52px; padding: 10px 12px; display: grid; align-content: center; gap: 4px; }
.shadow-evidence-fact span { color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.shadow-evidence-fact strong { overflow-wrap: anywhere; font-family: var(--font-data); font-size: 10px; font-weight: 600; }
.shadow-proof-rail.is-safe .shadow-evidence-fact strong { color: var(--green); }
.shadow-run-summary { grid-template-columns: 104px minmax(0, 1fr); }
.shadow-section-heading { min-height: 30px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); }
.shadow-section-heading p { margin: 0; }
.shadow-section-heading span { color: var(--graphite); font-family: var(--font-data); font-size: 8px; }
.shadow-evidence-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); border-top: 0; }
.shadow-evidence-grid .shadow-evidence-fact { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.shadow-evidence-grid .shadow-evidence-fact:nth-child(4n) { border-right: 0; }
.shadow-evidence-grid .shadow-evidence-fact:nth-last-child(-n + 4) { border-bottom: 0; }
.shadow-legs { display: grid; border: 1px solid var(--line); border-top: 0; }
.shadow-leg-evidence + .shadow-leg-evidence { border-top: 1px solid var(--line-strong); }
.shadow-leg-evidence > header { min-height: 54px; padding: 9px 12px; display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var(--subheader); border-bottom: 1px solid var(--line); }
.shadow-leg-evidence > header > div { min-width: 0; display: grid; gap: 3px; }
.shadow-leg-evidence > header p { margin: 0; }
.shadow-leg-evidence > header h3 { overflow-wrap: anywhere; font-size: 12px; }
.shadow-leg-evidence > header > span { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }
.shadow-leg-proof { display: grid; grid-template-columns: minmax(150px, 1.1fr) repeat(2, minmax(110px, .7fr)); border-bottom: 1px solid var(--line); }
.shadow-leg-proof > * { border-right: 1px solid var(--line); }
.shadow-leg-proof > *:last-child { border-right: 0; }
.shadow-leg-proof .safety-triad { padding: 7px 9px; }
.shadow-request-grid { margin: 0; display: grid; grid-template-columns: 118px minmax(0, 1fr) 118px minmax(0, 1fr); }
.shadow-request-grid dt, .shadow-request-grid dd { min-width: 0; min-height: 38px; margin: 0; padding: 8px 10px; border-bottom: 1px solid var(--line); }
.shadow-request-grid dt { color: var(--graphite); background: var(--inset); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.shadow-request-grid dd { overflow-wrap: anywhere; color: var(--ink-soft); font-family: var(--font-data); font-size: 9px; }
.shadow-request-grid code { overflow-wrap: anywhere; user-select: all; }
.opportunity-detail-body { gap: 16px; }
.opportunity-detail-header { display: flex !important; align-items: flex-start; justify-content: space-between; gap: 18px; }
.opportunity-detail-header > div:first-child { min-width: 0; display: grid; gap: 6px; }
.opportunity-detail-header > div:last-child { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.detail-safety { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.detail-timeseries-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.detail-timeseries-grid > section { min-width: 0; display: grid; gap: 6px; }
.book-grid { margin-top: 6px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.book-panel { min-width: 0; overflow: hidden; background: var(--inset); border: 1px solid var(--line); border-radius: 4px; }
.book-panel > header { min-height: 50px; padding: 9px 11px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-bottom: 1px solid var(--line); }
.book-panel > header > div { display: grid; gap: 2px; }
.book-top { min-height: 34px; padding: 7px 10px; display: grid; grid-template-columns: auto auto 1fr; gap: 10px; color: var(--graphite); border-bottom: 1px solid var(--line-soft); font-family: var(--font-data); font-size: 8px; }
.book-top span:last-child { justify-self: end; }
.depth-columns { display: grid; grid-template-columns: 1fr 1fr; }
.depth-columns > div { min-width: 0; padding: 7px; border-right: 1px solid var(--line-soft); }
.depth-columns > div:last-child { border-right: 0; }
.depth-row { position: relative; min-height: 23px; padding: 3px 5px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px; overflow: hidden; }
.depth-row > span { position: absolute; inset: 2px auto 2px 0; z-index: 0; opacity: .42; }
.depth-row.bid > span { background: var(--green-line); }
.depth-row.ask > span { background: var(--red-line); }
.depth-row > span.depth-width-0 { width: 0; }
.depth-row > span.depth-width-1 { width: 10%; }
.depth-row > span.depth-width-2 { width: 20%; }
.depth-row > span.depth-width-3 { width: 30%; }
.depth-row > span.depth-width-4 { width: 40%; }
.depth-row > span.depth-width-5 { width: 50%; }
.depth-row > span.depth-width-6 { width: 60%; }
.depth-row > span.depth-width-7 { width: 70%; }
.depth-row > span.depth-width-8 { width: 80%; }
.depth-row > span.depth-width-9 { width: 90%; }
.depth-row > span.depth-width-10 { width: 100%; }
.depth-row code, .depth-row b { position: relative; z-index: 1; font-family: var(--font-data); font-size: 8px; font-weight: 500; }
.depth-row b { color: var(--graphite); }
.related-record-stack { border-top: 1px solid var(--line); }
.execution-timeline { min-width: 0; overflow: hidden; background: var(--inset); border: 1px solid var(--line); }
.detail-body .timeline-header { min-height: 54px; padding: 10px 12px; display: flex; align-items: center; justify-content: space-between; gap: 16px; background: var(--subheader); border-bottom: 1px solid var(--line); }
.timeline-header > div:first-child { min-width: 0; display: grid; gap: 3px; }
.timeline-header h3 { margin: 0; font-family: var(--font-display); font-size: 14px; }
.timeline-meta { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; color: var(--graphite); font-family: var(--font-data); font-size: 8px; }
.timeline-meta strong { color: var(--amber); font-weight: 600; }
.timeline-list { max-height: 440px; margin: 0; padding: 0; overflow: auto; list-style: none; }
.timeline-event { min-width: 0; display: grid; grid-template-columns: 142px 14px minmax(0, 1fr); gap: 9px; padding: 10px 12px; border-bottom: 1px solid var(--line-soft); }
.timeline-event:last-child { border-bottom: 0; }
.timeline-event > time { color: var(--graphite); font-family: var(--font-data); font-size: 8px; white-space: nowrap; }
.timeline-marker { position: relative; width: 8px; height: 8px; margin-top: 2px; background: var(--accent); border: 2px solid var(--accent-line); border-radius: 50%; }
.timeline-marker::after { content: ""; position: absolute; top: 8px; left: 2px; width: 1px; height: calc(100% + 39px); background: var(--line); }
.timeline-event:last-child .timeline-marker::after { display: none; }
.timeline-event-body { min-width: 0; display: grid; gap: 6px; }
.timeline-event-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.timeline-event-heading strong { overflow-wrap: anywhere; font-size: 10px; }
.timeline-event-heading span { color: var(--graphite); font-family: var(--font-data); font-size: 8px; }
.timeline-event-body > code { overflow: hidden; color: var(--graphite-dim); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; user-select: all; }
.timeline-event-summary { margin: 0; display: flex; flex-wrap: wrap; gap: 5px 10px; }
.timeline-event-summary > div { min-width: 0; display: inline-flex; align-items: baseline; gap: 4px; }
.timeline-event-summary dt { color: var(--graphite-dim); font-family: var(--font-data); font-size: 7px; text-transform: uppercase; }
.timeline-event-summary dd { max-width: 310px; margin: 0; overflow: hidden; color: var(--ink-soft); font-family: var(--font-data); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.timeline-footer { min-height: 34px; padding: 7px 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--graphite); background: var(--subheader); border-top: 1px solid var(--line); font-size: 8px; }
.timeline-footer code { min-width: 0; overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; user-select: all; }
.detail-records { border-bottom: 1px solid var(--line); }
.detail-records > summary { min-height: 38px; padding: 8px 10px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--ink-soft); background: var(--control); cursor: pointer; list-style: none; font-size: 11px; }
.detail-records > summary::-webkit-details-marker { display: none; }
.detail-records > summary strong { color: var(--accent); font-family: var(--font-data); font-size: 9px; }
.detail-records[open] > summary { color: var(--ink); background: var(--hover); }
.detail-records-empty { padding: 14px 10px; color: var(--graphite); font-size: 10px; }
.opportunity-actions { flex-wrap: wrap; }
.opportunity-actions .icon-command { flex: none; }
.secondary-command.is-danger { color: var(--red-ink); background: var(--red-soft); border-color: var(--red-line); }

.operation-boundary { min-height: 72px; margin-bottom: 14px; display: grid; grid-template-columns: minmax(280px, 1.5fr) repeat(3, minmax(150px, .7fr)); overflow: hidden; background: var(--green-soft); border: 1px solid var(--green-line); border-left: 3px solid var(--green); border-radius: var(--radius); }
.boundary-heading { min-width: 0; padding: 12px 15px; display: flex; align-items: center; gap: 11px; border-right: 1px solid var(--green-line); }
.boundary-heading > svg { width: 18px; height: 18px; flex: none; color: var(--green); }
.boundary-heading > div { min-width: 0; display: grid; gap: 3px; }
.boundary-heading strong { overflow-wrap: anywhere; font-size: 12px; }
.boundary-check { min-width: 0; padding: 11px 13px; display: grid; align-content: center; gap: 4px; border-right: 1px solid var(--green-line); }
.boundary-check:last-child { border-right: 0; }
.boundary-check span { color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.boundary-check strong { color: var(--green); overflow-wrap: anywhere; font-family: var(--font-data); font-size: 10px; font-weight: 600; }
.funds-boundary { border-left-color: var(--amber); border-color: var(--amber-line); background: var(--amber-soft); }
.funds-boundary .boundary-heading, .funds-boundary .boundary-check { border-color: var(--amber-line); }
.funds-boundary .boundary-heading > svg, .funds-boundary .boundary-check strong { color: var(--amber); }

.phase-console-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(340px, .85fr); gap: 14px; margin-bottom: 14px; }
.phase-console-grid > .work-panel { margin-bottom: 0; }
.performance-band { min-height: 126px; display: grid; grid-template-columns: repeat(3, minmax(98px, 1fr)); border-bottom: 1px solid var(--line); }
.performance-band .metric-cell { min-width: 0; min-height: 62px; padding: 10px 12px; border-bottom: 1px solid var(--line-soft); }
.performance-band .metric-cell:nth-child(3n) { border-right: 0; }
.performance-band .metric-cell:nth-last-child(-n + 3) { border-bottom: 0; }
.performance-band .metric-cell span { font-size: 8px; }
.performance-band .metric-cell strong { overflow-wrap: anywhere; font-size: 14px; }
.report-distributions { display: grid; grid-template-columns: 1fr 1fr; }
.report-distribution { min-width: 0; padding: 10px 12px; border-right: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
.report-distribution:nth-child(2n) { border-right: 0; }
.report-distribution > span { display: block; margin-bottom: 5px; color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.report-distribution > div { min-width: 0; min-height: 22px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.report-distribution strong { min-width: 0; overflow: hidden; color: var(--ink-soft); font-size: 10px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.report-distribution b { color: var(--accent); font-family: var(--font-data); font-size: 9px; font-weight: 500; }
.report-evidence-section { border-bottom: 1px solid var(--line-soft); }
.report-evidence-section > header { min-height: 34px; padding: 8px 12px; display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--subheader); border-bottom: 1px solid var(--line-soft); }
.report-evidence-section > header span { color: var(--ink-soft); font-size: 10px; font-weight: 600; }
.report-evidence-section > header b { color: var(--graphite); font-family: var(--font-data); font-size: 8px; font-weight: 500; }
.report-attribution-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.report-evidence-metric { min-width: 0; min-height: 48px; padding: 8px 10px; display: grid; align-content: center; gap: 4px; border-right: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
.report-evidence-metric:nth-child(3n) { border-right: 0; }
.report-evidence-metric:nth-last-child(-n + 3) { border-bottom: 0; }
.report-evidence-metric span { overflow: hidden; color: var(--graphite); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.report-evidence-metric strong { overflow-wrap: anywhere; color: var(--accent); font-family: var(--font-data); font-size: 10px; font-weight: 500; }
.report-evidence-metric.is-alert strong { color: var(--amber); }
.report-venue-list { display: grid; }
.report-venue-row { min-width: 0; display: grid; grid-template-columns: 106px minmax(0, 1fr); border-bottom: 1px solid var(--line-soft); }
.report-venue-row:last-child { border-bottom: 0; }
.report-venue-name { min-width: 0; padding: 10px 12px; display: grid; align-content: center; gap: 4px; background: var(--control); border-right: 1px solid var(--line-soft); }
.report-venue-name strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.report-venue-name span { color: var(--graphite); font-family: var(--font-data); font-size: 7px; }
.report-venue-metrics { min-width: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.report-venue-metrics .report-evidence-metric { min-height: 42px; }
.report-empty { padding: 12px; color: var(--graphite); font-size: 10px; }
.report-footnote { padding: 9px 12px; color: var(--graphite); font-size: 9px; }

.safety-triad { display: grid; gap: 3px; }
.safety-triad.compact { min-width: 138px; }
.safety-state { min-width: 0; min-height: 20px; padding: 2px 5px; display: flex; align-items: center; justify-content: space-between; gap: 7px; background: var(--inset); border-left: 2px solid var(--red); }
.safety-state span { color: var(--graphite); font-family: var(--font-data); font-size: 7px; text-transform: uppercase; }
.safety-state strong { overflow-wrap: anywhere; color: var(--red); font-family: var(--font-data); font-size: 8px; font-weight: 600; }
.safety-state.is-safe { background: var(--green-soft); border-left-color: var(--green); }
.safety-state.is-safe strong { color: var(--green); }
.action-column { width: 76px; text-align: right; }
.payload-preview { display: block; max-width: 340px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.draft-field-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.draft-field-grid.two-column { grid-template-columns: 1fr 1fr; }
.unit-input { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; background: var(--inset); border: 1px solid var(--line); border-radius: 3px; }
.unit-input input { min-width: 0; border: 0 !important; background: transparent !important; }
.unit-input > span { padding: 0 8px; color: var(--graphite); font-family: var(--font-data); font-size: 8px; text-transform: uppercase; }
.resource-state.is-loading svg, .command-button [data-lucide="loader-circle"] { animation: latency-spin 850ms linear infinite; }
.toast { position: fixed; right: 22px; bottom: 22px; z-index: 50; min-width: 220px; max-width: 360px; padding: 11px 13px; color: var(--ink); background: var(--surface-raised); border: 1px solid var(--line-strong); border-left: 3px solid var(--accent); border-radius: 4px; box-shadow: var(--shadow); }
.toast.is-error { color: var(--red-ink); background: var(--red-soft); border-left-color: var(--red); }

@media (max-width: 1180px) {
  .exchange-monitor-grid { grid-template-columns: 1fr; }
  .exchange-monitor-grid > .work-panel { margin-bottom: 0; }
  .latency-venue-summary { grid-template-columns: minmax(160px, .8fr) minmax(400px, 2fr) auto; }
  .latency-summary-metrics { grid-template-columns: repeat(3, minmax(62px, .5fr)) minmax(240px, 1.8fr); }
}

@media (min-width: 1025px) and (max-width: 1600px) {
  .control-grid-command .command-fields { grid-template-columns: 1fr 1fr; }
  .control-grid-command .command-reason, .control-grid-command .command-fields .danger-command { grid-column: 1 / -1; }
  .control-grid-command .command-fields .danger-command { justify-content: center; }
}

@media (max-width: 1024px) {
  :root { --sidebar: 72px; }
  .sidebar { padding-inline: 10px; }
  .sidebar-brand > div:last-child, .nav-item span, .mode-badge { display: none; }
  .sidebar-brand, .nav-item { justify-content: center; padding: 0; }
  .nav-item.is-active::before { inset-inline: 8px auto; }
  .sidebar-foot { justify-content: center; }
  .split-layout { grid-template-columns: 1fr; }
  .metrics-band { grid-template-columns: repeat(7, 140px); }
  .control-grid-primary, .control-grid-command, .config-layout, .phase-console-grid { grid-template-columns: 1fr; }
  .control-grid > .work-panel, .config-layout > .work-panel { margin-bottom: 0; }
  .readiness-decision { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
  .readiness-decision .decision-cell:last-child { grid-column: 1 / -1; border-top: 1px solid var(--line); }
  .latency-venue-summary { grid-template-columns: minmax(160px, .8fr) minmax(0, 2fr) auto; }
  .latency-summary-metrics { grid-template-columns: repeat(3, minmax(60px, 1fr)); }
  .latency-summary-queues { grid-column: 1 / -1; }
  .latency-profile { min-width: 680px; }
}

@media (max-width: 680px) {
  :root { --sidebar: 0px; }
  .sidebar { inset: auto 0 0 0; width: 100%; height: 64px; padding: 7px 8px; flex-direction: row; align-items: center; overflow-x: auto; background: var(--rail); border-top: 1px solid var(--line); border-right: 0; }
  .sidebar-brand, .sidebar-foot { display: none; }
  .primary-nav { display: flex; gap: 2px; margin: 0; }
  .nav-item { width: 48px; height: 48px; flex: none; border-bottom: 2px solid transparent; }
  .nav-item.is-active { border-color: var(--blue-line); border-bottom-color: var(--blue); }
  .nav-item.is-active::before { display: none; }
  .workspace { margin-left: 0; padding: 0 12px 86px; }
  .workspace-header { height: auto; min-height: 78px; align-items: flex-start; padding: 14px 0; }
  .workspace-header::after { animation: none; }
  .header-actions { gap: 4px; }
  .system-clock, #pauseRefresh, .user-chip > div { display: none; }
  .spread-tape { grid-template-columns: 98px minmax(0, 1fr); margin: 12px 0; }
  .tape-item { min-width: 176px; }
  .metrics-band { margin-inline: -12px; border-radius: 0; }
  .risk-strip { grid-template-columns: 1fr; }
  .operation-boundary { grid-template-columns: 1fr 1fr; }
  .boundary-heading { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid var(--green-line); }
  .funds-boundary .boundary-heading { border-bottom-color: var(--amber-line); }
  .boundary-check { border-bottom: 1px solid var(--green-line); }
  .funds-boundary .boundary-check { border-bottom-color: var(--amber-line); }
  .boundary-check:nth-child(3) { border-right: 0; }
  .boundary-check:last-child { grid-column: 1 / -1; border-bottom: 0; }
  .risk-item { border-right: 0; border-bottom: 1px solid var(--line); }
  .filter-bar { display: grid; grid-template-columns: 1fr 1fr; }
  .filter-bar label, .filter-bar select, .filter-bar input { min-width: 0; }
  .ledger-filter-actions { grid-column: 1 / -1; justify-self: end; margin-left: 0; }
  .stage-console-header { align-items: flex-start; }
  .stage-console-meta { min-width: 0; justify-items: end; text-align: right; }
  .promotion-track, .evidence-strip { min-width: 660px; }
  .promotion-track { grid-template-columns: repeat(5, 132px); }
  .readiness-decision { grid-template-columns: 1fr 1fr; }
  .readiness-decision .decision-cell { min-height: 68px; }
  .readiness-decision .decision-cell:nth-child(2) { border-right: 0; }
  .readiness-decision .decision-cell:nth-child(3) { border-top: 1px solid var(--line); }
  .readiness-decision .decision-cell:last-child { grid-column: 1 / -1; }
  .control-facts { grid-template-columns: 1fr; }
  .control-fact { border-right: 0; }
  .action-segments { grid-template-columns: 1fr 1fr; }
  .action-segments button:nth-of-type(2n) { border-right: 0; }
  .action-segments button:nth-of-type(-n + 2) { border-bottom: 1px solid var(--line); }
  .command-fields { grid-template-columns: 1fr 1fr; }
  .draft-field-grid { grid-template-columns: 1fr; }
  .command-reason, .command-fields .danger-command { grid-column: 1 / -1; }
  .command-fields .danger-command { justify-content: center; }
  .config-row { grid-template-columns: 1fr; }
  .config-row .row-command { justify-self: end; }
  .runtime-config-summary, .access-summary { align-items: flex-start; }
  .access-summary-actions { flex-wrap: wrap; justify-content: flex-end; }
  .compact-select { width: 132px; }
  .latency-toolbar { padding-inline: 12px; align-items: flex-start; }
  .latency-toolbar-actions { align-items: flex-end; }
  .latency-toolbar-actions .count-label { max-width: 112px; text-align: right; white-space: normal; }
  .latency-venue-summary { padding: 12px 38px 12px 12px; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
  .latency-summary-primary { min-height: 40px; }
  .latency-summary-status { grid-column: 2; grid-row: 1; }
  .latency-summary-metrics { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .latency-summary-queues { grid-column: 1 / -1; grid-template-columns: 1fr; }
  .latency-summary-queue { min-height: 35px; }
  .latency-health-group { grid-template-columns: 112px minmax(0, 1fr); }
  .latency-request-error { grid-template-columns: auto minmax(0, 1fr); }
  .latency-request-error .text-command { grid-column: 2; justify-self: start; }
  .detail-grid { grid-template-columns: 1fr 1fr; }
  .detail-timeseries-grid, .book-grid { grid-template-columns: 1fr; }
  .detail-safety { grid-template-columns: 1fr; }
  .detail-body .timeline-header { align-items: flex-start; }
  .timeline-event { grid-template-columns: 104px 14px minmax(0, 1fr); }
  .exchange-runtime-boundary { align-items: flex-start; }
  .exchange-trend-metrics { grid-template-columns: 1fr 1fr; }
  .trend-foot { align-items: flex-start; flex-direction: column; }
  .detail-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .detail-actions .command-button, .detail-actions .secondary-command { min-width: 0; width: 100%; }
  .detail-metric:nth-child(3n) { border-right: 1px solid var(--line); }
  .detail-metric:nth-child(2n) { border-right: 0; }
  .shadow-proof-rail, .shadow-evidence-grid { grid-template-columns: 1fr 1fr; }
  .shadow-proof-rail .shadow-evidence-fact:nth-child(2n), .shadow-evidence-grid .shadow-evidence-fact:nth-child(2n) { border-right: 0; }
  .shadow-proof-rail .shadow-evidence-fact:nth-child(-n + 2), .shadow-evidence-grid .shadow-evidence-fact { border-bottom: 1px solid var(--line); }
  .shadow-evidence-grid .shadow-evidence-fact:nth-last-child(-n + 2) { border-bottom: 0; }
  .shadow-leg-proof { grid-template-columns: 1fr 1fr; }
  .shadow-leg-proof .safety-triad { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid var(--line); }
  .shadow-request-grid { grid-template-columns: 92px minmax(0, 1fr); }
  .command-confirm-summary { grid-template-columns: 88px minmax(0, 1fr); }
  .command-dialog-body { padding: 22px 18px; }
  .dialog-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .dialog-actions > button, .command-dialog .command-button { width: 100%; min-width: 0; justify-content: center; }
  .page-theme-switch { top: 10px; right: 10px; }
  .login-page { padding: 0; }
  .login-shell { min-height: 100vh; grid-template-columns: 1fr; border: 0; border-radius: 0; }
  .login-brand { min-height: 210px; padding: 28px; border-right: 0; border-bottom: 1px solid var(--line); }
  .login-brand::before { inset-inline: 28px; }
  .login-brand::after { left: 28px; animation: none; }
  .login-brand h1 { font-size: 32px; }
  .login-form-wrap { padding: 32px 24px; }
}

@media (max-width: 420px) {
  .ledger-filter-bar { grid-template-columns: 1fr; }
  .ledger-filter-actions { grid-column: 1; }
  .ledger-tabs { overflow-x: auto; }
  .ledger-tabs button { flex: 1; justify-content: center; }
  .detail-body .timeline-header { display: grid; }
  .timeline-meta { justify-content: flex-start; }
  .timeline-event { grid-template-columns: 14px minmax(0, 1fr); }
  .timeline-event > time { grid-column: 2; grid-row: 1; }
  .timeline-marker { grid-column: 1; grid-row: 1 / span 2; }
  .timeline-event-body { grid-column: 2; }
  .timeline-footer { align-items: flex-start; flex-direction: column; }
  .readiness-decision { grid-template-columns: 1fr; }
  .readiness-decision .decision-cell { border-right: 0; border-bottom: 1px solid var(--line); }
  .readiness-decision .decision-cell:last-child { grid-column: auto; border-bottom: 0; }
  .stage-console-header { display: grid; }
  .stage-console-meta { justify-items: start; text-align: left; }
  .command-fields { grid-template-columns: 1fr; }
  .operation-boundary { grid-template-columns: 1fr; }
  .boundary-heading, .boundary-check, .boundary-check:nth-child(3), .boundary-check:last-child { grid-column: 1; border-right: 0; border-bottom: 1px solid var(--green-line); }
  .funds-boundary .boundary-heading, .funds-boundary .boundary-check { border-bottom-color: var(--amber-line); }
  .operation-boundary .boundary-check:last-child { border-bottom: 0; }
  .performance-band { grid-template-columns: 1fr 1fr; }
  .performance-band .metric-cell:nth-child(3n) { border-right: 1px solid var(--line); }
  .performance-band .metric-cell:nth-child(2n) { border-right: 0; }
  .performance-band .metric-cell:nth-last-child(-n + 3) { border-bottom: 1px solid var(--line-soft); }
  .performance-band .metric-cell:nth-last-child(-n + 2) { border-bottom: 0; }
  .report-distributions { grid-template-columns: 1fr; }
  .report-distribution { border-right: 0; }
  .report-attribution-grid { grid-template-columns: 1fr 1fr; }
  .report-evidence-metric:nth-child(3n) { border-right: 1px solid var(--line-soft); }
  .report-evidence-metric:nth-child(2n) { border-right: 0; }
  .report-evidence-metric:nth-last-child(-n + 3) { border-bottom: 1px solid var(--line-soft); }
  .report-evidence-metric:nth-last-child(-n + 2) { border-bottom: 0; }
  .report-venue-row { grid-template-columns: 1fr; }
  .report-venue-name { border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .report-venue-metrics { grid-template-columns: 1fr 1fr; }
  .draft-field-grid.two-column, .detail-actions { grid-template-columns: 1fr; }
  .command-reason, .command-fields .danger-command { grid-column: auto; }
  .runtime-config-summary, .access-summary { display: grid; }
  .access-summary-actions { justify-content: flex-start; }
  .panel-header { align-items: flex-start; }
  .segmented-control { width: 100%; }
  .segmented-control button { min-width: 0; flex: 1; }
  .exchange-runtime-boundary, .opportunity-detail-header { display: grid !important; }
  .opportunity-detail-header > div:last-child { justify-content: flex-start; }
  .book-top { grid-template-columns: 1fr 1fr; }
  .book-top span:last-child { grid-column: 1 / -1; justify-self: start; }
  .exchange-trend-metrics { grid-template-columns: 1fr; }
  .shadow-proof-rail, .shadow-evidence-grid, .shadow-leg-proof { grid-template-columns: 1fr; }
  .shadow-proof-rail .shadow-evidence-fact, .shadow-evidence-grid .shadow-evidence-fact, .shadow-leg-proof > * { border-right: 0; border-bottom: 1px solid var(--line); }
  .shadow-proof-rail .shadow-evidence-fact:last-child, .shadow-evidence-grid .shadow-evidence-fact:last-child, .shadow-leg-proof > *:last-child { border-bottom: 0; }
  .shadow-leg-proof .safety-triad { grid-column: auto; }
  .shadow-leg-evidence > header { align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
