/* Source: v3-design-system.css */
/*
 * Zhongqi Zhiyan / V3 design system
 * Visual-only layer: keeps existing markup, IDs, data bindings and layout contracts intact.
 * Direction: graphite-teal trading console with a single, high-contrast market focus.
 */
:root {
  --v3-canvas: #eaf0f2;
  --v3-surface: #ffffff;
  --v3-surface-soft: #f4f8f9;
  --v3-surface-tint: #edf5f5;
  --v3-ink: #102b35;
  --v3-ink-strong: #08212b;
  --v3-muted: #5f747d;
  --v3-muted-light: #80949b;
  --v3-line: #cbd9de;
  --v3-line-soft: #dfe8eb;
  --v3-line-strong: #a8bec5;
  --v3-sidebar: #0d252e;
  --v3-sidebar-deep: #091d25;
  --v3-sidebar-line: #2b4650;
  --v3-teal: #078b75;
  --v3-teal-bright: #25c9a9;
  --v3-teal-soft: #e1f4ef;
  --v3-blue: #096e99;
  --v3-blue-soft: #e5f2f7;
  --v3-copper: #a66b18;
  --v3-copper-soft: #fbf0d9;
  --v3-up: #c53240;
  --v3-up-soft: #fbe8eb;
  --v3-down: #007f59;
  --v3-down-soft: #e2f4ef;
  --v3-danger: #b72339;
  --v3-shadow: 0 8px 22px rgba(9, 35, 45, .075);
  --v3-shadow-soft: 0 2px 8px rgba(9, 35, 45, .06);
  --v3-radius: 4px;
  --v3-radius-small: 3px;
  --v3-ui-body: 14px;
  --v3-ui-meta: 12px;
  --v3-ui-title: 22px;
  --v3-ui-panel: 16px;
}

html.v2-layout-ready {
  color-scheme: light;
  background: var(--v3-canvas);
}

html.v2-layout-ready body {
  background: var(--v3-canvas);
  color: var(--v3-ink);
  font-family: "Segoe UI", "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  font-size: var(--v3-ui-body);
  font-variant-numeric: tabular-nums;
}

html.v2-layout-ready ::selection { background: #bfe9df; color: var(--v3-ink-strong); }
html.v2-layout-ready :focus-visible {
  outline: 2px solid var(--v3-teal-bright);
  outline-offset: 2px;
}

html.v2-layout-ready ::-webkit-scrollbar { width: 10px; height: 10px; }
html.v2-layout-ready ::-webkit-scrollbar-track { background: #dfe8eb; }
html.v2-layout-ready ::-webkit-scrollbar-thumb {
  background: #91aab3;
  border: 3px solid #dfe8eb;
  border-radius: 999px;
}
html.v2-layout-ready ::-webkit-scrollbar-thumb:hover { background: #68848e; }

/* Navigation is a dark instrument rail, with one restrained active state. */
html.v2-layout-ready .sidebar {
  background: var(--v3-sidebar);
  border-right: 1px solid var(--v3-sidebar-line);
  box-shadow: 8px 0 24px rgba(5, 26, 34, .12);
}
html.v2-layout-ready .brand {
  min-height: 78px;
  background: var(--v3-sidebar-deep);
  border-bottom: 1px solid var(--v3-sidebar-line);
}
html.v2-layout-ready .brand .brand-mark {
  width: 42px;
  height: 42px;
  border-radius: var(--v3-radius-small);
  box-shadow: 0 0 0 1px rgba(37, 201, 169, .38), 0 5px 15px rgba(0, 0, 0, .2);
}
html.v2-layout-ready .brand-copy strong { color: #f2fbf9; font-size: 17px; letter-spacing: .01em; }
html.v2-layout-ready .brand-copy span { color: #91acb4; font-size: 11px; }
html.v2-layout-ready .nav-group-label {
  color: #75929c;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
}
html.v2-layout-ready .nav-button {
  min-height: 40px;
  margin-inline: 8px;
  padding-inline: 12px;
  border: 1px solid transparent;
  border-radius: var(--v3-radius-small);
  color: #b5c8cd;
  transition: background-color 140ms ease, color 140ms ease, border-color 140ms ease;
}
html.v2-layout-ready .nav-button svg { color: #81a9b2; }
html.v2-layout-ready .nav-button:hover {
  background: #173942;
  border-color: #315965;
  color: #f4fbfa;
}
html.v2-layout-ready .nav-button.is-active {
  background: #13564f;
  border-color: #1c9d88;
  color: #ffffff;
  box-shadow: inset 3px 0 0 var(--v3-teal-bright), 0 5px 14px rgba(0, 0, 0, .11);
}
html.v2-layout-ready .nav-button.is-active svg { color: #7ff1d5; }
html.v2-layout-ready .sidebar-footer {
  margin: auto 9px 10px;
  border: 1px solid #315963;
  border-top: 2px solid var(--v3-teal);
  border-radius: var(--v3-radius-small);
  background: #112f39;
}
html.v2-layout-ready .sidebar-footer strong { color: #edf8f6; }
html.v2-layout-ready .sidebar-footer span { color: #9db6bc; }

/* Header: controls first, system tape second, actions last. */
html.v2-layout-ready .topbar {
  background: #f8fbfc;
  border-bottom: 1px solid var(--v3-line);
  box-shadow: var(--v3-shadow-soft);
}
html.v2-layout-ready .contract-switcher label,
html.v2-layout-ready .environment-control label,
html.v2-layout-ready .top-status-item > span {
  color: var(--v3-muted);
  font-size: 11px;
  font-weight: 650;
}
html.v2-layout-ready input,
html.v2-layout-ready select,
html.v2-layout-ready textarea {
  border: 1px solid var(--v3-line-strong);
  border-radius: var(--v3-radius-small);
  background: #ffffff;
  color: var(--v3-ink-strong);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
html.v2-layout-ready input:hover,
html.v2-layout-ready select:hover,
html.v2-layout-ready textarea:hover { border-color: #6e929c; }
html.v2-layout-ready input:focus,
html.v2-layout-ready select:focus,
html.v2-layout-ready textarea:focus {
  border-color: var(--v3-teal);
  box-shadow: 0 0 0 3px rgba(7, 139, 117, .14);
}
html.v2-layout-ready .top-status {
  border-color: var(--v3-line);
  background: #edf4f5;
}
html.v2-layout-ready .top-status-item { border-right-color: var(--v3-line); }
html.v2-layout-ready .global-latest-quote {
  background: #e2f1f2;
  box-shadow: inset 3px 0 0 var(--v3-teal);
}
html.v2-layout-ready .global-latest-quote b { color: var(--v3-ink-strong); }
html.v2-layout-ready .global-latest-quote em { font-weight: 750; }
html.v2-layout-ready .top-actions { border-left-color: var(--v3-line); }
html.v2-layout-ready .user-button,
html.v2-layout-ready .icon-button {
  border: 1px solid var(--v3-line-strong);
  border-radius: var(--v3-radius-small);
  background: #ffffff;
  color: var(--v3-ink);
}
html.v2-layout-ready .user-button:hover,
html.v2-layout-ready .icon-button:hover { background: var(--v3-surface-soft); border-color: #6f929c; }
html.v2-layout-ready .user-avatar { background: var(--v3-teal-soft); color: var(--v3-teal); }

html.v2-layout-ready .environment-banner {
  min-height: 36px;
  border-bottom: 1px solid #b7d1d6;
  background: #e7f3f4;
  color: #315f68;
}
html.v2-layout-ready .environment-live,
html.v2-layout-ready .halt-banner {
  border-color: #e3a4ac;
  background: var(--v3-up-soft);
  color: #8e2636;
}

/* Workspace hierarchy and panel surfaces. */
html.v2-layout-ready .view { background: var(--v3-canvas); }
html.v2-layout-ready .page-heading h1 {
  color: var(--v3-ink-strong);
  font-size: var(--v3-ui-title);
  font-weight: 760;
  letter-spacing: -.02em;
}
html.v2-layout-ready .page-heading p,
html.v2-layout-ready .panel-heading p,
html.v2-layout-ready .section-heading p { color: var(--v3-muted); }
html.v2-layout-ready .page-heading::before { background: var(--v3-teal); }
html.v2-layout-ready .panel-heading,
html.v2-layout-ready .section-heading {
  border-bottom: 1px solid var(--v3-line-soft);
  background: #fbfdfd;
}
html.v2-layout-ready .panel-heading h2,
html.v2-layout-ready .section-heading h2 { color: var(--v3-ink-strong); font-weight: 720; }
html.v2-layout-ready .panel-heading > .heading-with-icon > svg,
html.v2-layout-ready .heading-with-icon > svg,
html.v2-layout-ready .section-heading .heading-with-icon > svg { color: var(--v3-teal); }
html.v2-layout-ready .tool-panel,
html.v2-layout-ready .detail-panel,
html.v2-layout-ready .table-section,
html.v2-layout-ready .timeline-panel,
html.v2-layout-ready .log-panel,
html.v2-layout-ready .forward-progress-panel {
  border: 1px solid var(--v3-line);
  border-radius: var(--v3-radius);
  background: var(--v3-surface);
  box-shadow: var(--v3-shadow-soft);
}
html.v2-layout-ready .metric-card {
  border: 1px solid var(--v3-line);
  border-top: 3px solid var(--v3-blue);
  border-radius: var(--v3-radius-small);
  background: var(--v3-surface);
  box-shadow: none;
}
html.v2-layout-ready .metric-card:has(.status-value-good),
html.v2-layout-ready .metric-card:has(.value-positive) { border-top-color: var(--v3-down); }
html.v2-layout-ready .metric-card:has(.status-value-warn),
html.v2-layout-ready .metric-card:has(.value-warning) { border-top-color: var(--v3-copper); }
html.v2-layout-ready .metric-card:has(.status-value-bad),
html.v2-layout-ready .metric-card:has(.value-negative) { border-top-color: var(--v3-up); }
html.v2-layout-ready .metric-card span,
html.v2-layout-ready .metric-card small { color: var(--v3-muted); }
html.v2-layout-ready .metric-card strong { color: var(--v3-ink-strong); font-weight: 750; }

html.v2-layout-ready .market-quote-strip,
html.v2-layout-ready .level-row,
html.v2-layout-ready .fundamental-score-grid,
html.v2-layout-ready .replay-summary,
html.v2-layout-ready .health-strip,
html.v2-layout-ready .ranking-summary-strip {
  border-color: var(--v3-line);
  background: var(--v3-surface-soft);
}
html.v2-layout-ready .market-quote-strip > span,
html.v2-layout-ready .level-row > span,
html.v2-layout-ready .fundamental-score-grid > div,
html.v2-layout-ready .replay-summary > div,
html.v2-layout-ready .health-strip > div,
html.v2-layout-ready .ranking-summary-strip > div { border-color: var(--v3-line); }

/* The current contract is the signature surface: one dark tape, one live price. */
html.v2-layout-ready .overview-market-banner {
  border: 1px solid #2b5b5d;
  border-top: 3px solid var(--v3-teal-bright);
  border-radius: var(--v3-radius);
  background: #17434a;
  color: #ecfbf8;
  box-shadow: 0 10px 22px rgba(10, 55, 58, .14);
}
html.v2-layout-ready .overview-instrument-heading h2,
html.v2-layout-ready .overview-instrument-heading p,
html.v2-layout-ready .overview-instrument-heading .status-badge { color: #effbf9; }
html.v2-layout-ready .overview-instrument-heading p { color: #a8d0ca; }
html.v2-layout-ready .overview-heading-icon { background: #245e5a; color: #8ef0d5; }
html.v2-layout-ready .overview-market-banner .market-quote-strip { background: transparent; border-color: #396b70; }
html.v2-layout-ready .overview-market-banner .market-quote-strip > span { border-color: #396b70; color: #b8d7d4; }
html.v2-layout-ready .overview-market-banner .market-quote-strip strong { color: #f4fffd; }
html.v2-layout-ready .overview-market-banner .overview-primary-quote strong { color: #82f1d5; }
html.v2-layout-ready .overview-market-banner .status-neutral { border-color: #4f8689; background: #285c61; color: #d4efeb; }

html.v2-layout-ready .market-panel { border-top: 2px solid var(--v3-blue); }
html.v2-layout-ready .overview-depth-panel { border-top: 2px solid var(--v3-teal); }
html.v2-layout-ready .trade-plan-panel { border-top: 2px solid var(--v3-copper); }
html.v2-layout-ready .market-subchart,
html.v2-layout-ready .intraday-signal-strip > div,
html.v2-layout-ready .fundamental-summary,
html.v2-layout-ready .detail-note,
html.v2-layout-ready .source-list > div,
html.v2-layout-ready .gate-list > div,
html.v2-layout-ready .strategy-card,
html.v2-layout-ready .switch-row,
html.v2-layout-ready .security-summary,
html.v2-layout-ready .update-row {
  border-color: var(--v3-line);
  border-radius: var(--v3-radius-small);
  background: var(--v3-surface-soft);
}
html.v2-layout-ready .market-subchart { box-shadow: inset 0 2px 0 #d7e7ea; }
html.v2-layout-ready .overview-market-subchart canvas,
html.v2-layout-ready #marketChart { background: #fbfdfd; border-radius: var(--v3-radius-small); }

/* Controls, state language, tables. */
html.v2-layout-ready .primary-button,
html.v2-layout-ready .secondary-button,
html.v2-layout-ready .danger-button,
html.v2-layout-ready .danger-outline-button,
html.v2-layout-ready .text-button,
html.v2-layout-ready .segmented-control,
html.v2-layout-ready .segmented-control button { border-radius: var(--v3-radius-small); }
html.v2-layout-ready .primary-button { border-color: var(--v3-blue); background: var(--v3-blue); box-shadow: 0 4px 10px rgba(9, 110, 153, .15); }
html.v2-layout-ready .primary-button:hover { border-color: #07577a; background: #07577a; }
html.v2-layout-ready .secondary-button { border-color: var(--v3-line-strong); background: #ffffff; color: var(--v3-ink); }
html.v2-layout-ready .secondary-button:hover { border-color: #6f929c; background: var(--v3-surface-soft); }
html.v2-layout-ready .danger-button { border-color: var(--v3-danger); background: var(--v3-danger); }
html.v2-layout-ready .danger-button:hover { border-color: #911b2d; background: #911b2d; }
html.v2-layout-ready .danger-outline-button { border-color: #d98996; color: var(--v3-danger); }
html.v2-layout-ready .danger-outline-button:hover { background: var(--v3-up-soft); }
html.v2-layout-ready .text-button { color: var(--v3-blue); }
html.v2-layout-ready .text-button:hover { background: var(--v3-blue-soft); }
html.v2-layout-ready .segmented-control { border-color: var(--v3-line-strong); background: #ffffff; }
html.v2-layout-ready .segmented-control button { color: var(--v3-muted); border-right-color: var(--v3-line); }
html.v2-layout-ready .segmented-control button:hover { background: var(--v3-surface-soft); color: var(--v3-ink); }
html.v2-layout-ready .segmented-control button.is-selected { background: var(--v3-blue); color: #ffffff; }

html.v2-layout-ready .status-badge.status-good:not(.qualification-state) { border-color: #8fc3b0 !important; background: var(--v3-down-soft) !important; color: #005c46 !important; }
html.v2-layout-ready .status-badge.status-warn:not(.qualification-state) { border-color: #d9b56c !important; background: var(--v3-copper-soft) !important; color: #76500d !important; }
html.v2-layout-ready .status-badge.status-blocked:not(.qualification-state) { border-color: #d9939e !important; background: var(--v3-up-soft) !important; color: #8a1e31 !important; }
html.v2-layout-ready .status-badge.status-neutral:not(.qualification-state) { border-color: #96bdca !important; background: var(--v3-blue-soft) !important; color: #075c80 !important; }
html.v2-layout-ready .value-positive,
html.v2-layout-ready .price-up,
html.v2-layout-ready [data-direction="long"] { color: var(--v3-up) !important; }
html.v2-layout-ready .value-negative,
html.v2-layout-ready .price-down,
html.v2-layout-ready [data-direction="short"] { color: var(--v3-down) !important; }

html.v2-layout-ready table { border-color: var(--v3-line); }
html.v2-layout-ready table th {
  border-color: var(--v3-line);
  background: #eaf2f3;
  color: #46636c;
  font-weight: 720;
}
html.v2-layout-ready table td { border-color: var(--v3-line-soft); color: var(--v3-ink); }
html.v2-layout-ready table tbody tr:hover td { background: #f0f8f8; }
html.v2-layout-ready .progress-track,
html.v2-layout-ready .score-bars i,
html.v2-layout-ready .limit-list i { background: #dce7ea; }
html.v2-layout-ready .progress-track > span,
html.v2-layout-ready .score-bars b { background: var(--v3-teal); }

html.v2-layout-ready dialog {
  border-color: var(--v3-line);
  border-radius: 8px;
  box-shadow: 0 22px 56px rgba(6, 28, 37, .27);
}
html.v2-layout-ready dialog::backdrop { background: rgba(5, 25, 32, .68); }
html.v2-layout-ready .toast { border-color: #37616a; background: var(--v3-sidebar); }
html.v2-layout-ready .alert-drawer { border-left-color: var(--v3-line); background: #ffffff; }

@media (min-width: 1041px) {
  /* Keep search and product selectors visually paired at compact desktop widths. */
  html.v2-layout-ready .contract-switcher {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.2fr);
  }
  html.v2-layout-ready .contract-switcher > label,
  html.v2-layout-ready .contract-switcher .product-search-field,
  html.v2-layout-ready #globalProductSearch,
  html.v2-layout-ready #globalProduct,
  html.v2-layout-ready #globalContract {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
}

@media (max-width: 720px) {
  html.v2-layout-ready .brand { min-height: 64px; }
  html.v2-layout-ready .nav-button { margin-inline: 6px; }
  html.v2-layout-ready .page-heading h1 { font-size: 20px; }
  html.v2-layout-ready .overview-market-banner { border-radius: var(--v3-radius-small); }
  html.v2-layout-ready .tool-panel,
  html.v2-layout-ready .detail-panel,
  html.v2-layout-ready .table-section { border-radius: var(--v3-radius-small); }
}

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


/* Source: v4-terminal-blueprint.css */
/*
 * V4 terminal blueprint
 * Information architecture layer for a Chinese-futures quant workstation.
 * It intentionally changes composition and reading order without touching data bindings.
 */

/* 1. Every view opens as a compact command header, then a clearly bounded work area. */
html.v2-layout-ready .view > .page-heading {
  min-height: 64px;
  margin-top: -14px;
  padding: 9px 16px 10px;
  background: #f7fafb;
  border-bottom: 1px solid var(--v3-line);
  box-shadow: 0 2px 0 rgba(8, 40, 50, .025);
}

html.v2-layout-ready .view > .page-heading + * { margin-top: 12px; }

html.v2-layout-ready .page-heading {
  min-height: 44px;
  gap: 13px;
}

html.v2-layout-ready .page-heading::before {
  min-width: 116px;
  min-height: 42px;
  align-self: center;
  justify-content: center;
  padding: 0 12px;
  border: 0;
  border-radius: 3px;
  background: #0d7569;
  color: #dcf8f1;
  box-shadow: inset 3px 0 0 var(--v3-teal-bright);
  font-size: 11px;
  line-height: 1.25;
  letter-spacing: .04em;
  text-align: center;
}

html.v2-layout-ready .page-heading > :first-child { padding-block: 1px; }
html.v2-layout-ready .page-heading h1 { letter-spacing: -.015em; }
html.v2-layout-ready .page-heading p { max-width: 760px; }
html.v2-layout-ready .page-heading > .segmented-control,
html.v2-layout-ready .page-heading > .view-actions,
html.v2-layout-ready .page-heading > .gateway-state { align-self: center; }

/* 2. Summary metrics read as one tape instead of a set of unrelated cards. */
html.v2-layout-ready .metric-strip,
html.v2-layout-ready .ranking-summary-strip,
html.v2-layout-ready .health-strip,
html.v2-layout-ready .trade-account-strip {
  display: grid;
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--v3-line);
  border-radius: var(--v3-radius);
  background: var(--v3-surface);
  box-shadow: var(--v3-shadow-soft);
}

html.v2-layout-ready .metric-strip > .metric-card,
html.v2-layout-ready .ranking-summary-strip > div,
html.v2-layout-ready .health-strip > div,
html.v2-layout-ready .trade-account-strip > div {
  min-width: 0;
  min-height: 74px;
  border: 0;
  border-right: 1px solid var(--v3-line-soft);
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 3px 0 var(--v3-blue);
}

html.v2-layout-ready .metric-strip > :last-child,
html.v2-layout-ready .ranking-summary-strip > :last-child,
html.v2-layout-ready .health-strip > :last-child,
html.v2-layout-ready .trade-account-strip > :last-child { border-right: 0; }

html.v2-layout-ready .metric-strip > .metric-card:has(.status-value-good),
html.v2-layout-ready .metric-strip > .metric-card:has(.value-positive),
html.v2-layout-ready .trade-account-strip > div:has(.value-positive) { box-shadow: inset 0 3px 0 var(--v3-down); }
html.v2-layout-ready .metric-strip > .metric-card:has(.status-value-warn),
html.v2-layout-ready .metric-strip > .metric-card:has(.value-warning) { box-shadow: inset 0 3px 0 var(--v3-copper); }
html.v2-layout-ready .metric-strip > .metric-card:has(.status-value-bad),
html.v2-layout-ready .metric-strip > .metric-card:has(.value-negative),
html.v2-layout-ready .trade-account-strip > div:has(.value-negative) { box-shadow: inset 0 3px 0 var(--v3-up); }

/* 3. The market banner is the signature instrument tape: identity left, live values right. */
@media (min-width: 721px) {
  html.v2-layout-ready #overview .overview-market-banner {
    display: grid;
    grid-template-columns: minmax(280px, .42fr) minmax(0, 1.58fr);
    align-items: stretch;
    min-height: 86px;
    margin-bottom: 13px;
  }

  html.v2-layout-ready #overview .overview-instrument-heading {
    min-height: 86px;
    padding: 12px 14px;
    border-right: 1px solid #3a7473;
    border-bottom: 0;
  }

  html.v2-layout-ready #overview .overview-instrument-heading h2,
  html.v2-layout-ready #overview .overview-instrument-heading p {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  html.v2-layout-ready #overview .overview-instrument-heading .status-badge {
    min-width: 0;
    max-width: 100%;
    justify-self: end;
  }

  html.v2-layout-ready #overview .overview-quote-grid {
    min-width: 0;
    align-self: stretch;
  }

  html.v2-layout-ready #overview .overview-quote-grid > span {
    min-height: 86px;
    padding: 9px 10px;
  }

  html.v2-layout-ready #overview .overview-primary-quote strong { font-size: 26px; }
}

html.v2-layout-ready #overview .overview-market-banner + .dashboard-grid {
  margin-top: 0;
}

/* 4. The overview is a decision desk: chart workspace on the left, execution rail on the right. */
@media (min-width: 1101px) {
  html.v2-layout-ready #overview .dashboard-grid {
    grid-template-columns: minmax(0, 1.72fr) minmax(360px, .78fr);
    gap: 14px;
  }
}

html.v2-layout-ready #overview .market-panel,
html.v2-layout-ready #overview .overview-depth-panel,
html.v2-layout-ready #overview .trade-plan-panel,
html.v2-layout-ready #overview .fundamental-report-panel {
  box-shadow: var(--v3-shadow);
}

html.v2-layout-ready #overview .market-panel > .panel-heading,
html.v2-layout-ready #overview .overview-depth-panel > .panel-heading,
html.v2-layout-ready #overview .trade-plan-panel > .panel-heading {
  min-height: 52px;
  padding: 10px 11px 9px;
  margin: -1px -1px 9px;
  background: #f7fbfb;
}

html.v2-layout-ready #overview .market-panel > .panel-heading { border-top: 2px solid var(--v3-blue); }
html.v2-layout-ready #overview .overview-depth-panel > .panel-heading { border-top: 2px solid var(--v3-teal); }
html.v2-layout-ready #overview .trade-plan-panel > .panel-heading { border-top: 2px solid var(--v3-copper); }

html.v2-layout-ready #overview .overview-timeframe-matrix {
  margin-top: 11px;
  border: 1px solid var(--v3-line);
  border-radius: var(--v3-radius-small);
  background: #f7fafb;
  overflow: hidden;
}

html.v2-layout-ready #overview .overview-timeframe-heading {
  min-height: 36px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--v3-line-soft);
}

html.v2-layout-ready #overview .overview-timeframe-grid {
  gap: 0;
}

html.v2-layout-ready #overview .overview-timeframe-grid > article {
  min-height: 62px;
  padding: 8px 10px;
  border: 0;
  border-right: 1px solid var(--v3-line-soft);
  border-radius: 0;
  background: transparent;
}

html.v2-layout-ready #overview .overview-timeframe-grid > article:last-child { border-right: 0; }

/* 5. Evidence wall: sections have clear roles, not a stack of indistinguishable cards. */
html.v2-layout-ready #overview .fundamental-report-panel,
html.v2-layout-ready #overview .exact-contract-curve-section,
html.v2-layout-ready #overview .overview-opportunity-section {
  box-shadow: var(--v3-shadow-soft);
}

html.v2-layout-ready #overview .fundamental-report-panel > .panel-heading {
  min-height: 50px;
  padding: 10px 12px;
  background: #f5faf9;
}

html.v2-layout-ready #overview .fundamental-intelligence-grid {
  gap: 10px;
  padding: 10px;
}

html.v2-layout-ready #overview .overview-event-list { gap: 1px; }
html.v2-layout-ready #overview .fundamental-driver-list { gap: 7px; }

html.v2-layout-ready #overview .overview-event-column,
html.v2-layout-ready #overview .fundamental-core-column,
html.v2-layout-ready #overview .fundamental-driver-column {
  min-width: 0;
  background: #fbfdfd;
}

html.v2-layout-ready .table-section > .section-heading {
  min-height: 46px;
  padding: 10px 12px 8px;
  background: #f7fafb;
}

html.v2-layout-ready .table-section > .section-heading::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--v3-blue);
}

html.v2-layout-ready .table-section > .section-heading { position: relative; }

/* Decision view: make the final disposition visually dominant, evidence quieter. */
html.v2-layout-ready #decision .decision-final-layer,
html.v2-layout-ready #decision .decision-judgment-block {
  border-top: 3px solid var(--v3-teal);
  box-shadow: var(--v3-shadow);
}

html.v2-layout-ready #decision .decision-execution-layer,
html.v2-layout-ready #decision .execution-plan {
  border-top-color: var(--v3-copper);
}

html.v2-layout-ready #decision .decision-evidence-layer,
html.v2-layout-ready #decision .analysis-event-section {
  border-top: 2px solid var(--v3-blue);
}

html.v2-layout-ready #decision .direction-main,
html.v2-layout-ready #decision .final-disposition,
html.v2-layout-ready #decision .decision-disposition {
  background: #f5faf9;
}

/* Execution pages share the same hierarchy as research pages. */
html.v2-layout-ready #orders .order-ticket,
html.v2-layout-ready #automation .arbitrage-auto-workbench,
html.v2-layout-ready #arbitrage .arbitrage-auto-workbench,
html.v2-layout-ready #positions .position-management-panel {
  border-top: 3px solid var(--v3-blue);
  box-shadow: var(--v3-shadow);
}

html.v2-layout-ready #automation .reconciliation-panel,
html.v2-layout-ready #operations .reconciliation-panel,
html.v2-layout-ready #operations .recovery-control-panel {
  border-top: 2px solid var(--v3-teal);
}

html.v2-layout-ready #arbitrage .arbitrage-auto-workbench,
html.v2-layout-ready #arbitrage .arbitrage-capability-section { border-top-color: var(--v3-copper); }

/* Governance and model pages read as operational control rooms, not forms. */
html.v2-layout-ready #models .model-layout,
html.v2-layout-ready #operations .operations-layout,
html.v2-layout-ready #governance .governance-layout,
html.v2-layout-ready #validation .validation-layout {
  align-items: start;
  gap: 14px;
}

html.v2-layout-ready #models .model-layout > .table-section,
html.v2-layout-ready #operations .operations-layout > .table-section,
html.v2-layout-ready #validation .validation-layout > .table-section {
  box-shadow: var(--v3-shadow-soft);
}

html.v2-layout-ready #models .model-layout > .detail-panel,
html.v2-layout-ready #operations .operations-layout > .detail-panel,
html.v2-layout-ready #validation .validation-layout > .detail-panel {
  border-top: 3px solid var(--v3-teal);
}

html.v2-layout-ready #models .model-layout {
  align-items: stretch;
  gap: 0;
}

html.v2-layout-ready #models .model-layout > .detail-panel {
  height: 100%;
  align-self: stretch;
}

/* Dense data surfaces: stable column rhythm and no decorative card nesting. */
html.v2-layout-ready .table-scroll { scrollbar-gutter: stable; }
html.v2-layout-ready table thead th { letter-spacing: .015em; }
html.v2-layout-ready table tbody tr:nth-child(even) td { background: #fbfdfd; }
html.v2-layout-ready table tbody tr:hover td { background: #eef8f6; }

@media (max-width: 1100px) and (min-width: 721px) {
  html.v2-layout-ready #overview .overview-market-banner {
    grid-template-columns: minmax(252px, .46fr) minmax(0, 1.54fr);
  }
  html.v2-layout-ready #overview .overview-quote-grid > span { min-height: 78px; }
  html.v2-layout-ready #overview .overview-primary-quote strong { font-size: 23px; }
}

@media (max-width: 720px) {
  html.v2-layout-ready .view > .page-heading {
    min-height: 58px;
    padding: 8px 12px;
  }

  html.v2-layout-ready .page-heading { gap: 9px; }
  html.v2-layout-ready .page-heading::before {
    min-width: 86px;
    min-height: 36px;
    padding-inline: 7px;
    font-size: 11px;
  }

  html.v2-layout-ready #overview .overview-market-banner {
    display: block;
    margin-bottom: 10px;
  }

  html.v2-layout-ready #overview .overview-instrument-heading {
    min-height: 74px;
    padding: 10px 11px;
  }

  html.v2-layout-ready #overview .overview-instrument-heading h2,
  html.v2-layout-ready #overview .overview-instrument-heading p {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }

  html.v2-layout-ready #overview .overview-quote-grid > span { min-height: 56px; }
  html.v2-layout-ready #overview .overview-timeframe-grid { gap: 0; }
  html.v2-layout-ready #overview .overview-timeframe-grid > article { min-height: 58px; }

  html.v2-layout-ready .metric-strip,
  html.v2-layout-ready .ranking-summary-strip,
  html.v2-layout-ready .health-strip,
  html.v2-layout-ready .trade-account-strip {
    gap: 8px;
    border: 0;
    overflow: visible;
    background: transparent;
    box-shadow: none;
  }

  html.v2-layout-ready .metric-strip > .metric-card,
  html.v2-layout-ready .ranking-summary-strip > div,
  html.v2-layout-ready .health-strip > div,
  html.v2-layout-ready .trade-account-strip > div {
    min-height: 68px;
    border: 1px solid var(--v3-line);
    border-radius: var(--v3-radius-small);
    background: var(--v3-surface);
    box-shadow: inset 3px 0 0 var(--v3-blue);
  }
}

/* Quant control plane: keep the overview entry compact and the full control
   surface aligned with operations ownership. */
html.v2-layout-ready .quant-system-summary {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 12px 0;
  padding: 8px 12px;
  border: 1px solid var(--v3-line-strong);
  border-left: 3px solid var(--v3-teal);
  border-radius: var(--v3-radius);
  background: var(--v3-surface);
  box-shadow: 0 4px 14px rgba(13, 37, 46, .05);
}

html.v2-layout-ready .quant-system-summary-copy,
html.v2-layout-ready .quant-system-summary-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}

html.v2-layout-ready .quant-system-summary-mark {
  width: 30px;
  height: 30px;
  display: grid;
  flex: 0 0 30px;
  place-items: center;
  border-radius: var(--v3-radius-small);
  background: #edf6f4;
  color: var(--v3-teal);
}

html.v2-layout-ready .quant-system-summary-mark svg { width: 16px; height: 16px; }
html.v2-layout-ready .quant-system-summary-copy > div {
  min-width: 0;
  display: grid;
  gap: 2px;
}
html.v2-layout-ready .quant-system-summary-copy strong {
  color: var(--v3-ink-strong);
  font-size: 13px;
  line-height: 1.25;
}
html.v2-layout-ready .quant-system-summary-copy span {
  overflow: hidden;
  color: var(--v3-muted);
  font-size: 11px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html.v2-layout-ready .quant-system-summary-actions .text-button {
  min-height: 30px;
  padding-inline: 8px;
}

html.v2-layout-ready .quant-system-strip {
  margin: 12px 0;
  overflow: hidden;
  border: 1px solid var(--v3-line-strong);
  border-top: 3px solid var(--v3-teal);
  border-radius: var(--v3-radius);
  background: var(--v3-surface);
  box-shadow: 0 7px 20px rgba(13, 37, 46, .08);
}

html.v2-layout-ready .quant-system-heading {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--v3-line);
  background: #f5f9fa;
}

html.v2-layout-ready .quant-system-identity,
html.v2-layout-ready .quant-system-badges {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}

html.v2-layout-ready .quant-system-mark {
  width: 34px;
  height: 34px;
  display: grid;
  flex: 0 0 34px;
  place-items: center;
  border-radius: var(--v3-radius-small);
  background: var(--v3-sidebar);
  color: #84ead4;
}

html.v2-layout-ready .quant-system-mark svg { width: 18px; height: 18px; }
html.v2-layout-ready .quant-system-kicker {
  display: block;
  color: var(--v3-copper);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.1;
  letter-spacing: 0;
}
html.v2-layout-ready .quant-system-heading h2 {
  margin: 1px 0 0;
  color: var(--v3-ink-strong);
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0;
}
html.v2-layout-ready .quant-system-heading p {
  margin: 1px 0 0;
  color: var(--v3-muted);
  font-size: 11px;
  line-height: 1.25;
}

html.v2-layout-ready .quant-pipeline-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  padding: 9px 10px;
  background: #edf3f4;
}

html.v2-layout-ready .quant-pipeline-node {
  position: relative;
  min-width: 0;
  min-height: 78px;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  grid-template-rows: 22px minmax(0, 1fr);
  gap: 2px 7px;
  align-items: start;
  padding: 8px 9px;
  border: 1px solid var(--v3-line);
  border-radius: var(--v3-radius-small);
  background: #ffffff;
  color: var(--v3-ink);
  text-align: left;
  box-shadow: inset 0 3px 0 var(--v3-copper);
}

html.v2-layout-ready .quant-pipeline-node:hover { border-color: #88aab2; background: #f9fcfc; }
html.v2-layout-ready .quant-pipeline-node:focus-visible { outline: 2px solid var(--v3-blue); outline-offset: 2px; }
html.v2-layout-ready .quant-pipeline-node > svg {
  width: 18px;
  height: 18px;
  grid-column: 1;
  grid-row: 2;
  align-self: center;
  color: var(--v3-copper);
}
html.v2-layout-ready .quant-pipeline-node.is-ready { box-shadow: inset 0 3px 0 var(--v3-teal); }
html.v2-layout-ready .quant-pipeline-node.is-ready > svg { color: var(--v3-teal); }
html.v2-layout-ready .quant-pipeline-node.is-blocked { box-shadow: inset 0 3px 0 var(--v3-up); }
html.v2-layout-ready .quant-pipeline-node.is-blocked > svg { color: var(--v3-up); }
html.v2-layout-ready .quant-pipeline-node.is-unavailable { box-shadow: inset 0 3px 0 #879aa1; }
html.v2-layout-ready .quant-pipeline-node.is-unavailable > svg { color: #71868d; }

html.v2-layout-ready .quant-step-index {
  grid-column: 1;
  grid-row: 1;
  color: #81949b;
  font: 700 10px/1.2 Consolas, "SFMono-Regular", monospace;
  font-variant-numeric: tabular-nums;
}
html.v2-layout-ready .quant-step-copy {
  min-width: 0;
  display: grid;
  grid-column: 2;
  grid-row: 1 / span 2;
  align-content: start;
  gap: 2px;
}
html.v2-layout-ready .quant-step-copy > span {
  color: var(--v3-muted);
  font-size: 11px;
  line-height: 1.2;
}
html.v2-layout-ready .quant-step-copy strong {
  overflow-wrap: anywhere;
  color: var(--v3-ink-strong);
  font-size: 14px;
  line-height: 1.22;
  font-variant-numeric: tabular-nums;
}
html.v2-layout-ready .quant-step-copy small {
  overflow-wrap: anywhere;
  color: var(--v3-muted);
  font-size: 11px;
  line-height: 1.25;
}

html.v2-layout-ready .quant-platform-tape {
  min-height: 38px;
  display: grid;
  grid-template-columns: repeat(6, minmax(90px, 1fr)) auto;
  align-items: stretch;
  border-top: 1px solid var(--v3-line);
  background: #ffffff;
}
html.v2-layout-ready .quant-platform-tape > span {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 7px 10px;
  border-right: 1px solid var(--v3-line);
  color: var(--v3-muted);
  font-size: 11px;
}
html.v2-layout-ready .quant-platform-tape strong {
  color: var(--v3-ink-strong);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
html.v2-layout-ready .quant-platform-tape .text-button {
  min-width: 104px;
  min-height: 38px;
  justify-content: center;
  border-radius: 0;
}

@media (min-width: 1181px) and (max-width: 1360px) {
  html.v2-layout-ready .quant-pipeline-grid { gap: 6px; padding-inline: 8px; }
  html.v2-layout-ready .quant-pipeline-node { padding-inline: 7px; }
}

@media (max-width: 1180px) {
  html.v2-layout-ready .quant-pipeline-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html.v2-layout-ready .quant-platform-tape { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html.v2-layout-ready .quant-platform-tape .text-button { grid-column: 1 / -1; border-top: 1px solid var(--v3-line); }
}

@media (max-width: 720px) {
  html.v2-layout-ready .quant-system-summary {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    margin-block: 9px;
  }
  html.v2-layout-ready .quant-system-summary-actions { width: 100%; justify-content: space-between; }
  html.v2-layout-ready .quant-system-summary-copy span { white-space: normal; }
  html.v2-layout-ready .quant-system-strip { margin-block: 9px; }
  html.v2-layout-ready .quant-system-heading { align-items: flex-start; flex-direction: column; }
  html.v2-layout-ready .quant-system-badges { width: 100%; flex-wrap: wrap; }
  html.v2-layout-ready .quant-pipeline-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; padding: 8px; }
  html.v2-layout-ready .quant-pipeline-node { min-height: 86px; }
  html.v2-layout-ready .quant-platform-tape { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 479px) {
  html.v2-layout-ready .quant-pipeline-grid { grid-template-columns: minmax(0, 1fr); }
  html.v2-layout-ready .quant-pipeline-node { min-height: 72px; }
}


/* Source: v5-operations-closure.css */
:root {
  --v5-control-height: 38px;
  --v5-dense-gap: 8px;
  --v5-section-gap: 12px;
}

/* Keep the closure verdict visible above the detailed integration table. The
   blockers stay readable at narrow widths and never force the table itself to
   overflow horizontally. */
html.v2-layout-ready .system-closure-summary {
  display: grid;
  grid-template-columns: minmax(150px, 0.8fr) minmax(120px, 0.6fr) minmax(260px, 1.6fr);
  gap: 1px;
  margin: 0 0 10px;
  border: 1px solid var(--line);
  background: var(--line);
}

html.v2-layout-ready .system-closure-summary > div {
  min-width: 0;
  padding: 9px 11px;
  background: var(--surface-soft);
}

html.v2-layout-ready .system-closure-summary span {
  display: block;
  color: var(--muted);
  font-size: var(--font-meta);
}

html.v2-layout-ready .system-closure-summary strong {
  display: block;
  margin-top: 3px;
  color: var(--ink);
  font-size: var(--font-body);
  font-weight: 650;
  overflow-wrap: anywhere;
}

html.v2-layout-ready .system-closure-summary .system-closure-blockers strong {
  color: var(--red);
  font-size: var(--font-meta);
  line-height: 1.4;
}

@media (max-width: 720px) {
  html.v2-layout-ready .system-closure-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html.v2-layout-ready .system-closure-summary .system-closure-blockers {
    grid-column: 1 / -1;
  }
}

/* Quote tape closure: keep the identity readable and never crop the live
   price when the terminal is narrowed or displayed at a non-default zoom. */
html.v2-layout-ready #overview .overview-market-banner,
html.v2-layout-ready #overview .overview-instrument-heading,
html.v2-layout-ready #overview .overview-quote-grid {
  min-width: 0;
}

/* The quote tape is dark by design. Reassert its state badge palette after
   the global status rules so live-state text never disappears into a pale
   fill, especially when the label expands to include depth quality. */
html.v2-layout-ready #overview .overview-instrument-heading .status-badge:not(.qualification-state) {
  min-width: 178px;
  min-height: 24px;
  padding-inline: 8px;
  justify-content: flex-start;
  border-radius: 3px;
  font-weight: 650;
  line-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.v2-layout-ready #overview .overview-instrument-heading .status-badge.status-good:not(.qualification-state) {
  border-color: #73d8bd !important;
  background: #245e5a !important;
  color: #e6fff8 !important;
}

html.v2-layout-ready #overview .overview-instrument-heading .status-badge.status-warn:not(.qualification-state) {
  border-color: #d9b56c !important;
  background: #5d4c2a !important;
  color: #fff3c2 !important;
}

html.v2-layout-ready #overview .overview-instrument-heading .status-badge.status-blocked:not(.qualification-state) {
  border-color: #e296a2 !important;
  background: #6d3340 !important;
  color: #ffe9ec !important;
}

html.v2-layout-ready #overview .overview-instrument-heading .status-badge.status-neutral:not(.qualification-state) {
  border-color: #a8d0ca !important;
  background: #a8d0ca !important;
  color: #17383f !important;
}

/* Keep the market-tape icon distinct from the dark instrument surface. A
   lighter, muted teal reads more clearly than another near-black teal while
   staying subordinate to the contract name and quote. */
html.v2-layout-ready #overview .overview-heading-icon {
  background: #3f766e;
  color: #d0fff1;
  box-shadow: inset 0 0 0 1px rgba(208, 255, 241, 0.2);
}

html.v2-layout-ready #overview #marketQuoteState.status-neutral::before {
  content: "\2014";
  background: #e9eef0;
  color: #5c6d75;
}

@media (min-width: 721px) {
  html.v2-layout-ready #overview .overview-instrument-heading {
    grid-template-columns: 38px minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    column-gap: 10px;
    row-gap: 2px;
    align-content: center;
  }

  html.v2-layout-ready #overview .overview-heading-icon {
    grid-row: 1 / span 3;
    align-self: center;
  }

  html.v2-layout-ready #overview .overview-instrument-heading > div {
    min-width: 0;
    grid-column: 2;
  }

  html.v2-layout-ready #overview .overview-instrument-heading h2,
  html.v2-layout-ready #overview .overview-instrument-heading p {
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

html.v2-layout-ready #overview .overview-instrument-heading .status-badge {
    grid-column: 2;
    grid-row: 3;
    justify-self: start;
    width: max-content;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  html.v2-layout-ready #overview .overview-quote-grid > span {
    min-width: 0;
    overflow: visible;
  }

  html.v2-layout-ready #overview .overview-quote-grid strong {
    min-width: 0;
    display: block;
    overflow: visible;
    white-space: nowrap;
    text-overflow: clip;
    font-variant-numeric: tabular-nums;
  }

  html.v2-layout-ready #overview .overview-primary-quote strong {
    width: max-content;
    max-width: 100%;
  }
}

/* Unified two-column closure: the simulation row is content-led. The equity
   canvas has an explicit analytical height, so its intrinsic 300:270 bitmap
   ratio cannot inflate both cards into a mostly empty viewport-height band. */
@media (min-width: 721px) {
  html.v2-layout-ready #simulation .simulation-layout {
    align-items: stretch;
    grid-auto-rows: auto;
  }

  html.v2-layout-ready #simulation .simulation-layout > .tool-panel {
    min-height: 0;
    height: auto;
    align-self: stretch;
  }

  html.v2-layout-ready #simulation .simulation-equity-panel {
    display: flex;
    flex-direction: column;
  }

  html.v2-layout-ready #simulation #paperEquityChart {
    width: 100%;
    height: 280px;
    min-height: 280px;
    max-height: 280px;
    flex: 0 0 280px;
  }
}

@media (max-width: 720px) {
  html.v2-layout-ready #simulation #paperEquityChart {
    width: 100%;
    height: 240px;
    min-height: 240px;
    max-height: 240px;
  }
}

/* The two horizontal automation scrollers use identical edge geometry even
   when their tables have different intrinsic widths. */
html.v2-layout-ready #automation .automation-execution-grid > .table-section > .table-scroll,
html.v2-layout-ready #automation .v2-automation-detail > .table-section > .table-scroll {
  width: 100%;
  margin-inline: 0;
  padding-inline: 0;
}

@media (min-width: 1201px) {
  html.v2-layout-ready #automation .v2-automation-detail > .table-section {
    min-height: 420px;
    height: clamp(420px, calc(100vh - 402px), 498px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  html.v2-layout-ready #automation .v2-automation-detail > .table-section > .table-scroll {
    min-height: 0;
    height: 0;
    flex: 1 1 0;
    overflow: auto;
  }

  html.v2-layout-ready #automation .v2-automation-detail table:has(.empty-state),
  html.v2-layout-ready #automation .v2-automation-detail table:has(.empty-state) tbody,
  html.v2-layout-ready #automation .v2-automation-detail table:has(.empty-state) tbody tr {
    height: 100%;
  }

  html.v2-layout-ready #automation .v2-automation-detail .empty-state {
    vertical-align: middle;
  }
}

/* Keep the operations pair content-sized on desktop. The previous viewport
   height contract left a large empty tail under short task/reconciliation
   content; the grid still stretches both panels to one shared bottom edge. */
@media (min-width: 1181px) {
  html.v2-layout-ready #operations .operations-layout {
    height: auto;
    min-height: 400px;
    max-height: none;
    align-items: stretch;
  }

  html.v2-layout-ready #operations .operations-layout > .table-section,
  html.v2-layout-ready #operations .operations-layout > .reconciliation-panel {
    height: auto;
    min-height: 0;
    align-self: stretch;
  }

  html.v2-layout-ready #operations .operations-layout > .table-section > .table-scroll,
  html.v2-layout-ready #operations .operations-layout > .reconciliation-panel {
    overflow-y: hidden;
  }
}

/* Task-state labels can contain a recovery explanation as well as the
   current state.  The fourth column is intentionally narrow, so allow the
   badge to wrap inside its cell instead of clipping the final characters at
   desktop widths around 1366px. */
html.v2-layout-ready #operations .operations-layout > .table-section
  table tbody td:nth-child(4) .status-badge {
  max-width: 100%;
  height: auto;
  min-height: 18px;
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
}

/* Use the shared type scale and a clearer three-column hierarchy for the
   spread score summary. The first two metrics retain vertical labels while
   the rationale receives a readable, bounded text area. */
@media (min-width: 721px) {
  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary {
    grid-template-columns: minmax(92px, 0.9fr) minmax(104px, 1fr) minmax(0, 2.8fr);
    min-height: 78px;
  }

  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div,
  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div:last-child {
    min-height: 78px;
    padding: 8px 10px;
    gap: 3px 8px;
  }

  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div:nth-child(-n+2) > strong {
    font-size: 18px;
    line-height: 1.25;
  }

  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div:nth-child(-n+2) > small {
    line-height: 1.25;
    white-space: nowrap;
  }

  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div:last-child {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: center;
  }

  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div:last-child > span {
    grid-column: 1;
    grid-row: 1;
    line-height: 1.3;
  }

  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div:last-child > strong {
    grid-column: 2;
    grid-row: 1;
    font-size: var(--font-body);
    line-height: 1.3;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div:last-child > small {
    grid-column: 1 / -1;
    grid-row: 2;
    line-height: 1.3;
  }
}

/* Event execution cells now use the same 13/14/12px hierarchy and explicit
   rhythm as the other execution strips. */
@media (min-width: 721px) {
  html.v2-layout-ready #events > .event-execution-policy > div {
    gap: 2px;
    padding: 8px 10px;
  }

  html.v2-layout-ready #events > .event-execution-policy > div > span {
    font-size: var(--font-meta);
    line-height: 1.3;
  }

  html.v2-layout-ready #events > .event-execution-policy > div > strong {
    font-size: var(--font-control);
    line-height: 1.3;
    font-weight: 650;
  }

  html.v2-layout-ready #events > .event-execution-policy > div > small {
    font-size: var(--font-assist);
    line-height: 1.3;
  }
}

/* Keep exit evidence immediately below the emergency action. The detail
   column may still share the ledger height, but content is never pushed to a
   hidden bottom edge by an automatic spacer. */
@media (min-width: 1181px) {
  html.v2-layout-ready #positions .position-exit-card > .detail-note {
    margin-top: 10px;
  }

  html.v2-layout-ready #positions #positionDetail > .position-exit-card {
    align-content: start;
  }
}

/* Operational and governance pairs always share the same row baseline. */
@media (min-width: 1181px) {
  html.v2-layout-ready #operations > .v2-detail-grid,
  html.v2-layout-ready #governance .governance-layout {
    align-items: stretch;
  }

  html.v2-layout-ready #operations > .v2-detail-grid > .log-panel,
  html.v2-layout-ready #operations > .v2-detail-grid > .recovery-control-panel,
  html.v2-layout-ready #governance .governance-layout > .tool-panel {
    height: auto;
    align-self: stretch;
  }
}

/* At compact desktop widths, use two five-column rows instead of forcing ten
   fixed cells into a strip that would hide the latest price. */
@media (min-width: 721px) and (max-width: 1100px) {
  html.v2-layout-ready #overview .overview-market-banner {
    display: block;
  }

  html.v2-layout-ready #overview .overview-instrument-heading {
    min-height: 92px;
    border-right: 0;
    border-bottom: 1px solid #3a7473;
  }

  html.v2-layout-ready #overview .overview-quote-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  html.v2-layout-ready #overview .overview-quote-grid > span {
    min-height: 74px;
  }
}

@media (max-width: 720px) {
  html.v2-layout-ready #overview .overview-instrument-heading {
    grid-template-columns: 34px minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    row-gap: 2px;
  }

  html.v2-layout-ready #overview .overview-heading-icon {
    grid-row: 1 / span 3;
  }

  html.v2-layout-ready #overview .overview-instrument-heading .status-badge {
    grid-column: 2;
    grid-row: 3;
    justify-self: start;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  html.v2-layout-ready #overview .overview-quote-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
  }

  html.v2-layout-ready #overview .overview-quote-grid > span,
  html.v2-layout-ready #overview .overview-quote-grid strong {
    min-width: 0;
    overflow: visible;
    white-space: nowrap;
    text-overflow: clip;
  }
}

/* Validation replay cost/gate row: the empty-state chart is a bounded
   analytical viewport. Without an explicit CSS height, the canvas keeps its
   300:230 intrinsic bitmap ratio after being stretched to the panel width,
   creating a large blank band and stretching the adjacent gate card. */
@media (min-width: 721px) {
  html.v2-layout-ready #validation .cost-layout {
    align-items: stretch;
  }

  html.v2-layout-ready #validation .cost-layout > .tool-panel {
    min-height: 0;
    height: auto;
    align-self: stretch;
  }

  html.v2-layout-ready #validation #costChart {
    width: 100%;
    height: 300px;
    min-height: 300px;
    max-height: 300px;
    aspect-ratio: auto;
  }
}

@media (max-width: 720px) {
  html.v2-layout-ready #validation #costChart {
    width: 100%;
    height: 220px;
    min-height: 220px;
    max-height: 220px;
    aspect-ratio: auto;
  }
}

/* Responsive closure for evidence-heavy pages. The production grids use
   desktop minimums that must yield before the compact navigation breakpoint. */
@media (min-width: 721px) and (max-width: 1040px) {
  html.v2-layout-ready #events .event-layout,
  html.v2-layout-ready #models .model-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html.v2-layout-ready #events .event-risk-panel,
  html.v2-layout-ready #models .model-layout > .detail-panel {
    order: -1;
  }

  html.v2-layout-ready #events .timeline-panel,
  html.v2-layout-ready #models .model-layout > .table-section,
  html.v2-layout-ready #models .model-layout > .detail-panel {
    width: 100%;
    max-width: 100%;
  }
}

@media (min-width: 1041px) and (max-width: 1360px) {
  html.v2-layout-ready #events .event-layout,
  html.v2-layout-ready #models .model-layout {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.45fr) !important;
  }
}

@media (min-width: 1361px) {
  html.v2-layout-ready #overview .dashboard-grid,
  html.v2-layout-ready #overview .market-panel {
    height: 1270px;
    min-height: 1270px;
    max-height: 1270px;
  }

  html.v2-layout-ready #overview .dashboard-grid {
    grid-template-rows: 1270px;
  }

  html.v2-layout-ready #overview .overview-timeframe-matrix {
    height: 207px;
    min-height: 207px;
    max-height: 207px;
  }

  html.v2-layout-ready #overview .overview-timeframe-grid,
  html.v2-layout-ready #overview .overview-timeframe-grid > article {
    height: 140px;
    min-height: 140px;
    max-height: 140px;
  }

  html.v2-layout-ready #overview .dashboard-side-column {
    height: 1270px !important;
    min-height: 1270px;
    max-height: 1270px;
    grid-template-rows: 876px 382px;
  }

  html.v2-layout-ready #overview .trade-plan-panel {
    height: 382px;
    min-height: 382px;
    max-height: 382px;
    flex: 0 0 382px !important;
  }

  html.v2-layout-ready #overview .overview-depth-panel {
    height: 876px;
    min-height: 876px;
    max-height: 876px;
  }
}

@media (min-width: 721px) {
  html.v2-layout-ready #events > .event-execution-policy {
    height: auto;
    min-height: 41px;
    max-height: none;
    margin-block: 4px;
    overflow: visible;
  }

  html.v2-layout-ready #events > .event-execution-policy > div {
    min-height: 41px;
    display: grid;
    grid-template-rows: auto auto;
    align-content: center;
    justify-content: stretch;
    gap: 1px;
    padding: 3px 8px;
  }

  html.v2-layout-ready #events > .event-execution-policy > div > span,
  html.v2-layout-ready #events > .event-execution-policy > div > strong {
    line-height: 1.25;
  }
}

html.v2-layout-ready .view,
html.v2-layout-ready .view > *,
html.v2-layout-ready .settings-content,
html.v2-layout-ready .settings-section {
  min-width: 0;
}

html.v2-layout-ready .view > .page-heading {
  min-height: 52px;
  align-items: center;
}

.remediation-center {
  min-width: 0;
}

.remediation-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--v3-line, #cbd9de);
  border-left: 1px solid var(--v3-line, #cbd9de);
}

.remediation-action {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--v5-dense-gap);
  min-height: 74px;
  padding: 10px;
  border-right: 1px solid var(--v3-line, #cbd9de);
  border-bottom: 1px solid var(--v3-line, #cbd9de);
  background: var(--v3-surface, #fff);
}

.remediation-action > i {
  width: 20px;
  height: 20px;
  color: var(--v3-blue, #096e99);
  justify-self: center;
}

.remediation-action-copy {
  min-width: 0;
}

.remediation-action-copy strong,
.subscription-plan-copy strong {
  display: block;
  color: var(--v3-ink-strong, #08212b);
  font-size: 14px;
  line-height: 1.35;
}

.remediation-action-copy span,
.subscription-plan-copy span {
  display: block;
  margin-top: 3px;
  color: var(--v3-muted, #5f747d);
  font-size: 12px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.remediation-action button {
  min-height: 34px;
  white-space: nowrap;
}

.remediation-queue-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  padding: 8px 2px;
  color: var(--v3-muted, #5f747d);
  font-size: 12px;
}

.remediation-queue-heading strong {
  color: var(--v3-ink, #102b35);
  font-size: 14px;
}

.remediation-job-scroll,
.billing-order-scroll {
  max-height: 270px;
}

.remediation-result-detail {
  display: block;
  max-width: 360px;
  color: var(--v3-muted, #5f747d);
  font-size: 12px;
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: anywhere;
}

.data-gap-command {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 190px;
}

.data-gap-command > span {
  min-width: 0;
  line-height: 1.4;
}

.data-gap-command button {
  flex: 0 0 auto;
  min-height: 32px;
}

.billing-account-band {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--v3-line, #cbd9de);
  background: #f4f8f9;
}

.billing-account-band > span {
  min-width: 0;
  padding: 10px 12px;
  color: var(--v3-muted, #5f747d);
  font-size: 12px;
  border-right: 1px solid var(--v3-line, #cbd9de);
}

.billing-account-band > span:last-child {
  border-right: 0;
}

.billing-account-band strong {
  display: block;
  margin-top: 3px;
  color: var(--v3-ink-strong, #08212b);
  font-size: 14px;
  overflow-wrap: anywhere;
}

.subscription-plan-list {
  margin-top: 12px;
  border-top: 1px solid var(--v3-line, #cbd9de);
}

.subscription-plan-row {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(130px, .6fr) minmax(180px, .85fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 68px;
  padding: 10px 2px;
  border-bottom: 1px solid var(--v3-line, #cbd9de);
}

.subscription-plan-price {
  color: var(--v3-ink-strong, #08212b);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

.subscription-plan-features {
  color: var(--v3-muted, #5f747d);
  font-size: 12px;
  line-height: 1.45;
}

.subscription-plan-row button {
  min-height: var(--v5-control-height);
  white-space: nowrap;
}

.billing-settings-section .remediation-queue-heading {
  margin-top: 8px;
}

@media (max-width: 1280px) {
  .remediation-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .billing-account-band {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .billing-account-band > span:nth-child(2) {
    border-right: 0;
  }

  .billing-account-band > span:nth-child(-n + 2) {
    border-bottom: 1px solid var(--v3-line, #cbd9de);
  }
}

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

  .subscription-plan-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .subscription-plan-features {
    grid-column: 1 / -1;
  }
}

@media (max-width: 620px) {
  .remediation-action {
    grid-template-columns: 28px minmax(0, 1fr);
  }

  .remediation-action button {
    grid-column: 2;
    justify-self: start;
  }

  .billing-account-band {
    grid-template-columns: minmax(0, 1fr);
  }

  .billing-account-band > span,
  .billing-account-band > span:nth-child(2) {
    border-right: 0;
    border-bottom: 1px solid var(--v3-line, #cbd9de);
  }

  .billing-account-band > span:last-child {
    border-bottom: 0;
  }

  .subscription-plan-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .subscription-plan-features {
    grid-column: auto;
  }

  .subscription-plan-row button {
    justify-self: start;
  }
}
html.v2-layout-ready #models .training-queue-disclosure > summary {
  min-height: 37px;
  padding-block: 5px;
}

/* Keep the timeframe matrix as light as the direction cards above it. */
html.v2-layout-ready #overview .overview-timeframe-grid {
  background: var(--v3-line-soft, #dfe8eb);
}

html.v2-layout-ready #overview .overview-timeframe-grid > article {
  background: var(--v3-surface-soft, #f4f8f9);
}

/* At the compact wide-workstation breakpoint the six cards are narrower,
   so the live timestamp can otherwise add a third line and overflow the
   fixed matrix row. Keep the same type hierarchy while tightening only the
   internal rhythm; the text remains fully readable and the matrix stays
   aligned with the adjacent dashboard column. */
@media (min-width: 1361px) and (max-width: 1499px) {
  html.v2-layout-ready #overview .overview-timeframe-grid > article {
    padding: 6px 7px;
  }

  html.v2-layout-ready #overview .overview-timeframe-grid > article > small {
    line-height: 1.18;
  }
}

/* Fundamental panorama: match the annotated three-column reading order on
   wide workstations without letting the tallest internal grid stretch the
   other columns. Each column keeps its own header/body rhythm and shares one
   aligned outer baseline. */
@media (min-width: 1361px) {
  html.v2-layout-ready #overview .fundamental-intelligence-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: minmax(0, 1fr);
    align-items: stretch;
  }

  html.v2-layout-ready #overview .fundamental-core-column,
  html.v2-layout-ready #overview .fundamental-driver-column,
  html.v2-layout-ready #overview .overview-event-column {
    grid-row: auto;
    display: grid;
    grid-template-rows: 36px 293px;
    align-content: stretch;
    gap: 8px;
    padding: 0 10px 10px;
  }

  /* The sketch leaves the left diagnostic strip on the left column, but
     starts it on the same content baseline as the two right-hand panels.
     Use the recovered 44px header offset and give the metric matrix the
     remaining height so the column bottom stays aligned. */
  html.v2-layout-ready #overview .fundamental-core-column {
    grid-template-rows: 42px 243px;
    padding-top: 44px;
  }

  html.v2-layout-ready #overview .fundamental-core-column .fundamental-score-grid {
    height: 42px;
    min-height: 42px;
  }

  html.v2-layout-ready #overview .fundamental-core-column .fundamental-metrics {
    height: 243px;
    max-height: 243px;
  }

  html.v2-layout-ready #overview .fundamental-score-grid,
  html.v2-layout-ready #overview .fundamental-driver-column > h3,
  html.v2-layout-ready #overview .overview-event-column > .overview-subheading {
    height: 36px;
    min-height: 36px;
    align-self: stretch;
  }

  html.v2-layout-ready #overview .fundamental-score-grid > div {
    display: grid;
    align-content: center;
    padding: 2px 6px;
  }

  html.v2-layout-ready #overview .fundamental-score-grid span {
    line-height: 14px;
  }

  html.v2-layout-ready #overview .fundamental-score-grid strong {
    margin-top: 1px;
    line-height: 17px;
  }

  html.v2-layout-ready #overview .fundamental-metrics {
    height: 293px;
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }

  html.v2-layout-ready #overview .fundamental-driver-list,
  html.v2-layout-ready #overview .overview-event-list {
    height: 293px !important;
    max-height: 293px !important;
  }
}

/* The core-driver cross grid retains the original neutral surface. The 1px
   separators provide structure without turning the matrix into a dark block. */
html.v2-layout-ready #overview .fundamental-driver-list {
  gap: 1px;
  border-color: var(--v3-line, #cbd9de);
  background: var(--v3-line, #cbd9de);
}

html.v2-layout-ready #overview .fundamental-driver-list > div {
  background: var(--v3-surface, #ffffff);
}

@media (min-width: 1181px) {
  html.v2-layout-ready #overview .trade-plan-panel > .panel-actions {
    margin-top: auto !important;
  }
}

@media (min-width: 1361px) {
  html.v2-layout-ready #overview .trade-plan-panel > .plan-blocker {
    max-height: none;
  }
}

/* Keep the decision card fixed, but remove the artificial tail below the
   depth content. The resulting unused rail space stays outside both cards. */
@media (min-width: 1361px) {
  html.v2-layout-ready #overview .dashboard-side-column {
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr);
    align-content: start;
  }

  html.v2-layout-ready #overview .overview-depth-panel {
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
  }

  html.v2-layout-ready #overview .trade-plan-panel {
    height: 100%;
    min-height: 0;
    max-height: none;
    flex: 0 0 auto !important;
  }
}

/* The outer blocker remains the flexible rail slot that keeps the actions in
   their fixed position. Only the inner warning surface follows text height. */
html.v2-layout-ready #overview .trade-plan-panel > .plan-blocker {
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  overflow-y: auto;
}

html.v2-layout-ready #overview .trade-plan-panel .plan-blocker-content {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 7px 8px;
  border: 1px solid #e6c790;
  border-radius: 3px;
  background: var(--amber-soft);
  color: #7a4b00;
}

html.v2-layout-ready #overview .trade-plan-panel .plan-blocker-content svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
}

html.v2-layout-ready #overview .trade-plan-panel .plan-blocker-content span {
  min-width: 0;
  overflow-wrap: anywhere;
}

html.v2-layout-ready #overview .trade-plan-panel .overview-plan-danger .plan-blocker-content {
  border-color: #e2aeb2;
  background: var(--red-soft);
  color: var(--red);
}

/* Automation tables form one visual 2x2 matrix. Keep both rows on the same
   column tracks so the outer edges and center divider align exactly. */
@media (min-width: 1201px) {
  html.v2-layout-ready #automation .v2-automation-execution {
    grid-template-columns: minmax(0, 1fr);
  }

  html.v2-layout-ready #automation .v2-automation-execution > .v2-region-heading,
  html.v2-layout-ready #automation .v2-automation-execution > .automation-execution-grid {
    grid-column: 1 / -1;
    width: 100%;
  }

  html.v2-layout-ready #automation .automation-execution-grid,
  html.v2-layout-ready #automation .v2-automation-detail {
    grid-template-columns: minmax(0, 1.15fr) minmax(420px, .85fr);
    align-items: stretch;
  }

  html.v2-layout-ready #automation .automation-execution-grid > .table-section,
  html.v2-layout-ready #automation .v2-automation-detail > .table-section {
    min-width: 0;
    height: 100%;
    align-self: stretch;
  }
}

@media (min-width: 721px) and (max-width: 1200px) {
  html.v2-layout-ready #automation .v2-automation-execution,
  html.v2-layout-ready #automation .v2-automation-detail {
    grid-template-columns: minmax(0, 1fr);
  }

  html.v2-layout-ready #automation .v2-automation-execution > .v2-region-heading,
  html.v2-layout-ready #automation .v2-automation-execution > .automation-execution-grid {
    grid-column: 1;
    width: 100%;
  }
}

/* Position detail uses its spare height for exit management, not for a blank
   tail under the ledger. Each card owns its overflow, while the workspace
   baseline remains flush with the navigation rail. */
@media (min-width: 1181px) {
  html.v2-layout-ready #positions.is-active {
    padding-bottom: 0;
  }

  html.v2-layout-ready #positions #positionDetail:has(> .position-ledger-card) {
    grid-template-rows: minmax(0, clamp(0px, calc(100% - 300px), 410px)) minmax(288px, 1fr);
    align-content: stretch;
    overflow: hidden;
  }

  html.v2-layout-ready #positions #positionDetail > .position-ledger-card {
    min-height: 0;
    height: auto;
    overflow-y: auto;
  }

  html.v2-layout-ready #positions #positionDetail > .position-exit-card {
    min-height: 0;
    height: 100%;
    overflow-y: auto;
  }

  html.v2-layout-ready #positions .position-exit-card > .detail-note {
    margin-top: 10px;
  }
}

/* Risk panels are content-led. The canvas keeps its declared analytical
   height instead of expanding from its intrinsic aspect ratio and stretching
   the limits panel alongside it. */
@media (min-width: 721px) {
  html.v2-layout-ready #risk .risk-layout {
    align-items: stretch;
  }

  html.v2-layout-ready #risk .risk-layout > .tool-panel {
    min-height: 0;
    height: auto;
    align-self: stretch;
  }

  html.v2-layout-ready #risk #riskChart {
    width: 100%;
    height: 168px;
    min-height: 0;
  }
}

/* Keep the validation evidence row balanced. Six evidence states fit as a
   compact 3 x 2 matrix on desktop, so the taller registry panel no longer
   leaves a blank band below the Walk-forward structure. */
@media (min-width: 1181px) {
  html.v2-layout-ready #validation .validation-layout {
    align-items: stretch;
  }

  html.v2-layout-ready #validation .validation-layout > .tool-panel {
    min-height: 0;
    height: auto;
    align-self: stretch;
  }

  html.v2-layout-ready #validation .validation-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  html.v2-layout-ready #validation .validation-metrics > div {
    min-height: 56px;
    padding: 7px 10px;
  }
}

/* Governance uses compact evidence matrices on desktop. This balances each
   two-panel row without stretching the shorter card or hiding any evidence. */
@media (min-width: 1181px) {
  html.v2-layout-ready #governance .governance-layout {
    align-items: stretch;
  }

  html.v2-layout-ready #governance .governance-layout > .tool-panel {
    min-height: 0;
    height: auto;
    align-self: stretch;
  }

  html.v2-layout-ready #governance .governance-recovery-layout,
  html.v2-layout-ready #governance .governance-recovery-layout > .tool-panel {
    align-self: stretch;
  }

  html.v2-layout-ready #governance .governance-qualification-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-left: 1px solid var(--v2-line);
  }

  html.v2-layout-ready #governance .governance-qualification-summary .metric-card {
    min-width: 0;
    border-right: 1px solid var(--v2-line);
  }

  html.v2-layout-ready #governance .governance-recovery-layout .recovery-checklist {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-left: 1px solid var(--v2-line);
  }

  html.v2-layout-ready #governance .governance-recovery-layout .recovery-checklist > div {
    min-width: 0;
    border-right: 1px solid var(--v2-line);
  }

  html.v2-layout-ready #governance .governance-recovery-layout .recovery-checklist > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

/* The two lead spread-ranking labels share one vertical reading pattern;
   ranks and scores remain horizontal for fast numeric comparison. */
@media (min-width: 721px) {
  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div:nth-child(-n+2) {
    grid-template-columns: 18px minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) auto;
    column-gap: 8px;
  }

  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div:nth-child(-n+2) > span {
    grid-column: 1;
    grid-row: 1 / 3;
    align-self: center;
    justify-self: center;
    writing-mode: vertical-rl;
    text-orientation: upright;
    white-space: nowrap;
    line-height: 1;
    letter-spacing: 0;
  }

  html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div:nth-child(-n+2) > strong {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
  }

html.v2-layout-ready #arbitrage #arbitrageDetail .arbitrage-score-summary > div:nth-child(-n+2) > small {
    grid-column: 2;
    grid-row: 2;
  }
}

/* Contract tape redesign: identity first, session state second. Keep the
   existing IDs and dynamic text, but remove the oversized third-row slab. */
html.v2-layout-ready #overview .overview-market-banner {
  border-color: #2b5b5d;
  border-top-color: #18a486;
  background: #17434a;
  box-shadow: 0 8px 18px rgba(10, 55, 58, 0.12);
}

html.v2-layout-ready #overview .overview-heading-icon {
  background: #2a6b62;
  color: #d8fff2;
  box-shadow: inset 0 0 0 1px rgba(216, 255, 242, 0.28);
}

html.v2-layout-ready #overview .overview-instrument-heading .status-badge:not(.qualification-state) {
  min-width: 0;
  max-width: 220px;
  min-height: 22px;
  padding: 3px 8px;
  border: 1px solid #5f9993 !important;
  border-left: 3px solid #a8d0ca !important;
  border-radius: 3px;
  background: rgba(168, 208, 202, 0.18) !important;
  color: #eafbf7 !important;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: left;
  flex-wrap: wrap;
}

html.v2-layout-ready #overview #marketQuoteState.status-neutral::before {
  background: #cbe3dc;
  color: #244c4b;
}

html.v2-layout-ready #overview #marketQuoteState.status-neutral:not(.qualification-state) {
  border-color: #5f9993 !important;
  border-left-color: #a8d0ca !important;
  background: rgba(168, 208, 202, 0.18) !important;
  color: #eafbf7 !important;
}

@media (min-width: 721px) {
  html.v2-layout-ready #overview .overview-instrument-heading {
    grid-template-columns: 38px minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    min-height: 92px;
    padding: 12px 14px;
    column-gap: 10px;
    row-gap: 2px;
    align-content: center;
  }

  html.v2-layout-ready #overview .overview-heading-icon {
    grid-column: 1;
    grid-row: 1 / 3;
  }

  html.v2-layout-ready #overview .overview-instrument-heading > div {
    grid-column: 2;
    grid-row: 1 / 3;
    align-self: center;
  }

  html.v2-layout-ready #overview .overview-instrument-heading .status-badge {
    grid-column: 2;
    grid-row: 3;
    justify-self: start;
    align-self: start;
    width: max-content;
    max-width: 100%;
  }

  html.v2-layout-ready #overview .overview-instrument-heading h2 {
    font-size: 18px;
    line-height: 1.2;
  }

  html.v2-layout-ready #overview .overview-instrument-heading p {
    margin-top: 3px;
    font-size: 12px;
    line-height: 1.35;
  }
}

@media (max-width: 720px) {
  html.v2-layout-ready #overview .overview-instrument-heading {
    grid-template-columns: 34px minmax(0, 1fr);
    grid-template-rows: auto auto;
    min-height: 78px;
    padding: 10px 11px;
    column-gap: 9px;
    row-gap: 4px;
    align-content: center;
  }

  html.v2-layout-ready #overview .overview-heading-icon {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 34px;
    height: 34px;
  }

  html.v2-layout-ready #overview .overview-instrument-heading > div {
    grid-column: 2;
    grid-row: 1;
  }

  html.v2-layout-ready #overview .overview-instrument-heading .status-badge {
    grid-column: 2;
    grid-row: 2;
    justify-self: start;
    max-width: 100%;
    min-height: 20px;
    padding-block: 2px;
  }
}

/* Final event-strip sizing override: follow the standard execution-strip
   rhythm used by the other pages and keep the supporting line visible. */
@media (min-width: 721px) {
  html.v2-layout-ready #events > .event-execution-policy {
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 68px;
    max-height: none;
    margin-top: 0;
    margin-bottom: 4px;
  }

  html.v2-layout-ready #events > .event-execution-policy > div {
    min-height: 68px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 0;
    padding: 9px 12px;
  }

  html.v2-layout-ready #events > .event-execution-policy > div > span,
  html.v2-layout-ready #events > .event-execution-policy > div > strong {
    min-width: 0;
    margin-top: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  html.v2-layout-ready #events > .event-execution-policy > div > small {
    display: block;
    min-width: 0;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--muted);
    font-size: var(--font-assist);
  }
}

/* Automation execution is a four-panel workbench: two equal panels on the
   first row and two equal panels on the second row. Both grids use the full
   content width so the right-hand tables are not compressed by the old
   1.15/0.85 split. */
@media (min-width: 1201px) {
  html.v2-layout-ready #automation .automation-layout {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  html.v2-layout-ready #automation .automation-execution-grid,
  html.v2-layout-ready #automation .v2-automation-detail {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  html.v2-layout-ready #automation .automation-execution-grid > .table-section,
  html.v2-layout-ready #automation .v2-automation-detail > .table-section {
    width: 100%;
    min-width: 0;
  }
}

/* Keep the wide four-column automation form visually separated from its
   warning and save actions. The controls remain in the same grid columns; a
   small local gap prevents their borders from visually touching the actions. */
@media (min-width: 1601px) {
  html.v2-layout-ready #automation .automation-layout > .tool-panel:first-child > .detail-note,
  html.v2-layout-ready #automation .automation-layout > .tool-panel:first-child > .button-block {
    margin-top: 10px;
  }
}

/* Keep live quote updates inside a stable card geometry. Price and change
   values can vary in length without resizing the command side or moving the
   controls that follow it. */
@media (min-width: 721px) {
  html.v2-layout-ready .v2-command-side .global-latest-quote {
    flex: 0 0 clamp(160px, 18vw, 290px);
    inline-size: clamp(160px, 18vw, 290px);
    min-inline-size: clamp(160px, 18vw, 290px);
    max-inline-size: clamp(160px, 18vw, 290px);
    box-sizing: border-box;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: center;
    gap: 2px;
    overflow: hidden;
    contain: layout;
  }

  html.v2-layout-ready .v2-command-side .global-latest-quote > span,
  html.v2-layout-ready .v2-command-side .global-latest-quote > strong {
    grid-column: 1;
    min-width: 0;
    width: 100%;
  }

  html.v2-layout-ready .v2-command-side .global-latest-quote > span {
    grid-row: 1;
  }

  html.v2-layout-ready .v2-command-side .global-latest-quote > strong {
    grid-row: 2;
  }

  html.v2-layout-ready .v2-command-side .global-latest-quote > strong {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(72px, 5.4vw, 86px);
    align-items: baseline;
    gap: 8px;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
  }

  html.v2-layout-ready .v2-command-side #globalLastPrice {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: clip;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
  }

  html.v2-layout-ready .v2-command-side #globalChangeSummary {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-align: right;
    text-overflow: clip;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
  }
}
.inference-summary {
  margin: 12px 0 14px;
  padding: 14px 16px 12px;
  border: 1px solid var(--v3-line, #cbd9de);
  border-left: 4px solid var(--v3-blue, #096e99);
  border-radius: 4px;
  background: var(--v3-surface, #fff);
  box-shadow: 0 4px 12px rgba(16, 43, 53, .06);
}

.inference-summary.is-blocked { border-left-color: var(--v3-copper, #a66b18); }
.inference-summary-heading,
.inference-summary-grid,
.inference-summary-meta { display: grid; align-items: center; gap: 12px; }
.inference-summary-heading { grid-template-columns: minmax(0, 1fr) auto; margin-bottom: 10px; }
.inference-summary-heading h3 { margin: 2px 0 0; font-size: 16px; color: var(--v3-ink-strong, #08212b); }
.inference-summary-heading .eyebrow { color: var(--v3-muted, #5f747d); font-size: 11px; }
.inference-summary-grid { grid-template-columns: minmax(180px, 1.35fr) repeat(3, minmax(150px, 1fr)); }
.inference-summary-grid > div { min-width: 0; padding: 8px 10px; border-left: 1px solid var(--v3-line, #cbd9de); }
.inference-summary-grid > div:first-child { border-left: 0; padding-left: 0; }
.inference-summary-grid span,
.inference-summary-meta { color: var(--v3-muted, #5f747d); font-size: 12px; }
.inference-summary-grid strong { display: block; margin: 3px 0; color: var(--v3-ink-strong, #08212b); font-size: 15px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.inference-summary-grid small { display: block; color: var(--v3-muted, #5f747d); line-height: 1.45; overflow-wrap: anywhere; }
.inference-primary strong { font-size: 20px; }
.inference-summary-meta { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--v3-line, #cbd9de); line-height: 1.45; }
.inference-summary-meta span { min-width: 0; overflow-wrap: anywhere; }
.inference-summary-meta .value-negative { color: var(--price-down, #007f59); }
.inference-summary-meta .value-positive { color: var(--price-up, #c53240); }

/* The activity table keeps both as-of and write timestamps in one bounded
   row. Allow the exact text to wrap instead of clipping the live monitor. */
html.v2-layout-ready #data .data-activity-scroll td:nth-child(7) {
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.3;
}

@media (max-width: 1200px) {
  .inference-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inference-summary-grid > div:nth-child(odd) { border-left: 0; padding-left: 0; }
  .inference-summary-meta { grid-template-columns: 1fr; gap: 5px; }
}

@media (max-width: 700px) {
  .inference-summary { padding: 12px; }
  .inference-summary-grid { grid-template-columns: 1fr; gap: 4px; }
  .inference-summary-grid > div,
  .inference-summary-grid > div:nth-child(odd) { border-left: 0; border-top: 1px solid var(--v3-line, #cbd9de); padding: 8px 0 0; }
  .inference-summary-grid > div:first-child { border-top: 0; padding-top: 0; }
}

.legacy-spread-attestation {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--v3-line, #cbd9de);
}

.legacy-spread-attestation[hidden] { display: none; }
.legacy-spread-list { display: grid; border-block: 1px solid var(--v3-line, #cbd9de); }
.legacy-spread-row {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-height: 48px;
  padding: 7px 2px;
  border-bottom: 1px solid var(--v3-line, #cbd9de);
}
.legacy-spread-row:last-child { border-bottom: 0; }
.legacy-spread-row strong,
.legacy-spread-row small { display: block; }
.legacy-spread-row strong { font-size: 13px; color: var(--v3-ink-strong, #08212b); }
.legacy-spread-row small { margin-top: 3px; color: var(--v3-muted, #5f747d); font-size: 12px; line-height: 1.4; }
.legacy-spread-role-note { padding: 8px 2px; color: var(--v3-muted, #5f747d); font-size: 12px; }

/* Model registry cells present localized model semantics first and retain the
   raw identifier as a compact audit line. */
html.v2-layout-ready #models .model-layout > .table-section > .table-scroll > table {
  table-layout: fixed;
  min-width: 720px;
}

html.v2-layout-ready #models .model-layout > .table-section th:nth-child(1) { width: 25%; }
html.v2-layout-ready #models .model-layout > .table-section th:nth-child(2) { width: 25%; }
html.v2-layout-ready #models .model-layout > .table-section th:nth-child(3) { width: 14%; }
html.v2-layout-ready #models .model-layout > .table-section th:nth-child(4) { width: 13%; }
html.v2-layout-ready #models .model-layout > .table-section th:nth-child(5) { width: 12%; }
html.v2-layout-ready #models .model-layout > .table-section th:nth-child(6) { width: 11%; }

html.v2-layout-ready #models .model-layout > .table-section td {
  overflow: hidden;
  overflow-wrap: normal;
  word-break: normal;
  vertical-align: middle;
}

html.v2-layout-ready #models .model-registry-identity,
html.v2-layout-ready #models .model-registry-timeframe,
html.v2-layout-ready #models .model-registry-boundary {
  min-width: 0;
}

html.v2-layout-ready #models .model-registry-identity > strong,
html.v2-layout-ready #models .model-registry-timeframe > strong,
html.v2-layout-ready #models .model-registry-boundary > strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.25;
}

html.v2-layout-ready #models .model-registry-identity > small,
html.v2-layout-ready #models .model-registry-timeframe > small,
html.v2-layout-ready #models .model-registry-boundary > small {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: var(--v2-muted);
  font-size: 11px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.v2-layout-ready #models .model-layout td:nth-child(3) code {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}

html.v2-layout-ready #models .model-layout td:nth-child(4) .status-badge,
html.v2-layout-ready #models .model-layout td:nth-child(5) .status-badge {
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  min-width: max-content;
  white-space: nowrap;
}

/* CTP quote/depth latency strip: keep telemetry in the data-center palette
   and update values inside a fixed grid so the surrounding page never shifts. */
html.v2-layout-ready #data .data-latency-panel {
  border-top: 3px solid var(--v2-blue);
}

html.v2-layout-ready #data .data-latency-panel .market-latency-strip {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 1px;
  min-height: 64px;
  border: 1px solid var(--v2-line);
  background: var(--v2-line);
}

html.v2-layout-ready #data .data-latency-panel .market-latency-item {
  min-width: 0;
  min-height: 64px;
  display: grid;
  grid-template-rows: auto minmax(18px, auto) minmax(22px, auto);
  align-content: center;
  gap: 2px;
  padding: 7px 9px;
  background: #f7fafb;
  color: var(--v2-ink);
}

html.v2-layout-ready #data .data-latency-panel .market-latency-item > span {
  color: var(--v2-muted);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .02em;
}

html.v2-layout-ready #data .data-latency-panel .market-latency-item > strong {
  min-width: 0;
  color: #17313b;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.v2-layout-ready #data .data-latency-panel .market-latency-item > small {
  min-width: 0;
  color: var(--v2-muted);
  font-size: 11px;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.v2-layout-ready #data .data-latency-panel .market-latency-item > strong.status-value-good { color: #146b4a; }
html.v2-layout-ready #data .data-latency-panel .market-latency-item > strong.status-value-warn { color: #825400; }
html.v2-layout-ready #data .data-latency-panel .market-latency-item > strong.status-value-bad { color: #9b2130; }

@media (max-width: 1280px) {
  html.v2-layout-ready #data .data-latency-panel .market-latency-strip {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  html.v2-layout-ready #data .data-latency-panel .market-latency-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html.v2-layout-ready #data .data-latency-panel .market-latency-item {
    min-height: 68px;
    padding: 7px 8px;
  }
}

/* Final model-registry contract. Keep the registry readable at desktop widths:
   give the qualification rail enough room, use a stable 44px data row, and
   let the table consume the full bounded panel without changing its bindings. */
@media (min-width: 1181px) {
  html.v2-layout-ready #models .model-layout {
    grid-template-columns: minmax(0, 1fr) 320px;
    align-items: stretch;
  }

  /* v2-consistency defines a four-column rhythm for this legacy workspace;
     collapse it explicitly so the registry and gate are true two-column peers. */
  html.v2-layout-ready #models .model-layout > .table-section {
    grid-column: 1 !important;
  }

  html.v2-layout-ready #models .model-layout > .detail-panel {
    grid-column: 2 !important;
  }

  html.v2-layout-ready #models .model-layout > .table-section,
  html.v2-layout-ready #models .model-layout > .detail-panel {
    min-height: max(420px, var(--v2-model-register-height, calc(100dvh - 787px)));
  }

  html.v2-layout-ready #models .model-layout > .table-section > .table-scroll > table {
    min-width: 0;
    width: 100%;
    height: auto;
  }

  html.v2-layout-ready #models .model-layout > .table-section th,
  html.v2-layout-ready #models .model-layout > .table-section td {
    padding: 5px 9px;
    line-height: 1.25;
  }

  html.v2-layout-ready #models .model-layout > .table-section tbody tr {
    height: 44px;
  }

  html.v2-layout-ready #models .model-layout > .table-section th:nth-child(1) { width: 24%; }
  html.v2-layout-ready #models .model-layout > .table-section th:nth-child(2) { width: 24%; }
  html.v2-layout-ready #models .model-layout > .table-section th:nth-child(3) { width: 14%; }
  html.v2-layout-ready #models .model-layout > .table-section th:nth-child(4) { width: 12%; }
  html.v2-layout-ready #models .model-layout > .table-section th:nth-child(5) { width: 12%; }
  html.v2-layout-ready #models .model-layout > .table-section th:nth-child(6) { width: 14%; }

  html.v2-layout-ready #models .model-layout > .detail-panel {
    padding: 12px;
  }

  html.v2-layout-ready #models .model-layout > .detail-panel > .gate-list {
    grid-template-rows: repeat(5, minmax(44px, 1fr));
  }

  html.v2-layout-ready #models .model-layout > .detail-panel > .gate-list > div {
    min-height: 44px;
    padding-block: 7px;
  }
}

@media (min-width: 1041px) and (max-width: 1180px) {
  html.v2-layout-ready #models .model-layout {
    grid-template-columns: minmax(0, 1fr) 300px;
  }
}

/* Keep the five position-management states on one desktop rhythm. The shared
   execution strip switches to three columns too early for this five-item row,
   leaving a false sixth cell after reconciliation. */
@media (min-width: 901px) and (max-width: 1360px) {
  html.v2-layout-ready #positions .position-management-strip {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  html.v2-layout-ready #positions .position-management-strip > div,
  html.v2-layout-ready #positions .position-management-strip > div:nth-child(3) {
    border-right: 1px solid var(--v2-line);
    border-bottom: 0;
  }

  html.v2-layout-ready #positions .position-management-strip > div:last-child {
    border-right: 0;
  }
}

@media (min-width: 721px) and (max-width: 900px) {
  html.v2-layout-ready #positions .position-management-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html.v2-layout-ready #positions .position-management-strip > div {
    border-right: 1px solid var(--v2-line);
    border-bottom: 1px solid var(--v2-line);
  }

  html.v2-layout-ready #positions .position-management-strip > div:nth-child(2n) {
    border-right: 0;
  }

  html.v2-layout-ready #positions .position-management-strip > div:last-child {
    grid-column: 1 / -1;
    border-right: 0;
    border-bottom: 0;
  }
}

/* An empty ledger is evidence, not a data workspace. Keep it compact on the
   standard desktop instead of forcing both columns to a 380px blank canvas. */
@media (min-width: 1181px) and (max-width: 1600px) {
  html.v2-layout-ready #positions:has(#positionsBody > tr:only-child .empty-state) > .v2-position-workspace {
    grid-template-rows: auto 260px;
    align-items: stretch;
  }

  html.v2-layout-ready #positions:has(#positionsBody > tr:only-child .empty-state) .positions-ledger-table,
  html.v2-layout-ready #positions:has(#positionsBody > tr:only-child .empty-state) #positionDetail,
  html.v2-layout-ready #positions:has(#positionsBody > tr:only-child .empty-state) .position-empty-card {
    min-height: 260px;
    height: 260px;
  }
}

/* Below the side-by-side ledger breakpoint, give the table and audit card the
   full content width so eleven ledger columns never compete with the detail. */
@media (min-width: 721px) and (max-width: 1180px) {
  html.v2-layout-ready #positions > .v2-position-workspace {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    row-gap: 10px;
    overflow: visible;
  }

  html.v2-layout-ready #positions > .v2-position-workspace > .v2-region-heading,
  html.v2-layout-ready #positions > .v2-position-workspace > .positions-ledger-table,
  html.v2-layout-ready #positions > .v2-position-workspace > #positionDetail {
    grid-column: 1;
  }

  html.v2-layout-ready #positions > .v2-position-workspace > .positions-ledger-table {
    grid-row: 2;
  }

  html.v2-layout-ready #positions > .v2-position-workspace > #positionDetail {
    grid-row: 3;
  }

  html.v2-layout-ready #positions:has(#positionsBody > tr:only-child .empty-state) .positions-ledger-table {
    min-height: 180px;
    height: 180px;
  }

  html.v2-layout-ready #positions:has(#positionsBody > tr:only-child .empty-state) #positionDetail,
  html.v2-layout-ready #positions:has(#positionsBody > tr:only-child .empty-state) .position-empty-card {
    min-height: 0;
    height: auto;
  }

  html.v2-layout-ready #positions:has(#positionsBody > tr:only-child .empty-state) #positionDetail {
    overflow-x: hidden;
    overflow-y: auto;
  }

  html.v2-layout-ready #positions:has(#positionsBody > tr:only-child .empty-state) .position-empty-card {
    overflow: visible;
  }
}