/* Source: styles.css */
:root {
  color-scheme: light;
  --bg: #f1f3f6;
  --surface: #ffffff;
  --surface-soft: #f7f8fa;
  --surface-strong: #e8ebef;
  --ink: #20262d;
  --muted: #66707b;
  --line: #d5dbe2;
  --line-strong: #b7c1cc;
  --nav: #1d2422;
  --nav-hover: #2c3532;
  --green: #067252;
  --green-soft: #e3f3ed;
  --red: #bd3741;
  --red-soft: #fbe9eb;
  --amber: #955900;
  --amber-soft: #fff2d9;
  --blue: #1769aa;
  --blue-soft: #e8f2fb;
  --price-up: #bd3741;
  --price-up-soft: #fbe9eb;
  --price-down: #087f5b;
  --price-down-soft: #e3f3ed;
  --shadow: 0 10px 28px rgba(32, 38, 45, 0.11);
  --font-assist: 12px;
  --font-meta: 13px;
  --font-body: 14px;
  --font-control: 14px;
  --font-section: 14px;
  --font-panel: 16px;
  --font-page: 18px;
  --font-metric: 20px;
  --chart-price-height: 420px;
  --chart-range-height: 240px;
  --desktop-summary-strip-height: 76px;
  font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
  font-size: 14px;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

html { min-width: 0; background: var(--bg); }

body {
  margin: 0;
  min-width: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: inherit;
  letter-spacing: 0;
}
body.western-colors {
  --price-up: #087f5b;
  --price-up-soft: #e3f3ed;
  --price-down: #bd3741;
  --price-down-soft: #fbe9eb;
}

button, input, select, textarea { font: inherit; letter-spacing: 0; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: 0.55; }
button:focus-visible, input:focus-visible, select:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 22px; font-weight: 500; }
h2 { font-size: 15px; font-weight: 500; }
small { font-size: 11px; }
code { font-family: Consolas, "Cascadia Mono", monospace; font-size: 12px; }

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 214px minmax(0, 1fr);
}

.sidebar {
  position: sticky;
  top: 0;
  z-index: 20;
  height: 100vh;
  min-height: 640px;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  background: var(--nav);
  color: #f1f4f2;
  border-right: 1px solid #111512;
}

.brand {
  height: 72px;
  flex: 0 0 72px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 0 16px;
  border-bottom: 1px solid #39413c;
}

.brand-mark {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border: 1px solid #7da493;
  color: #a7d9c4;
  font-weight: 500;
}

.brand-copy { min-width: 0; }
.brand-copy strong, .brand-copy span { display: block; white-space: nowrap; }
.brand-copy strong { font-size: 16px; font-weight: 500; }
.brand-copy span { margin-top: 2px; color: #aab6af; font-size: 11px; }

.primary-nav { display: grid; gap: 2px; padding: 10px 8px; }
.nav-group-label { padding: 10px 11px 3px; color: #7f8d86; font-size: 11px; font-weight: 600; text-transform: uppercase; }
.nav-group-label:first-child { padding-top: 2px; }

.nav-button {
  position: relative;
  width: 100%;
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 7px 11px;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: #b8c3bd;
  text-align: left;
}

.nav-button svg { width: 17px; height: 17px; flex: 0 0 auto; }
.nav-button:hover { background: var(--nav-hover); color: #ffffff; }
.nav-button.is-active { background: #32403b; color: #ffffff; box-shadow: inset 3px 0 0 #52c49a; }
.nav-button[data-tooltip]::after { left: calc(100% + 8px); top: 50%; bottom: auto; transform: translateY(-50%); }

.sidebar-footer {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 62px;
  padding: 11px 15px;
  border-top: 1px solid #39413c;
}

.sidebar-footer strong, .sidebar-footer span { display: block; }
.sidebar-footer strong { font-size: 11px; font-weight: 500; }
.sidebar-footer span { margin-top: 2px; color: #9eaaa3; font-size: 11px; }

.main-shell { min-width: 0; }

.mobile-market-summary, .mobile-bottom-nav { display: none; }

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.global-controls {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(600px, 1fr) minmax(150px, 0.28fr);
  align-items: end;
  gap: 8px;
}
.mobile-nav-button { display: none !important; }
.environment-control { min-width: 0; display: grid; gap: 3px; overflow: hidden; }
.environment-control label { color: var(--muted); font-size: 11px; }
.environment-control select { width: 100%; min-width: 0; max-width: 100%; }

.topbar {
  position: sticky;
  top: 0;
  z-index: 15;
  min-height: 72px;
  display: grid;
  grid-template-columns: minmax(760px, 1.35fr) minmax(400px, 0.8fr) auto;
  align-items: center;
  gap: 16px;
  padding: 9px 20px;
  background: var(--surface);
  border-bottom: 1px solid var(--line);
}

.contract-switcher { min-width: 0; display: grid; grid-template-columns: minmax(190px, 0.9fr) minmax(190px, 0.9fr) minmax(230px, 1.2fr); align-items: end; gap: 8px; overflow: hidden; }
.contract-switcher label { min-width: 0; display: grid; gap: 3px; overflow: hidden; color: var(--muted); font-size: 11px; }
.contract-switcher .product-search-label { grid-column: auto; overflow: visible; }
.contract-switcher .control-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.contract-switcher label small { display: inline; color: var(--blue); font-size: var(--font-assist); margin-left: 4px; font-weight: 500; }
.contract-switcher select { width: 100%; min-width: 0; max-width: 100%; font-weight: 500; }
.product-search-field { position: relative; min-width: 0; display: block; }
.product-search-field > svg { position: absolute; z-index: 1; left: 9px; top: 50%; width: 15px; height: 15px; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.product-search-field input { width: 100%; min-height: 31px; padding: 5px 10px 5px 31px; background: var(--surface); }
#globalProductSearch, #globalProduct, #globalContract, #globalEnvironment { font-size: 14px; }

.top-status { min-width: 0; display: grid; grid-template-columns: repeat(5, minmax(82px, 1fr)); border-left: 1px solid var(--line); }
.top-status-item { min-width: 0; padding: 2px 14px; border-right: 1px solid var(--line); }
.top-status-item > span, .top-status-item > strong { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.top-status-item > span { color: var(--muted); font-size: var(--font-assist); }
.top-status-item > strong { margin-top: 3px; font-size: var(--font-meta); font-weight: 600; }
.top-status-item > strong > span { display: inline; overflow: visible; font: inherit; }
.top-status-item .status-dot { margin-right: 5px; }
.global-latest-quote { background: #eef4f8; }
.global-latest-quote > strong { display: flex; align-items: baseline; gap: 8px; overflow: visible; }
.global-latest-quote b { font-size: 20px; font-weight: 700; line-height: 1; letter-spacing: 0; }
.global-latest-quote em { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: 12px; font-style: normal; font-weight: 600; }

.top-actions, .view-actions, .panel-actions, .row-actions, .dialog-footer { display: flex; align-items: center; gap: 8px; }
.top-actions { justify-content: flex-end; }
.top-actions > * { flex: 0 0 auto; }
.user-button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 3px 8px 3px 4px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--surface);
  color: var(--ink);
  text-align: left;
}
.user-button:hover { background: var(--surface-soft); }
.user-avatar {
  width: 29px;
  height: 29px;
  flex: 0 0 29px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--green-soft);
  color: var(--green);
  font-size: 11px;
  font-weight: 600;
}
.user-avatar.large { width: 42px; height: 42px; flex-basis: 42px; font-size: 14px; }
.user-button-copy strong, .user-button-copy small { display: block; line-height: 1.2; }
.user-button-copy strong { font-size: 11px; font-weight: 500; }
.user-button-copy small { margin-top: 2px; color: var(--muted); }

.environment-banner {
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 20px;
  border-bottom: 1px solid var(--line);
  font-size: 11px;
}
.environment-banner svg { width: 16px; height: 16px; flex: 0 0 16px; }
.environment-banner strong { font-weight: 500; }
.environment-banner span { color: var(--muted); }
.environment-paper { background: var(--blue-soft); color: #204e72; }
.environment-live { background: var(--red-soft); color: #8e252d; border-bottom-color: #dda1a6; }
.environment-live span { color: #8e252d; }

main { min-width: 0; }
.view { display: none; padding: 20px 22px 40px; }
.view.is-active { display: block; }

.page-heading {
  min-height: 52px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 14px;
}

.page-heading p, .panel-heading p, .section-heading p, .dialog-heading p { margin-top: 3px; color: var(--muted); font-size: 11px; }

.primary-button, .secondary-button, .danger-button, .danger-outline-button, .text-button, .icon-button {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid transparent;
  border-radius: 4px;
  padding: 6px 12px;
  font-weight: 500;
  white-space: nowrap;
}

.primary-button { background: var(--blue); border-color: var(--blue); color: #ffffff; }
.primary-button:hover { background: #12598f; }
.secondary-button { background: var(--surface); border-color: var(--line-strong); color: var(--ink); }
.secondary-button:hover { background: var(--surface-soft); }
.danger-button { background: var(--red); border-color: var(--red); color: #ffffff; }
.danger-button:hover { background: #a82d36; }
.danger-outline-button { background: var(--surface); border-color: #d9989e; color: var(--red); }
.danger-outline-button:hover { background: var(--red-soft); }
.text-button { min-height: 28px; padding: 4px 6px; background: transparent; border-color: transparent; color: var(--blue); }
.text-button:hover { background: var(--blue-soft); }
.icon-button { width: 35px; height: 35px; padding: 0; background: var(--surface); border-color: var(--line); color: var(--ink); }
.icon-button:hover { background: var(--surface-soft); }
.icon-button.small { width: 29px; height: 29px; min-height: 29px; }
.small-command { min-height: 29px; padding: 3px 8px; font-size: 11px; }
.button-block { width: 100%; }
button svg, .primary-button svg, .secondary-button svg, .danger-button svg, .danger-outline-button svg { width: 16px; height: 16px; }

[data-tooltip] { position: relative; }
[data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  z-index: 80;
  left: 50%;
  bottom: calc(100% + 7px);
  transform: translateX(-50%);
  display: none;
  width: max-content;
  max-width: 190px;
  padding: 5px 7px;
  border-radius: 3px;
  background: #111512;
  color: #ffffff;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.3;
  white-space: normal;
  box-shadow: var(--shadow);
}
[data-tooltip]:hover::after, [data-tooltip]:focus-visible::after { display: block; }

select, input, textarea {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line-strong);
  border-radius: 3px;
  padding: 8px 10px;
  background: var(--surface);
  color: var(--ink);
  font-size: 14px;
  line-height: 1.35;
}
select { padding-right: 10px; text-overflow: ellipsis; }
input[readonly] { background: var(--surface-soft); color: var(--muted); }
label { min-width: 0; display: grid; gap: 5px; color: var(--muted); font-size: 11px; }

.segmented-control { display: inline-flex; flex-wrap: nowrap; border: 1px solid var(--line-strong); border-radius: 4px; background: var(--surface); }
.segmented-control button { min-height: 32px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; padding: 5px 10px; border: 0; border-right: 1px solid var(--line); background: transparent; color: var(--muted); white-space: nowrap; }
.segmented-control button:last-child { border-right: 0; }
.segmented-control button:hover { background: var(--surface-soft); }
.segmented-control button.is-selected { background: var(--blue); color: #ffffff; }
.segmented-control .buy-mode.is-selected { background: var(--price-up); }
.segmented-control .sell-mode.is-selected { background: var(--price-down); }

.metric-strip { display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)); gap: 10px; margin-bottom: 12px; }
.metric-card { min-width: 0; padding: 13px 15px; border: 1px solid var(--line); border-radius: 4px; background: var(--surface); }
.metric-card span, .metric-card strong, .metric-card small { display: block; }
.metric-card span { color: var(--muted); font-size: 11px; }
.metric-card strong { margin-top: 4px; font-size: 21px; font-weight: 500; overflow-wrap: anywhere; }
.metric-card small { margin-top: 3px; color: var(--muted); }
.compact-metrics .metric-card strong { font-size: 18px; }
.automation-metrics { grid-template-columns: repeat(5, minmax(130px, 1fr)); }

.gate-bar {
  display: grid;
  grid-template-columns: repeat(4, minmax(110px, 1fr)) auto;
  align-items: center;
  gap: 0;
  margin-bottom: 12px;
  padding: 8px;
  border: 1px solid var(--line);
  background: var(--surface);
}
.gate-bar > div { min-width: 0; padding: 3px 12px; border-right: 1px solid var(--line); }
.gate-bar span, .gate-bar strong { display: block; overflow-wrap: anywhere; }
.gate-bar span { color: var(--muted); font-size: 11px; }
.gate-bar strong { margin-top: 2px; font-size: 12px; font-weight: 500; }
.gate-bar button { margin-left: 8px; }

.dashboard-grid, .decision-grid, .position-detail-grid, .risk-layout, .data-layout, .operations-layout, .simulation-layout, .validation-layout, .cost-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(300px, 0.75fr);
  gap: 12px;
  margin-bottom: 12px;
}
.position-detail-grid, .risk-layout, .data-layout, .simulation-layout, .validation-layout, .cost-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dashboard-side-column { min-width: 0; display: grid; align-content: start; gap: 12px; }

.tool-panel, .detail-panel, .table-section, .timeline-panel, .log-panel, .forward-progress-panel {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--surface);
}
.tool-panel, .detail-panel, .timeline-panel, .log-panel, .forward-progress-panel { padding: 14px; }
.paper-equity-setting { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; margin: 4px 0 12px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.paper-equity-setting label { display: grid; gap: 4px; color: var(--muted); font-size: 11px; }
.paper-equity-setting input { width: 100%; min-width: 0; }
.paper-equity-setting button { min-height: 33px; }
.paper-equity-setting small { grid-column: 1 / -1; color: var(--muted); font-size: 11px; line-height: 1.4; }
.panel-heading, .section-heading, .dialog-heading, .drawer-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.panel-heading { min-height: 36px; margin-bottom: 10px; }
.section-heading { min-height: 46px; align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--line); }

canvas { display: block; width: 100%; max-width: 100%; }
.market-panel canvas, .tool-panel canvas { min-height: 180px; }
#marketChart, #decisionChart { height: var(--chart-price-height); }
#marketOscillatorChart, #decisionOscillatorChart { height: var(--chart-range-height); }

.direction-chip, .status-badge { display: inline-flex; align-items: center; justify-content: center; border-radius: 3px; white-space: nowrap; }
.direction-chip { min-height: 28px; padding: 4px 9px; font-size: 12px; font-weight: 500; }
.direction-long { color: var(--price-up); background: var(--price-up-soft); border: 1px solid #dda7ac; }
.status-badge { min-height: 23px; padding: 2px 7px; border: 1px solid var(--line); font-size: 11px; }
.status-good { color: var(--green); background: var(--green-soft); border-color: #afd6c7; }
.status-warn { color: var(--amber); background: var(--amber-soft); border-color: #e4c78f; }
.status-blocked { color: var(--red); background: var(--red-soft); border-color: #e2aeb2; }
.status-neutral { color: var(--blue); background: var(--blue-soft); border-color: #aec8dc; }

.status-dot { width: 8px; height: 8px; display: inline-block; flex: 0 0 8px; border-radius: 50%; background: var(--muted); border: 0; }
.status-dot.status-good { background: #30a778; }
.status-dot.status-warn { background: #d59122; }
.status-dot.status-bad { background: var(--red); }

.value-positive { color: var(--price-up) !important; }
.value-negative { color: var(--price-down) !important; }
.value-warning { color: var(--amber) !important; }
.status-value-good { color: var(--green) !important; }
.status-value-bad { color: var(--red) !important; }
.status-value-warn { color: var(--amber) !important; }

.level-row { display: grid; grid-template-columns: repeat(5, minmax(85px, 1fr)); gap: 1px; margin-top: 10px; background: var(--line); border: 1px solid var(--line); }
.level-row span { min-width: 0; padding: 7px 8px; background: var(--surface-soft); color: var(--muted); font-size: 11px; }
.level-row strong { display: block; margin-top: 2px; color: var(--ink); font-size: 12px; font-weight: 500; overflow-wrap: anywhere; }
.market-panel-controls { display: flex; align-items: flex-end; gap: 8px; }
.market-panel-controls label { display: grid; gap: 3px; color: var(--muted); font-size: 11px; }
.market-panel-controls select { width: min(220px, 25vw); min-height: 30px; padding: 4px 28px 4px 8px; }
.market-timeframe-row { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; margin-bottom: 8px; }
.market-timeframe-tools { min-width: 0; max-width: 100%; flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.market-timeframe-control { min-width: max-content; }
.market-timeframe-control button { min-width: 42px; padding-inline: 9px; }
.chart-zoom-controls { display: inline-flex; align-items: center; gap: 4px; }
.chart-zoom-controls .icon-button { flex: 0 0 auto; }
.market-timeframe-row > span { min-width: 0; flex: 1 1 280px; color: var(--muted); font-size: 11px; text-align: right; overflow-wrap: anywhere; }
.intraday-signal-strip { display: grid; grid-template-columns: minmax(150px, .72fr) minmax(250px, 1.35fr) minmax(210px, 1fr); gap: 8px; margin: 0 0 8px; }
.intraday-signal-strip > div { min-width: 0; min-height: 66px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); display: grid; align-content: center; gap: 2px; }
.intraday-signal-strip span { color: var(--muted); font-size: 11px; }
.intraday-signal-strip strong { font-size: 17px; line-height: 1.25; }
.intraday-signal-strip small { color: var(--muted); font-size: 11px; line-height: 1.35; overflow-wrap: anywhere; }
.market-subchart { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.market-subchart > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 2px; }
.market-subchart > div > div:first-child { min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.market-subchart .chart-zoom-controls { flex: 0 0 auto; }
.market-subchart strong { font-size: 11px; font-weight: 500; }
.market-subchart span { color: var(--muted); font-size: 11px; text-align: right; }
.market-subchart canvas { min-height: 0; }
.market-macd-subchart { border-top-color: var(--line-strong); }
.market-quote-strip { display: grid; grid-template-columns: repeat(7, minmax(72px, 1fr)); gap: 1px; margin: 0 0 10px; border: 1px solid var(--line); background: var(--line); }
.market-quote-strip > span { min-width: 0; padding: 7px 8px; background: var(--surface-soft); color: var(--muted); font-size: 11px; }
.market-quote-strip strong { display: block; margin-top: 2px; color: var(--ink); font-size: 13px; font-weight: 500; overflow-wrap: anywhere; }

.fundamental-summary { min-width: 0; display: flex; align-items: flex-start; gap: 8px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 3px; background: var(--surface-soft); color: var(--ink); font-size: 11px; line-height: 1.5; }
.fundamental-summary svg { width: 16px; height: 16px; flex: 0 0 16px; margin-top: 1px; color: var(--blue); }
.fundamental-summary span { min-width: 0; overflow-wrap: anywhere; }
.fundamental-score-grid { margin-top: 9px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border: 1px solid var(--line); background: var(--line); gap: 1px; }
.fundamental-score-grid > div { min-width: 0; padding: 7px 6px; background: var(--surface); text-align: center; }
.fundamental-score-grid span { display: block; color: var(--muted); font-size: var(--font-assist); }
.fundamental-score-grid strong { display: block; margin-top: 3px; font-size: var(--font-control); font-weight: 600; overflow-wrap: anywhere; }
.fundamental-metrics { margin: 10px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid var(--line); background: var(--line); gap: 1px; }
.fundamental-metrics > div { min-width: 0; padding: 7px 8px; background: var(--surface); }
.fundamental-metrics dt { color: var(--muted); font-size: 11px; }
.fundamental-metrics dd { min-width: 0; margin: 2px 0 0; color: var(--ink); font-size: 12px; font-weight: 500; overflow-wrap: anywhere; }
.fundamental-driver-list { margin-top: 8px; border-top: 1px solid var(--line); }
.fundamental-driver-list > div { min-width: 0; display: grid; grid-template-columns: minmax(74px, 0.65fr) minmax(0, 1.35fr); gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--line); }
.fundamental-driver-list span { color: var(--muted); font-size: 11px; }
.fundamental-driver-list strong { min-width: 0; font-size: 11px; font-weight: 500; text-align: right; overflow-wrap: anywhere; }
.fundamental-source { margin: 8px 0 0; color: var(--muted); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.fundamental-domain-table { min-width: 0; margin-top: 9px; overflow-x: auto; overflow-y: visible; border: 1px solid var(--line); }
.fundamental-domain-table table { width: 100%; }
.fundamental-domain-table th, .fundamental-domain-table td { padding: 6px 7px; font-size: var(--font-assist); }
.fundamental-evidence { margin-top: 8px; border-top: 1px solid var(--line); }
.fundamental-evidence-title { margin: 0; padding: 8px 0 4px; color: var(--ink); font-size: var(--font-assist); font-weight: 600; }
.fundamental-evidence .fundamental-domain-table { margin-top: 4px; }
.fundamental-evidence td { vertical-align: top; line-height: 1.4; }
.market-source-evidence { margin-top: 10px; padding-top: 4px; }
.market-source-evidence .fundamental-domain-table { margin-top: 5px; }
.market-source-note { margin-top: 7px; }

.trend-report-section { display: grid; gap: 12px; padding: 12px; }
.trend-report-section > .section-heading { margin-bottom: 0; }
.trend-report-overview { min-width: 0; display: grid; align-content: start; gap: 8px; padding: 11px 12px; border: 1px solid var(--line); border-top: 3px solid var(--blue); background: color-mix(in srgb, var(--blue) 2.5%, var(--surface)); }
.trend-report-overview-heading { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 5px 8px; }
.trend-report-overview-heading h2 { margin: 0; font-size: var(--font-panel); }
.trend-report-overview-heading p { margin: 3px 0 0; color: var(--muted); font-size: var(--font-assist); line-height: 1.4; overflow-wrap: anywhere; }
.trend-report-overview-heading .status-badge { align-self: start; }
.trend-report-headline { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); border: 1px solid var(--line); background: var(--surface); }
.trend-report-headline > div { min-width: 0; padding: 12px 14px; }
.trend-report-headline span { display: block; color: var(--muted); font-size: var(--font-assist); }
.trend-report-headline strong { display: block; margin-top: 4px; color: var(--ink); font-size: var(--font-panel); font-weight: 600; overflow-wrap: anywhere; }
.trend-report-headline p { margin: 6px 0 0; color: var(--muted); font-size: var(--font-meta); line-height: 1.55; overflow-wrap: anywhere; }
.trend-report-verdict { display: flex; flex-direction: column; justify-content: center; background: var(--surface-soft); }
.trend-report-verdict strong { font-size: var(--font-section); }
.trend-report-verdict small { margin-top: 5px; color: var(--muted); line-height: 1.45; }
.execution-disposition { min-width: 0; min-height: 108px; margin-top: 14px; padding: 13px 14px; border: 1px solid var(--line); border-top: 3px solid var(--amber); border-radius: 4px; }
.execution-disposition span { color: var(--muted); font-size: var(--font-assist); }
.execution-disposition strong { display: block; margin-top: 4px; font-size: var(--font-panel); overflow-wrap: anywhere; }
.execution-disposition small { display: block; font-size: var(--font-meta); overflow-wrap: anywhere; }
.execution-disposition:has(.value-positive) { border-top-color: var(--green); }
.execution-disposition:has(.value-negative) { border-top-color: var(--red); }
.trend-report-summary-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border: 1px solid var(--line); background: var(--line); gap: 1px; }
.trend-report-summary-strip > div { min-width: 0; padding: 8px 10px; background: var(--surface-soft); }
.trend-report-summary-strip span { display: block; color: var(--muted); font-size: var(--font-assist); }
.trend-report-summary-strip strong { display: block; margin-top: 3px; color: var(--ink); font-size: var(--font-body); font-weight: 600; overflow-wrap: anywhere; }
.trend-report-overview .trend-report-headline > div { padding: 9px 10px; }
.trend-report-overview .trend-report-headline strong { font-size: var(--font-body); }
.trend-report-overview .trend-report-summary-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.trend-report-key-status { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--line); border-top: 3px solid var(--blue); background: var(--line); }
.trend-report-key-status > div { min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 10px 8px; background: var(--surface-soft); text-align: center; }
.trend-report-key-status span { color: var(--muted); font-size: var(--font-assist); }
.trend-report-key-status strong { display: block; margin-top: 5px; color: var(--ink); font-size: var(--font-body); font-weight: 600; overflow-wrap: anywhere; }
.trend-report-key-status .trend-report-model-status { grid-column: 1 / -1; }
.trend-report-block { min-width: 0; }
.trend-report-block h3, .trend-report-detail-grid h3 { margin: 0 0 7px; font-size: var(--font-section); }
.trend-report-block .table-scroll { border: 1px solid var(--line); }
.trend-report-block th, .trend-report-block td { font-size: var(--font-meta); }
.trend-report-insight-grid { min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 620px), 1fr)); align-items: stretch; gap: 12px; }
.trend-report-primary { min-width: 0; display: grid; align-content: start; gap: 10px; }
.trend-scenario-grid, .trend-report-detail-grid { min-width: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 10px; }
.trend-scenario-grid article { min-width: 0; min-height: 152px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 3px; background: var(--surface-soft); }
.trend-scenario-grid article:nth-child(2) { border-top: 2px solid var(--red); }
.trend-scenario-grid article:nth-child(3) { border-top: 2px solid var(--green); }
.trend-scenario-grid span { color: var(--muted); font-size: var(--font-assist); }
.trend-scenario-grid strong { display: block; margin-top: 4px; font-size: var(--font-body); font-weight: 600; overflow-wrap: anywhere; }
.trend-scenario-grid p { margin: 6px 0 0; color: var(--muted); font-size: var(--font-meta); line-height: 1.5; overflow-wrap: anywhere; }
.trend-scenario-grid small { display: block; margin-top: 6px; color: var(--ink); font-size: var(--font-assist); line-height: 1.45; overflow-wrap: anywhere; }
.trend-report-detail-grid > section { min-width: 0; min-height: 152px; height: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 3px; background: var(--surface); }
.trend-chain-list, .trend-capability-list { display: grid; gap: 0; border-top: 1px solid var(--line); }
.trend-chain-list > div, .trend-capability-list > div { min-width: 0; padding: 7px 0; border-bottom: 1px solid var(--line); }
.trend-chain-list strong, .trend-capability-list strong { display: block; font-size: var(--font-meta); font-weight: 600; overflow-wrap: anywhere; }
.trend-chain-list span, .trend-capability-list span { display: block; margin-top: 2px; color: var(--muted); font-size: var(--font-assist); line-height: 1.45; overflow-wrap: anywhere; }
.trend-capability-list > div { display: grid; grid-template-columns: 20px minmax(0, 1fr); column-gap: 7px; }
.trend-capability-list i { width: 16px; height: 16px; margin-top: 1px; }
.trend-capability-list .capability-ok { color: var(--green); }
.trend-capability-list .capability-limited { color: var(--amber); }
.trend-capability-list .capability-missing { color: var(--red); }
.trend-capability-list .capability-isolated { color: var(--muted); }
.trend-limit-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.trend-limit-list li { position: relative; padding: 7px 0 7px 15px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: var(--font-assist); line-height: 1.45; overflow-wrap: anywhere; }
.trend-limit-list li::before { content: ""; position: absolute; left: 2px; top: 13px; width: 5px; height: 5px; border-radius: 50%; background: var(--amber); }

@media (max-width: 600px) {
  .trend-scenario-grid, .trend-report-detail-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 721px) {
  .trend-report-block table { min-width: 0; table-layout: fixed; }
  .trend-report-block th, .trend-report-block td { white-space: normal; overflow-wrap: anywhere; }
  .trend-report-block th:nth-child(1) { width: 10%; }
  .trend-report-block th:nth-child(2) { width: 10%; }
  .trend-report-block th:nth-child(3) { width: 10%; }
  .trend-report-block th:nth-child(4) { width: 17%; }
  .trend-report-block th:nth-child(5) { width: 23%; }
  .trend-report-block th:nth-child(6) { width: 15%; }
  .trend-report-block th:nth-child(7) { width: 15%; }
}

.plan-list { margin: 0; display: grid; gap: 0; }
.plan-list > div { min-width: 0; display: grid; grid-template-columns: minmax(90px, 0.7fr) minmax(120px, 1.3fr); gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--line); }
.plan-list > div:last-child { border-bottom: 0; }
.plan-list dt { color: var(--muted); font-size: 11px; }
.plan-list dd { min-width: 0; margin: 0; text-align: right; font-size: 12px; font-weight: 500; overflow-wrap: anywhere; }
.plan-list.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
.execution-plan .plan-list.compact { grid-template-columns: 1fr; }
.execution-plan .plan-list > div { grid-template-columns: minmax(72px, 0.65fr) minmax(0, 1.35fr); }

.plan-blocker, .detail-note, .conflict-row, .danger-confirm, .reconcile-progress {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 10px;
  padding: 9px 10px;
  border-radius: 3px;
  font-size: 11px;
}
.plan-blocker, .warning-note { color: #7a4b00; background: var(--amber-soft); border: 1px solid #e6c790; }
.danger-note, .danger-confirm { color: #8e252d; background: var(--red-soft); border: 1px solid #e2aeb2; }
.success-note { color: #056946; background: var(--green-soft); border: 1px solid #afd6c7; }
.detail-note svg, .plan-blocker svg, .conflict-row svg, .danger-confirm svg { width: 16px; height: 16px; flex: 0 0 16px; }
.detail-note span, .plan-blocker span, .conflict-row span, .danger-confirm span { min-width: 0; overflow-wrap: anywhere; }
.panel-actions { margin-top: 12px; }
.panel-actions > button { flex: 1 1 0; }

.table-section { margin-bottom: 12px; overflow: hidden; }
.table-scroll { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 760px; }
th, td { padding: 9px 11px; border-bottom: 1px solid var(--line); text-align: left; white-space: nowrap; font-size: 11px; }
th { background: var(--surface-soft); color: var(--muted); font-weight: 500; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #f8faf9; }
td strong { font-weight: 500; }
td small { display: block; margin-top: 2px; color: var(--muted); }
.empty-table-state, td.empty-state { padding: 18px 12px; color: var(--muted); text-align: center; white-space: normal; }
.automation-execution-grid td.empty-state > strong,
.automation-execution-grid td.empty-state > span,
.automation-execution-grid td.empty-state > small { display: block; }
.automation-execution-grid td.empty-state > strong { color: var(--ink); margin-bottom: 5px; }
.automation-execution-grid td.empty-state > small { margin-top: 4px; color: var(--muted); }
.automation-position-section tr.is-unmanaged-position td { background: color-mix(in srgb, var(--red) 3%, var(--surface)); }
.selectable-row { cursor: pointer; }
.selectable-row.is-selected { background: var(--blue-soft); box-shadow: inset 3px 0 0 var(--blue); }

.filter-bar, .analysis-inputs {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 9px;
  margin-bottom: 12px;
  padding: 10px;
  border: 1px solid var(--line);
  background: var(--surface);
}
.filter-bar label, .analysis-inputs label { min-width: 130px; }
.timestamp { margin-left: auto; align-self: center; color: var(--muted); font-size: 11px; }

.ranking-layout, .event-layout, .model-layout, .settings-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 12px;
}
.ranking-summary-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(130px, 1fr));
  margin-bottom: 12px;
  border: 1px solid var(--line);
  background: var(--surface);
}
.ranking-summary-strip > div { min-width: 0; padding: 11px 14px; border-right: 1px solid var(--line); }
.ranking-summary-strip > div:last-child { border-right: 0; }
.ranking-summary-strip span, .ranking-summary-strip strong, .ranking-summary-strip small { display: block; }
.ranking-summary-strip span, .ranking-summary-strip small { color: var(--muted); font-size: var(--font-assist); }
.ranking-summary-strip strong { margin: 3px 0; font-size: 19px; font-weight: 600; overflow-wrap: anywhere; }
#rankingTable { min-width: 1040px; }
.ranking-decision-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 12px 0; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.ranking-decision-summary > div { min-width: 0; padding: 9px 10px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ranking-decision-summary dt { color: var(--muted); font-size: var(--font-assist); }
.ranking-decision-summary dd { margin: 3px 0 0; font-size: var(--font-body); font-weight: 600; overflow-wrap: anywhere; }
.ranking-detail-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.ranking-detail-actions button { justify-content: center; }
.ranking-layout.movers-mode { grid-template-columns: minmax(0, 1fr); }
.ranking-layout.movers-mode .ranking-table { width: 100%; }
.mover-list-control { display: none; }
.filter-bar:has([data-ranking-kind="movers"].is-selected) .mover-list-control { display: inline-flex; }
.filter-bar:has([data-ranking-kind="movers"].is-selected) .ranking-strategy-filter { display: none; }
.strategy-router-section { margin-bottom: 12px; }
.ranking-table { margin-bottom: 0; }
.ranking-score-missing { color: var(--amber); font-weight: 600; }
.score-large { font-size: 24px; font-weight: 500; color: var(--blue); }
.score-bars, .limit-list { display: grid; gap: 10px; }
.score-bars > div, .limit-list > div { display: grid; grid-template-columns: 82px minmax(80px, 1fr) 32px; align-items: center; gap: 8px; }
.score-bars span, .limit-list span { color: var(--muted); font-size: 11px; }
.score-bars strong, .limit-list strong { text-align: right; font-size: 11px; font-weight: 500; }
progress { width: 100%; height: 7px; overflow: hidden; border: 0; border-radius: 0; background: var(--surface-strong); accent-color: var(--blue); }
progress::-webkit-progress-bar { background: var(--surface-strong); }
progress::-webkit-progress-value { background: var(--blue); }

.analysis-inputs { display: grid; grid-template-columns: repeat(5, minmax(120px, 1fr)); }
.direction-summary { display: grid; grid-template-columns: minmax(180px, 0.8fr) minmax(0, 3.2fr); gap: 0; margin-bottom: 10px; }
.direction-summary > * { min-width: 0; }
.direction-main { display: grid; place-content: center; min-width: 0; min-height: 98px; overflow: hidden; padding: 12px; border: 1px solid #b8cede; border-left: 4px solid var(--amber); background: var(--blue-soft); text-align: center; }
.direction-main.direction-summary-long { border-left-color: var(--price-up); background: color-mix(in srgb, var(--blue-soft) 82%, var(--price-up-soft)); }
.direction-main.direction-summary-short { border-left-color: var(--price-down); background: color-mix(in srgb, var(--blue-soft) 82%, var(--price-down-soft)); }
.direction-main.direction-summary-neutral { border-left-color: var(--amber); background: var(--blue-soft); }
.direction-main span, .direction-main small, .direction-main strong { display: block; max-width: 100%; overflow-wrap: anywhere; }
.direction-main span, .direction-main small { color: var(--muted); font-size: 11px; }
.direction-main strong { margin: 3px 0; font-size: 22px; font-weight: 500; line-height: 1.2; }
.evidence-split { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid #b8d4c5; border-left: 0; background: color-mix(in srgb, var(--green) 3%, var(--surface)); }
.evidence-split > div { min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 9px 11px; border-right: 1px solid var(--line); }
.evidence-split > div:last-child { border-right: 0; }
.evidence-split span, .evidence-split strong { display: block; }
.evidence-split span { color: var(--muted); font-size: 11px; }
.evidence-split strong { margin-top: 2px; overflow-wrap: anywhere; font-size: 16px; font-weight: 500; }
.conflict-row { margin: 0 0 8px; background: var(--blue-soft); border: 1px solid #b5cada; color: #234e70; }
.direction-rationale { display: grid; grid-template-columns: minmax(300px, 1.45fr) minmax(150px, 0.65fr) minmax(0, 0.9fr) minmax(0, 0.9fr); align-items: stretch; gap: 10px; margin-bottom: 10px; }
.rationale-column { min-width: 0; min-height: 158px; padding: 11px 13px; border: 1px solid var(--line); background: var(--surface); }
.rationale-column + .rationale-column { border-left: 1px solid var(--line); }
.long-rationale { border-top: 3px solid var(--price-up); background: color-mix(in srgb, var(--price-up) 2.5%, var(--surface)); }
.short-rationale { border-top: 3px solid var(--price-down); background: color-mix(in srgb, var(--price-down) 2.5%, var(--surface)); }
.rationale-column h3 { display: flex; align-items: center; gap: 6px; margin: 0 0 9px; padding-bottom: 7px; border-bottom: 1px solid var(--line); font-size: 12px; font-weight: 600; }
.rationale-column h3 svg { width: 15px; height: 15px; }
.long-rationale h3 { color: var(--price-up); }
.short-rationale h3 { color: var(--price-down); }
.rationale-column ul { margin: 0; padding: 0; display: grid; gap: 6px; list-style: none; }
.rationale-column li { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px; font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
.rationale-column li strong { color: var(--muted); font-weight: 500; }
.rationale-column li small { grid-column: 2; color: var(--muted); }
.trigger-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 8px; }
.decision-pipeline { display: grid; grid-template-columns: 1fr; margin: 0 0 10px; overflow: hidden; border: 1px solid var(--line); background: var(--surface); }
.decision-pipeline-step { min-width: 0; min-height: 48px; display: grid; grid-template-columns: minmax(68px, 0.72fr) minmax(82px, 0.86fr) minmax(0, 1.42fr); align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid var(--line); box-shadow: inset 3px 0 0 var(--amber); }
.decision-pipeline-step:last-child { border-bottom: 0; }
.decision-pipeline-step.pipeline-pass { box-shadow: inset 3px 0 0 var(--green); background: color-mix(in srgb, var(--green) 3%, var(--surface)); }
.decision-pipeline-step.pipeline-blocked { box-shadow: inset 3px 0 0 var(--red); background: color-mix(in srgb, var(--red) 3%, var(--surface)); }
.decision-pipeline-step > span, .specialist-gate-strip span { color: var(--muted); font-size: 11px; }
.decision-pipeline-step > strong { margin: 0; font-size: 13px; line-height: 1.25; overflow-wrap: anywhere; }
.decision-pipeline-step > small { color: var(--muted); font-size: 11px; line-height: 1.35; overflow-wrap: anywhere; }
.specialist-gate-strip { display: grid; grid-template-columns: 1fr; margin: -1px 0 10px; border: 1px solid var(--line); background: var(--surface-soft); }
.specialist-gate-strip > div { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 8px; padding: 8px 10px; border-bottom: 1px solid var(--line); }
.specialist-gate-strip > div:last-child { border-bottom: 0; }
.specialist-gate-strip strong { min-width: 0; font-size: 12px; text-align: right; overflow-wrap: anywhere; }
.specialist-gate-strip small { grid-column: 1 / -1; color: var(--muted); font-size: 11px; line-height: 1.35; overflow-wrap: anywhere; }
.trigger-side { min-height: 88px; padding: 10px; border: 1px solid var(--line); }

.trigger-side span, .trigger-side strong, .trigger-side small { display: block; }
.trigger-side span, .trigger-side small { color: var(--muted); font-size: 11px; }
.trigger-side strong { margin: 4px 0; font-size: 22px; font-weight: 500; }
.scenario-levels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 9px 0 0; border-top: 1px solid var(--line); }
.scenario-levels > div { min-width: 0; padding: 6px 6px 2px 0; }
.scenario-levels dt { color: var(--muted); font-size: 11px; }
.scenario-levels dd { margin: 2px 0 0; font-size: 11px; font-weight: 500; overflow-wrap: anywhere; }
.execution-plan .plan-list .wide-plan-item { grid-column: 1 / -1; }
.execution-plan .plan-list .wide-plan-item dd { text-align: left; }
.exit-rule-list { display: grid; gap: 5px; margin: 9px 0; padding-top: 8px; border-top: 1px solid var(--line); }
.exit-rule-list span { display: grid; grid-template-columns: 68px minmax(0, 1fr); gap: 6px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.exit-rule-list strong { color: var(--ink); font-weight: 500; }
.long-side { border-top: 3px solid var(--price-up); }
.short-side { border-top: 3px solid var(--price-down); }
.gate-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; margin: 10px 0; }
.gate-checks > div { display: flex; align-items: center; gap: 5px; padding: 6px; background: var(--surface-soft); font-size: 11px; }
.gate-checks svg { width: 14px; height: 14px; }
.check-pass { color: var(--green); }
.check-fail { color: var(--red); }
.check-pending { color: var(--amber); }
.no-trade-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.no-trade-grid span { min-width: 0; padding: 10px 12px; overflow-wrap: anywhere; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: 11px; }

.gateway-state { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: var(--font-meta); }
.trade-environment-workbench { display: grid; grid-template-columns: minmax(280px, 1fr) auto auto; align-items: center; gap: 14px; margin-bottom: 10px; padding: 12px 14px; border: 1px solid var(--line); background: var(--surface-soft); }
.trade-environment-workbench > div:first-child { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 3px 10px; }
.trade-environment-workbench > div:first-child > span { color: var(--muted); font-size: var(--font-meta); }
.trade-environment-workbench > div:first-child > strong { font-size: 17px; }
.trade-environment-workbench > div:first-child > small { grid-column: 1 / -1; color: var(--muted); font-size: var(--font-assist); }
.trade-environment-selector button { min-width: 132px; }
.trade-account-strip { display: grid; grid-template-columns: repeat(5, minmax(120px, 1fr)); margin-bottom: 10px; border: 1px solid var(--line); background: var(--surface); }
.trade-account-strip > div { min-width: 0; min-height: 60px; display: flex; flex-direction: column; justify-content: center; padding: 8px 12px; border-right: 1px solid var(--line); }
.trade-account-strip > div:last-child { border-right: 0; }
.trade-account-strip span { color: var(--muted); font-size: var(--font-meta); }
.trade-account-strip strong { margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; }
.trade-mode-gate { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 10px; margin-bottom: 12px; padding: 9px 12px; border: 1px solid var(--line); }
.trade-mode-gate > svg { width: 20px; height: 20px; }
.trade-mode-gate > div { min-width: 0; display: grid; gap: 2px; }
.trade-mode-gate > div strong { font-size: var(--font-body); }
.trade-mode-gate > div span { color: var(--muted); font-size: var(--font-meta); }
.trade-mode-gate-paper { border-color: #9bc6b2; background: var(--green-soft); color: #166143; }
.trade-mode-gate-live { border-color: #dda1a6; background: var(--red-soft); color: #8e252d; }
.order-layout { display: grid; grid-template-columns: minmax(520px, 1fr) minmax(470px, 0.9fr); gap: 12px; margin-bottom: 12px; }
.side-selector { width: 100%; margin-bottom: 10px; }
.side-selector button { flex: 1 1 50%; }
.form-grid { display: grid; gap: 10px; }
.two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.number-stepper { display: grid; grid-template-columns: 34px minmax(50px, 1fr) 34px; }
.number-stepper button { display: grid; place-items: center; border: 1px solid var(--line-strong); background: var(--surface-soft); color: var(--ink); }
.number-stepper input { border-left: 0; border-right: 0; border-radius: 0; text-align: center; }
.number-stepper svg { width: 14px; height: 14px; }
.quick-price-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
}
.quick-price-row > span { margin-right: 2px; color: var(--muted); font-size: var(--font-meta); }
.quick-price-row button { min-height: 31px; padding: 4px 10px; border: 1px solid var(--line); border-radius: 3px; background: var(--surface-soft); color: var(--ink); font-size: var(--font-meta); }
.quick-price-row button:hover { border-color: var(--blue); color: var(--blue); }
.order-estimate { display: grid; grid-template-columns: repeat(4, minmax(100px, 1fr)); margin-top: 12px; border: 1px solid var(--line); background: var(--surface-soft); }
.order-estimate > div { min-height: 72px; padding: 10px 12px; border-right: 1px solid var(--line); }
.order-estimate > div:last-child { border-right: 0; }
.order-estimate span, .order-estimate strong { display: block; }
.order-estimate span { color: var(--muted); font-size: var(--font-meta); }
.order-estimate strong { margin-top: 5px; font-size: 18px; font-weight: 600; line-height: 1.25; }
.sizing-breakdown { display: grid; grid-template-columns: repeat(4, minmax(70px, 1fr)); margin-top: 8px; border: 1px solid var(--line); background: var(--surface-soft); }
.sizing-breakdown > div { padding: 7px 8px; border-right: 1px solid var(--line); }
.sizing-breakdown > div:last-child { border-right: 0; }
.sizing-breakdown span, .sizing-breakdown strong { display: block; }
.sizing-breakdown span { color: var(--muted); font-size: var(--font-meta); }
.sizing-breakdown strong { margin-top: 3px; font-size: 16px; font-weight: 600; }
.depth-column-head { display: grid; grid-template-columns: 56px minmax(100px, 1fr) minmax(150px, auto); padding: 6px 10px; border: 1px solid var(--line); border-bottom: 0; background: var(--surface-soft); color: var(--muted); font-size: var(--font-assist); }
.depth-column-head span:nth-child(2) { text-align: center; }
.depth-column-head span:last-child { text-align: right; }
.order-book { display: grid; gap: 1px; background: var(--line); border: 1px solid var(--line); }
.book-row, .last-price { position: relative; display: grid; grid-template-columns: 56px minmax(100px, 1fr) minmax(150px, auto); align-items: center; min-height: 46px; padding: 7px 12px; background: var(--surface); font-size: var(--font-body); }
.book-row::before { content: ""; position: absolute; z-index: 0; top: 0; bottom: 0; right: 0; width: var(--depth-share, 0%); opacity: 0.55; }
.ask::before { background: var(--red-soft); }
.bid::before { background: var(--green-soft); }
.book-row > *, .last-price > * { position: relative; z-index: 1; }
.book-row strong, .last-price strong { text-align: center; font-size: 17px; font-weight: 600; }
.book-row em, .last-price em { text-align: right; font-size: var(--font-meta); font-style: normal; color: var(--muted); }
.ask span, .ask strong { color: var(--price-up); }
.bid span, .bid strong { color: var(--price-down); }
.best { font-weight: 500; }
.last-price { min-height: 62px; background: #eef4f8; border-block: 1px solid var(--line-strong); }
.last-price strong { font-size: 25px; font-weight: 700; }
.last-price em { font-weight: 600; }
.book-market-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 10px; border: 1px solid var(--line); background: var(--surface-soft); }
.book-market-summary > div { min-width: 0; min-height: 50px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.book-market-summary > div:nth-child(2n) { border-right: 0; }
.book-market-summary > div:nth-last-child(-n + 2) { border-bottom: 0; }
.book-market-summary span { color: var(--muted); font-size: var(--font-meta); }
.book-market-summary strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.microstructure-row { display: grid; grid-template-columns: 1fr; gap: 0; margin-top: 10px; border: 1px solid var(--line); color: var(--muted); font-size: var(--font-meta); }
.microstructure-row span { min-width: 0; padding: 8px 10px; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.microstructure-row span:last-child { border-bottom: 0; }
.microstructure-row strong { color: var(--ink); font-weight: 500; }
.book-integrity-warning { color: var(--red) !important; }
.orders-simulation-workspace { margin-top: 20px; padding-top: 18px; border-top: 2px solid var(--line-strong); }
.orders-simulation-workspace .trading-subsection-heading { min-height: 0; margin-bottom: 12px; }

.exit-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.exit-actions button { min-height: 42px; }

.automation-layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr); gap: 12px; margin-bottom: 12px; }
.compact-switch { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.compact-switch input, .switch-row input {
  position: relative;
  width: 36px;
  height: 20px;
  min-height: 20px;
  flex: 0 0 36px;
  margin: 0;
  padding: 0;
  appearance: none;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--surface-strong);
  cursor: pointer;
  transition: background 140ms ease, border-color 140ms ease;
}
.compact-switch input::before, .switch-row input::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 1px 3px rgba(18, 22, 20, 0.22);
  transition: transform 140ms ease;
}
.compact-switch input:checked, .switch-row input:checked { border-color: var(--green); background: var(--green); }
.compact-switch input:checked::before, .switch-row input:checked::before { transform: translateX(16px); }
.automation-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 12px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.automation-actions label { min-height: 58px; display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: start; gap: 8px; padding: 9px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.automation-actions input { width: 16px; height: 16px; min-height: 16px; margin: 2px 0 0; padding: 0; accent-color: var(--green); }
.automation-actions strong, .automation-actions small { display: block; }
.automation-actions strong { font-size: 11px; font-weight: 500; }
.automation-actions small { margin-top: 3px; color: var(--muted); }
.automation-suggestion-note { align-items: flex-start; gap: 9px; }
.automation-suggestion-content { min-width: 0; flex: 1; }
.automation-suggestion-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 12px; margin-bottom: 8px; }
.automation-suggestion-heading strong { color: var(--text); font-weight: 650; }
.automation-suggestion-heading span, .automation-suggestion-content > small { color: var(--muted); line-height: 1.45; }
.automation-suggestion-grid { display: grid; grid-template-columns: repeat(7, minmax(92px, 1fr)); gap: 6px; }
.automation-suggestion-grid > div { min-width: 0; padding: 7px 8px; border: 1px solid var(--line); background: var(--panel); }
.automation-suggestion-grid span, .automation-suggestion-grid strong { display: block; overflow-wrap: anywhere; }
.automation-suggestion-grid span { color: var(--muted); font-size: var(--font-assist); }
.automation-suggestion-grid strong { margin-top: 3px; color: var(--text); font-size: var(--font-body); font-weight: 650; }
@media (max-width: 1200px) { .automation-suggestion-grid { grid-template-columns: repeat(4, minmax(110px, 1fr)); } }
@media (max-width: 720px) { .automation-suggestion-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.storage-facts { margin: 12px 0 0; border-top: 1px solid var(--line); }
.storage-facts > div { min-height: 38px; display: flex; justify-content: space-between; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); }
.storage-facts dt { color: var(--muted); }
.storage-facts dd { margin: 0; text-align: right; }
.shadow-oms-section { margin-top: 12px; }
#shadowOmsBody td small { display: block; margin-top: 3px; color: var(--muted); }
.oms-integrity-strip { display: grid; grid-template-columns: repeat(5, minmax(120px, 1fr)); border-top: 1px solid var(--line); background: var(--surface-soft); }
.oms-integrity-strip span { min-height: 38px; display: flex; align-items: center; gap: 6px; padding: 7px 10px; border-right: 1px solid var(--line); color: var(--muted); font-size: 11px; }
.oms-integrity-strip span:last-child { border-right: 0; }
.oms-integrity-strip svg { width: 14px; height: 14px; color: var(--green); }

.governance-warning { margin-bottom: 12px; }
.governance-warning strong { font-weight: 600; }
.governance-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.fingerprint-list { margin: 0; border-top: 1px solid var(--line); }
.fingerprint-list > div { min-height: 40px; display: grid; grid-template-columns: 120px minmax(0, 1fr); align-items: center; gap: 10px; border-bottom: 1px solid var(--line); }
.fingerprint-list dt { color: var(--muted); }
.fingerprint-list dd { min-width: 0; margin: 0; text-align: right; overflow-wrap: anywhere; }
.fingerprint-list + .button-block { margin-top: 12px; }
.button-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.button-row > button { flex: 1 1 170px; }
.recovery-checklist { display: grid; margin-bottom: 12px; border-top: 1px solid var(--line); }
.recovery-checklist > div { min-height: 40px; display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: center; gap: 8px; border-bottom: 1px solid var(--line); }
.recovery-checklist svg { width: 16px; height: 16px; }
.recovery-checklist .check-pending { color: var(--amber); }
.slo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.slo-grid > div { min-height: 62px; padding: 10px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.slo-grid span, .slo-grid strong { display: block; }
.slo-grid span { color: var(--muted); font-size: 11px; }
.slo-grid strong { margin-top: 4px; font-size: 15px; font-weight: 500; }

.risk-layout { grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.25fr); }

.event-layout { align-items: start; }
.event-risk-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); margin-bottom: 10px; }
.event-risk-metrics > div { min-height: 56px; padding: 8px 9px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.event-risk-metrics span, .event-risk-metrics strong { display: block; }
.event-risk-metrics span { color: var(--muted); font-size: var(--font-assist); }
.event-risk-metrics strong { margin-top: 3px; font-size: var(--font-control); font-weight: 600; }
.event-risk-facts { margin: 10px 0 0; border-top: 1px solid var(--line); }
.event-risk-facts > div { display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--line); }
.event-risk-facts dt { color: var(--muted); font-size: var(--font-assist); }
.event-risk-facts dd { margin: 0; text-align: right; font-size: var(--font-assist); overflow-wrap: anywhere; }
.timeline-panel { padding: 0; overflow: hidden; }
.timeline-date { padding: 9px 13px; background: var(--surface-soft); border-bottom: 1px solid var(--line); color: var(--muted); font-size: 11px; font-weight: 500; }
.timeline-item { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--line); border-left: 3px solid var(--line-strong); }
.timeline-item:last-child { border-bottom: 0; }
.timeline-item time { font-weight: 500; }
.timeline-item h2 { margin: 0; font-size: 14px; font-weight: 600; line-height: 1.4; }
.timeline-item h2 a { color: inherit; text-decoration: none; }
.timeline-item h2 a:hover { color: var(--accent); text-decoration: underline; }
.timeline-item p { margin: 4px 0; color: var(--muted); font-size: 11px; }
.timeline-item span { font-size: 11px; }
.timeline-item .event-timestamps, .timeline-item .event-keywords { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; }
.severity-high { border-left-color: var(--red); }
.severity-medium { border-left-color: var(--amber); }
.severity-low { border-left-color: var(--blue); }
.setting-list { display: grid; gap: 0; border-top: 1px solid var(--line); }
.switch-row { min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.switch-row strong, .switch-row small { display: block; }
.switch-row strong { color: var(--ink); font-size: 11px; font-weight: 500; }
.switch-row small { margin-top: 2px; color: var(--muted); }

.source-list { display: grid; }
.source-list > div { min-height: 54px; display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 9px; border-bottom: 1px solid var(--line); }
.source-list > div:last-child { border-bottom: 0; }
.source-list strong, .source-list small { display: block; }
.source-list strong { font-size: 11px; font-weight: 500; }
.source-list small { margin-top: 3px; color: var(--muted); }
.freshness-grid, .validation-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.freshness-grid > div, .validation-metrics > div { min-height: 62px; padding: 10px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.freshness-grid span, .freshness-grid strong, .validation-metrics span, .validation-metrics strong { display: block; }
.freshness-grid span, .validation-metrics span { color: var(--muted); font-size: 11px; }
.freshness-grid strong, .validation-metrics strong { margin-top: 4px; font-size: 16px; font-weight: 500; }

.model-layout { align-items: start; }
.gate-list { display: grid; gap: 0; }
.gate-list > div { min-height: 52px; display: flex; gap: 9px; align-items: flex-start; padding: 9px 0; border-bottom: 1px solid var(--line); }
.gate-list svg { width: 17px; height: 17px; flex: 0 0 17px; }
.gate-list strong, .gate-list small { display: block; }
.gate-list strong { font-size: 11px; font-weight: 500; }
.gate-list small { margin-top: 2px; color: var(--muted); }
.gate-pass svg { color: var(--green); }
.gate-fail svg { color: var(--red); }
.gate-pending svg { color: var(--blue); }
.training-row { display: grid; grid-template-columns: minmax(180px, 0.7fr) minmax(180px, 1fr) auto auto; align-items: center; gap: 12px; padding: 12px; }
.training-row strong, .training-row span { display: block; }
.training-row strong { font-size: 11px; font-weight: 500; }
.training-row span { margin-top: 2px; color: var(--muted); font-size: 11px; }
.training-queue-scroll { min-height: 0; max-height: 360px; overflow: auto; border-top: 1px solid var(--line); scrollbar-gutter: stable; }
.training-queue-table { min-width: 560px; table-layout: fixed; }
.training-queue-table th:nth-child(1) { width: 68px; }
.training-queue-table th:nth-child(2) { width: 42%; }
.training-queue-table th:nth-child(3) { width: 18%; }
.training-queue-table th:nth-child(4) { width: 20%; }
.training-queue-table th:nth-child(5) { width: 110px; }
.training-queue-table td:first-child { color: var(--muted); font-variant-numeric: tabular-nums; }
.training-queue-table td small { font-family: Consolas, "Cascadia Mono", monospace; }
.training-queue-table thead { position: sticky; top: 0; z-index: 2; }

.health-strip { display: grid; grid-template-columns: repeat(5, minmax(110px, 1fr)); margin-bottom: 12px; border: 1px solid var(--line); background: var(--surface); }
.health-strip > div { min-width: 0; display: grid; grid-template-columns: 20px minmax(0, 1fr); grid-template-rows: auto auto; padding: 10px 12px; border-right: 1px solid var(--line); }
.health-strip > div:last-child { border-right: 0; }
.health-strip svg { grid-row: 1 / 3; width: 16px; height: 16px; margin-top: 5px; color: var(--muted); }
.health-strip span { color: var(--muted); font-size: 11px; }
.health-strip strong { margin-top: 2px; font-size: 11px; font-weight: 500; }
.reconciliation-panel { align-self: start; }
.recovery-control-panel { margin-top: 12px; }
.recovery-state-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.recovery-state-grid > div { min-height: 62px; padding: 10px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.recovery-state-grid span, .recovery-state-grid strong { display: block; }
.recovery-state-grid span { color: var(--muted); font-size: 11px; }
.recovery-state-grid strong { margin-top: 5px; font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.recovery-action-row { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.recovery-control-panel .detail-note { margin-top: 10px; }
.log-panel pre { margin: 0; max-height: 164px; overflow: auto; padding: 10px; background: #181d1a; color: #c7d2cc; font-size: 11px; line-height: 1.65; }
.log-panel.is-expanded pre { max-height: min(52vh, 620px); }

.settings-layout { grid-template-columns: 180px minmax(0, 1fr); align-items: start; }
.settings-nav { display: grid; border: 1px solid var(--line); background: var(--surface); }
.settings-nav button { min-height: 40px; padding: 8px 12px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--muted); text-align: left; }
.settings-nav button:last-child { border-bottom: 0; }
.settings-nav button:hover, .settings-nav button.is-active { background: var(--surface-soft); color: var(--ink); box-shadow: inset 3px 0 0 var(--green); }
.settings-content { min-width: 0; }
.settings-section { margin-bottom: 12px; padding: 14px; border: 1px solid var(--line); background: var(--surface); }
.settings-section .section-heading { margin: -14px -14px 14px; }
.security-summary { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; padding: 9px 11px; border: 1px solid #aec8dc; background: var(--blue-soft); }
.security-summary > div { min-width: 0; display: flex; align-items: center; gap: 9px; color: #234e70; }
.security-summary svg { width: 18px; height: 18px; flex: 0 0 18px; }
.security-summary strong, .security-summary small { display: block; }
.security-summary strong { font-size: 11px; font-weight: 500; }
.security-summary small { margin-top: 3px; color: #4f708a; }
.security-summary label { min-width: 120px; color: var(--muted); font-size: 11px; }
.security-summary select { display: block; width: 100%; margin-top: 3px; }
#userTable td small { display: block; margin-top: 2px; color: var(--muted); }
.update-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.update-row strong, .update-row span { display: block; }
.update-row strong { font-size: 11px; font-weight: 500; }
.update-row span { margin-top: 3px; color: var(--muted); font-size: 11px; }

.forward-progress-panel { margin-bottom: 12px; }
.dual-progress { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.dual-progress > div > div { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; font-size: 11px; }
.dual-progress strong { font-weight: 500; }
.dual-progress progress { height: 10px; }
.forward-rules { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 13px; }
.forward-rules span { display: flex; align-items: center; gap: 6px; padding: 7px 8px; background: var(--surface-soft); color: var(--muted); font-size: 11px; }
.forward-rules svg { width: 14px; height: 14px; color: var(--green); }

.validation-stage-strip { display: grid; grid-template-columns: auto minmax(10px, 1fr) auto minmax(10px, 1fr) auto minmax(10px, 1fr) auto minmax(10px, 1fr) auto; align-items: center; margin-bottom: 12px; padding: 12px; border: 1px solid var(--line); background: var(--surface); }
.stage-item { min-width: 120px; display: flex; align-items: center; gap: 8px; color: var(--muted); }
.stage-item > svg { width: 22px; height: 22px; padding: 4px; border: 1px solid var(--line); border-radius: 50%; }
.stage-item strong, .stage-item small { display: block; }
.stage-item strong { color: var(--ink); font-size: 11px; font-weight: 500; }
.stage-item small { margin-top: 2px; }
.stage-complete > svg { color: var(--green); border-color: #9fcdbb; background: var(--green-soft); }
.stage-running > svg { color: var(--amber); border-color: #e4c78f; background: var(--amber-soft); }
.stage-line { height: 1px; background: var(--line); }
.stage-line.complete { background: var(--green); }

.walk-forward-chart { display: grid; gap: 6px; padding: 6px 0 2px; }
.wf-axis { display: flex; justify-content: space-between; margin-left: 30px; color: var(--muted); font-size: 11px; }
.wf-row { position: relative; height: 18px; padding-left: 30px; background: repeating-linear-gradient(to right, transparent, transparent calc(20% - 1px), var(--line) 20%); opacity: 1; }
.wf-row > span { position: absolute; left: 0; top: 2px; color: var(--muted); font-size: 11px; }
.wf-row > i { position: absolute; top: 3px; left: calc(30px + (100% - 30px) * var(--start) / 100); width: calc((100% - 30px) * var(--size) / 100); height: 12px; }
.wf-start-0 { --start: 0; }
.wf-start-8 { --start: 8; }
.wf-start-16 { --start: 16; }
.wf-start-24 { --start: 24; }
.wf-start-32 { --start: 32; }
.wf-start-33 { --start: 33; }
.wf-start-40 { --start: 40; }
.wf-start-41 { --start: 41; }
.wf-start-48 { --start: 48; }
.wf-start-49 { --start: 49; }
.wf-start-56 { --start: 56; }
.wf-start-57 { --start: 57; }
.wf-start-65 { --start: 65; }
.wf-start-73 { --start: 73; }
.wf-start-81 { --start: 81; }
.wf-start-89 { --start: 89; }
.wf-size-32 { --size: 32; }
.wf-size-8 { --size: 8; }
.wf-train { background: var(--blue); }
.wf-test { background: var(--green); border-left: 2px solid var(--surface); }
.wf-row.is-pending { opacity: 0.38; }
.chart-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px; color: var(--muted); font-size: 11px; }
.chart-legend span { display: inline-flex; align-items: center; gap: 5px; }
.chart-legend i { width: 14px; height: 7px; display: inline-block; }
.legend-train { background: var(--blue); }
.legend-test { background: var(--green); }
.legend-gap { background: var(--line); }
.replay-summary { display: grid; grid-template-columns: repeat(6, minmax(90px, 1fr)); border-bottom: 1px solid var(--line); }
.replay-summary > div { padding: 10px 12px; border-right: 1px solid var(--line); }
.replay-summary > div:last-child { border-right: 0; }
.replay-summary span, .replay-summary strong { display: block; }
.replay-summary span { color: var(--muted); font-size: 11px; }
.replay-summary strong { margin-top: 3px; font-size: 15px; font-weight: 500; }
.replay-depth-audit { padding: 10px 12px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 94%, var(--blue) 6%); }
.replay-depth-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.replay-depth-heading > div > strong, .replay-depth-heading > div > span { display: block; }
.replay-depth-heading > div > strong { font-size: var(--font-body); font-weight: 600; }
.replay-depth-heading > div > span { margin-top: 2px; color: var(--muted); font-size: var(--font-small); }
.replay-depth-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin-top: 9px; background: var(--line); }
.replay-depth-grid > div { padding: 8px 10px; background: var(--surface); }
.replay-depth-grid span, .replay-depth-grid strong { display: block; }
.replay-depth-grid span { color: var(--muted); font-size: var(--font-small); }
.replay-depth-grid strong { margin-top: 2px; font-size: 15px; font-weight: 600; }
.replay-depth-missing { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 10px; margin-top: 8px; color: var(--muted); line-height: 1.45; }
.replay-depth-missing strong { color: var(--text); font-weight: 600; }
.replay-lanes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
.replay-lanes > div { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 9px; padding: 10px 12px; border-right: 1px solid var(--line); }
.replay-lanes > div:last-child { border-right: 0; }
.replay-lanes svg { width: 18px; height: 18px; color: var(--blue); }
.replay-lanes strong, .replay-lanes small { display: block; }
.replay-lanes strong { font-size: var(--font-body); font-weight: 600; }
.replay-lanes small { margin-top: 2px; color: var(--muted); }

.halt-banner { min-height: 42px; display: flex; align-items: center; gap: 8px; padding: 7px 20px; color: #82242c; background: var(--red-soft); border-bottom: 1px solid #d99aa0; }
.halt-banner svg { width: 17px; height: 17px; }
.halt-banner span { font-size: 11px; }
.halt-banner .text-button { margin-left: auto; color: #82242c; }

.alert-count { position: absolute; top: -4px; right: -4px; min-width: 17px; height: 17px; display: grid; place-items: center; border-radius: 9px; background: var(--red); color: #ffffff; font-size: 11px; }
.alert-drawer { position: fixed; z-index: 60; top: 0; right: 0; width: min(380px, calc(100vw - 24px)); height: 100vh; overflow-y: auto; overscroll-behavior: contain; padding: 16px; background: var(--surface); border-left: 1px solid var(--line); box-shadow: -12px 0 32px rgba(29, 36, 32, 0.16); transform: translateX(105%); transition: transform 160ms ease; }
.alert-drawer.is-open { transform: translateX(0); }
.drawer-heading { min-height: 50px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.drawer-heading p { margin-top: 3px; color: var(--muted); font-size: 11px; }
.drawer-backdrop { position: fixed; z-index: 55; inset: 0; background: rgba(18, 22, 20, 0.38); }
.alert-list { display: grid; }
.alert-item { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 9px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.alert-item > svg { width: 17px; height: 17px; color: var(--amber); }
.alert-item strong, .alert-item span, .alert-item time { display: block; }
.alert-item strong { font-size: 11px; font-weight: 500; }
.alert-item span { margin-top: 3px; color: var(--muted); font-size: 11px; }
.alert-item time { margin-top: 5px; color: var(--muted); font-size: 11px; }
.alert-critical > svg { color: var(--red); }

dialog { width: min(520px, calc(100vw - 28px)); max-height: calc(100dvh - 28px); overflow-y: auto; overscroll-behavior: contain; padding: 0; border: 1px solid var(--line); border-radius: 5px; background: var(--surface); color: var(--ink); box-shadow: var(--shadow); }
dialog::backdrop { background: rgba(18, 22, 20, 0.48); }
dialog form { display: grid; gap: 14px; padding: 16px; }
.dialog-heading { align-items: center; padding-bottom: 11px; border-bottom: 1px solid var(--line); }
.dialog-footer { justify-content: flex-end; padding-top: 3px; }
.review-list { display: grid; }
.review-list > div { min-height: 56px; display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 9px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.review-list svg { width: 18px; height: 18px; }
.review-list strong, .review-list small { display: block; }
.review-list strong { font-size: 11px; font-weight: 500; }
.review-list small { margin-top: 3px; color: var(--muted); }
.check-icon { color: var(--green); }
.fail-icon { color: var(--red); }
.danger-confirm { margin-top: 0; padding: 12px; }
.danger-confirm strong, .danger-confirm span, .reconcile-progress strong, .reconcile-progress small { display: block; }
.danger-confirm span { margin-top: 4px; font-size: 11px; }
.form-check { display: flex; grid-template-columns: none; align-items: center; gap: 8px; color: var(--ink); }
.form-check input { width: 16px; height: 16px; min-height: 16px; accent-color: var(--green); }
.reconcile-progress { margin: 0; align-items: center; background: var(--blue-soft); border: 1px solid #aec8dc; color: #234e70; }
.reconcile-progress small { margin-top: 3px; }
.session-dialog { width: min(440px, calc(100vw - 28px)); }
.session-profile { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 10px; background: var(--surface-soft); border: 1px solid var(--line); }
.session-profile strong, .session-profile span { display: block; }
.session-profile strong { font-size: 12px; font-weight: 500; }
.session-profile div > span { margin-top: 3px; color: var(--muted); font-size: 11px; }
.session-facts { margin: 0; border-top: 1px solid var(--line); }
.session-facts > div { min-height: 40px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); }
.session-facts dt { color: var(--muted); }
.session-facts dd { margin: 0; text-align: right; }
.login-dialog { width: min(410px, calc(100vw - 28px)); }
.login-dialog::backdrop { background: rgba(18, 22, 20, 0.76); }
.login-dialog form { gap: 13px; padding: 22px; }
.login-brand { display: flex; align-items: center; gap: 11px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.login-brand .brand-mark { color: var(--green); border-color: #8dbba7; background: var(--green-soft); }
.login-brand h2 { font-size: 17px; }
.login-brand p { margin-top: 3px; color: var(--muted); font-size: 11px; }
.login-dialog label { display: grid; gap: 4px; color: var(--muted); font-size: 11px; }
.login-dialog .form-check { display: flex; color: var(--ink); }
.auth-notice { display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: start; gap: 8px; padding: 9px 10px; border: 1px solid #aec8dc; background: var(--blue-soft); color: #234e70; font-size: 11px; line-height: 1.45; }
.auth-notice svg { width: 17px; height: 17px; }
.auth-footnote { color: var(--muted); font-size: 11px; line-height: 1.5; text-align: center; }
.auth-register-link { justify-self: center; }
.broker-login-dialog { width: min(660px, calc(100vw - 28px)); }
.broker-session-status { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 11px; border: 1px solid var(--line); background: var(--surface-soft); }
.broker-session-status > svg { width: 20px; height: 20px; color: var(--blue); }
.broker-session-status strong, .broker-session-status small { display: block; }
.broker-session-status small { margin-top: 3px; color: var(--muted); }
.nav-backdrop { position: fixed; z-index: 45; inset: 0; background: rgba(18, 22, 20, 0.45); }
.spin { animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.toast { position: fixed; z-index: 90; right: 18px; bottom: 18px; max-width: min(380px, calc(100vw - 36px)); padding: 9px 12px; border-radius: 4px; background: var(--nav); color: #ffffff; box-shadow: var(--shadow); opacity: 0; pointer-events: none; transform: translateY(8px); transition: opacity 140ms ease, transform 140ms ease; }
.toast.is-visible { opacity: 1; transform: translateY(0); }

/* Desktop typography: keep dense trading layouts readable on 1080p and high-DPI screens. */
@media (min-width: 721px) {
  :root { font-size: 15px; }
  body { line-height: 1.45; }
  h1 { font-size: 24px; }
  h2 { font-size: 17px; }
  small, code { font-size: 13px; }

  .brand-copy span,
  .sidebar-footer strong,
  .sidebar-footer span,
  .environment-control label,
  .contract-switcher label,
  .top-status-item span,
  .user-avatar,
  .user-button-copy strong,
  .environment-banner,
  .page-heading p,
  .panel-heading p,
  .section-heading p,
  .dialog-heading p,
  .small-command,
  [data-tooltip]::after,
  label,
  .metric-card span,
  .gate-bar span,
  .status-badge,
  .level-row span,
  .market-subchart strong,
  .market-quote-strip > span,
  .plan-list dt,
  .plan-blocker,
  .detail-note,
  .conflict-row,
  .danger-confirm,
  .reconcile-progress,
  th,
  td,
  .timestamp,
  .score-bars span,
  .limit-list span,
  .score-bars strong,
  .limit-list strong,
  .direction-main span,
  .direction-main small,
  .rationale-column li,
  .trigger-side span,
  .trigger-side small,
  .exit-rule-list span,
  .gate-checks > div,
  .no-trade-grid span,
  .gateway-state,
  .quick-price-row > span,
  .quick-price-row button,
  .order-estimate span,
  .sizing-breakdown span,
  .book-row,
  .last-price,
  .microstructure-row,
  .compact-switch,
  .automation-actions strong,
  .oms-integrity-strip span,
  .slo-grid span,
  .timeline-date,
  .timeline-item p,
  .timeline-item span,
  .switch-row strong,
  .source-list strong,
  .freshness-grid span,
  .validation-metrics span,
  .gate-list strong,
  .training-row strong,
  .training-row span,
  .health-strip span,
  .health-strip strong,
  .log-panel pre,
  .security-summary strong,
  .security-summary label,
  .update-row strong,
  .update-row span,
  .dual-progress > div > div,
  .forward-rules span,
  .stage-item strong,
  .wf-axis,
  .wf-row > span,
  .chart-legend,
  .replay-summary span,
  .halt-banner span,
  .alert-count,
  .drawer-heading p,
  .alert-item strong,
  .alert-item span,
  .alert-item time,
  .review-list strong,
  .danger-confirm span,
  .session-profile div > span,
  .login-brand p,
  .login-dialog label,
  .auth-notice,
  .auth-footnote { font-size: 13px; }

  .contract-switcher label small,
  .market-panel-controls label,
  .market-timeframe-row > span,
  .market-subchart span,
  .scenario-levels dt,
  .timeline-item .event-timestamps,
  .timeline-item .event-keywords { font-size: 12px; }

  .top-status-item strong,
  .direction-chip,
  .level-row strong,
  .plan-list dd,
  .order-estimate strong,
  .sizing-breakdown strong,
  .session-profile strong { font-size: 14px; }

  #globalProduct,
  #globalContract,
  #globalEnvironment,
  select,
  input,
  textarea { font-size: 15px; }

  .brand-copy strong { font-size: 17px; }
  .market-quote-strip strong { font-size: 15px; }
  .rationale-column h3 { font-size: 14px; }
  .scenario-levels dd { font-size: 13px; }
  .evidence-split strong { font-size: 17px; }
  .trigger-side strong { font-size: 24px; }

  .primary-button,
  .secondary-button,
  .danger-button,
  .danger-outline-button,
  .icon-button { min-height: 38px; }
  .segmented-control button { min-height: 36px; }
  .small-command,
  .icon-button.small { min-height: 32px; }
  .status-badge { min-height: 26px; padding: 3px 8px; }
  .direction-chip { min-height: 31px; }
  select,
  input,
  textarea { min-height: 42px; }

  .rationale-column li,
  .exit-rule-list span,
  .detail-note,
  .conflict-row { line-height: 1.55; }
  .plan-list > div { padding-block: 9px; }
  th,
  td { padding: 10px 12px; }
}

@media (max-width: 1360px) {
  .app-shell { grid-template-columns: 64px minmax(0, 1fr); }
  .brand { justify-content: center; padding: 0; }
  .brand-copy, .nav-button > span, .sidebar-footer > div { display: none; }
  .nav-group-label { display: none; }
  .primary-nav { padding: 10px 7px; }
  .nav-button { justify-content: center; padding: 7px; }
  .sidebar-footer { justify-content: center; padding: 10px; }
  .user-button-copy { display: none; }
  .user-button { width: 38px; justify-content: center; padding: 3px; }
  .topbar { grid-template-columns: minmax(500px, 540px) minmax(300px, 1fr) auto; }
  .dashboard-grid, .decision-grid { grid-template-columns: minmax(0, 1.2fr) minmax(290px, 0.8fr); }
  .analysis-inputs { grid-template-columns: repeat(3, minmax(120px, 1fr)); }
  .validation-stage-strip { overflow-x: auto; }
}

@media (max-width: 1500px) {
  .user-button-copy { display: none; }
  .user-button { width: 38px; justify-content: center; padding: 3px; }
  .topbar { grid-template-columns: minmax(0, 1fr) auto; }
  .top-status { grid-column: 1 / 3; grid-row: 2; border-top: 1px solid var(--line); border-left: 0; padding-top: 6px; }
  .top-actions { grid-column: 2; grid-row: 1; }
}

@media (min-width: 501px) and (max-width: 1500px) {
  .user-button {
    width: auto;
    max-width: 116px;
    justify-content: flex-start;
    padding: 3px 9px 3px 4px;
  }
  .user-button-copy { min-width: 0; display: block; }
  .user-button-copy strong {
    max-width: 66px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .user-button-copy small { display: none; }
}

@media (max-width: 1180px) {
  .topbar { gap: 10px; padding-inline: 12px; }
  .global-controls { grid-template-columns: minmax(0, 1fr) minmax(140px, 0.30fr); gap: 6px; }
  .contract-switcher { grid-template-columns: minmax(150px, 0.95fr) minmax(150px, 0.95fr) minmax(180px, 1.1fr); }
  .top-actions { gap: 6px; }
  .broker-login-shortcut,
  .top-actions .danger-button { width: 38px; padding-inline: 0; justify-content: center; }
  .broker-login-shortcut span,
  .top-actions .danger-button span { display: none; }
}

@media (max-width: 1080px) {
  .topbar { gap: 8px; padding-inline: 10px; }
  .global-controls { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; gap: 6px; }
  .contract-switcher { grid-column: 1; grid-row: 1 / 3; grid-template-columns: minmax(0, 0.96fr) minmax(0, 1fr); gap: 6px; }
  .contract-switcher .product-search-label { grid-column: 1 / -1; }
  .environment-control { grid-column: 1; grid-row: 3; }
  .order-layout { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 1501px) {
  .top-actions { gap: 5px; }
  .top-actions > .secondary-button,
  .top-actions > .danger-button { padding-inline: 10px; }
  .user-button { max-width: 108px; }
}

@media (max-width: 800px) {
  .top-actions .danger-button { width: 35px; padding: 0; }
  .top-actions .danger-button span { display: none; }
  .broker-login-shortcut { width: 35px; padding: 0; }
  .broker-login-shortcut span { display: none; }
  .automation-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .oms-integrity-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .oms-integrity-strip span { border-bottom: 1px solid var(--line); }
}

@media (max-width: 960px) {
  .simulation-layout { grid-template-columns: 1fr; }
}

@media (max-width: 960px) {
  .topbar {
    min-height: 112px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px;
    padding-inline: 8px;
  }
  .global-controls { grid-column: 1 / -1; grid-row: 1; }
  .top-status { grid-column: 1; grid-row: 2; padding-top: 0; border-top: 0; }
  .top-actions { grid-column: 2; grid-row: 2; gap: 5px; }
  .top-actions > button:not(.user-button),
  .broker-login-shortcut,
  .top-actions .danger-button {
    width: 35px;
    min-height: 35px;
    padding-inline: 0;
    justify-content: center;
  }
  .dashboard-grid, .decision-grid, .position-detail-grid, .risk-layout, .data-layout, .operations-layout, .simulation-layout, .validation-layout, .cost-layout, .order-layout, .ranking-layout, .event-layout, .model-layout, .automation-layout, .governance-layout { grid-template-columns: 1fr; }
  .ranking-layout .detail-panel, .event-layout .detail-panel, .model-layout .detail-panel { order: -1; }
  .level-row { grid-template-columns: repeat(3, minmax(80px, 1fr)); }
  .market-quote-strip { grid-template-columns: repeat(3, minmax(80px, 1fr)); }
  .recovery-state-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analysis-inputs { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
  .health-strip { grid-template-columns: repeat(3, minmax(100px, 1fr)); }
  .health-strip > div { border-bottom: 1px solid var(--line); }
  .forward-rules { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .replay-summary { grid-template-columns: repeat(3, minmax(90px, 1fr)); }
  .replay-depth-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ranking-summary-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ranking-summary-strip > div:nth-child(3) { border-right: 0; }
  .ranking-summary-strip > div:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
}

@media (max-width: 720px) {
  :root { font-size: 13px; }
  html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
  .app-shell { display: block; }
  .sidebar { position: fixed; z-index: 50; inset: 0 auto 0 0; width: min(270px, calc(100vw - 54px)); height: 100vh; min-height: 0; transform: translateX(-102%); transition: transform 160ms ease; box-shadow: 14px 0 34px rgba(18, 22, 20, 0.22); }
  body.nav-open { overflow: hidden; }
  body.nav-open .sidebar { transform: translateX(0); }
  .brand { height: 58px; flex-basis: 58px; justify-content: flex-start; padding: 0 14px; }
  .brand-mark { width: 30px; height: 30px; flex-basis: 30px; font-size: 11px; }
  .brand-copy, .nav-button > span, .sidebar-footer > div { display: block; }
  .nav-group-label { display: block; }
  .primary-nav { padding: 8px; }
  .nav-button { min-height: 38px; justify-content: flex-start; padding: 7px 11px; }
  .sidebar-footer { justify-content: flex-start; padding: 10px 14px; }
  .nav-button[data-tooltip]::after { display: none !important; }
  .replay-lanes { grid-template-columns: 1fr; }
  .replay-lanes > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .mobile-nav-button { display: inline-flex !important; }
  .topbar { position: relative; min-height: 206px; grid-template-columns: minmax(0, 1fr) auto; gap: 7px; padding: 8px; }
  .global-controls { grid-column: 1 / -1; grid-row: 1; grid-template-columns: 34px minmax(0, 1fr); grid-template-rows: repeat(3, 40px); align-items: center; gap: 6px; }
  .global-controls > * { min-width: 0; }
  .mobile-nav-button { grid-column: 1; grid-row: 1 / 4; }
  .contract-switcher { grid-column: 2; grid-row: 1 / 3; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 6px; }
  .contract-switcher .product-search-label { grid-column: 1 / -1; }
  .environment-control { grid-column: 2; grid-row: 3; }
  .contract-switcher .control-label, .environment-control label { display: none; }
  .top-status { grid-column: 1; grid-row: 2; padding-top: 0; border-top: 0; }
  .top-actions { grid-column: 2; grid-row: 2; }
  .top-status { grid-template-columns: repeat(2, minmax(75px, 1fr)); }
  .top-status-item { padding: 2px 6px; }
  .top-status-item:nth-child(3), .top-status-item:nth-child(4) { display: none; }
  .danger-button span { display: none; }
  .top-actions .danger-button { width: 35px; padding: 0; }
  .environment-banner { display: grid; grid-template-columns: 16px minmax(0, 1fr); align-items: start; padding: 7px 10px; }
  .environment-banner svg { grid-column: 1; grid-row: 1 / 3; }
  .environment-banner strong, .environment-banner span { grid-column: 2; min-width: 0; white-space: normal; overflow-wrap: anywhere; }
  .environment-banner span { margin-left: 0; }
  .view { padding: 13px 10px 28px; }
  .page-heading { align-items: stretch; flex-direction: column; }
  .view-actions { flex-wrap: wrap; }
  .trade-environment-workbench { grid-template-columns: 1fr; align-items: stretch; gap: 9px; padding: 10px; }
  .trade-environment-selector { width: 100%; }
  .trade-environment-selector button { min-width: 0; flex: 1 1 50%; }
  .trade-account-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trade-account-strip > div { border-bottom: 1px solid var(--line); }
  .trade-account-strip > div:nth-child(2n) { border-right: 0; }
  .trade-account-strip > div:last-child { grid-column: 1 / -1; border-bottom: 0; }
  .trade-mode-gate { grid-template-columns: 20px minmax(0, 1fr); }
  .trade-mode-gate > .status-badge { grid-column: 2; justify-self: start; }
  .metric-strip, .automation-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .metric-card { padding: 10px; }
  .metric-card strong { font-size: 17px; }
  .gate-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gate-bar > div:nth-child(2) { border-right: 0; }
  .gate-bar button { grid-column: 1 / 3; margin: 6px 0 0; }
  .level-row, .no-trade-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .market-panel .panel-heading { flex-direction: column; }
  .market-panel-controls { width: 100%; flex-direction: column; align-items: stretch; }
  .market-panel-controls label { width: 100%; flex: 1 1 auto; }
  .market-panel-controls select { width: 100%; }
  .market-panel-controls .status-badge { max-width: 100%; align-self: flex-start; white-space: normal; }
  .market-timeframe-row { align-items: stretch; flex-direction: column; overflow: hidden; }
  .market-timeframe-tools { width: 100%; flex-wrap: wrap; }
  .market-timeframe-control { width: 100%; overflow-x: auto; }
  .chart-zoom-controls { margin-left: auto; }
  .market-timeframe-row > span { text-align: left; }
  .intraday-signal-strip { grid-template-columns: 1fr; }
  .market-quote-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .level-row span:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .plan-list.compact, .trigger-columns, .two-columns, .direction-summary, .dual-progress { grid-template-columns: 1fr; }
  .direction-rationale { grid-template-columns: 1fr; }
  .rationale-column + .rationale-column { border-left: 0; border-top: 1px solid var(--line); }
  .evidence-split { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-bar, .analysis-inputs { grid-template-columns: 1fr; display: grid; }
  .filter-bar label, .analysis-inputs label { min-width: 0; }
  .timestamp { margin-left: 0; }
  .order-estimate { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .order-estimate > div:nth-child(2) { border-right: 0; }
  .order-estimate > div { border-bottom: 1px solid var(--line); }
  .exit-actions { grid-template-columns: 1fr; }
  .automation-actions { grid-template-columns: 1fr; }
  .oms-integrity-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .oms-integrity-strip span { border-bottom: 1px solid var(--line); }
  .health-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .health-strip > div:nth-child(2n) { border-right: 0; }
  .settings-layout { grid-template-columns: 1fr; }
  .settings-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .settings-nav button { border-right: 1px solid var(--line); }
  .forward-rules { grid-template-columns: 1fr; }
  .validation-stage-strip { display: grid; grid-template-columns: 1fr; min-width: 0; overflow: visible; }
  .stage-item { min-width: 0; }
  .stage-line { width: 1px; height: 12px; margin-left: 11px; }
  .replay-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .replay-depth-heading { align-items: flex-start; }
  .replay-depth-missing { grid-template-columns: 1fr; gap: 3px; }
  .halt-banner { align-items: flex-start; flex-wrap: wrap; padding: 8px 10px; }
  .halt-banner .text-button { width: 100%; margin-left: 20px; justify-content: flex-start; }
  .alert-drawer { width: calc(100vw - 52px); }
  .security-summary { align-items: stretch; flex-direction: column; }
  .security-summary label { width: 100%; }
  .session-profile { grid-template-columns: auto minmax(0, 1fr); }
  .session-profile > .status-badge { grid-column: 2; justify-self: start; }
  .session-dialog .dialog-footer { display: grid; grid-template-columns: 1fr; }
  .login-dialog form { padding: 18px; }
  .broker-login-dialog .form-grid.two-columns { grid-template-columns: 1fr; }
  .recovery-action-row { display: grid; grid-template-columns: 1fr; }
}

@media (max-width: 0px) {
  body { padding-bottom: 64px; }
  .sidebar, .nav-backdrop { display: none !important; }
  .main-shell { width: 100%; }
  .topbar {
    position: relative;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0;
    background: #0b6b42;
    border-bottom: 0;
  }
  .mobile-market-summary {
    width: 100%;
    display: grid;
    gap: 12px;
    padding: 13px 12px 12px;
    color: #ffffff;
  }
  .mobile-market-heading { display: grid; grid-template-columns: 36px minmax(0, 1fr) 36px; align-items: center; gap: 8px; text-align: center; }
  .mobile-market-heading > div { min-width: 0; }
  .mobile-market-heading strong, .mobile-market-heading span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-market-heading strong { font-size: 19px; font-weight: 500; }
  .mobile-market-heading span { margin-top: 2px; color: #d1eadf; font-size: 12px; }
  .mobile-header-button { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 0; background: transparent; color: #ffffff; }
  .mobile-header-button svg { width: 25px; height: 25px; }
  .mobile-market-quote { display: grid; grid-template-columns: minmax(110px, 0.82fr) minmax(0, 1.18fr); align-items: end; gap: 14px; }
  .mobile-last strong { display: block; font-size: 42px; font-weight: 500; line-height: 1; }
  .mobile-last span { display: flex; gap: 14px; margin-top: 10px; }
  .mobile-last em { color: #ffffff; font-size: 15px; font-style: normal; }
  .mobile-market-quote dl { min-width: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 12px; }
  .mobile-market-quote dl > div { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px; }
  .mobile-market-quote dt { color: #b7ddca; font-size: 11px; }
  .mobile-market-quote dd { min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; color: #ffffff; font-size: 14px; font-weight: 500; text-align: right; }
  .mobile-market-summary .value-positive { color: #ffd7da !important; }
  .mobile-market-summary .value-negative { color: #c8f0de !important; }
  .global-controls {
    position: static;
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 6px;
    padding: 8px;
    background: #f4f7f5;
  }
  .mobile-nav-button { display: none !important; }
  .contract-switcher { grid-column: 1; grid-row: 1; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 6px; }
  .environment-control { grid-column: 1; grid-row: 2; }
  .contract-switcher select, .environment-control select { min-height: 40px; background: #ffffff; }
  .top-status, .top-actions, .environment-banner { display: none; }
  .view { padding: 10px 10px 28px; }
  #overview.is-active { display: flex; flex-direction: column; }
  #overview > *, #overview .dashboard-grid > * { order: 3; }
  #overview .dashboard-grid { display: contents; }
  #overview .market-panel { order: 0; margin: -10px -10px 0; padding: 0 10px 10px; border: 0; border-radius: 0; box-shadow: none; }
  #overview > .page-heading { order: 1; margin-top: 10px; }
  #overview > .metric-strip, #overview > .gate-bar { order: 2; }
  #overview .market-panel > .panel-heading { display: none; }
  .market-timeframe-row { margin: 0 -10px 7px; padding: 0 8px; background: #ffffff; border-bottom: 1px solid var(--line); }
  .market-timeframe-control { width: 100%; display: grid; grid-template-columns: repeat(7, minmax(42px, 1fr)); overflow-x: auto; border: 0; border-radius: 0; }
  .market-timeframe-control button { min-width: 42px; min-height: 42px; padding: 6px 4px; border-right: 0; color: var(--ink); }
  .market-timeframe-control button.is-selected { background: transparent; color: var(--blue); box-shadow: inset 0 -3px 0 var(--blue); }
  .market-timeframe-row > span { display: none; }
  .market-panel > .market-quote-strip { display: none; }
  .market-subchart { margin-top: 0; padding-top: 6px; }
  .market-subchart > div { min-height: 25px; }
  .market-subchart strong { font-size: 12px; }
  .market-subchart span { font-size: 11px; }
  .mobile-bottom-nav {
    position: fixed;
    z-index: 45;
    left: 0;
    right: 0;
    bottom: 0;
    height: 64px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    padding-bottom: env(safe-area-inset-bottom, 0);
    border-top: 1px solid var(--line-strong);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 -5px 18px rgba(29, 36, 32, 0.10);
  }
  .mobile-bottom-nav button { min-width: 0; display: grid; place-items: center; align-content: center; gap: 3px; padding: 5px 2px; border: 0; background: transparent; color: var(--muted); font-size: 11px; }
  .mobile-bottom-nav button svg { width: 21px; height: 21px; }
  .mobile-bottom-nav button.is-active { color: var(--blue); }
  .mobile-more-dialog {
    width: 100%;
    max-width: none;
    max-height: min(76vh, 650px);
    margin: auto 0 0;
    padding: 0;
    border: 0;
    border-radius: 8px 8px 0 0;
    background: #ffffff;
  }
  .mobile-more-dialog::backdrop { background: rgba(17, 21, 18, 0.44); }
  .mobile-more-sheet { padding: 14px 14px calc(16px + env(safe-area-inset-bottom, 0px)); }
  .mobile-more-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 8px; padding: 10px 0 18px; }
  .mobile-more-grid button { min-width: 0; display: grid; justify-items: center; gap: 6px; padding: 0; border: 0; background: transparent; color: var(--ink); font-size: 12px; }
  .mobile-more-grid button svg { width: 38px; height: 38px; padding: 8px; border: 1px solid #9db7aa; border-radius: 50%; color: var(--green); }
  .mobile-more-grid button span { max-width: 100%; overflow-wrap: anywhere; }
  .mobile-emergency-stop { width: 100%; min-height: 44px; }
}

@media (max-width: 420px) {
  .topbar { min-height: 226px; }
  .global-controls { grid-template-rows: auto 40px; align-items: stretch; }
  .mobile-nav-button { grid-row: 1 / 3; align-self: start; }
  .contract-switcher { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 1361px) {
  .nav-button[data-tooltip]::after { display: none !important; }
}

/* Unified application type scale. Layout breakpoints change structure, not hierarchy. */
:root { font-size: var(--font-body); }
body { font-size: var(--font-body); line-height: 1.45; }
h1 { font-size: var(--font-page); font-weight: 600; line-height: 1.25; }
h2 { font-size: var(--font-panel); font-weight: 600; line-height: 1.3; }
h3 { font-size: var(--font-section); font-weight: 600; line-height: 1.35; }
button, input, select, textarea { font-size: var(--font-control); }
#globalProductSearch,
#globalProduct,
#globalContract,
#globalEnvironment { font-size: var(--font-control); }
small, code, .fundamental-source { font-size: var(--font-assist); }
.page-heading p, .panel-heading p, .section-heading p, .dialog-heading p,
.top-status-item span, .metric-card span, label, th, td,
.status-badge, .detail-note, .environment-banner { font-size: var(--font-meta); }
.metric-card strong { font-size: var(--font-metric); }
.compact-metrics .metric-card strong { font-size: 18px; }
.plan-list dd, .level-row strong, .order-estimate strong,
.sizing-breakdown strong, .market-quote-strip strong { font-size: var(--font-body); }
.direction-main strong, .trigger-side strong { font-size: 22px; }

/* Apply the shared type scale to legacy components that hard-coded undersized text. */
.nav-group-label { font-size: 12px; }
.environment-control label,
.contract-switcher label,
.user-button-copy strong,
.top-status-item strong,
.small-command { font-size: var(--font-meta); }
.brand-copy span,
.sidebar-footer strong,
.sidebar-footer span,
.user-button-copy small,
.market-panel-controls label,
.intraday-signal-strip span,
.intraday-signal-strip small,
.market-subchart strong,
.market-quote-strip > span,
.timeline-item .event-timestamps,
.timeline-item .event-keywords,
.training-row span,
.health-strip span,
.update-row span,
.alert-item span,
.alert-item time,
.source-list small,
.gate-list small,
.security-summary small,
.review-list small { font-size: var(--font-assist); }
.fundamental-summary,
.rationale-column li,
.timeline-item p,
.switch-row strong,
.source-list strong,
.gate-list strong,
.training-row strong,
.health-strip strong,
.security-summary strong,
.update-row strong,
.alert-item strong,
.review-list strong { font-size: var(--font-meta); }
.timeline-date { font-size: var(--font-meta); }
.fundamental-summary,
.paper-equity-setting label,
.paper-equity-setting small,
.market-timeframe-row > span,
.market-subchart span,
.scenario-levels dt,
.recovery-state-grid span { font-size: var(--font-assist); }
.fundamental-metrics dt,
.fundamental-driver-list span,
.evidence-split span { font-size: var(--font-assist); }
.fundamental-metrics dd,
.fundamental-driver-list strong { font-size: var(--font-body); }

/* Keep the desktop workbench fluid when browser zoom reduces the CSS viewport. */
@media (min-width: 721px) {
  html,
  body {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
  }
  .app-shell {
    width: 100%;
    min-width: 0;
    grid-template-columns: clamp(176px, 14vw, 214px) minmax(0, 1fr);
  }
  .brand { justify-content: flex-start; padding: 0 16px; }
  .brand-copy,
  .nav-button > span,
  .sidebar-footer > div,
  .nav-group-label { display: block; }
  .primary-nav { padding: 10px 8px; }
  .nav-button { justify-content: flex-start; padding: 7px 11px; }
  .sidebar-footer { justify-content: flex-start; padding: 11px 15px; }
  .view { padding-inline: 16px; }

  .topbar {
    min-height: 108px;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto 42px;
    gap: 8px 20px;
    padding: 9px 20px 8px;
  }
  .global-controls {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    grid-template-columns: minmax(0, 1fr) 180px;
    grid-template-rows: auto;
    align-items: end;
    gap: 8px;
  }
  .contract-switcher {
    grid-column: auto;
    grid-row: auto;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 0.9fr) minmax(0, 1.2fr);
    gap: 8px;
  }
  .contract-switcher .product-search-label { grid-column: auto; }
  .environment-control { grid-column: auto; grid-row: auto; }
  #globalProductSearch,
  #globalProduct,
  #globalContract,
  #globalEnvironment { min-height: 40px; }
  .top-status {
    grid-column: 1 / 3;
    grid-row: 2;
    height: 42px;
    grid-template-columns: minmax(230px, 1.25fr) minmax(210px, 1.1fr) repeat(3, minmax(140px, 1fr));
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: var(--surface-soft);
  }
  .top-status-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    padding: 7px 14px;
  }
  .top-status-item > span,
  .top-status-item > strong {
    display: block;
    margin: 0;
    line-height: 1.25;
  }
  .top-status-item > strong { justify-self: start; }
  .top-status-item.global-latest-quote > strong { display: flex; align-items: baseline; gap: 8px; }
  .top-status-item:last-child { border-right: 0; }
  .top-status-item .status-dot { vertical-align: 1px; }
  .top-actions {
    align-self: end;
    padding-left: 12px;
    border-left: 1px solid var(--line);
  }
  .top-actions { grid-column: 2; grid-row: 1; gap: 6px; }
  .user-button {
    width: auto;
    max-width: 116px;
    justify-content: flex-start;
    padding: 3px 9px 3px 4px;
  }
  .user-button-copy { min-width: 0; display: block; }
  .user-button-copy strong {
    max-width: 66px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .user-button-copy small { display: none; }
  .broker-login-shortcut,
  .top-actions .danger-button {
    width: auto;
    padding-inline: 12px;
  }
  .broker-login-shortcut span,
  .top-actions .danger-button span { display: inline; }

  .dashboard-grid,
  .decision-grid,
  .operations-layout { grid-template-columns: minmax(0, 1.65fr) minmax(300px, 0.75fr); }
  .position-detail-grid,
  .data-layout,
  .simulation-layout,
  .validation-layout,
  .cost-layout,
  .governance-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .risk-layout { grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.25fr); }
  .ranking-layout,
  .event-layout,
  .model-layout { grid-template-columns: minmax(0, 1fr) 360px; }
  .ranking-layout .detail-panel,
  .event-layout .detail-panel,
  .model-layout .detail-panel { order: initial; }
  .order-layout { grid-template-columns: minmax(520px, 1fr) minmax(470px, 0.9fr); }
  .automation-layout { grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr); }
  .settings-layout { grid-template-columns: 180px minmax(0, 1fr); }

  .analysis-inputs { grid-template-columns: repeat(5, minmax(120px, 1fr)); }
  .level-row { grid-template-columns: repeat(5, minmax(85px, 1fr)); }
  .market-quote-strip { grid-template-columns: repeat(7, minmax(72px, 1fr)); }
  .automation-metrics { grid-template-columns: repeat(5, minmax(130px, 1fr)); }
  .oms-integrity-strip { grid-template-columns: repeat(5, minmax(120px, 1fr)); }
  .health-strip { grid-template-columns: repeat(5, minmax(110px, 1fr)); }
  .health-strip > div { border-bottom: 0; }
  .forward-rules { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .replay-summary { grid-template-columns: repeat(6, minmax(90px, 1fr)); }
  .ranking-summary-strip { grid-template-columns: repeat(5, minmax(130px, 1fr)); }
  .ranking-summary-strip > div { border-bottom: 0; }
  .ranking-summary-strip > div:nth-child(3) { border-right: 1px solid var(--line); }
  .page-heading p, .panel-heading p, .section-heading p, .dialog-heading p {
    font-size: var(--font-meta);
    line-height: 1.45;
  }
}

@media (min-width: 721px) and (max-width: 1040px) {
  .app-shell { grid-template-columns: 68px minmax(0, 1fr); }
  .brand { justify-content: center; padding-inline: 0; }
  .brand-copy,
  .nav-button > span,
  .sidebar-footer > div,
  .nav-group-label { display: none; }
  .primary-nav { padding-inline: 7px; }
  .nav-button { justify-content: center; padding-inline: 7px; }
  .sidebar-footer { justify-content: center; padding-inline: 8px; }
  .view { padding-inline: 12px; }
  .dashboard-grid,
  .decision-grid,
  .position-detail-grid,
  .risk-layout,
  .data-layout,
  .operations-layout,
  .simulation-layout,
  .validation-layout,
  .cost-layout,
  .order-layout,
  .ranking-layout,
  .event-layout,
  .model-layout,
  .automation-layout,
  .governance-layout { grid-template-columns: minmax(0, 1fr); }
  .ranking-layout .detail-panel,
  .event-layout .detail-panel,
  .model-layout .detail-panel { order: initial; }
  .analysis-inputs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .market-quote-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .health-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 721px) {
  #overview > .overview-summary-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1.05fr)) minmax(0, 1.25fr) repeat(4, minmax(0, 0.72fr)) auto;
    align-items: stretch;
    margin-bottom: 12px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 4px;
    background: var(--surface);
  }
  #overview > .overview-summary-row > .metric-strip,
  #overview > .overview-summary-row > .gate-bar { display: contents; }
  #overview > .overview-summary-row .metric-card {
    min-height: 72px;
    padding: 8px 12px 7px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 0;
    border-right: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
  }
  #overview > .overview-summary-row .metric-card span,
  #overview > .overview-summary-row .metric-card strong,
  #overview > .overview-summary-row .metric-card small,
  #overview > .overview-summary-row .gate-bar span,
  #overview > .overview-summary-row .gate-bar strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #overview > .overview-summary-row .metric-card span { line-height: 1.2; }
  #overview > .overview-summary-row .metric-card strong { margin-top: 2px; line-height: 1.2; }
  #overview > .overview-summary-row .metric-card small { margin-top: 2px; line-height: 1.25; }
  #overview > .overview-summary-row .gate-bar > div {
    min-width: 0;
    padding: 8px 9px 7px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-right: 1px solid var(--line);
  }
  #overview > .overview-summary-row .gate-bar button {
    align-self: center;
    margin: 0 8px;
    white-space: nowrap;
  }
  .page-heading p, .panel-heading p, .section-heading p, .dialog-heading p { font-size: var(--font-meta); }
  .detail-note, .conflict-row, .plan-blocker, .plan-list dt, .plan-list dd,
  th, td { font-size: var(--font-meta); }
  .book-row, .last-price, .microstructure-row { font-size: var(--font-body); }
  .metric-card span, .gate-bar span, .status-badge, .timestamp,
  .score-bars span, .score-bars strong, .source-list strong, .source-list small { font-size: var(--font-meta); }
}

@media (max-width: 720px) {
  :root { font-size: var(--font-body); }
  h1 { font-size: var(--font-page); }
  h2 { font-size: var(--font-panel); }
  button, input, select, textarea { font-size: var(--font-control); }
  .fundamental-score-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fundamental-score-grid > div:nth-child(4),
  .fundamental-score-grid > div:nth-child(5) { border-top: 1px solid var(--line); }
  .ranking-summary-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ranking-summary-strip > div { border-bottom: 1px solid var(--line); }
  .ranking-summary-strip > div:nth-child(even) { border-right: 0; }
  .ranking-summary-strip > div:last-child { grid-column: 1 / -1; border-bottom: 0; }
  .order-estimate, .sizing-breakdown { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .order-estimate > div:nth-child(2), .sizing-breakdown > div:nth-child(2) { border-right: 0; }
  .order-estimate > div:nth-child(-n+2), .sizing-breakdown > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation-duration: 0.01ms !important; }
}
.curve-summary-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.curve-summary-strip > div {
  min-width: 0;
  padding: 10px 14px;
  border-right: 1px solid var(--line);
}

.curve-summary-strip > div:last-child {
  border-right: 0;
}

.curve-summary-strip span,
.curve-summary-strip strong {
  display: block;
}

.curve-summary-strip span {
  color: var(--muted);
  font-size: 12px;
}

.curve-summary-strip strong {
  margin-top: 4px;
  font-size: 14px;
}

.exact-curve-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(420px, 0.85fr);
  gap: 16px;
  padding: 14px;
}

.exact-curve-pane {
  min-width: 0;
}

.exact-curve-pane h3 {
  margin: 0 0 8px;
  font-size: 14px;
}

.exact-contract-scroll,
.exact-spread-scroll {
  max-height: 360px;
}

.exact-contract-curve-section tbody tr.is-selected {
  background: var(--blue-soft);
}

.curve-method-note {
  margin: 0;
  padding: 0 14px 14px;
  color: var(--muted);
  font-size: 12px;
}

.arbitrage-metrics { grid-template-columns: repeat(5, minmax(120px, 1fr)); }

.arbitrage-ranking-kind-control {
  min-width: 0;
  min-height: 42px;
  padding: 7px 10px;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line);
  border-bottom-color: var(--line-strong);
  background: var(--surface-soft);
}
.arbitrage-ranking-kind-control > span { color: var(--muted); font-size: var(--font-meta); font-weight: 600; }
.arbitrage-ranking-kind-control > .segmented-control { flex: 0 0 auto; margin-left: auto; }

.operator-control-strip {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto minmax(520px, auto);
  align-items: center;
  gap: 10px 14px;
  margin-bottom: 12px;
  padding: 11px 12px;
  border: 1px solid color-mix(in srgb, var(--blue) 24%, var(--line));
  border-left: 3px solid var(--blue);
  background: color-mix(in srgb, var(--blue) 4%, var(--surface));
}

.operator-control-copy {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}
.operator-control-copy > svg { width: 20px; height: 20px; flex: 0 0 auto; color: var(--blue); }
.operator-control-copy span,
.operator-control-copy strong,
.operator-control-copy small { min-width: 0; display: block; overflow-wrap: anywhere; }
.operator-control-copy strong { font-size: var(--font-body); }
.operator-control-copy small { margin-top: 3px; color: var(--muted); font-size: var(--font-meta); }
.operator-control-actions { min-width: 0; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 7px; }
.operator-control-actions button { min-height: 36px; white-space: nowrap; }
.operator-control-actions svg { width: 15px; height: 15px; }
.operator-control-strip.is-active {
  border-color: color-mix(in srgb, var(--amber) 42%, var(--line));
  border-left-color: var(--amber);
  background: color-mix(in srgb, var(--amber) 6%, var(--surface));
}
.operator-control-strip.is-active .operator-control-copy > svg { color: var(--amber); }

.arbitrage-combination-control {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  padding: 9px;
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--ink) 1.5%, var(--surface));
}
.arbitrage-combination-control span { min-width: 0; font-size: var(--font-meta); overflow-wrap: anywhere; }
.arbitrage-combination-control .row-actions { flex-wrap: wrap; justify-content: flex-end; }

.arbitrage-auto-workbench {
  min-width: 0;
  margin-bottom: 12px;
  border: 1px solid var(--line);
  border-top: 3px solid var(--blue);
  background: var(--surface);
  box-shadow: 0 8px 24px rgba(22, 32, 45, 0.06);
}

.arbitrage-auto-heading {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto auto;
  align-items: center;
  gap: 14px;
  padding: 13px 14px 11px;
  border-bottom: 1px solid var(--line);
}

.arbitrage-auto-heading h2 { margin: 0; font-size: var(--font-panel); letter-spacing: 0; }
.arbitrage-auto-heading p { margin: 4px 0 0; color: var(--muted); font-size: var(--font-meta); overflow-wrap: anywhere; }
.arbitrage-auto-heading .segmented-control button { min-width: 116px; }
.arbitrage-auto-heading .segmented-control svg { width: 15px; height: 15px; }

.arbitrage-auto-controls {
  min-width: 0;
  display: grid;
  grid-template-columns: auto auto repeat(4, minmax(118px, 0.7fr)) minmax(260px, 1.35fr) auto;
  align-items: end;
  gap: 10px;
  padding: 12px 14px;
}

.arbitrage-auto-controls > label:not(.compact-switch),
.arbitrage-scope-control {
  min-width: 0;
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: var(--font-meta);
}

.arbitrage-auto-controls input[type="number"] {
  width: 100%;
  min-width: 0;
  height: 38px;
  font-size: var(--font-body);
  font-variant-numeric: tabular-nums;
}

.arbitrage-auto-toggle {
  min-height: 38px;
  align-self: end;
  white-space: nowrap;
}

.arbitrage-scope-control .segmented-control { width: 100%; }
.arbitrage-scope-control .segmented-control button { flex: 1 1 0; min-width: 0; padding-inline: 10px; }
.arbitrage-auto-controls > .primary-button { min-height: 38px; white-space: nowrap; }

.arbitrage-auto-gate {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(180px, 0.62fr) minmax(0, 4fr);
  align-items: stretch;
  border-top: 1px solid color-mix(in srgb, var(--line) 68%, transparent);
}

.arbitrage-auto-gate-status {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  align-content: center;
  gap: 8px;
  padding: 10px 14px;
  border-right: 1px solid var(--line);
  color: var(--muted);
  font-size: var(--font-meta);
}

.arbitrage-auto-gate-status > span {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 8px;
  border: 1px solid color-mix(in srgb, var(--red) 26%, var(--line));
  background: color-mix(in srgb, var(--red) 5%, var(--surface));
}

.arbitrage-auto-gate-status > span.is-passed {
  border-color: color-mix(in srgb, var(--green) 26%, var(--line));
  background: color-mix(in srgb, var(--green) 6%, var(--surface));
  color: var(--green);
}

.arbitrage-auto-gate-status svg { width: 14px; height: 14px; flex: 0 0 auto; }
.arbitrage-evidence-metrics {
  min-width: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
}
.arbitrage-evidence-metrics .metric-card {
  min-height: 84px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 9px 12px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
}
.arbitrage-evidence-metrics .metric-card:last-child { border-right: 0; }
.arbitrage-evidence-metrics .metric-card strong { margin-top: 3px; }
.arbitrage-evidence-metrics .metric-card small { line-height: 1.3; overflow-wrap: anywhere; }
.arbitrage-capability-section {
  min-width: 0;
  margin-bottom: 12px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.arbitrage-capability-workspace {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
}

.arbitrage-capability-matrix { display: contents; }

.arbitrage-capability-item {
  min-width: 0;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: start;
  gap: 8px;
  padding: 11px 12px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.arbitrage-capability-item:nth-child(4n) { border-right: 0; }
.arbitrage-capability-item:nth-child(n + 9) { border-bottom: 0; }
.arbitrage-capability-icon {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--blue) 24%, var(--line));
  background: color-mix(in srgb, var(--blue) 6%, var(--surface));
  color: var(--blue);
}
.arbitrage-capability-icon svg { width: 16px; height: 16px; }
.arbitrage-capability-copy { min-width: 0; }
.arbitrage-capability-copy strong,
.arbitrage-capability-copy span,
.arbitrage-capability-copy small { display: block; overflow-wrap: anywhere; }
.arbitrage-capability-copy strong { font-size: var(--font-body); }
.arbitrage-capability-copy span { margin-top: 3px; color: var(--blue); font-size: var(--font-assist); font-weight: 600; }
.arbitrage-capability-copy small { margin-top: 4px; color: var(--muted); font-size: var(--font-assist); line-height: 1.4; }
.arbitrage-capability-item > .status-badge { align-self: start; white-space: nowrap; }
.arbitrage-capability-empty { grid-column: 1 / -1; padding: 18px; color: var(--muted); text-align: center; }

.arbitrage-capability-boundaries {
  min-width: 0;
  display: grid;
  grid-column: 1 / -1;
  grid-row: auto;
  grid-template-columns: minmax(0, 1fr);
  border-top: 1px solid var(--line);
  background: color-mix(in srgb, var(--ink) 1.5%, var(--surface));
}
.arbitrage-capability-boundaries section {
  min-width: 0;
  padding: 9px 12px;
  display: grid;
  grid-template-columns: minmax(150px, 0.18fr) minmax(0, 1fr);
  align-items: start;
  gap: 10px 14px;
}
.arbitrage-capability-boundaries section + section { border-top: 1px solid var(--line); }
.arbitrage-capability-boundaries h3 { display: flex; align-items: center; gap: 7px; margin: 0; font-size: var(--font-meta); }
.arbitrage-capability-boundaries h3 svg { width: 15px; height: 15px; color: var(--amber); }
.arbitrage-capability-boundaries ul { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 14px; list-style: none; }
.arbitrage-capability-boundaries li { position: relative; padding-left: 12px; color: var(--muted); font-size: var(--font-assist); line-height: 1.3; overflow-wrap: anywhere; }
.arbitrage-capability-boundaries li::before { position: absolute; left: 0; top: 0.58em; width: 5px; height: 5px; background: var(--amber); content: ""; }
.arbitrage-score-value { color: var(--blue) !important; font-weight: 700; }

.arbitrage-score-summary {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--blue) 4%, var(--surface));
}

.arbitrage-score-summary > div {
  min-width: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 4px 10px;
  padding: 12px 14px;
  border-right: 1px solid var(--line);
}

.arbitrage-score-summary > div:nth-child(2) { border-right: 0; }
.arbitrage-score-summary > div:last-child { grid-column: 1 / -1; border-top: 1px solid var(--line); border-right: 0; }
.arbitrage-score-summary span { color: var(--muted); font-size: var(--font-meta); }
.arbitrage-score-summary strong { min-width: 0; color: var(--ink); font-size: var(--font-body); overflow-wrap: anywhere; }
.arbitrage-score-summary > div:nth-child(-n+2) strong { color: var(--blue); font-size: 20px; font-variant-numeric: tabular-nums; }
.arbitrage-score-summary small { grid-column: 1 / -1; color: var(--muted); font-size: var(--font-meta); overflow-wrap: anywhere; }
.arbitrage-score-summary .status-badge { width: max-content; }

.arbitrage-layout {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  margin-bottom: 12px;
}

.arbitrage-candidate-section { min-height: 0; display: flex; flex-direction: column; margin-bottom: 0; }
.arbitrage-table-scroll { min-height: 0; flex: 1 1 auto; max-height: 720px; }
.arbitrage-table-scroll table { min-width: 1380px; }
.arbitrage-table-scroll tbody tr.is-selected { background: var(--blue-soft); }
.arbitrage-table-scroll td strong,
.arbitrage-table-scroll td small { display: block; }
.arbitrage-table-scroll td small { margin-top: 2px; color: var(--muted); }

.arbitrage-detail {
  width: 100%;
  max-height: none;
  overflow: visible;
}

.arbitrage-legs { border-top: 1px solid var(--line); }
.arbitrage-leg {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}
.arbitrage-leg > div > span,
.arbitrage-leg > div > strong,
.arbitrage-leg > div > small { display: block; }
.arbitrage-leg > div > span,
.arbitrage-leg > div > small { color: var(--muted); font-size: var(--font-assist); }
.arbitrage-leg > div > strong { margin: 2px 0; font-size: var(--font-body); }
.arbitrage-leg dl { grid-column: 1 / -1; min-width: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.arbitrage-leg dl > div { min-width: 0; padding: 6px 7px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.arbitrage-leg dt { color: var(--muted); font-size: var(--font-assist); }
.arbitrage-leg dd { margin: 2px 0 0; overflow-wrap: anywhere; font-size: var(--font-meta); font-weight: 500; }

.arbitrage-diagnostics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 10px 0 0;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}
.arbitrage-diagnostics > div {
  min-width: 0;
  padding: 8px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.arbitrage-diagnostics dt { color: var(--muted); font-size: var(--font-assist); }
.arbitrage-diagnostics dd { margin: 3px 0 0; overflow-wrap: anywhere; font-size: var(--font-body); font-weight: 500; }
.arbitrage-diagnostics small { display: block; margin-top: 2px; color: var(--muted); line-height: 1.35; }

.arbitrage-entry-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 10px; border: 1px solid var(--line); }
.arbitrage-entry-grid > div { min-width: 0; padding: 9px; }
.arbitrage-entry-grid > div + div { border-left: 1px solid var(--line); }
.arbitrage-entry-grid span,
.arbitrage-entry-grid strong,
.arbitrage-entry-grid small { display: block; overflow-wrap: anywhere; }
.arbitrage-entry-grid span,
.arbitrage-entry-grid small { color: var(--muted); font-size: var(--font-assist); }
.arbitrage-entry-grid strong { margin: 3px 0; font-size: var(--font-body); }
.arbitrage-leg-actions,
.arbitrage-order-lock { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }

.catalog-detail-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin: 0 0 10px;
  border: 1px solid var(--line);
  background: var(--line);
}

.catalog-detail-facts > span {
  min-width: 0;
  padding: 9px 10px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: var(--font-meta);
}

.catalog-detail-facts strong {
  display: block;
  min-width: 0;
  margin-top: 3px;
  color: var(--ink);
  font-size: var(--font-body);
  font-weight: 650;
  overflow-wrap: anywhere;
}

.catalog-preview-value {
  display: table-cell;
  max-width: 360px;
  white-space: normal;
  overflow-wrap: anywhere;
}

.operations-integrations {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

.platform-record-form textarea {
  min-height: 112px;
  resize: vertical;
  font-family: Consolas, "SFMono-Regular", monospace;
}

.form-span-two { grid-column: 1 / -1; }

.platform-assets-section .view-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.platform-assets-section td small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
}

@media (max-width: 960px) {
  .catalog-detail-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .catalog-detail-facts { grid-template-columns: 1fr; }
  .platform-assets-section .section-heading { align-items: stretch; }
  .platform-assets-section .view-actions { justify-content: stretch; }
  .platform-asset-tabs { width: 100%; overflow-x: auto; }
  .form-span-two { grid-column: auto; }
}

.arbitrage-blockers { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.arbitrage-blockers h3 { margin: 0 0 7px; }
.arbitrage-blockers ul { margin: 0; padding: 0; display: grid; gap: 5px; list-style: none; }
.arbitrage-blockers li { min-width: 0; display: grid; grid-template-columns: 15px minmax(0, 1fr); align-items: start; gap: 6px; color: var(--red); font-size: var(--font-meta); line-height: 1.4; }
.arbitrage-blockers li.is-warning { color: var(--amber); }
.arbitrage-blockers li.is-passed { color: var(--green); }
.arbitrage-blockers li svg { width: 14px; height: 14px; margin-top: 2px; }
.arbitrage-blockers li span { overflow-wrap: anywhere; }

.arbitrage-boundaries { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.arbitrage-boundaries span { min-width: 0; display: flex; align-items: center; gap: 6px; padding: 10px 12px; border-right: 1px solid var(--line); color: var(--muted); font-size: var(--font-meta); overflow-wrap: anywhere; }
.arbitrage-boundaries span:last-child { border-right: 0; }
.arbitrage-boundaries svg { width: 15px; height: 15px; flex: 0 0 auto; color: var(--blue); }

@media (max-width: 1180px) {
  .exact-curve-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .operator-control-strip { grid-template-columns: minmax(0, 1fr) auto; }
  .operator-control-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .arbitrage-auto-heading { grid-template-columns: minmax(0, 1fr) auto; }
  .arbitrage-auto-heading > .status-badge { grid-column: 1 / -1; justify-self: start; }
  .arbitrage-auto-controls { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .arbitrage-scope-control { grid-column: span 2; }
  .arbitrage-auto-controls > .primary-button { grid-column: span 2; }
  .arbitrage-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .arbitrage-layout { grid-template-columns: minmax(0, 1fr); }
  .arbitrage-detail { max-height: none; }
  .arbitrage-boundaries { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .arbitrage-boundaries span { border-bottom: 1px solid var(--line); }
}

@media (max-width: 760px) {
  .curve-summary-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .curve-summary-strip > div {
    border-bottom: 1px solid var(--line);
  }
  .arbitrage-ranking-kind-control { align-items: stretch; flex-direction: column; gap: 6px; }
  .arbitrage-ranking-kind-control > .segmented-control { width: 100%; margin-left: 0; }
  .arbitrage-ranking-kind-control > .segmented-control button { flex: 1 1 50%; }
  .operator-control-strip { grid-template-columns: minmax(0, 1fr); align-items: stretch; }
  .operator-control-strip > .status-badge { justify-self: start; }
  .operator-control-actions { grid-column: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .operator-control-actions button { width: 100%; min-width: 0; white-space: normal; }
  .arbitrage-combination-control { grid-template-columns: minmax(0, 1fr); }
  .arbitrage-combination-control .row-actions { justify-content: stretch; }
  .arbitrage-combination-control .row-actions button { flex: 1 1 160px; }
  .arbitrage-auto-heading { grid-template-columns: 1fr; align-items: stretch; }
  .arbitrage-auto-heading .segmented-control { width: 100%; }
  .arbitrage-auto-heading .segmented-control button { flex: 1 1 50%; min-width: 0; }
  .arbitrage-auto-heading > .status-badge { grid-column: auto; }
  .arbitrage-auto-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .arbitrage-auto-toggle { min-height: 34px; }
  .arbitrage-scope-control,
  .arbitrage-auto-controls > .primary-button { grid-column: 1 / -1; }
  .arbitrage-auto-gate { grid-template-columns: minmax(0, 1fr); }
  .arbitrage-auto-gate-status { border-right: 0; border-bottom: 1px solid var(--line); }
  .arbitrage-evidence-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .arbitrage-evidence-metrics .metric-card:nth-child(2) { border-right: 0; }
  .arbitrage-evidence-metrics .metric-card:nth-child(-n + 2) { border-bottom: 1px solid var(--line); }
  .arbitrage-capability-workspace { grid-template-columns: minmax(0, 1fr); }
  .arbitrage-capability-item,
  .arbitrage-capability-item:nth-child(2n),
  .arbitrage-capability-item:nth-child(4n) { border-right: 0; border-bottom: 1px solid var(--line); }
  .arbitrage-capability-item:last-child { border-bottom: 1px solid var(--line); }
  .arbitrage-capability-boundaries { grid-column: 1; grid-row: auto; border-left: 0; }
  .arbitrage-capability-boundaries section { grid-template-columns: minmax(0, 1fr); }
  .arbitrage-capability-boundaries ul { grid-template-columns: minmax(0, 1fr); }
  .arbitrage-score-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .arbitrage-score-summary > div:nth-child(2) { border-right: 0; }
  .arbitrage-score-summary > div:last-child { grid-column: 1 / -1; border-top: 1px solid var(--line); }
  .arbitrage-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .arbitrage-leg { grid-template-columns: minmax(0, 1fr) auto; }
  .arbitrage-leg > .status-badge { justify-self: start; }
  .arbitrage-diagnostics,
  .arbitrage-entry-grid,
  .arbitrage-leg-actions,
  .arbitrage-order-lock { grid-template-columns: 1fr; }
  .arbitrage-entry-grid > div + div { border-left: 0; border-top: 1px solid var(--line); }
  .arbitrage-boundaries { grid-template-columns: 1fr; }
  .arbitrage-boundaries span { border-right: 0; }
}

@media (max-width: 500px) {
  .operator-control-actions { grid-template-columns: minmax(0, 1fr); }
}

/* These sections are declared after the main desktop lock, so pin them here. */
@media (min-width: 721px) {
  .exact-curve-grid { grid-template-columns: minmax(0, 1.35fr) minmax(420px, 0.85fr); }
  .arbitrage-capability-item,
  .arbitrage-capability-item:nth-child(2n) { border-right: 1px solid var(--line); }
  .arbitrage-capability-item:nth-child(4n) { border-right: 0; }
  .arbitrage-capability-item:nth-child(n + 9) { border-bottom: 0; }
  .arbitrage-metrics { grid-template-columns: repeat(5, minmax(120px, 1fr)); }
  .arbitrage-layout { grid-template-columns: minmax(440px, 0.78fr) minmax(650px, 1.35fr); align-items: stretch; }
  #arbitrageDetail { grid-column: 1; grid-row: 1; }
  .arbitrage-candidate-section { grid-column: 2; grid-row: 1; contain: size; height: 100%; }
  .arbitrage-table-scroll { flex: 1 1 0; max-height: none; overflow-y: auto; }
  .arbitrage-detail { max-height: none; overflow: visible; }
  .arbitrage-diagnostics,
  .arbitrage-entry-grid,
  .arbitrage-leg-actions,
  .arbitrage-order-lock { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .arbitrage-entry-grid > div + div { border-left: 1px solid var(--line); border-top: 0; }
  .arbitrage-boundaries { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .arbitrage-boundaries span { border-right: 1px solid var(--line); border-bottom: 0; }
  .arbitrage-boundaries span:last-child { border-right: 0; }
}

/* Match oversized desktop summary cards to the overview status strip. */
@media (min-width: 721px) {
  main .view > .metric-strip .metric-card {
    height: var(--desktop-summary-strip-height);
    min-height: 0;
    padding: 4px 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
  }

  #simulation > .metric-strip .metric-card {
    height: var(--desktop-summary-strip-height);
    min-height: 0;
    padding: 4px 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
  }

  #simulation > .metric-strip .metric-card span,
  #simulation > .metric-strip .metric-card strong,
  #simulation > .metric-strip .metric-card small {
    min-width: 0;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #simulation > .metric-strip .metric-card strong { margin-top: 2px; }
  #simulation > .metric-strip .metric-card small { margin-top: 2px; line-height: 1.2; }

  main .view > .metric-strip .metric-card span,
  main .view > .metric-strip .metric-card strong,
  main .view > .metric-strip .metric-card small {
    min-width: 0;
    line-height: 1.15;
  }

  main .view > .metric-strip .metric-card strong { margin-top: 2px; }
  main .view > .metric-strip .metric-card small { margin-top: 2px; line-height: 1.2; }

  .ranking-summary-strip > div {
    height: calc(var(--desktop-summary-strip-height) - 2px);
    padding: 4px 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
  }

  .ranking-summary-strip span,
  .ranking-summary-strip strong,
  .ranking-summary-strip small { line-height: 1.15; }
  .ranking-summary-strip strong { margin: 2px 0; }

  #decision .direction-summary { height: var(--desktop-summary-strip-height); }
  #decision .direction-main {
    height: 100%;
    min-height: 0;
    padding: 4px 8px;
  }
  #decision .direction-main span,
  #decision .direction-main small { font-size: 11px; line-height: 1.15; }
  #decision .direction-main strong { margin: 1px 0; font-size: 20px; line-height: 1.1; }
  #decision .evidence-split {
    height: 100%;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-rows: minmax(0, 1fr);
  }
  #decision .evidence-split > div {
    padding: 2px 7px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
  }
  #decision .evidence-split span { font-size: 11px; line-height: 1.15; }
  #decision .evidence-split strong { margin-top: 1px; font-size: 15px; line-height: 1.1; }
}

/* Full-domain overview: market first, evidence second, account and governance third. */
#overview {
  --overview-dark: #315950;
  --overview-dark-soft: #eef4f2;
  --overview-accent: #27745f;
  --overview-blue: #2d6f9e;
  --overview-border: #cbd8d3;
}

#overview > * + * { margin-top: 12px; }
#overview > .page-heading + * { margin-top: 0; }

.heading-with-icon {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 9px;
}
.heading-with-icon > svg,
.heading-with-icon > i {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  padding: 6px;
  border-radius: 4px;
  background: #e7f1ee;
  color: var(--overview-accent);
}
.heading-with-icon > div { min-width: 0; }

.overview-market-banner {
  min-width: 0;
  margin-bottom: 12px;
  border: 1px solid #b9cbc5;
  border-top: 3px solid #78ad9d;
  border-radius: 4px;
  background: #f3f7f6;
  color: var(--ink);
  overflow: hidden;
}
.overview-instrument-heading {
  min-width: 0;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 11px 14px 9px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  background: var(--overview-dark);
}
.overview-heading-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 4px;
  background: #315b51;
  color: #bfe3d7;
}
.overview-heading-icon svg { width: 20px; height: 20px; }
.overview-instrument-heading h2 { color: #ffffff; font-size: 18px; }
.overview-instrument-heading p { margin-top: 2px; color: #c2d6d0; }
.overview-instrument-heading .status-badge { border-color: #72958b; background: #2c5047; color: #edf7f4; }

#overview .overview-quote-grid {
  grid-template-columns: minmax(118px, 1.2fr) repeat(9, minmax(82px, 1fr));
  gap: 0;
  margin: 0;
  border: 0;
  background: transparent;
}
#overview .overview-quote-grid > span {
  min-height: 58px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 8px 10px;
  border-right: 1px solid #cbd9d5;
  background: var(--overview-dark-soft);
  color: #60736d;
}
#overview .overview-quote-grid > span:last-child { border-right: 0; }
#overview .overview-quote-grid strong { color: #1d312c; font-size: 15px; font-weight: 600; }
#overview .overview-primary-quote { background: #deebe7 !important; }
#overview .overview-primary-quote strong { font-size: 24px; line-height: 1.05; }
#overview .overview-quote-grid .value-positive { color: var(--price-up) !important; }
#overview .overview-quote-grid .value-negative { color: var(--price-down) !important; }

#overview .dashboard-grid {
  align-items: start;
  margin-bottom: 0;
}
#overview .market-panel {
  display: flex;
  flex-direction: column;
  align-self: start;
  border-color: var(--overview-border);
  border-top: 3px solid var(--overview-blue);
}
#overview .market-panel .panel-heading { margin-bottom: 8px; }
#overview .market-panel #marketChart { flex: 0 0 auto; }
.overview-market-subcharts {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 16px;
}
.overview-market-subchart {
  min-width: 0;
  margin-top: 0;
  padding: 8px;
  border: 1px solid var(--line);
  background: var(--surface-soft);
}
.overview-market-subchart > div:first-child { min-height: 32px; align-items: flex-start; }
.overview-market-subchart > div:first-child > div:first-child {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}
.overview-market-subchart > div:first-child strong {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--ink);
  font-size: var(--font-meta);
  font-weight: 600;
}
.overview-market-subchart > div:first-child strong svg { width: 15px; height: 15px; color: var(--overview-blue); }
.overview-market-subchart > div:first-child span { text-align: left; line-height: 1.35; }
.overview-market-subchart canvas { width: 100%; display: block; background: var(--surface); }
#overview .overview-market-subchart canvas {
  height: var(--chart-range-height);
  min-height: var(--chart-range-height);
}
#overview #marketOscillatorChart {
  height: var(--chart-range-height);
  min-height: var(--chart-range-height);
}
.overview-subchart-stats {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px !important;
  margin: 6px 0 0 !important;
  border: 1px solid var(--line);
  background: var(--line);
}
.overview-subchart-stats > span {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 44px;
  padding: 5px 7px;
  background: var(--surface);
  color: var(--muted);
  font-size: var(--font-assist);
  text-align: left;
}
.overview-subchart-stats strong {
  margin-top: 2px;
  color: var(--ink);
  font-size: var(--font-meta);
  font-weight: 600;
  overflow-wrap: anywhere;
}
.overview-timeframe-matrix {
  min-width: 0;
  margin-top: 8px;
  border: 1px solid var(--line);
  background: var(--surface-soft);
}
.overview-timeframe-heading {
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 9px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}
.overview-timeframe-heading > div { min-width: 0; display: flex; align-items: baseline; gap: 8px; }
.overview-timeframe-heading strong { display: inline-flex; align-items: center; gap: 5px; font-size: var(--font-meta); }
.overview-timeframe-heading strong svg { width: 15px; height: 15px; color: var(--overview-blue); }
.overview-timeframe-heading span { min-width: 0; color: var(--muted); font-size: var(--font-assist); overflow-wrap: anywhere; }
.overview-timeframe-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 1px;
  background: var(--line);
}
.overview-timeframe-grid article {
  min-width: 0;
  min-height: 78px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 7px 8px;
  background: var(--surface);
  box-shadow: inset 0 3px 0 var(--line-strong);
}
.overview-timeframe-grid article.is-bullish { box-shadow: inset 0 3px 0 var(--price-up); }
.overview-timeframe-grid article.is-bearish { box-shadow: inset 0 3px 0 var(--price-down); }
.overview-timeframe-grid article > span { color: var(--muted); font-size: var(--font-assist); }
.overview-timeframe-grid article > strong { margin-top: 3px; font-size: var(--font-control); font-weight: 600; }
.overview-timeframe-grid article.is-bullish > strong { color: var(--price-up); }
.overview-timeframe-grid article.is-bearish > strong { color: var(--price-down); }
.overview-timeframe-grid article > small { margin-top: 3px; color: var(--muted); font-size: var(--font-assist); line-height: 1.3; overflow-wrap: anywhere; }
#overview .dashboard-side-column {
  grid-template-rows: auto auto;
  align-content: start;
}

.overview-depth-panel {
  min-height: 0;
  display: flex;
  flex-direction: column;
  border-color: var(--overview-border);
  border-top: 3px solid var(--overview-accent);
}
.overview-depth-panel .panel-heading { margin-bottom: 8px; }
.overview-depth-panel .depth-column-head {
  grid-template-columns: 45px minmax(82px, 0.8fr) minmax(122px, 1.2fr);
  padding: 5px 8px;
}
.overview-order-book {
  flex: 1 1 auto;
  grid-template-rows: repeat(5, minmax(31px, 1fr)) minmax(48px, 1.25fr) repeat(5, minmax(31px, 1fr));
}
.overview-order-book .book-row,
.overview-order-book .last-price {
  grid-template-columns: 45px minmax(82px, 0.8fr) minmax(122px, 1.2fr);
  min-height: 31px;
  padding: 5px 8px;
}
.overview-order-book .book-row strong { font-size: 14px; }
.overview-order-book .book-row em { font-size: 11px; }
.overview-order-book .book-row.is-unavailable { background: #f5f7f6; }
.overview-order-book .book-row.is-unavailable::before { display: none; }
.overview-order-book .book-row.is-unavailable span,
.overview-order-book .book-row.is-unavailable strong,
.overview-order-book .book-row.is-unavailable em { color: var(--muted); }
.overview-order-book .last-price { min-height: 48px; }
.overview-order-book .last-price strong { font-size: 22px; }
.overview-book-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: 8px;
  border: 1px solid var(--line);
  background: var(--line);
}
.overview-book-stats > div {
  min-width: 0;
  padding: 7px 8px;
  background: var(--surface-soft);
}
.overview-book-stats span,
.overview-book-stats strong { display: block; overflow-wrap: anywhere; }
.overview-book-stats span { color: var(--muted); font-size: var(--font-assist); }
.overview-book-stats strong { margin-top: 2px; font-size: var(--font-meta); font-weight: 600; }
.overview-contract-specs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 8px;
  border: 1px solid var(--line);
  background: var(--line);
}
.overview-contract-specs > span {
  min-width: 0;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 1px 6px;
  padding: 7px;
  background: var(--surface);
}
.overview-contract-specs svg { grid-row: 1 / 3; width: 16px; height: 16px; color: var(--overview-blue); }
.overview-contract-specs small { color: var(--muted); }
.overview-contract-specs strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--font-meta); }

#overview .trade-plan-panel {
  border-color: var(--overview-border);
  border-top: 3px solid #b78932;
}
#overview .trade-plan-panel .plan-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--line);
  background: var(--line);
}
#overview .trade-plan-panel .plan-list > div {
  display: block;
  padding: 7px 8px;
  border: 0;
  background: var(--surface-soft);
}
#overview .trade-plan-panel .plan-list dd { margin-top: 3px; text-align: left; }
#overview .trade-plan-panel .panel-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
#overview .trade-plan-panel .overview-plan-danger { color: var(--red); background: var(--red-soft); border-color: #e2aeb2; }

#overview .fundamental-report-panel {
  border-color: var(--overview-border);
  border-top: 3px solid #7a6242;
}
.fundamental-intelligence-grid {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 12px;
  margin-top: 10px;
}
.fundamental-intelligence-grid > * { min-width: 0; height: 100%; }
.fundamental-core-column,
.fundamental-driver-column,
.overview-event-column {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  background: var(--surface-soft);
}
.fundamental-core-column {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#overview .fundamental-score-grid { margin-top: 0; }
#overview .fundamental-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: auto;
}
#overview .fundamental-metrics > div { min-height: 70px; }
#overview .fundamental-metrics dt { display: flex; align-items: center; gap: 5px; }
#overview .fundamental-metrics dt svg { width: 15px; height: 15px; color: #7a6242; }
.fundamental-driver-column h3,
.overview-subheading h3 {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-size: var(--font-section);
}
.fundamental-driver-column {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.fundamental-driver-column h3 svg,
.overview-subheading h3 svg { width: 17px; height: 17px; color: var(--overview-accent); }
#overview .fundamental-driver-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: auto;
  border: 1px solid var(--line);
  background: var(--line);
}
#overview .fundamental-driver-list > div {
  display: block;
  min-height: 58px;
  padding: 7px 8px;
  border: 0;
  background: var(--surface);
}
#overview .fundamental-driver-list strong { display: block; margin-top: 3px; text-align: left; }
.overview-subheading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.overview-event-list {
  display: grid;
  align-content: start;
  grid-auto-rows: 72px;
  gap: 1px;
  margin-top: 8px;
  border: 1px solid var(--line);
  background: var(--line);
  max-height: 293px;
  overflow-y: auto;
  scrollbar-gutter: stable;
}
.overview-event-item {
  min-width: 0;
  min-height: 72px;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 7px;
  padding: 8px;
  background: var(--surface);
  overflow: hidden;
}
.overview-event-item > span {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--blue-soft);
  color: var(--overview-blue);
}
.overview-event-item > span svg { width: 13px; height: 13px; }
.overview-event-item > div { min-width: 0; }
.overview-event-item strong { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: var(--font-meta); line-height: 1.4; }
.overview-event-item small { display: block; margin-top: 3px; color: var(--muted); }
.event-authority { display: block; margin-top: 3px; font-size: var(--font-assist); font-weight: 600; }
.event-authority.status-good { color: var(--green, #167a52); }
.event-authority.status-warn { color: var(--amber, #926000); }
#overview .fundamental-evidence { margin-top: 12px; }
#overview .fundamental-domain-table { max-height: none; overflow-y: visible; }

#overview > .overview-summary-row { margin-bottom: 0; }
.v2-overview-detail {
  min-width: 0;
  display: grid;
  gap: 12px;
}
.overview-curve-visual {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  gap: 12px;
  padding: 12px 14px 0;
}
.overview-curve-chart {
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  background: var(--surface-soft);
}
.overview-curve-chart > div { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.overview-curve-chart > div span { color: var(--muted); font-size: var(--font-assist); text-align: right; }
#overviewCurveChart { height: 210px; min-height: 210px; }
.overview-curve-insights {
  display: grid;
  grid-template-rows: repeat(3, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--line);
  background: var(--line);
}
.overview-curve-insights > div {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 10px 12px;
  background: var(--surface);
}
.overview-curve-insights span { color: var(--muted); font-size: var(--font-assist); }
.overview-curve-insights strong { margin-top: 4px; font-size: var(--font-body); overflow-wrap: anywhere; }
#overview .overview-opportunity-section .table-scroll { width: 100%; }

@media (min-width: 1361px) {
  #overview .dashboard-grid { grid-template-columns: minmax(0, 1.65fr) minmax(340px, 0.72fr); }
}

@media (min-width: 1101px) and (max-width: 1360px) {
  #overview .dashboard-grid { grid-template-columns: minmax(0, 1.35fr) minmax(330px, 0.8fr); }
  #overview .overview-quote-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  #overview .overview-quote-grid > span:nth-child(5n) { border-right: 0; }
  .fundamental-intelligence-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .overview-event-column { grid-column: 1 / -1; }
  .overview-event-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .overview-market-subcharts { grid-template-columns: minmax(0, 1fr); }
  .overview-timeframe-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 721px) and (max-width: 1100px) {
  #overview .overview-quote-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  #overview .overview-quote-grid > span:nth-child(5n) { border-right: 0; }
  #overview .dashboard-grid { grid-template-columns: minmax(0, 1fr); }
  #overview .dashboard-side-column { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto; }
  .fundamental-intelligence-grid { grid-template-columns: minmax(0, 1fr); }
  .overview-curve-visual { grid-template-columns: minmax(0, 1fr); }
  .overview-curve-insights { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto; }
  .overview-market-subcharts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .overview-market-subchart:last-child { grid-column: 1 / -1; }
  .overview-timeframe-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  #overview.is-active { display: block; }
  #overview > *, #overview .dashboard-grid > * { order: initial; }
  #overview .dashboard-grid { display: grid; grid-template-columns: minmax(0, 1fr); }
  #overview .market-panel { margin: 0; padding: 12px; border: 1px solid var(--overview-border); border-top: 3px solid var(--overview-blue); border-radius: 4px; }
  #overview .market-panel > .panel-heading { display: flex; }
  .overview-instrument-heading { grid-template-columns: 34px minmax(0, 1fr); }
  .overview-instrument-heading .status-badge { grid-column: 2; justify-self: start; }
  #overview .overview-quote-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #overview .overview-quote-grid > span:nth-child(2n) { border-right: 0; }
  #overview .overview-primary-quote strong { font-size: 20px; }
  #overview .dashboard-side-column { grid-template-rows: auto; }
  .fundamental-intelligence-grid { grid-template-columns: minmax(0, 1fr); }
  #overview .fundamental-driver-list { grid-template-columns: minmax(0, 1fr); }
  .overview-curve-visual { grid-template-columns: minmax(0, 1fr); padding-inline: 10px; }
  .overview-curve-insights { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; }
  .overview-market-subcharts { grid-template-columns: minmax(0, 1fr); }
  .overview-market-subchart:last-child { grid-column: auto; }
  .overview-timeframe-heading { align-items: flex-start; }
  .overview-timeframe-heading > div { flex-direction: column; gap: 2px; }
  .overview-timeframe-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #overview .trade-plan-panel .panel-actions { grid-template-columns: minmax(0, 1fr); }
}

/* Unified execution domain ------------------------------------------------ */
.execution-link-strip,
.execution-command-strip,
.arbitrage-flow-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: 12px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.arbitrage-flow-strip { grid-template-columns: repeat(6, minmax(0, 1fr)); }

.execution-link-strip > div,
.execution-command-strip > div,
.arbitrage-flow-strip > div {
  min-width: 0;
  min-height: 68px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 9px 12px;
  border-right: 1px solid var(--line);
}

.execution-link-strip > div:last-child,
.execution-command-strip > div:last-child,
.arbitrage-flow-strip > div:last-child { border-right: 0; }

.execution-link-strip span,
.execution-command-strip span,
.arbitrage-flow-strip span { color: var(--muted); font-size: var(--font-meta); }

.execution-link-strip strong,
.execution-command-strip strong,
.arbitrage-flow-strip strong {
  margin-top: 3px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--font-control);
  font-weight: 650;
}

.execution-link-strip small,
.execution-command-strip small,
.arbitrage-flow-strip small {
  min-width: 0;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: var(--font-assist);
}

.execution-command-primary { background: var(--surface-soft); }
.execution-command-primary strong { color: var(--green); }

.automation-flow-strip {
  display: grid;
  grid-template-columns: minmax(160px, 0.7fr) minmax(0, 4.3fr);
  align-items: stretch;
  margin-bottom: 12px;
  border: 1px solid var(--line);
  background: var(--surface);
}

.automation-flow-summary {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 10px 14px;
  border-right: 1px solid var(--line);
  background: var(--surface-soft);
}

.automation-flow-summary span,
.automation-flow-summary small { color: var(--muted); font-size: var(--font-assist); }
.automation-flow-summary strong { margin: 3px 0; font-size: 17px; }

.execution-stage-list {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.execution-stage-list li {
  min-width: 0;
  min-height: 72px;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-content: center;
  gap: 2px 7px;
  padding: 8px 9px;
  border-right: 1px solid var(--line);
}

.execution-stage-list li:last-child { border-right: 0; }
.execution-stage-list li > span {
  grid-row: 1 / 3;
  align-self: center;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: var(--muted);
  font-size: var(--font-assist);
}
.execution-stage-list strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--font-meta); }
.execution-stage-list small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); }
.execution-stage-list li.is-active { box-shadow: inset 0 -3px 0 var(--amber); background: var(--amber-soft); }
.execution-stage-list li.is-complete { box-shadow: inset 0 -3px 0 var(--green); }
.execution-stage-list li.is-blocked { box-shadow: inset 0 -3px 0 var(--red); background: var(--red-soft); }

.automation-execution-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(420px, 0.88fr);
  gap: 12px;
}

.automation-execution-grid > .table-section { min-width: 0; margin: 0; }
.automation-execution-grid .table-scroll { max-height: 360px; overflow: auto; }
.automation-execution-grid td strong,
.automation-execution-grid td small { display: block; }
.automation-execution-grid td small { margin-top: 2px; color: var(--muted); }
.automation-candidate-section td:last-child { min-width: 190px; }
.event-machine-badge { display: inline-flex; width: fit-content; margin-top: 6px; }

.ranking-decision-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ranking-detail-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.arbitrage-execution-ledger { margin-bottom: 12px; }
.arbitrage-execution-ledger .table-scroll { max-height: 330px; overflow: auto; }

@media (max-width: 1360px) {
  .execution-link-strip,
  .execution-command-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .execution-link-strip > div:nth-child(3),
  .execution-command-strip > div:nth-child(3) { border-right: 0; }
  .execution-link-strip > div:nth-child(-n+3),
  .execution-command-strip > div:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
  .arbitrage-flow-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .arbitrage-flow-strip > div:nth-child(3) { border-right: 0; }
  .arbitrage-flow-strip > div:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
  .automation-flow-strip { grid-template-columns: minmax(0, 1fr); }
  .automation-flow-summary { border-right: 0; border-bottom: 1px solid var(--line); }
  .automation-execution-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 900px) {
  .execution-stage-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .execution-stage-list li { border-bottom: 1px solid var(--line); }
  .execution-stage-list li:nth-child(4n) { border-right: 0; }
  .execution-stage-list li:nth-child(n+5) { border-bottom: 0; }
}

@media (max-width: 720px) {
  .execution-link-strip,
  .execution-command-strip,
  .arbitrage-flow-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .execution-link-strip > div,
  .execution-command-strip > div,
  .arbitrage-flow-strip > div { min-height: 62px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .execution-link-strip > div:nth-child(2n),
  .execution-command-strip > div:nth-child(2n),
  .arbitrage-flow-strip > div:nth-child(2n) { border-right: 0; }
  .execution-link-strip > div:last-child,
  .execution-command-strip > div:last-child { grid-column: 1 / -1; border-bottom: 0; }
  .arbitrage-flow-strip > div:nth-last-child(-n+2) { border-bottom: 0; }
  .execution-stage-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .execution-stage-list li:nth-child(2n) { border-right: 0; }
  .execution-stage-list li:nth-child(n+5) { border-bottom: 1px solid var(--line); }
  .execution-stage-list li:last-child { grid-column: 1 / -1; border-bottom: 0; }
}


/* Source: v2-production-theme.css */
/* V2 production theme. Structural IDs and application behavior remain in styles.css/app.js. */
:root {
  --bg: #edf1f4;
  --surface: #ffffff;
  --surface-soft: #f5f8fa;
  --surface-strong: #e7edf1;
  --ink: #10202a;
  --muted: #5d6d78;
  --line: #ccd6dd;
  --line-strong: #aab9c3;
  --nav: #071820;
  --nav-hover: #102730;
  --green: #006f4e;
  --green-soft: #e5f4ed;
  --red: #c53240;
  --red-soft: #fce9eb;
  --amber: #955900;
  --amber-soft: #fff2d8;
  --blue: #0069a8;
  --blue-soft: #e8f3fa;
  --price-up: #c53240;
  --price-up-soft: #fce9eb;
  --price-down: #007f59;
  --price-down-soft: #e5f4ed;
  --shadow: 0 8px 24px rgba(13, 35, 47, 0.08);
  --font-body: 15px;
  --font-control: 15px;
  --font-page: 22px;
}

html,
body {
  background: var(--bg);
  color: var(--ink);
}

body {
  scrollbar-color: #9fb0ba #e6ecef;
}

::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: #e6ecef; }
::-webkit-scrollbar-thumb { background: #9fb0ba; border: 3px solid #e6ecef; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #70858f; }

.sidebar {
  background: var(--nav);
  border-right-color: #02090c;
}

.brand {
  height: 76px;
  flex-basis: 76px;
  gap: 12px;
  border-bottom-color: #29414a;
}

.brand .brand-mark {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  display: block;
  border: 0;
  border-radius: 4px;
  object-fit: contain;
  box-shadow: 0 0 0 1px rgba(24, 184, 149, 0.18);
}

.brand-copy strong { color: #f4faf9; font-weight: 650; }
.brand-copy span { color: #9fb2b8; }
.primary-nav { gap: 2px; }
.nav-group-label { color: #8aa0a7; font-weight: 700; }

.nav-button {
  min-height: 39px;
  border-left: 3px solid transparent;
  border-radius: 3px;
  color: #b6c5c9;
}

.nav-button svg { color: #81a3ad; }
.nav-button:hover { background: var(--nav-hover); color: #ffffff; }
.nav-button.is-active {
  border-left-color: #23c5a0;
  background: #15343c;
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(35, 197, 160, 0.08);
}
.nav-button.is-active svg { color: #46d6b4; }
.sidebar-footer { border-top-color: #29414a; }
.sidebar-footer strong { color: #eef6f4; }
.sidebar-footer span { color: #a8b8bd; }

.topbar {
  background: rgba(255, 255, 255, 0.98);
  border-bottom-color: var(--line);
  box-shadow: 0 2px 8px rgba(20, 44, 58, 0.05);
}

.contract-switcher label,
.environment-control label,
.top-status-item > span { color: var(--muted); }

select,
input,
textarea {
  border-color: var(--line-strong);
  border-radius: 3px;
  background: #ffffff;
  color: var(--ink);
}

select:hover,
input:hover,
textarea:hover { border-color: #7f96a3; }

select:focus,
input:focus,
textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 2px rgba(0, 105, 168, 0.12);
}

.top-status {
  border-color: var(--line);
  background: var(--surface-soft);
}

.top-status-item { border-right-color: var(--line); }
.global-latest-quote { background: #edf6fb; }
.global-latest-quote b { color: #071820; font-weight: 750; }
.top-actions { border-left-color: var(--line); }
.user-button,
.icon-button { border-color: var(--line); border-radius: 3px; background: #ffffff; }
.user-button:hover,
.icon-button:hover { background: var(--surface-soft); border-color: var(--line-strong); }
.user-avatar { background: #dff3ed; color: #00765f; }

.environment-banner {
  min-height: 36px;
  border-bottom-color: #bed4e2;
  background: #e8f3fa;
  color: #31596e;
}
.environment-live { border-bottom-color: #e7a1a8; background: var(--red-soft); color: #8a2831; }
.halt-banner { border-color: #e7a1a8; background: var(--red-soft); color: #8a2831; }

.view { background: var(--bg); }
.page-heading { align-items: center; }
.page-heading h1 { color: #071820; font-weight: 700; letter-spacing: 0; }
.page-heading p,
.panel-heading p,
.section-heading p,
.dialog-heading p { color: var(--muted); }

.primary-button,
.secondary-button,
.danger-button,
.danger-outline-button,
.text-button,
.icon-button { border-radius: 3px; font-weight: 600; }
.primary-button { border-color: var(--blue); background: var(--blue); }
.primary-button:hover { border-color: #005888; background: #005888; }
.secondary-button { border-color: var(--line-strong); background: #ffffff; color: var(--ink); }
.secondary-button:hover { border-color: #7f96a3; background: var(--surface-soft); }
.danger-button { border-color: var(--red); background: var(--red); }
.danger-button:hover { border-color: #a92733; background: #a92733; }
.danger-outline-button { border-color: #d88d95; background: #ffffff; color: var(--red); }
.danger-outline-button:hover { background: var(--red-soft); }
.text-button { color: var(--blue); }
.text-button:hover { background: var(--blue-soft); }

.segmented-control {
  overflow: hidden;
  border-color: var(--line-strong);
  border-radius: 3px;
  background: #ffffff;
}
.segmented-control button { border-right-color: var(--line); color: var(--muted); }
.segmented-control button:hover { background: var(--surface-soft); color: var(--ink); }
.segmented-control button.is-selected { background: var(--blue); color: #ffffff; }

.metric-card {
  min-height: 76px;
  border-color: var(--line);
  border-top: 3px solid var(--blue);
  border-radius: 4px;
  background: var(--surface);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}
.metric-card:has(.status-value-good),
.metric-card:has(.value-positive) { border-top-color: #00866e; }
.metric-card:has(.status-value-warn),
.metric-card:has(.value-warning) { border-top-color: #d7a62d; }
.metric-card:has(.status-value-bad),
.metric-card:has(.value-negative) { border-top-color: var(--red); }
.metric-card span,
.metric-card small { color: var(--muted); }
.metric-card span { line-height: 1.2; }
.metric-card strong { color: var(--ink); font-weight: 700; line-height: 1.1; }
.metric-card small { line-height: 1.25; }

.gate-bar {
  border-color: var(--line);
  border-radius: 4px;
  background: var(--surface);
}
.gate-bar > div { border-right-color: var(--line); }

.tool-panel,
.detail-panel,
.table-section,
.timeline-panel,
.log-panel,
.forward-progress-panel {
  border-color: var(--line);
  border-radius: 4px;
  background: var(--surface);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.82);
}

.panel-heading h2,
.section-heading h2,
.dialog-heading h2 { color: #10202a; font-weight: 700; }
.section-heading {
  border-bottom-color: var(--line);
  background: linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%);
}

.market-quote-strip,
.level-row,
.fundamental-score-grid,
.replay-summary,
.health-strip,
.ranking-summary-strip { border-color: var(--line); background: var(--surface-soft); }
.market-quote-strip > span,
.level-row > span,
.fundamental-score-grid > div,
.replay-summary > div,
.health-strip > div,
.ranking-summary-strip > div { border-color: var(--line); }
.market-quote-strip strong { color: #071820; font-weight: 700; }

.intraday-signal-strip > div,
.market-subchart,
.fundamental-summary,
.detail-note,
.source-list > div,
.gate-list > div,
.strategy-card,
.switch-row,
.security-summary,
.update-row {
  border-color: var(--line);
  border-radius: 4px;
  background: var(--surface-soft);
}

.market-subchart { padding-top: 10px; }
.chart-zoom-controls .icon-button { background: #ffffff; }

table { border-color: var(--line); }
th {
  border-color: var(--line);
  background: var(--surface-soft);
  color: var(--muted);
  font-weight: 650;
}
td { border-color: var(--line); color: var(--ink); }
tbody tr:hover td { background: #f3f8fa; }

.status-badge,
.direction-chip { border-radius: 3px; font-weight: 600; }
.status-good { border-color: #9ed2c0; background: var(--green-soft); color: var(--green); }
.status-warn { border-color: #e2bf79; background: var(--amber-soft); color: var(--amber); }
.status-blocked { border-color: #e7a1a8; background: var(--red-soft); color: var(--red); }
.status-neutral { border-color: #a9c8db; background: var(--blue-soft); color: var(--blue); }

.progress-track,
.score-bars i,
.limit-list i { background: #e5eaee; }
.progress-track > span,
.score-bars b { background: var(--blue); }

dialog {
  border-color: var(--line);
  border-radius: 6px;
  background: #ffffff;
  color: var(--ink);
  box-shadow: 0 18px 48px rgba(7, 24, 32, 0.24);
}
dialog::backdrop { background: rgba(7, 24, 32, 0.66); }
.login-dialog::backdrop { background: rgba(7, 24, 32, 0.76); }
.login-brand { border-bottom-color: var(--line); }
.login-brand .brand-mark {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  display: block;
  border: 0;
  border-radius: 4px;
  object-fit: contain;
  background: transparent;
}
.auth-notice { border-color: #a9c8db; background: var(--blue-soft); color: #234e70; }
.session-profile,
.broker-session-status { border-color: var(--line); background: var(--surface-soft); }

.toast { border: 1px solid #29414a; background: var(--nav); }
.alert-drawer { border-left-color: var(--line); background: #ffffff; }

@media (min-width: 721px) {
  .app-shell {
    grid-template-columns: 224px minmax(0, 1fr);
  }

  .brand { padding-inline: 16px; }

  .contract-switcher {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 0.9fr) minmax(0, 1.2fr);
  }

  #overview > .overview-summary-row {
    border-color: var(--line);
    background: var(--surface);
  }

  #overview > .overview-summary-row .metric-card {
    min-height: 74px;
    border-top: 0;
    border-right-color: var(--line);
    box-shadow: inset 0 3px 0 var(--blue);
  }
  #overview > .overview-summary-row .metric-card:has(.status-value-good),
  #overview > .overview-summary-row .metric-card:has(.value-positive) { box-shadow: inset 0 3px 0 #00866e; }
  #overview > .overview-summary-row .metric-card:has(.status-value-warn),
  #overview > .overview-summary-row .metric-card:has(.value-warning) { box-shadow: inset 0 3px 0 #d7a62d; }
  #overview > .overview-summary-row .metric-card:has(.status-value-bad),
  #overview > .overview-summary-row .metric-card:has(.value-negative) { box-shadow: inset 0 3px 0 var(--red); }

  .topbar { border-bottom-color: var(--line); }

  .arbitrage-layout {
    grid-template-columns: minmax(650px, 1.35fr) minmax(420px, 0.78fr);
  }
}

@media (max-width: 720px) {
  .sidebar { background: var(--nav); transition: none; }
  body.nav-open .sidebar { transition: transform 160ms ease; }
  .brand { height: 64px; flex-basis: 64px; }
  .brand .brand-mark { width: 36px; height: 36px; flex-basis: 36px; }
  .page-heading { align-items: stretch; }
  .metric-card { min-height: 70px; }
  .tool-panel,
  .detail-panel,
  .table-section,
  .timeline-panel,
  .log-panel,
  .forward-progress-panel { border-radius: 3px; }
}