﻿@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@700&family=IBM+Plex+Sans:wght@700&display=swap");

 /* =========================
   BASE
   ========================= */

:root {
  --oc-red: #b35c6b;
  --oc-red-bright: #ff7878;
  --bg: #03070d;
  --bg-2: #07111e;
  --panel: rgba(8, 18, 32, 0.84);
  --panel-2: rgba(10, 22, 39, 0.92);
  --panel-soft: rgba(10, 20, 35, 0.7);
  --border: rgba(126, 153, 196, 0.16);
  --border-strong: rgba(157, 183, 223, 0.24);
  --text: #e6ecf5;
  --text-soft: #a5b0c1;
  --text-muted: #7e899b;
  --accent: #d5b37c;
  --accent-soft: rgba(213, 179, 124, 0.18);
  --good: #8ec9a3;
  --bad: #d17979;
  --iv-blue: #6997cd;
  --iv-green: #8ec9a3;
  --iv-gold: #d5b37c;
  --iv-burgundy:#800020;
  --rates-ladder-sh: #7f1d1d;
  --rates-ladder-mh: #e87979;
  --rates-ladder-n: #d5b37c;
  --rates-ladder-md: #86c98f;
  --rates-ladder-sd: #5f7356;
  --shadow: 0 12px 30px rgba(0, 0, 0, 0.34);
  --radius: 18px;
  --radius-sm: 12px;
  --toolbar-h: 74px;
  --about-black: #C8A35A;
  --vector-silver: #8f9aac;
}

/* EQUITIES Market Indexes GeoScen governed evidence surface */
#view-equities .equities-market-geoscen { display: grid; gap: 9px; color: #1f2937; font-size: 11.5px; line-height: 1.38; }
#view-equities .equities-market-geoscen-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 12px; padding-bottom: 7px; border-bottom: 1px solid rgba(91, 33, 182, 0.18); }
#view-equities .equities-market-geoscen-identity { min-width: 0; color: #374151; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#view-equities .equities-market-geoscen-identity b { color: #111827; font-size: 13px; }
#view-equities .equities-market-geoscen-identity span { color: #6d28d9; font-size: 11.5px; font-weight: 750; }
#view-equities .equities-market-geoscen-route { display: flex; align-items: baseline; justify-content: flex-end; gap: 12px; color: #111827; white-space: nowrap; }
#view-equities .equities-market-geoscen-horizon,
#view-equities .equities-market-geoscen-date { color: #111827; font-size: 10.5px; font-weight: 700; letter-spacing: 0.035em; }
#view-equities .equities-market-geoscen-rail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid rgba(17, 24, 39, 0.1); border-bottom: 1px solid rgba(17, 24, 39, 0.1); background: rgba(248, 250, 252, 0.88); }
#view-equities .equities-market-geoscen-rail span { display: flex; align-items: baseline; justify-content: center; gap: 4px; padding: 7px 8px; border-right: 1px solid rgba(17, 24, 39, 0.1); white-space: nowrap; }
#view-equities .equities-market-geoscen-rail span:last-child { border-right: 0; }
#view-equities .equities-market-geoscen-rail b { color: #111827; font-size: 13px; font-variant-numeric: tabular-nums; }
#view-equities .equities-market-geoscen-rail small { color: #6b7280; font-size: 8.5px; font-weight: 800; letter-spacing: 0.055em; }
#view-equities .equities-market-geoscen-narrative { text-align: left; }
#view-equities .equities-market-geoscen-narrative ul { display: grid; gap: 4px; margin: 1px 0 0; padding-left: 16px; }
#view-equities .equities-market-geoscen-governance { display: grid; justify-items: center; gap: 4px; padding-top: 7px; border-top: 1px solid rgba(55, 65, 81, 0.12); color: #9ca3af; font-size: 8.5px; font-weight: 750; letter-spacing: 0.045em; text-align: center; }
#view-equities .equities-market-geoscen-governance b { color: #64748b; font-size: 9px; }
#view-equities .equities-market-geoscen-guard-rail { display: flex; flex-wrap: wrap; justify-content: center; gap: 3px 14px; color: #9ca3af; }
#view-equities .equities-market-geoscen-limit,
#view-equities .equities-market-geoscen-unavailable { padding-top: 7px; border-top: 1px solid rgba(55, 65, 81, 0.12); color: #6b7280; font-size: 11px; }

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  background:
    radial-gradient(
      circle at top center,
      rgba(37, 73, 128, 0.16),
      transparent 34%
    ),
    linear-gradient(180deg, #02060c 0%, #02060b 38%, #03080f 100%);
  color: var(--text);
  font-family: 'Inter', sans-serif;
}

body {
  overflow-x: hidden;
}

button,
select {
  font: inherit;
}

.sr-only,
.ism-chart-summary {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.app-shell.app-shell {
  min-height: 100vh;
  padding-bottom: 0;
}

.topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 5000;

  min-height: 90px;
  padding: 0 20px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 18px;
  border-bottom: 1px solid rgba(159, 178, 214, 0.14);
  background:
    linear-gradient(180deg, rgba(6, 12, 22, 0.96), rgba(4, 9, 16, 0.92)),
    radial-gradient(
      circle at top center,
      rgba(74, 118, 193, 0.16),
      transparent 40%
    );
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.24);
}

.topbar,
.top-nav,
.top-nav-item {
  pointer-events: auto;
}

.mobile-appbar,
.mobile-module-drawer,
.mobile-drawer-backdrop,
.mobile-menu-button,
.mobile-appbar-brand,
.mobile-appbar-module {
  display: none !important;
}

.top-nav-item:not(:disabled) {
  cursor: pointer;
}

.brand-wrap {
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
  min-width: 0;
}

.brand {
  font-family: 'Cormorant Garamond', serif;
  font-size: 3rem;
  line-height: 1;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.iso {
  color: #ffffff;
}

.vector {
  color: #8f9aac;
}

.brand-subtitle {
  color: #8f9aac;
  font-size: 0.92rem;
  letter-spacing: 0.02em;
}

.release-tag {
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(8, 16, 30, 0.7);
  color: var(--text-soft);
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.main-grid {
  display: grid;
  grid-template-columns: 360px minmax(0, 1fr);
  gap: 28px;
  padding: 28px 28px 18px;
}

.main-grid {
  padding-top: 118px;
}

.sidebar-panel,
.content-panel {
  border: 1px solid var(--border);
  background:
    linear-gradient(180deg, rgba(8, 18, 32, 0.9), rgba(7, 15, 27, 0.85)),
    radial-gradient(
      circle at top center,
      rgba(63, 97, 157, 0.08),
      transparent 48%
    );
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.sidebar-panel {
  padding: 26px 22px;
}

.content-panel {
  display: flex;
  flex-direction: column;
  padding: 24px 24px 14px;
  min-height: 640px;
}

body.view-fx .sidebar-panel {
  display: none !important;
}

body.view-fx .main-grid {
  grid-template-columns: 1fr !important;
}

.panel-kicker,
.content-kicker,
.section-label,
.footer-label {
  color: var(--text-muted);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 0.78rem;
}

.sidebar-nav {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.finstate-group-row th {
  border-bottom: 1px solid rgba(126, 153, 196, 0.16);
  text-align: center;
  color: #9fb3c8;
}

.finstate-vector-group,
.finstate-vector-cell {
  color: #8f9aac !important;
}

.nav-item {
  width: 100%;
  min-height: 56px;
  text-align: left;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text-soft);
  padding: 14px 14px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: 180ms ease;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.nav-item:hover:not(:disabled):not(.locked),
.nav-item.active,
.nav-parent.active {
  background: linear-gradient(
    180deg,
    rgba(16, 29, 48, 0.94),
    rgba(10, 21, 36, 0.92)
  );
  border-color: rgba(157, 183, 223, 0.22);
  color: var(--text);
  box-shadow:
    inset 0 0 0 1px rgba(213, 179, 124, 0.04),
    0 0 22px rgba(55, 106, 188, 0.1);
}

.nav-parent.active {
  border-left: 2px solid rgba(213, 179, 124, 0.7);
}

.nav-child {
  padding: 11px 14px 11px 28px;
  font-size: 0.94rem;
}

.nav-item.locked,
.nav-item:disabled {
  cursor: not-allowed;
  opacity: 0.54;
}

.nav-meta {
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent);
}

.nav-meta.muted {
  color: var(--text-muted);
}

.subnav {
  display: none;
  margin: -2px 0 4px;
  padding-left: 10px;
  border-left: 1px solid rgba(126, 153, 196, 0.12);
}

.subnav.open {
  display: block;
}

.content-view {
  display: none;
  animation: fadeIn 220ms ease;
}

.content-view.active {
  display: block;
}

.content-header {
  margin-bottom: 8px;
}

.content-header-with-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 18px;
  margin-bottom: 6px;
}

.content-header-with-toolbar > div:first-child {
  flex: 0 1 auto;
  min-width: fit-content;
}

.content-header-with-toolbar h2 {
  margin: 0;
  line-height: 1.15;
}

.content-header-with-toolbar .fx-toolbar {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px 10px;
}

.content-header-with-toolbar .fx-control-group {
  flex: 0 0 auto;
  max-width: none;
}

.content-header-with-toolbar .fx-control-group label {
  white-space: nowrap;
}

.content-header-with-toolbar .fx-control-group select {
  width: auto;
  max-width: none;
}

.content-header-with-toolbar .fx-separator {
  flex: 0 0 auto;
}

.content-header h1 {
  margin: 8px 0 0;
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.08;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.hero-grid,
.two-column {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
  gap: 26px;
}

.hero-copy,
.stacked-cards {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.lead {
  margin: 0;
  font-size: 1.42rem;
  line-height: 1.58;
  color: #eef3fa;
  max-width: 18.5ch;
}

.lead.compact {
  font-size: 1.1rem;
  max-width: none;
}

.body-copy {
  margin: 0;
  color: var(--text-soft);
  line-height: 1.7;
}

.info-card,
.formula-card,
.list-card,
.quote-card,
.comparison-card,
.metric-card,
.cpmai-card,
.metric-detail-card {
  border-radius: 16px;
  border: 1px solid var(--border);
  background:
    linear-gradient(180deg, rgba(8, 18, 33, 0.9), rgba(7, 15, 27, 0.82)),
    radial-gradient(
      circle at top center,
      rgba(62, 107, 187, 0.08),
      transparent 45%
    );
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.015);
}

.info-card,
.list-card,
.quote-card {
  padding: 22px 22px;
}

.info-card.full-height,
.quote-card.full-height {
  min-height: 100%;
}

.formula-card {
  padding: 26px 24px;
}

.formula-card.large {
  padding: 28px 24px;
}

.formula-main {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.1;
  text-align: center;
  color: #f2f5fa;
}

.formula-main.secondary {
  margin-top: 12px;
  font-size: 1.5rem;
}

.formula-main.small {
  font-size: 2rem;
}

.formula-sub {
  margin-top: 14px;
  text-align: center;
  color: var(--text-soft);
  font-size: 0.92rem;
  line-height: 1.55;
}

.clean-list,
.icon-list {
  margin: 0;
  padding-left: 20px;
  display: grid;
  gap: 14px;
  color: var(--text-soft);
  line-height: 1.65;
}


.iso-landing-art {
  width: 100%;
  min-height: 360px;
  border-radius: 18px;
  overflow: hidden;
  background: #050b12;
}

.iso-landing-art img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  object-position: center;
}

.clean-list.tight {
  gap: 10px;
}

.clean-list li::marker {
  color: rgba(213, 179, 124, 0.82);
}

.hero-visual {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0px;
  min-height: 100%;
}

.hero-visual .iso-landing-art {
  transform: translateY(-95px);
}

.stack-graphic {
  position: relative;
  min-height: 420px;
  border-radius: 16px;
  border: 1px solid rgba(127, 152, 190, 0.14);
  background:
    linear-gradient(180deg, rgba(4, 10, 18, 0.88), rgba(4, 9, 16, 0.76)),
    radial-gradient(circle at center, rgba(40, 89, 165, 0.08), transparent 55%);
  overflow: hidden;
}

.stack-axis {
  position: absolute;
  top: 36px;
  bottom: 36px;
  left: 50%;
  width: 1px;
  transform: translateX(-50%);
  background: linear-gradient(
    180deg,
    transparent,
    rgba(235, 242, 255, 0.45),
    transparent
  );
}

.stack-layer {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 34px;
  width: 74%;
  clip-path: polygon(10% 0%, 90% 0%, 100% 100%, 0% 100%);
  opacity: 0.94;
  filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.24));
}

.stack-layer::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 255, 255, 0.1) 50%,
    transparent 100%
  );
  mix-blend-mode: screen;
}

.l1 {
  top: 42px;
  background: linear-gradient(
    180deg,
    rgba(28, 130, 110, 0.88),
    rgba(13, 74, 63, 0.88)
  );
}
.l2 {
  top: 86px;
  background: linear-gradient(
    180deg,
    rgba(46, 133, 85, 0.84),
    rgba(23, 82, 52, 0.9)
  );
}
.l3 {
  top: 130px;
  background: linear-gradient(
    180deg,
    rgba(92, 140, 52, 0.86),
    rgba(58, 95, 30, 0.9)
  );
}
.l4 {
  top: 174px;
  background: linear-gradient(
    180deg,
    rgba(136, 122, 27, 0.88),
    rgba(95, 85, 20, 0.9)
  );
}
.l5 {
  top: 218px;
  background: linear-gradient(
    180deg,
    rgba(146, 103, 24, 0.88),
    rgba(101, 71, 18, 0.9)
  );
}
.l6 {
  top: 262px;
  background: linear-gradient(
    180deg,
    rgba(146, 83, 21, 0.88),
    rgba(101, 57, 16, 0.9)
  );
}
.l7 {
  top: 306px;
  background: linear-gradient(
    180deg,
    rgba(132, 46, 31, 0.9),
    rgba(95, 28, 20, 0.9)
  );
}
.l8 {
  top: 350px;
  background: linear-gradient(
    180deg,
    rgba(132, 24, 39, 0.92),
    rgba(92, 12, 24, 0.9)
  );
}

.visual-caption {
  color: var(--text-muted);
  text-align: center;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.75rem;
}

.quote-card {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 148px;
  text-align: center;
}

.quote-card.japanese {
  min-height: 170px;
  flex-direction: column;
  gap: 10px;
}

.jp-line {
  font-family: 'Cormorant Garamond', serif;
  font-size: 2rem;
  color: var(--accent);
  line-height: 1.2;
}

.quote-sub {
  color: var(--accent);
  font-style: italic;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.25rem;
}

.quote-sub2 {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.15rem;
  letter-spacing: 0.08em;
}

.quote-sub2 .sep-dot {
  color: #C0C0C0; /* Iso Silver */
}

.quote-sub2 .sep-bar {
  color: #4A90E2; /* Iso Blue */
}

.quote-text {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.7rem;
  line-height: 1.35;
  color: #e6d1a9;
}

.comparison-card {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  overflow: hidden;
}

.comparison-column {
  padding: 22px 22px 18px;
}

.comparison-column:first-child {
  border-right: 1px solid var(--border);
}

.icon-list {
  list-style: none;
  padding-left: 0;
}

.icon-list li {
  position: relative;
  padding-left: 26px;
}

.icon-list li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--good);
  font-weight: 700;
}

.negative-list li::before {
  content: "\2715";
  color: var(--bad);
}

.metric-detail-grid,
.cpmai-grid-expanded {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  align-items: stretch;
}

.metric-detail-card {
  min-height: 250px;
  padding: 22px 22px 20px;
  display: flex;
  flex-direction: column;
}


/* ==========================
   IV BURGUNDY METRIC CARDS
   ========================== */

.iv-card-burgundy {
  border-color: rgba(128, 0, 32, 0.65);

  background:
    linear-gradient(
      180deg,
      rgba(128, 0, 32, 0.18),
      rgba(8, 18, 32, 0.88)
    ),
    radial-gradient(
      circle at top center,
      rgba(128, 0, 32, 0.16),
      transparent 55%
    );

  box-shadow:
    inset 0 0 0 1px rgba(128, 0, 32, 0.18),
    0 12px 30px rgba(0,0,0,0.34);
}

.iv-card-burgundy .metric-detail-head strong {
  color: #ffb3c1;
}

.iv-card-burgundy .metric-detail-head span {
  color: #f1d7de;
}

.iv-card-burgundy .metric-detail-example {
  color: #d5b37c;
}

.metric-detail-head {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 14px;
}

.metric-detail-head strong {
  font-family: 'Cormorant Garamond', serif;
  font-size: 2rem;
  line-height: 1;
  color: #f0f4fa;
}

.metric-detail-head span {
  color: #d9e2ef;
  font-size: 1rem;
  letter-spacing: 0.01em;
}

.metric-detail-body,
.metric-detail-example {
  margin: 0;
  line-height: 1.68;
}

.metric-detail-body {
  color: var(--text-soft);
}

.metric-detail-example {
  color: #cdb287;
  font-size: 0.95rem;
  margin-top: 10px;
}

.metric-detail-example-layman {
  color: #4d4dff;
  font-size: 0.95rem;
  margin-top: 10px;
  font-style: normal;
}

.cpmai-card {
  min-height: 185px;
  padding: 22px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 12px;
}

.cpmai-card strong {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.65rem;
  line-height: 1;
  color: #f0f4fa;
}

.cpmai-card span {
  color: var(--text-soft);
  line-height: 1.65;
}

.content-footer {
  margin-top: auto;
  padding-top: 14px;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  color: var(--text-muted);
  font-size: 0.84rem;
  border-top: 1px solid rgba(126, 153, 196, 0.08);
}

.fx-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 14px;
  width: 100%;
  margin-bottom: 12px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(126, 153, 196, 0.12);
}

.fx-depth-metric-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-bottom: 12px;
}

.fx-depth-metric-button {
  position: relative;
  min-height: 30px;
  padding: 0 10px;
  border: none;
  background: transparent;
  color: var(--accent);
  font-size: 0.66rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
}

.fx-depth-metric-button::after {
  content: '';
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: -6px;
  height: 2px;
  background: transparent;
}

.fx-depth-metric-button.active::after,
.fx-depth-metric-button:hover::after {
  background: linear-gradient(90deg, transparent, #ffffff, transparent);
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.35);
}

.fx-depth-selected-metric {
  min-height: 230px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--accent);
  font-size: 1.25rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: center;
}

.fx-depth-live-summary {
  padding: 8px 10px 4px;
  text-align: center;
}

.fx-depth-live-title {
  color: var(--accent);
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.fx-depth-live-value {
  margin-top: 4px;
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 1;
}

.fx-depth-live-value.positive {
  color: var(--good);
}

.fx-depth-live-value.negative {
  color: var(--bad);
}

.fx-depth-live-meta {
  margin-top: 6px;
  color: #8f9aac;
  font-size: 0.68rem;
  letter-spacing: 0.04em;
}

.fx-depth-live-chart {
  width: 100%;
  min-height: 178px;
}

.fx-depth-live-chart svg {
  display: block;
  width: 100%;
  height: 178px;
}

.fx-depth-live-line {
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.fx-depth-live-line.positive {
  stroke: var(--good);
}

.fx-depth-live-line.negative {
  stroke: var(--bad);
}

.fx-depth-live-area {
  stroke: none;
}

.fx-depth-live-area.positive {
  fill: rgba(142, 201, 163, 0.18);
}

.fx-depth-live-area.negative {
  fill: rgba(209, 121, 121, 0.18);
}

.fx-depth-live-area-positive {
  fill: rgba(142, 201, 163, 0.22);
  stroke: none;
}

.fx-depth-live-area-negative {
  fill: rgba(209, 121, 121, 0.22);
  stroke: none;
}

.fx-depth-live-label {
  fill: #eef3fa;
  font-size: 10px;
  font-weight: 700;
}

.fx-depth-seasonal-line {
  fill: none;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.9;
}

.fx-depth-seasonal-line.high {
  stroke: rgba(209, 121, 121, 0.72);
}

.fx-depth-seasonal-line.avg {
  stroke: rgba(213, 179, 124, 0.72);
  stroke-dasharray: 5 4;
}

.fx-depth-seasonal-line.low {
  stroke: rgba(142, 201, 163, 0.72);
}

.fx-depth-seasonal-line.current {
  stroke: #eef3fa;
  stroke-width: 2.4;
  opacity: 1;
}

.fx-depth-seasonal-label {
  fill: #8f9aac;
  font-size: 10px;
  letter-spacing: 0.04em;
}

.fx-depth-seasonal-label.current {
  fill: #eef3fa;
  font-weight: 700;
}

.fx-supporting-metrics-description {
  margin-top: 10px;
  color: #b6c3d2;
  font-size: 0.78rem;
  font-style: italic;
  line-height: 1.5;
  text-align: center;
}

.fx-control-group,
#wti-inventory-view-group,
#wti-inventory-regime-group {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  flex-shrink: 0;
}

.fx-control-group label {
  margin: 0;
  color: var(--text-muted);
  text-transform: uppercase;
  font-size: 0.72rem;
  line-height: 1;
  white-space: nowrap;
}

.fx-control-group select {
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(8, 18, 32, 0.95);
  color: var(--text);
  font: inherit;
  white-space: nowrap;
}

.fx-main-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-areas:
    'iv depth price'
    'geoscen sigma spread';
  gap: 18px;
}

.fx-iv-panel {
  grid-area: iv;
}
.fx-depth-panel {
  grid-area: depth;
  min-height: 320px;
}
.fx-price-panel {
  grid-area: price;
}
.fx-geoscen-panel {
  grid-area: geoscen;
}
.fx-sigma-panel {
  grid-area: sigma;
}
.fx-spread-panel {
  grid-area: spread;
}

.fx-iv-panel {
  grid-area: iv;
}
.fx-reserved-panel {
  grid-area: reserved;
}

.fx-panel {
  position: relative;
  border: 1px solid #1f2a38;
  border-radius: 12px;
  padding: 16px;
  background: #08121d;
  min-height: 240px;
  width: 100%;
}

.fx-price-panel {
  grid-area: price;
  min-height: 320px;
}

.fx-spread-panel {
  grid-area: spread;
  min-height: 320px;
}

.fx-spread-panel .panel-head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 8px;
  margin-bottom: 18px;
}

.fx-spread-panel .panel-head-copy {
  width: 100%;
}

.fx-spread-panel .panel-source,
.fx-spread-panel .panel-subtitle {
  position: relative;
  z-index: 2;
}

.fx-spread-panel .panel-badge {
  white-space: normal;
}

.fx-spread-panel .chart-shell {
  margin-top: 6px;
}

.fx-geoscen-panel {
  grid-area: geoscen;
}

.fx-sigma-panel {
  grid-area: sigma;
}

.fx-reserved-panel {
  grid-area: reserved;
}

.fx-geoscen .panel-title,
.fx-geoscen .panel-footnote,
.fx-geoscen .panel-source {
  color: #7c5cff;
}

.panel-title {
  font-size: 0.8rem;
  letter-spacing: 1px;
  margin-bottom: 10px;
  color: #9fb3c8;
  text-transform: uppercase;
}

.panel-subtitle {
  margin-top: 2px;
  color: #7f8ea3;
  font-size: 0.72rem;
  line-height: 1.35;
  letter-spacing: 0.03em;
}

.panel-placeholder {
  min-height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #5f7388;
  border: 1px dashed #223347;
  border-radius: 8px;
  padding: 12px;
  text-align: center;
}

.panel-footnote {
  font-size: 0.7rem;
  margin-top: 10px;
  color: #8a9bad;
  line-height: 1.5;
}

.fx-geoscen {
  border-color: #4c3f7a;
  background: #101426;
}

.fx-geoscen .panel-title,
.fx-geoscen .panel-footnote {
  color: #7c5cff;
}

.wti-inventory-panel.wti-oc-active {
  border-color: #4c3f7a;
  background: #101426;
}

.wti-inventory-panel.wti-oc-active .panel-title,
.wti-inventory-panel.wti-oc-active .panel-source,
.wti-inventory-panel.wti-oc-active #wti-inventory-source-prefix,
.wti-inventory-panel.wti-oc-active #wti-inventory-date {
  color: #7c5cff;
}

.panel-head-copy {
  min-width: 0;
}

.panel-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(126, 153, 196, 0.18);
  background: rgba(10, 20, 35, 0.72);
  color: #b6c3d2;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.chart-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 100%;
  height: 100%;
}

.chart-header-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.chart-header-row[hidden] {
  display: none;
}

.chart-stat {
  min-height: 56px;
  padding: 10px 12px;
  border: 1px solid rgba(126, 153, 196, 0.12);
  border-radius: 10px;
  background: linear-gradient(
    180deg,
    rgba(8, 17, 28, 0.72),
    rgba(7, 14, 24, 0.58)
  );
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}

.chart-stat-label {
  color: var(--text-muted);
  font-size: 0.66rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.chart-stat-value {
  color: #eef3fa;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.chart-stat-value.positive {
  color: var(--good);
}

.chart-stat-value.negative {
  color: var(--bad);
}

.fx-chart {
  position: relative;
  width: 100%;
  min-height: 230px;
  border: 1px solid rgba(126, 153, 196, 0.12);
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(5, 12, 20, 0.9), rgba(4, 10, 17, 0.84)),
    radial-gradient(
      circle at top center,
      rgba(56, 98, 171, 0.06),
      transparent 46%
    );
  overflow: hidden;
}

.fx-price-panel .fx-chart,
.fx-spread-panel .fx-chart {
  min-height: 190px;
}

.fx-candle-wick {
  stroke-width: 1.2;
}

.fx-candle-body {
  stroke: none;
}

.fx-candle-up {
  stroke: #16a34a;
  fill: #16a34a;
}

.fx-candle-down {
  stroke: #dc2626;
  fill: #dc2626;
}

.fx-chart svg {
  display: block;
  width: 100%;
  height: 100%;
}

.fx-axis-label {
  fill: #718096;
  font-size: 10px;
  letter-spacing: 0.04em;
}

.fx-grid-line {
  stroke: rgba(126, 153, 196, 0.12);
  stroke-width: 1;
}

.fx-zero-line {
  stroke: rgba(213, 179, 124, 0.38);
  stroke-width: 1;
  stroke-dasharray: 4 4;
}

.fx-line-secondary {
  fill: none;
  stroke: #7e9bc4;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.92;
}

.rates-geoscen-panel {
  min-height: 430px !important;
}

.rates-geoscen-evidence-block {
  min-height: 360px;
}

.rates-geoscen-body {
  gap: 12px;
}

.rates-geoscen-context-list {
  display: grid;
  gap: 10px;
  line-height: 1.55;
  font-size: 0.82rem;
}

.rates-yield-family-line {
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.95;
}

.fx-point-last {
  fill: #f2d8a7;
  stroke: rgba(3, 7, 13, 0.95);
  stroke-width: 2;
}


.industry-code-col,
.industry-code-cell {
  text-align: center;
  vertical-align: middle;
  width: 52px;
}

.industry-code-cell {
  color: #d5b37c;
  font-weight: 700;
  letter-spacing: 0.08em;
  font-size: 0.72rem;
}

.fx-chart-bars {
  min-height: 220px;
}

.fx-bar {
  fill: rgba(126, 153, 196, 0.58);
}

.fx-bar.selected {
  fill: rgba(213, 179, 124, 0.88);
}

.fx-bar-label {
  fill: #c9d3df;
  font-size: 10px;
  letter-spacing: 0.02em;
}

.fx-bar-value {
  fill: #eef3fa;
  font-size: 10px;
  font-weight: 600;
}

.fx-price-panel .fx-chart {
  background: #ffffff;
  border: 1px solid rgba(31, 42, 56, 0.18);
}

.fx-price-panel .fx-chart svg {
  background: #ffffff;
}

.fx-price-panel .fx-axis-label {
  fill: #4b5563;
  font-size: 10px;
  letter-spacing: 0.04em;
}

.fx-price-panel .fx-grid-line {
  stroke: rgba(107, 114, 128, 0.16);
  stroke-width: 1;
}

.fx-sma-line {
  fill: none;
  stroke: #111827;
  stroke-width: 1.8;
}

.fx-ema-line {
  fill: none;
  stroke: #2563eb;
  stroke-width: 1.8;
  stroke-dasharray: 6 4;
}

.fx-overlay-label {
  fill: #111827;
  font-size: 10px;
  font-weight: 600;
}

.fx-overlay-label.ema {
  fill: #2563eb;
}

.fx-overlay-label,
.fx-depth-live-label {
  display: none;
}

.bottom-toolbar {
  position: relative;
  height: var(--toolbar-h);
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  gap: 0;
  border-top: 1px solid rgba(160, 182, 220, 0.16);
  background:
    linear-gradient(180deg, rgba(4, 10, 18, 0.96), rgba(3, 8, 14, 0.98)),
    radial-gradient(
      circle at top center,
      rgba(62, 107, 187, 0.08),
      transparent 45%
    );
  backdrop-filter: blur(12px);
  z-index: 1;
}

.module-tab {
  border: none;
  border-right: 1px solid rgba(126, 153, 196, 0.08);
  background: transparent;
  color: var(--text-soft);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: 0.85rem;
  cursor: default;
  transition: 160ms ease;
}

.module-tab::before {
  content: 'â€¢';
  display: inline-block;
  margin-right: 8px;
  color: rgba(126, 137, 155, 0.72);
  font-size: 0.95rem;
  transform: translateY(-1px);
}

.module-tab.live.active {
  color: #f0f5fb;
  position: relative;
}

.module-tab.live.active::before {
  color: rgba(213, 179, 124, 0.92);
}

.module-tab.live.active::after {
  content: '';
  position: absolute;
  left: 18%;
  right: 18%;
  top: 0;
  height: 2px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(213, 179, 124, 0.95),
    transparent
  );
  box-shadow: 0 0 18px rgba(213, 179, 124, 0.35);
}

.module-tab:last-child {
  border-right: none;
}

.module-tab.preview {
  color: #909cad;
}

.module-tab.in-build {
  color: #788395;
}

.module-tab:disabled {
  opacity: 0.95;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 1280px) {
  .main-grid {
    grid-template-columns: 320px minmax(0, 1fr);
  }

  .metric-detail-grid,
  .cpmai-grid-expanded {
    grid-template-columns: 1fr;
  }

  .bottom-toolbar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    height: auto;
  }

  .module-tab {
    min-height: 58px;
  }
}

@media (max-width: 1180px) {
  .about-frame {
    grid-template-columns: 1fr;
  }

  .about-copy h1,
  .about-lead,
  .about-formula,
  .about-list {
    max-width: none;
  }

  .about-visual-stage {
    grid-template-rows: minmax(320px, auto) 100px;
  }
}

@media (max-width: 1100px) {
  .fx-main-grid {
    grid-template-columns: 1fr 1fr !important;
    grid-template-areas:
      'iv depth'
      'price spread'
      'geoscen sigma';
  }

  .chart-header-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 980px) {
  .topbar {
    height: auto;
    align-items: flex-start;
    gap: 12px;
  }

  .top-nav {
    margin-left: 0;
    width: 100%;
    gap: 8px 12px;
  }

  .release-tag {
    align-self: flex-start;
  }
}

@media (max-width: 980px) {
  .main-grid {
    grid-template-columns: 1fr;
  }

  .hero-grid,
  .two-column,
  .comparison-card {
    grid-template-columns: 1fr;
  }

  .sidebar-panel {
    order: 1;
  }

  .content-panel {
    order: 2;
    min-height: auto;
  }

  .content-footer {
    justify-content: flex-start;
  }

  .metric-detail-grid,
  .cpmai-grid-expanded {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .topbar {
    height: auto;
    padding: 16px 16px 14px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .brand-wrap {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .brand {
    font-size: 1.8rem;
  }

  .brand-subtitle {
    font-size: 0.9rem;
  }

  .release-tag {
    padding: 6px 10px;
    font-size: 0.68rem;
    letter-spacing: 0.08em;
  }

  .main-grid {
    grid-template-columns: 1fr !important;
    gap: 16px;
    padding: 16px 16px 16px;
  }

  .sidebar-panel,
  .content-panel {
    width: 100%;
    padding: 16px;
  }

  .sidebar-nav {
    gap: 8px;
  }

  .nav-item {
    width: 100%;
    padding: 12px;
    font-size: 0.95rem;
    border-radius: 10px;
  }

  .nav-child {
    padding: 10px 12px 10px 24px;
    font-size: 0.9rem;
  }

  .content-panel {
    min-height: auto;
  }

  .content-header h1 {
    font-size: clamp(1.7rem, 8vw, 2.4rem);
    line-height: 1.08;
  }

  .hero-grid,
  .two-column,
  .comparison-card,
  .metric-detail-grid,
  .cpmai-grid-expanded {
    grid-template-columns: 1fr !important;
  }

  .content-footer {
    justify-content: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .lead {
    font-size: 1.02rem;
    max-width: none;
  }

  .bottom-toolbar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    height: auto;
  }

  .module-tab {
    min-height: 56px;
    font-size: 0.74rem;
    letter-spacing: 0.06em;
  }

  .fx-toolbar {
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    row-gap: 10px;
    overflow-x: visible;
    overflow-y: visible;
  }

  .fx-toolbar .fx-control-group {
    display: grid;
    grid-template-columns: 88px 1fr;
    align-items: center;
    gap: 8px;
    width: 100%;
  }

  .fx-toolbar .fx-control-group:nth-child(1) {
    order: 1;
  }

  .fx-toolbar .fx-control-group:nth-child(3) {
    order: 2;
  }

  .fx-toolbar .fx-control-group:nth-child(2) {
    order: 3;
  }

  .fx-toolbar .fx-control-group:nth-child(4) {
    order: 4;
  }

  .fx-control-group select {
    width: 100%;
    min-width: 0;
  }

  .fx-main-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      'iv'
      'depth'
      'price'
      'geoscen'
      'sigma'
      'spread';
    gap: 14px;
  }

  .fx-depth-panel {
    grid-area: depth;
  }

  .fx-panel,
  .fx-price-panel,
  .fx-spread-panel,
  .fx-geoscen-panel,
  .fx-sigma-panel,
  .fx-reserved-panel {
    min-height: 180px;
    width: 100%;
  }

  .panel-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .panel-badge {
    white-space: normal;
  }

  .fx-depth-panel {
    grid-area: depth;
    min-height: 320px;
  }

  .chart-header-row {
    grid-template-columns: 1fr;
  }

  .fx-chart,
  .fx-price-panel .fx-chart,
  .fx-spread-panel .fx-chart {
    min-height: 200px;
  }

  .about-frame {
    min-height: auto;
    padding: 18px 16px 14px;
    gap: 18px;
  }

  .about-copy h1 {
    font-size: clamp(2rem, 9vw, 2.8rem);
  }

  .about-lead {
    font-size: 1rem;
    line-height: 1.6;
  }

  .about-visual-stage {
    grid-template-rows: 260px 80px;
  }
}

.about-view {
  min-height: 100%;
}

.about-shell {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.about-frame {
  width: 100%;
  min-height: 620px;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
  gap: 28px;
  padding: 26px 24px 18px;
  border: 1px solid rgba(126, 153, 196, 0.12);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(6, 14, 24, 0.82), rgba(4, 10, 18, 0.76)),
    radial-gradient(
      circle at top center,
      rgba(56, 98, 171, 0.08),
      transparent 46%
    );
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.about-copy {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 18px;
  padding: 8px 8px 8px 6px;
}

.about-copy h1 {
  margin: 6px 0 0;
  max-width: 15ch;
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2.6rem, 4vw, 4rem);
  line-height: 1.02;
  font-weight: 600;
  letter-spacing: 0.005em;
}

.about-lead {
  max-width: 21ch;
  font-size: 1.18rem;
  line-height: 1.72;
  color: #edf2f9;
}

.about-formula {
  max-width: 760px;
  padding: 28px 24px;
}

.about-list {
  max-width: 760px;
  gap: 16px;
  padding-left: 24px;
  font-size: 1.02rem;
  color: #d8e0eb;
}

.about-visual-stage {
  display: grid;
  grid-template-rows: 1fr 120px;
  gap: 18px;
  align-items: start;
  min-height: 100%;
}

.about-stack {
  min-height: 350px;
  height: 100%;
}

.about-lower-panel {
  position: relative;
  border: 1px solid rgba(126, 153, 196, 0.1);
  border-radius: 14px;
  background: linear-gradient(
    180deg,
    rgba(8, 17, 28, 0.62),
    rgba(6, 13, 22, 0.5)
  );
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.01);
}

.about-lower-panel .panel-source {
  position: absolute;
  bottom: 10px;
  right: 14px;
  font-size: 0.65rem;
  color: #7f8fa6;
  letter-spacing: 0.04em;
  opacity: 0.85;
}

.panel-source {
  margin-top: 10px;
  color: #7f8ea3;
  font-size: 0.72rem;
  line-height: 1.35;
  letter-spacing: 0.03em;
}

.panel-footnote-price {
  margin-top: 10px;
  text-align: right;
}

.panel-footnote-spread {
  margin-top: 10px;
  text-align: right;
}

.wti-main-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-areas:
    'inventory price macro'
    'geoscen sigma reserved';
  gap: 18px;
}

.wti-inventory-panel {
  grid-area: inventory;
}
.wti-price-panel {
  grid-area: price;
}
.wti-macro-panel {
  grid-area: macro;
}
.wti-geoscen-panel {
  grid-area: geoscen;
}
.wti-sigma-panel {
  grid-area: sigma;
}
#view-wti .fx-reserved-panel {
  grid-area: reserved;
}

#view-wti .fx-panel {
  min-height: 280px;
}

#view-wti .wti-inventory-panel,
#view-wti .wti-price-panel,
#view-wti .wti-macro-panel {
  min-height: 360px;
}

#view-wti .wti-geoscen-panel,
#view-wti .wti-sigma-panel,
#view-wti .fx-reserved-panel {
  min-height: 260px;
}

@media (max-width: 1200px) {
  .wti-main-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      'inventory price'
      'macro geoscen'
      'sigma reserved';
  }

  .wti-main-grid > .fx-panel {
    grid-column: auto;
    grid-row: auto;
  }
}

@media (max-width: 820px) {
  .wti-main-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      'inventory'
      'price'
      'macro'
      'geoscen'
      'sigma'
      'reserved';
  }
}

body.about-sidebar-hidden .sidebar-panel {
  display: none;
}

body.about-sidebar-hidden .main-grid {
  grid-template-columns: 1fr;
}

@media (max-width: 680px) {
  #view-wti .wti-main-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      'inventory'
      'price'
      'macro'
      'geoscen'
      'sigma'
      'reserved';
    gap: 14px;
  }

  #view-wti .fx-panel,
  #view-wti .wti-inventory-panel,
  #view-wti .wti-price-panel,
  #view-wti .wti-macro-panel,
  #view-wti .wti-geoscen-panel,
  #view-wti .wti-sigma-panel,
  #view-wti .fx-reserved-panel {
    min-height: 180px;
    width: 100%;
  }

  #view-wti .panel-head {
    flex-direction: column;
    align-items: flex-start;
  }

  #view-wti .panel-badge {
    white-space: normal;
  }

  #view-wti .chart-header-row {
    grid-template-columns: 1fr;
  }

  #view-wti .fx-chart,
  #view-wti .wti-inventory-panel .fx-chart,
  #view-wti .wti-price-panel .fx-chart,
  #view-wti .wti-macro-panel .fx-chart,
  #view-wti .wti-sigma-panel .fx-chart {
    min-height: 200px;
  }
}

#equities-region option {
  color: #d9e2ef;
}

.equities-main-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: auto auto !important;
  align-items: start !important;
  gap: 18px;
  overflow: visible !important;
}

.equities-left-stack,
.equities-left-top-grid {
  display: contents;
}

.equities-iv-panel {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: start !important;
  height: auto !important;
  min-height: unset !important;
}

.equities-index-panel {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: start !important;
  height: auto !important;
  min-height: unset !important;
}

.equities-top-right-panel {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

.equities-geoscen-panel {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

.equities-industry-panel {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

.equities-sigma-panel {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

.equities-chamber-panel {
  display: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  grid-column: 3 !important;
  grid-row: 3 !important;
}

@media (max-width: 1200px) {
  .equities-main-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  .equities-index-panel {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  .equities-industry-panel {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  .equities-top-right-panel {
    grid-column: 1 / span 2 !important;
    grid-row: 2 !important;
  }

  .equities-geoscen-panel {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }

  .equities-sigma-panel {
    grid-column: 2 !important;
    grid-row: 3 !important;
  }

  .equities-reserved-panel {
    grid-column: 1 / span 2 !important;
    grid-row: 4 !important;
  }
}

@media (max-width: 820px) {
  .equities-main-grid {
    grid-template-columns: 1fr !important;
  }

  .equities-index-panel,
  .equities-industry-panel,
  .equities-top-right-panel,
  .equities-geoscen-panel,
  .equities-sigma-panel,
  .equities-reserved-panel {
    grid-column: 1 !important;
  }

  .equities-index-panel {
    grid-row: 1 !important;
  }
  .equities-industry-panel {
    grid-row: 2 !important;
  }
  .equities-top-right-panel {
    grid-row: 3 !important;
  }
  .equities-geoscen-panel {
    grid-row: 4 !important;
  }
  .equities-sigma-panel {
    grid-row: 5 !important;
  }
  .equities-reserved-panel {
    grid-row: 6 !important;
  }
}

@media (max-width: 680px) {
  #view-equities .panel-head {
    flex-direction: column;
    align-items: flex-start;
  }

  #view-equities .panel-badge {
    white-space: normal;
  }

  #view-equities .chart-header-row {
    grid-template-columns: 1fr;
  }

  #view-equities .fx-chart,
  #view-equities .equities-index-panel .fx-chart,
  #view-equities .equities-industry-panel .fx-chart,
  #view-equities .equities-top-right-panel .fx-chart,
  #view-equities .equities-sigma-panel .fx-chart {
    min-height: 200px;
  }
}

.finstate-main-grid,
.cflow-main-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: auto auto;
  gap: 18px;
}

.finstate-iv-panel,
.cflow-fcf-panel {
  grid-column: 1;
  grid-row: 1;
}

.finstate-i2-panel,
.cflow-quality-panel {
  grid-column: 2;
  grid-row: 1;
}

.finstate-metrics-panel,
.cflow-liquidity-panel {
  grid-column: 3;
  grid-row: 1;
}

.finstate-geoscen-panel,
.cflow-geoscen-panel {
  grid-column: 1;
  grid-row: 2;
}

.finstate-constituents-panel {
  grid-column: 2;
  grid-row: 2;
}

.finstate-statements-panel {
  grid-column: 3;
  grid-row: 2;
}

.finstate-lens-story {
  margin-top: 4px;
  color: #9fb3c8;
  font-size: 0.7rem;
  line-height: 1.45;
  letter-spacing: 0.03em;
  text-transform: none;
}

.finstate-main-grid,
.cflow-main-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: auto auto;
  gap: 18px;
}

#view-finstate .finstate-constituents-table th:nth-child(2),
#view-finstate .finstate-constituents-table td:nth-child(2) {
  font-weight: 600 !important;
  color: #eef3fa !important;
  letter-spacing: 0.01em;
}

.cflow-statement-panel {
  grid-column: 2;
  grid-row: 2;
}

.finstate-vinv-panel,
.cflow-risk-panel {
  grid-column: 3;
  grid-row: 2;
}

#view-finstate .fx-panel,
#view-cflow .fx-panel {
  min-height: 280px;
}

#view-finstate .finstate-iv-panel,
#view-finstate .finstate-i2-panel,
#view-finstate .finstate-metrics-panel,
#view-cflow .cflow-fcf-panel,
#view-cflow .cflow-quality-panel,
#view-cflow .cflow-liquidity-panel {
  min-height: 360px;
}

.cflow-metric-summary-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.cflow-metric-summary-row > div {
  min-height: 52px;
  padding: 9px 10px;
  border: 1px solid rgba(126, 153, 196, 0.12);
  border-radius: 8px;
  background: rgba(8, 17, 28, 0.62);
}

.cflow-metric-summary-row span {
  display: block;
  color: var(--text-muted);
  font-size: 0.62rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.cflow-metric-summary-row strong {
  display: block;
  margin-top: 5px;
  color: #eef3fa;
  font-size: 0.92rem;
  line-height: 1.2;
}

.cflow-metric-chart {
  width: 100%;
  height: 260px;
  min-height: 240px;
  border: 1px solid rgba(126, 153, 196, 0.1);
  border-radius: 8px;
  background: rgba(3, 7, 13, 0.2);
  overflow: hidden;
}

#cflow-regime-summary.cflow-chart-host {
  display: block;
  min-height: 292px;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: initial;
}

.cflow-metric-chart .plot-container,
.cflow-metric-chart .svg-container {
  width: 100% !important;
  height: 100% !important;
}

.cflow-metric-line {
  stroke: #4caf50;
  stroke-width: 2;
}

@media (max-width: 820px) {
  .finstate-main-grid,
  .cflow-main-grid {
    grid-template-columns: 1fr !important;
  }

  .finstate-main-grid > .fx-panel,
  .cflow-main-grid > .fx-panel {
    grid-column: 1 !important;
  }
}

.macro-main-grid {
  display: grid !important;
  grid-template-columns: 1.45fr 1.45fr 0.4fr;
  grid-template-rows: auto auto;
  gap: 18px;
  align-items: start;
}

.macro-drivers-panel {
  grid-column: 1;
  grid-row: 1;
  min-height: 360px;
}

.macro-transmission-panel {
  grid-column: 2;
  grid-row: 1;
  min-height: 360px;
}

.macro-transmission-panel .macro-panel-heading {
  margin-bottom: 8px;
}

.macro-transmission-title {
  font-size: inherit;
  font-weight: inherit;
  line-height: 1;
  margin-bottom: 0;
  text-transform: uppercase;
}

.macro-transmission-subtitle {
  margin-top: 2px;
  font-size: 0.65rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.03em;
  opacity: 0.65;
  text-transform: none;
}

.macro-lag-panel {
  position: relative;
  grid-column: 3;
  grid-row: 1;
  min-height: 360px;
}

.macro-exposure-panel {
  grid-column: 1;
  grid-row: 2;
  min-height: 320px;
}

.macro-impact-panel {
  grid-column: 2;
  grid-row: 2;
  min-height: 320px;
}

.macro-riskstack-panel {
  grid-column: 1;
  grid-row: 1;
  min-height: 360px;
}

.macro-regime-analogues-panel {
  grid-column: 2;
  grid-row: 1;
  min-height: 360px;
}

.macro-metric-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.macro-metric-tile {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 56px;
  padding: 12px 14px;
  border: 1px solid rgba(126, 153, 196, 0.12);
  border-radius: 10px;
  background: linear-gradient(
    180deg,
    rgba(8, 17, 28, 0.72),
    rgba(7, 14, 24, 0.58)
  );
}

.macro-metric-tile span {
  color: #d7e0eb;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.macro-metric-tile strong {
  color: #f2d8a7;
  font-size: 1.05rem;
  font-weight: 700;
}

.iv-contract-group {
  margin-top: 12px;
  padding: 10px;
  border: 1px solid rgba(126, 153, 196, 0.12);
  border-radius: 12px;
  background: rgba(8, 17, 28, 0.34);
}

.iv-group-title {
  margin-bottom: 2px;
  color: #9fb3c8;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.iv-contract-group .macro-metric-stack {
  gap: 8px;
}

.iv-contract-group .macro-metric-tile {
  min-height: 42px;
  padding: 8px 11px;
}

.iv-group-pressure {
  border-left: 3px solid rgba(142, 201, 163, 0.7);
}

.iv-group-fragility {
  border-left: 3px solid rgba(126, 155, 196, 0.7);
}

.iv-group-transmission {
  border-left: 3px solid rgba(213, 179, 124, 0.75);
}

.iv-group-outcome {
  border-left: 3px solid rgba(160, 170, 185, 0.75);
}

.iv-group-regime-analogues {
  border-left: 3px solid rgba(148,123,255,0.75);
}

.regime-analogue-oc-area {
  margin-top: 10px;
  min-height: 220px;

  display: flex;
  align-items: center;
  justify-content: center;

  color: #7c5cff;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;

  border: none;
  background: transparent;
}



@media (max-width: 1200px) {
  .macro-main-grid {
    grid-template-columns: 1fr 1fr;
  }

  .macro-lag-panel {
    grid-column: 1 / span 2;
    grid-row: 2;
  }

  .macro-exposure-panel {
    grid-column: 1;
    grid-row: 3;
  }

  .macro-impact-panel {
    grid-column: 2;
    grid-row: 3;
  }

  .macro-riskstack-panel {
    grid-column: 1 / span 2;
    grid-row: 4;
    min-height: auto;
  }

  .macro-drivers-panel {
    grid-column: 1;
    grid-row: 1;
  }

  .macro-transmission-panel {
    grid-column: 2;
    grid-row: 1;
  }
}

@media (max-width: 820px) {
  .macro-main-grid {
    grid-template-columns: 1fr !important;
  }

  .macro-drivers-panel,
  .macro-transmission-panel,
  .macro-lag-panel,
  .macro-exposure-panel,
  .macro-impact-panel,
  .macro-riskstack-panel {
    grid-column: 1 !important;
  }

  .macro-drivers-panel {
    grid-row: 1 !important;
  }
  .macro-transmission-panel {
    grid-row: 2 !important;
  }
  .macro-lag-panel {
    grid-row: 3 !important;
  }
  .macro-exposure-panel {
    grid-row: 4 !important;
  }
  .macro-impact-panel {
    grid-row: 5 !important;
  }
  .macro-riskstack-panel {
    grid-row: 6 !important;
  }
}

.rates-main-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: 320px 320px auto;
  gap: 18px;
  align-items: stretch;
}

.rates-iv-panel {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

.rates-curve-panel {
  grid-column: 2 !important;
  grid-row: 1 !important;
}

.rates-policy-panel {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

.rates-geoscen-panel {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

.rates-spread-panel {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

.rates-sigma-panel {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

.rates-state-engine-panel {
  grid-column: 1 / span 3 !important;
  grid-row: 3 !important;
}

.rates-reserved-right-panel {
  display: none;
}
@media (max-width: 1200px) {
  .rates-main-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  .rates-iv-panel {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }
  .rates-curve-panel {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }
  .rates-policy-panel {
    grid-column: 1 / span 2 !important;
    grid-row: 2 !important;
  }
  .rates-geoscen-panel {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }
  .rates-spread-panel {
    grid-column: 2 !important;
    grid-row: 3 !important;
  }
  .rates-sigma-panel {
    grid-column: 1 / span 2 !important;
    grid-row: 4 !important;
  }
  .rates-state-engine-panel {
    grid-column: 1 / span 2 !important;
    grid-row: 5 !important;
  }
}

@media (max-width: 820px) {
  .rates-main-grid {
    grid-template-columns: 1fr !important;
  }

  .rates-iv-panel,
  .rates-curve-panel,
  .rates-policy-panel,
  .rates-geoscen-panel,
  .rates-spread-panel,
  .rates-sigma-panel {
    grid-column: 1 !important;
  }

  .rates-iv-panel {
    grid-row: 1 !important;
  }
  .rates-curve-panel {
    grid-row: 2 !important;
  }
  .rates-policy-panel {
    grid-row: 3 !important;
  }
  .rates-geoscen-panel {
    grid-row: 4 !important;
  }
  .rates-spread-panel {
    grid-row: 5 !important;
  }
  .rates-sigma-panel {
    grid-row: 6 !important;
  }
  .rates-state-engine-panel {
    grid-column: 1 !important;
    grid-row: 7 !important;
  }
}

@media (max-width: 680px) {
  #view-rates .panel-head {
    flex-direction: column;
    align-items: flex-start;
  }

  #view-rates .panel-badge {
    white-space: normal;
  }

  #view-rates .chart-header-row {
    grid-template-columns: 1fr;
  }

  #view-rates .fx-chart,
  #view-rates .rates-curve-panel .fx-chart,
  #view-rates .rates-spread-panel .fx-chart,
  #view-rates .rates-policy-panel .fx-chart,
  #view-rates .rates-sigma-panel .fx-chart {
    min-height: 200px;
  }

  #view-rates .fx-panel,
  #view-rates .rates-curve-panel,
  #view-rates .rates-spread-panel,
  #view-rates .rates-policy-panel,
  #view-rates .rates-geoscen-panel,
  #view-rates .rates-sigma-panel,
  #view-rates .rates-state-engine-panel,
  #view-rates .rates-reserved-right-panel {
    min-height: 180px;
    width: 100%;
  }
}

#view-rates .fx-panel {
  min-height: 280px;
}

#view-rates .rates-policy-panel.rates-metric-blank .chart-shell {
  display: none;
}

#view-rates .rates-geoscen-panel,
#view-rates .rates-spread-panel,
#view-rates .rates-sigma-panel {
  height: 320px;
  min-height: 320px;
  max-height: 320px;
  overflow: hidden;
}

#view-rates .rates-geoscen-panel .panel-placeholder {
  min-height: 185px;
  max-height: 185px;
  overflow: hidden;
}

#view-rates .rates-spread-panel .fx-chart,
#view-rates .rates-sigma-panel .fx-chart {
  height: 210px;
  min-height: 210px;
  max-height: 210px;
  overflow: hidden;
}

#view-rates .rates-curve-panel,
#view-rates .rates-policy-panel {
  min-height: 360px;
}

#view-rates .rates-reserved-left-panel,
#view-rates .rates-reserved-right-panel {
  min-height: 260px;
}

.top-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-left: auto;
  margin-right: auto;
  flex: 1 1 auto;
  min-width: 0;
  flex-wrap: wrap;
}

.top-nav-item {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 42px;
  padding: 4px 8px;
  border: 1px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #d5dee9;
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transition:
    color 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    opacity 180ms ease;
}

.top-nav-item:hover:not(:disabled) {
  color: #f4f7fb;
  background: transparent;
  border-color: transparent;
}

.top-nav-item.active {
  color: #f5f8fc;
  background: transparent;
  border-color: transparent;
}

.top-nav-item:is(
  [data-view="macro"],
  [data-view="finstate"],
  [data-view="cflow"],
  [data-view="equities"],
  [data-view="fx"],
  [data-view="rates"]
),
.top-nav-item:is(
  [data-view="macro"],
  [data-view="finstate"],
  [data-view="cflow"],
  [data-view="equities"],
  [data-view="fx"],
  [data-view="rates"]
):is(:hover, :focus, :focus-visible, :active, .active, [aria-current="page"]) {
  color: #8F9AAC;
}

.top-nav-item::after {
  content: '';
  position: absolute;
  left: 10%;
  right: 10%;
  bottom: -8px;
  height: 2px;
  background: transparent;
  transition: all 200ms ease;
}

.top-nav-item:is(.active, [aria-current="page"])::after {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(213, 179, 124, 0.95),
    transparent
  );
  box-shadow: 0 0 10px rgba(213, 179, 124, 0.35);
}

.top-nav-item.about-tab.active::after {
    background: linear-gradient(
        90deg,
        transparent,
        var(--about-black),
        transparent
    );
    box-shadow: 0 0 8px rgba(0,0,0,.25);
}

.top-nav-item[data-view="cflow"]:is(.active, [aria-current="page"])::after,
.top-nav-item[data-view="rates"]:is(.active, [aria-current="page"])::after {
  background: linear-gradient(90deg, transparent, #4CAF50, transparent);
  box-shadow: 0 0 10px rgba(76, 175, 80, 0.35);
}

.top-nav-item[data-view="macro"]:is(.active, [aria-current="page"])::after {
  background: linear-gradient(90deg, transparent, #0F52BA, transparent);
  box-shadow: 0 0 10px rgba(15, 82, 186, 0.35);
}

.top-nav-item[data-view="finstate"]:is(.active, [aria-current="page"])::after {
  background: linear-gradient(90deg, transparent, #4CAF50, transparent);
  box-shadow: 0 0 10px rgba(76, 175, 80, 0.35);
}

.top-nav-item[data-view="equities"]:is(.active, [aria-current="page"])::after,
.top-nav-item[data-view="fx"]:is(.active, [aria-current="page"])::after {
  background: linear-gradient(90deg, transparent, #D4AF37, transparent);
  box-shadow: 0 0 10px rgba(212, 175, 55, 0.35);
}

.top-nav-item:is(
  [data-view="macro"],
  [data-view="finstate"],
  [data-view="cflow"],
  [data-view="equities"],
  [data-view="fx"],
  [data-view="rates"]
 )::after {
  bottom: -6px;
}

.top-nav-item:is(
  [data-view="macro"],
  [data-view="finstate"],
  [data-view="cflow"],
  [data-view="equities"],
  [data-view="fx"],
  [data-view="rates"]
 )::before {
  content: '';
  position: absolute;
  left: 10%;
  right: 10%;
  bottom: -10px;
  height: 2px;
  background: transparent;
  pointer-events: none;
  transition:
    background-color 200ms ease,
    box-shadow 200ms ease;
}

.top-nav-item:is(
  [data-view="macro"],
  [data-view="finstate"],
  [data-view="cflow"],
  [data-view="equities"],
  [data-view="fx"],
  [data-view="rates"]
):is(.active, [aria-current="page"])::before {
  background: linear-gradient(90deg, transparent, #FFFFFF, transparent);
  box-shadow: 0 0 8px rgba(255, 255, 255, 0.28);
}

.top-nav-item:disabled {
  color: #7f8a9b;
  background: transparent;
  border-color: transparent;
  opacity: 0.55;
  cursor: not-allowed;
}

.top-nav-item .dot {
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(213, 179, 124, 0.68);
  box-shadow: 0 0 6px rgba(213, 179, 124, 0.45);
  flex: 0 0 5px;
  order: -1;
}

.top-nav-item.about-tab {
    color: var(--about-black);
}

.top-nav-item.about-tab .dot {
    background: var(--about-black);
    box-shadow: 0 0 6px rgba(0,0,0,.35);
}

.top-nav-item[data-view="cflow"] .dot,
.top-nav-item[data-view="rates"] .dot {
  background: #4CAF50;
  box-shadow: 0 0 6px rgba(76, 175, 80, 0.45);
}

.top-nav-item[data-view="macro"] .dot {
  background: #0F52BA;
  box-shadow: 0 0 6px rgba(15,82,186,.45);
}

.top-nav-item[data-view="finstate"] .dot {
  background: #4CAF50;
  box-shadow: 0 0 6px rgba(76, 175, 80, 0.45);
}

.top-nav-item[data-view="equities"] .dot,
.top-nav-item[data-view="fx"] .dot {
  background: #D4AF37;
  box-shadow: 0 0 6px rgba(212, 175, 55, 0.45);
}

.oc-view {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.top-nav-item.oc-tab {
  color: #7c5cff;
  border-bottom: 2px solid #7c5cff;
}


.top-nav-item.oc-tab-ch {
  color: #FF0000;
  border-bottom: 2px solid #FF0000;
}

.top-nav-item.oc-tab:hover {
  color: #9b87ff;
}

.top-nav-item.oc-tab.active {
  color: #7c5cff;
}

.top-nav-item.oc-tab.active::after {
  background: linear-gradient(90deg, transparent, #7c5cff, transparent);
  box-shadow: 0 0 10px rgba(124, 92, 255, 0.35);
}

.top-nav-item.sys-tab {
    color: var(--vector-silver);
}

/* ==========================
   SYS DROPDOWN
   ========================== */

.sys-nav-menu {
  position: relative;
  display: inline-flex;
  align-items: center;
  overflow: visible;
}

.top-nav {
  overflow: visible;
}

.topbar {
  overflow: visible;
}

.sys-tab[aria-expanded="true"] {
  color: #c8d0dc;
}

.sys-tab[aria-expanded="true"]::after {
  background: linear-gradient(
    90deg,
    transparent,
    var(--vector-silver),
    transparent
  );
  box-shadow: 0 0 10px rgba(143, 154, 172, 0.28);
}

.sys-dropdown {
  position: absolute;

  top: calc(100% + 10px);
  left: 50%;
  right: auto;
  transform: translateX(-50%);

  width: 260px;
  min-width: 260px;
  max-width: min(320px, calc(100vw - 24px));

  padding: 10px;

  border: 1px solid rgba(143, 154, 172, 0.22);
  border-radius: 8px;

  background:
    linear-gradient(
      180deg,
      rgba(8, 18, 32, 0.98),
      rgba(5, 12, 22, 0.98)
    );

  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.45);

  z-index: 6000;
}

.sys-dropdown[hidden] {
    display: none;
}

.sys-dropdown-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  width: 100%;
  min-height: 42px;
  height: auto;

  padding: 9px 12px;

  border: 0;
  border-radius: 6px;

  background: transparent;
  color: var(--vector-silver);

  text-align: left;
  text-transform: uppercase;

  letter-spacing: 0.07em;
  font-size: 0.68rem;
  line-height: 1.25;

  white-space: nowrap;
}

.sys-dropdown-item:hover:not(:disabled) {
    background: rgba(255,255,255,.04);
}

.sys-dropdown-item:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.oc-content {
  text-align: center;
}

.oc-image {
  width: 100%;
  max-width: 840px;
  border-radius: 12px;
  opacity: 0.9;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
}

.oc-text {
  margin-top: 18px;
  font-size: 0.9rem;
  letter-spacing: 0.12em;
  color: rgba(200, 210, 230, 0.7);
  text-transform: uppercase;
}

body.view-oc .sidebar-panel {
  display: none !important;
}

body.view-oc .main-grid {
  grid-template-columns: 1fr !important;
}

#view-oc {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

#view-oc .oc-view {
  width: 100%;
  min-height: 520px;
  max-height: calc(100vh - 170px);
  overflow: hidden;
}

#view-oc .oc-content {
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
}

#view-oc .oc-image {
  width: 100%;
  max-width: 720px;
  max-height: 420px;
  object-fit: contain;
}

.content-panel {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.content-view {
  flex: 1;
}

@media (max-width: 980px) {
  .topbar {
    height: auto;
    padding: 14px 14px 12px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .brand-wrap {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .brand {
    font-size: 1.8rem;
  }

  .brand-subtitle {
    font-size: 0.84rem;
  }

  .top-nav {
    width: 100%;
    margin-left: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }

  .top-nav-item {
    justify-content: center;
    align-items: center;
    width: 100%;
    min-width: 0;
    min-height: 42px;
    padding: 6px 4px;
    font-size: 0.62rem;
    letter-spacing: 0.03em;
    line-height: 1.1;
    text-align: center;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .top-nav-item .dot {
    display: inline-block;
  }

  .release-tag {
    display: none;
  }
}

.equities-line-1,
.equities-line-2,
.equities-line-3,
.equities-line-4,
.equities-line-5,
.equities-line-6 {
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}



.equities-line-1 {
  stroke: #f2d8a7;
}
.equities-line-2 {
  stroke: #7e9bc4;
}
.equities-line-3 {
  stroke: #8ec9a3;
}
.equities-line-4 {
  stroke: #d17979;
}
.equities-line-5 {
  stroke: #b6c3d2;
}
.equities-line-6 {
  stroke: #cdb287;
}

.equities-legend-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.03em;
}

.equities-bar-positive {
  fill: rgba(142, 201, 163, 0.65);
}

.equities-bar-negative {
  fill: rgba(209, 121, 121, 0.65);
}

.panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.panel-meta {
  font-size: 0.72rem;
  opacity: 0.8;
}

.panel-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0 14px;
}

.stat-label {
  font-size: 0.72rem;
  opacity: 0.72;
  margin-bottom: 4px;
}

.stat-value {
  font-size: 1rem;
  font-weight: 600;
}

.panel-chart {
  min-height: 180px;
}

.panel-empty {
  font-size: 0.85rem;
  opacity: 0.72;
}

.mini-line-chart {
  width: 100%;
  height: 180px;
  display: block;
}

[data-state='high'] {
  opacity: 1;
}

[data-state='low'] {
  opacity: 1;
}

[data-state='neutral'] {
  opacity: 0.85;
}

.equities-pmi-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.equities-pmi-summary-card {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 10px 12px;
  background: rgba(8, 18, 33, 0.55);
}

.equities-pmi-summary-card .label {
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a9bad;
  margin-bottom: 4px;
}

.equities-pmi-summary-card .value {
  font-size: 1rem;
  font-weight: 600;
  color: #eef3fa;
}

.ism-apf-shell {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
}

.equities-ism-substructure {
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(7, 15, 27, 0.72);
  padding: 10px;
}

.equities-ism-substructure > .equities-industry-section-title {
  margin: -10px -10px 10px;
}

.ism-apf-column {
  display: grid;
  align-content: start;
  align-items: stretch;
  justify-content: stretch;
  justify-items: stretch;
  grid-auto-rows: max-content;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid rgba(138, 155, 173, 0.16);
  border-radius: 8px;
  background: rgba(8, 18, 32, 0.56);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.ism-apf-column:hover,
.ism-apf-column:focus-visible {
  border-color: rgba(155, 181, 214, 0.38);
  background: rgba(11, 24, 42, 0.72);
  outline: none;
}

.ism-apf-column.is-active {
  border-color: rgba(213, 179, 124, 0.48);
  box-shadow: inset 0 0 0 1px rgba(213, 179, 124, 0.1);
}

.ism-apf-column-title {
  margin-bottom: 6px;
  color: #d5b37c;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ism-apf-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 4px 0;
  border-top: 1px solid rgba(138, 155, 173, 0.1);
  color: #aeb8c3;
  font-size: 0.72rem;
}

.ism-apf-row:first-of-type {
  border-top: 0;
}

.ism-apf-row strong {
  color: #eef3fa;
  font-size: 0.78rem;
}

.ism-apf-row.combined strong {
  color: #f1eee4;
}

.ism-apf-row.combined strong.ism-apf-combined-strong-positive {
  color: #69ef9b;
  text-shadow: 0 0 7px rgba(105, 239, 155, 0.38);
}

.ism-apf-row.combined strong.ism-apf-combined-positive {
  color: #79d99a;
}

.ism-apf-row.combined strong.ism-apf-combined-mild-positive {
  color: #acd9b9;
}

.ism-apf-row.combined strong.ism-apf-combined-neutral {
  color: #f1eee4;
}

.ism-apf-row.combined strong.ism-apf-combined-mild-negative {
  color: #e2aaa8;
}

.ism-apf-row.combined strong.ism-apf-combined-negative {
  color: #e47d79;
}

.ism-apf-row.combined strong.ism-apf-combined-strong-negative {
  color: #ff716d;
  text-shadow: 0 0 7px rgba(255, 113, 109, 0.38);
}

.ism-apf-activity-lens {
  display: grid;
  gap: 3px;
  margin-top: 7px;
  padding-top: 7px;
  border-top: 1px solid rgba(138, 155, 173, 0.12);
}

.ism-apf-lens-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: rgba(174, 184, 195, 0.82);
  font-size: 0.62rem;
}

.ism-apf-lens-row strong {
  color: rgba(238, 243, 250, 0.86);
  font-size: 0.66rem;
}

.ism-apf-source {
  margin-top: -2px;
  margin-bottom: 2px;
  color: rgba(138, 155, 173, 0.62);
  font-size: 0.58rem;
  letter-spacing: 0.04em;
}

.ism-apf-backdrop,
.ism-apf-chamber[hidden],
.ism-apf-backdrop[hidden] {
  display: none;
}

.ism-apf-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1190;
  background: rgba(1, 6, 12, 0.28);
  backdrop-filter: blur(1px);
  pointer-events: none;
}

.ism-apf-chamber {
  position: fixed;
  left: var(--ism-apf-popup-left, 50%);
  top: var(--ism-apf-popup-top, 50%);
  z-index: 1200;
  width: min(760px, calc(100vw - 24px));
  max-height: min(680px, 74vh);
  overflow-y: auto;
  padding: 10px;
  border: 1px solid rgba(155, 181, 214, 0.46);
  border-radius: 8px;
  background: rgba(6, 12, 22, 0.97);
  box-shadow:
    0 22px 54px rgba(0, 0, 0, 0.58),
    inset 0 0 0 1px rgba(238, 243, 250, 0.05);
}

.ism-apf-chamber:focus {
  outline: none;
}

.ism-apf-chamber-head,
.ism-apf-chamber-summary,
.ism-apf-component-row,
.ism-apf-component-head {
  display: grid;
  gap: 8px;
}

.ism-apf-chamber-head {
  grid-template-columns: 1fr auto;
  align-items: start;
  margin-bottom: 8px;
}

.ism-apf-chamber-kicker {
  color: rgba(138, 155, 173, 0.72);
  font-size: 0.58rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.ism-apf-chamber-title {
  color: #eef3fa;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ism-apf-chamber-title.ism-apf-activity {
  color: var(--iv-blue);
}

.ism-apf-chamber-title.ism-apf-pressure {
  color: var(--iv-gold);
}

.ism-apf-chamber-title.ism-apf-flow {
  color: var(--iv-green);
}

.ism-apf-chamber-title span {
  color: rgba(213, 179, 124, 0.86);
}

.ism-apf-chamber-close {
  width: 22px;
  height: 22px;
  border: 1px solid rgba(138, 155, 173, 0.18);
  border-radius: 6px;
  background: rgba(8, 18, 32, 0.72);
  color: #d8e0ea;
  cursor: pointer;
}

.ism-apf-chamber-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 8px;
}

.ism-apf-chamber-summary div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 7px;
  border: 1px solid rgba(138, 155, 173, 0.12);
  border-radius: 6px;
  color: #aeb8c3;
  font-size: 0.68rem;
}

.ism-apf-chamber-summary strong {
  color: #eef3fa;
}

.ism-apf-chamber-summary .combined {
  border-color: rgba(213, 179, 124, 0.22);
}

.ism-apf-exec-summary {
  display: grid;
  gap: 7px;
  margin: 4px 0 10px;
  padding: 8px;
  border: 1px solid rgba(138, 155, 173, 0.12);
  border-radius: 7px;
  background: rgba(8, 18, 32, 0.38);
}

.ism-apf-exec-title,
.ism-apf-temporal-title,
.ism-apf-drivers-title,
.ism-apf-geoscen-title,
.ism-apf-oracle-title,
.ism-apf-component-title {
  position: relative;
  padding-top: 7px;
  border-top: 1px solid rgba(138, 155, 173, 0.16);
  color: rgba(213, 179, 124, 0.82);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1.15;
  text-transform: uppercase;
}

.ism-apf-exec-title {
  border-top-color: rgba(213, 179, 124, 0.2);
}

.ism-apf-exec-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.ism-apf-exec-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px;
  min-width: 0;
  padding: 6px 7px;
  border: 1px solid rgba(126, 153, 196, 0.12);
  border-radius: 6px;
  background: rgba(6, 14, 25, 0.58);
}

.ism-apf-exec-card span,
.ism-apf-exec-net > span {
  grid-column: 1 / -1;
  color: rgba(138, 155, 173, 0.82);
  font-size: 0.54rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ism-apf-exec-card strong {
  grid-column: 1;
  overflow: hidden;
  color: rgba(238, 243, 250, 0.92);
  font-size: 0.64rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ism-apf-exec-card em {
  grid-column: 2;
  justify-self: end;
  color: #eef3fa;
  font-size: 0.68rem;
  font-style: normal;
  font-weight: 800;
}

.ism-apf-exec-net {
  display: grid;
  grid-template-columns: 76px 1fr;
  gap: 8px;
  align-items: center;
  padding-top: 6px;
  border-top: 1px solid rgba(138, 155, 173, 0.1);
}

.ism-apf-vector-participation {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.ism-apf-vector-letters,
.ism-apf-vector-dots {
  display: grid;
  grid-template-columns: repeat(8, minmax(18px, 1fr));
  align-items: center;
  column-gap: 5px;
  max-width: 255px;
}

.ism-apf-vector-letter,
.ism-apf-vector-dot {
  display: inline-grid;
  place-items: center;
  min-width: 0;
  color: rgba(174, 184, 195, 0.62);
  font-weight: 800;
  line-height: 1;
  text-align: center;
}

.ism-apf-vector-letter {
  font-size: 0.78rem;
  letter-spacing: 0.02em;
}

.ism-apf-vector-letter.is-secondary {
  font-size: 0.69rem;
}

.ism-apf-vector-letter.is-systemicity .iv-systemicity-letter {
  font-size: 1.05em;
}

.ism-apf-vector-letter.is-active,
.ism-apf-vector-dot.is-active {
  color: rgba(238, 243, 250, 0.94);
}

.ism-apf-vector-letter.is-p.is-active,
.ism-apf-vector-dot.is-active:nth-child(1) {
  color: rgba(105, 151, 205, 0.95);
}

.ism-apf-vector-letter.is-l.is-active,
.ism-apf-vector-dot.is-active:nth-child(3) {
  color: rgba(142, 201, 163, 0.95);
}

.ism-apf-vector-letter.is-m.is-active,
.ism-apf-vector-dot.is-active:nth-child(5) {
  color: rgba(213, 179, 124, 0.96);
}

.ism-apf-vector-dot {
  font-size: 0.62rem;
}

.ism-apf-vector-dot.is-inactive {
  color: rgba(138, 155, 173, 0.46);
}

.ism-apf-temporal {
  display: grid;
  gap: 9px;
  margin: 4px 0 10px;
  padding: 8px;
  border: 1px solid rgba(138, 155, 173, 0.12);
  border-radius: 7px;
  background: rgba(8, 18, 32, 0.42);
}

.ism-apf-temporal-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
  align-items: start;
  padding-top: 2px;
  border-top: 1px solid rgba(138, 155, 173, 0.08);
}

.ism-apf-temporal-row:first-of-type {
  padding-top: 0;
  border-top: 0;
}

.ism-apf-temporal-row-label {
  align-self: start;
  color: rgba(174, 184, 195, 0.86);
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1;
}

.ism-apf-temporal-path {
  display: grid;
  grid-template-columns: minmax(62px, 0.78fr) minmax(70px, 1fr) minmax(62px, 0.78fr) minmax(70px, 1fr) minmax(62px, 0.78fr);
  gap: 7px;
  align-items: center;
  min-width: 0;
}

.ism-apf-temporal-state {
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  gap: 5px;
  min-width: 0;
  color: rgba(138, 155, 173, 0.84);
  font-size: 0.6rem;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  white-space: nowrap;
}

.ism-apf-temporal-state strong {
  color: #eef3fa;
  font-size: 0.68rem;
  font-weight: 800;
}

.ism-apf-temporal-state span {
  color: rgba(138, 155, 173, 0.84);
}

.ism-apf-temporal-state.is-strengthening strong,
.ism-apf-temporal-transition.is-strengthening .ism-apf-temporal-delta {
  color: rgba(126, 226, 166, 0.92);
}

.ism-apf-temporal-transition.is-strengthening .ism-apf-temporal-line-segment,
.ism-apf-temporal-transition.is-strengthening .ism-apf-temporal-waypoint {
  background: rgba(126, 226, 166, 0.58);
}

.ism-apf-temporal-transition.is-strengthening {
  color: rgba(126, 226, 166, 0.58);
}

.ism-apf-temporal-state.is-weakening strong,
.ism-apf-temporal-transition.is-weakening .ism-apf-temporal-delta {
  color: rgba(236, 112, 119, 0.88);
}

.ism-apf-temporal-transition.is-weakening .ism-apf-temporal-line-segment,
.ism-apf-temporal-transition.is-weakening .ism-apf-temporal-waypoint {
  background: rgba(236, 112, 119, 0.5);
}

.ism-apf-temporal-transition.is-weakening {
  color: rgba(236, 112, 119, 0.5);
}

.ism-apf-temporal-state.is-stable strong,
.ism-apf-temporal-transition.is-stable .ism-apf-temporal-delta {
  color: rgba(216, 224, 234, 0.82);
}

.ism-apf-temporal-transition.is-stable .ism-apf-temporal-line-segment,
.ism-apf-temporal-transition.is-stable .ism-apf-temporal-waypoint {
  background: rgba(174, 184, 195, 0.42);
}

.ism-apf-temporal-transition.is-stable {
  color: rgba(174, 184, 195, 0.42);
}

.ism-apf-temporal-transition {
  display: grid;
  gap: 4px;
  min-width: 0;
  justify-items: center;
}

.ism-apf-temporal-rail {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--temporal-rail-width, 94%);
  max-width: 100%;
  min-width: 0;
}

.ism-apf-temporal-line-segment {
  display: block;
  flex: 1 1 auto;
  height: 1px;
  min-width: 24px;
  opacity: 0.9;
}

.ism-apf-temporal-line-segment::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  margin-left: auto;
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-left: 5px solid currentColor;
  color: inherit;
  transform: translate(5px, -2.5px);
}

.ism-apf-temporal-waypoint {
  display: block;
  width: 5px;
  height: 5px;
  margin-left: 7px;
  border-radius: 999px;
  opacity: 0.95;
}

.ism-apf-temporal-delta,
.ism-apf-temporal-direction {
  color: rgba(174, 184, 195, 0.72);
  font-size: 0.56rem;
  line-height: 1.2;
}

.ism-apf-temporal-delta {
  font-variant-numeric: tabular-nums;
}

.ism-apf-temporal-direction {
  text-transform: capitalize;
}

.ism-apf-flow-spread-row {
  display: grid;
  gap: 7px;
  padding-top: 6px;
  border-top: 1px solid rgba(142, 201, 163, 0.13);
}

.ism-apf-flow-spread-title {
  color: rgba(174, 184, 195, 0.86);
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1;
  text-align: center;
  text-transform: none;
}

.ism-apf-spread-timeline {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  align-items: center;
  min-width: 0;
}

.ism-apf-spread-timeline-point {
  position: relative;
  display: grid;
  grid-template-rows: auto auto auto;
  gap: 4px;
  min-width: 0;
  padding: 2px 8px;
  text-align: center;
}

.ism-apf-spread-month {
  color: rgba(138, 155, 173, 0.82);
  font-size: 0.54rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  white-space: nowrap;
}

.ism-apf-spread-value {
  position: relative;
  z-index: 1;
  display: inline-grid;
  place-self: center;
  min-width: 42px;
  color: #eef3fa;
  font-size: 0.68rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.ism-apf-spread-state {
  color: rgba(174, 184, 195, 0.72);
  font-size: 0.55rem;
  font-weight: 700;
  line-height: 1.1;
  white-space: nowrap;
}

.ism-apf-spread-timeline-point.is-negative .ism-apf-spread-value {
  color: rgba(236, 112, 119, 0.88);
}

.ism-apf-spread-timeline-point.is-positive .ism-apf-spread-value {
  color: rgba(126, 226, 166, 0.9);
}

.ism-apf-spread-timeline-point.is-reversal .ism-apf-spread-state {
  color: rgba(213, 179, 124, 0.86);
}

.ism-apf-spread-connector {
  position: absolute;
  z-index: 0;
  top: calc(50% - 1px);
  left: calc(50% + 24px);
  right: calc(-50% + 20px);
  height: 1px;
  background: rgba(174, 184, 195, 0.36);
}

.ism-apf-spread-connector::after {
  content: "";
  position: absolute;
  top: -3px;
  right: -1px;
  width: 0;
  height: 0;
  border-top: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-left: 5px solid rgba(174, 184, 195, 0.5);
}

.ism-apf-drivers {
  display: grid;
  gap: 7px;
  margin: 0 0 10px;
  padding: 8px;
  border: 1px solid rgba(138, 155, 173, 0.12);
  border-radius: 7px;
  background: rgba(7, 16, 29, 0.44);
}

.ism-apf-driver-list {
  display: grid;
  gap: 7px;
}

.ism-apf-focus-traceability {
  display: grid;
  gap: 7px;
  padding: 7px;
  border: 1px solid rgba(126, 153, 196, 0.1);
  border-radius: 7px;
  background: rgba(6, 14, 25, 0.36);
}

.ism-apf-focus-traceability-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
  min-width: 0;
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(138, 155, 173, 0.08);
}

.ism-apf-focus-traceability-head span,
.ism-apf-focus-traceability-side {
  color: rgba(138, 155, 173, 0.8);
  font-size: 0.54rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}

.ism-apf-focus-traceability-head strong {
  overflow: hidden;
  color: rgba(238, 243, 250, 0.82);
  font-size: 0.62rem;
  font-weight: 800;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ism-apf-focus-traceability-groups {
  display: grid;
  gap: 7px;
}

.ism-apf-focus-traceability-group {
  display: grid;
  gap: 5px;
}

.ism-apf-driver-card {
  display: grid;
  gap: 6px;
  padding: 7px;
  border: 1px solid rgba(126, 153, 196, 0.12);
  border-radius: 7px;
  background: rgba(6, 14, 25, 0.58);
}

.ism-apf-driver-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: baseline;
}

.ism-apf-driver-head span {
  color: rgba(138, 155, 173, 0.78);
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ism-apf-driver-head strong {
  color: #eef3fa;
  font-size: 0.68rem;
  text-align: right;
}

.ism-apf-driver-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-items: baseline;
  color: rgba(226, 234, 244, 0.9);
  font-size: 0.64rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
}

.ism-apf-driver-industries {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.ism-apf-code-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  padding: 4px 6px;
  border: 1px solid rgba(126, 153, 196, 0.18);
  border-radius: 6px;
  background: rgba(10, 22, 38, 0.82);
  color: #d8e0ea;
  cursor: pointer;
  font: inherit;
  font-size: 0.58rem;
  line-height: 1.1;
}

.ism-apf-code-chip:hover,
.ism-apf-code-chip:focus-visible {
  border-color: rgba(213, 179, 124, 0.45);
  color: #eef3fa;
  outline: none;
}

.ism-apf-code-chip span {
  color: rgba(174, 184, 195, 0.86);
  font-weight: 800;
  letter-spacing: 0.06em;
}

.ism-apf-focus-traceability-group.is-manufacturing .ism-apf-code-chip span {
  color: rgba(105, 151, 205, 0.96);
}

.ism-apf-focus-traceability-group.is-services .ism-apf-code-chip span {
  color: rgba(142, 201, 163, 0.94);
}

.ism-apf-code-chip em {
  max-width: 190px;
  overflow: hidden;
  color: rgba(174, 184, 195, 0.78);
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ism-apf-driver-empty {
  color: rgba(174, 184, 195, 0.64);
  font-size: 0.62rem;
  font-style: italic;
}

.ism-apf-geoscen-evidence {
  display: grid;
  gap: 7px;
  margin: 0 0 10px;
  padding: 8px;
  border: 1px solid rgba(138, 155, 173, 0.12);
  border-radius: 7px;
  background: rgba(7, 16, 29, 0.38);
}

.ism-apf-geoscen-title span {
  color: rgba(138, 155, 173, 0.78);
}

.ism-apf-geoscen-list {
  display: grid;
  gap: 7px;
}

.ism-apf-geoscen-driver-group {
  display: grid;
  gap: 7px;
  padding: 7px;
  border: 1px solid rgba(138, 155, 173, 0.11);
  border-radius: 7px;
  background: rgba(6, 14, 25, 0.28);
}

.ism-apf-geoscen-driver-group + .ism-apf-geoscen-driver-group {
  margin-top: 3px;
}

.ism-apf-geoscen-driver-head {
  display: grid;
  grid-template-columns: minmax(86px, auto) 1fr auto;
  gap: 8px;
  align-items: center;
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(138, 155, 173, 0.1);
}

.ism-apf-geoscen-driver-head span {
  color: rgba(213, 179, 124, 0.82);
  font-size: 0.55rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ism-apf-geoscen-driver-head strong {
  color: rgba(238, 243, 250, 0.88);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.ism-apf-geoscen-driver-head em {
  color: rgba(174, 184, 195, 0.76);
  font-size: 0.56rem;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-align: right;
}

.ism-apf-geoscen-group {
  display: grid;
  gap: 5px;
}

.ism-apf-geoscen-group + .ism-apf-geoscen-group {
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px solid rgba(138, 155, 173, 0.1);
}

.ism-apf-geoscen-group-title {
  color: rgba(174, 184, 195, 0.84);
  font-size: 0.56rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ism-apf-geoscen-item {
  display: grid;
  gap: 5px;
  padding: 7px;
  border: 1px solid rgba(126, 153, 196, 0.12);
  border-radius: 7px;
  background: rgba(6, 14, 25, 0.54);
}

.ism-apf-geoscen-source {
  color: rgba(238, 243, 250, 0.9);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ism-apf-geoscen-component {
  color: rgba(174, 184, 195, 0.78);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.ism-apf-geoscen-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  color: rgba(138, 155, 173, 0.78);
  font-size: 0.56rem;
}

.ism-apf-geoscen-meta span + span::before {
  content: "\2022";
  margin-right: 8px;
  color: rgba(138, 155, 173, 0.48);
}

.ism-apf-geoscen-confidence {
  color: rgba(174, 184, 195, 0.76);
  font-size: 0.56rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ism-apf-geoscen-excerpt,
.ism-apf-geoscen-empty {
  color: rgba(216, 224, 234, 0.82);
  font-size: 0.64rem;
  line-height: 1.35;
}

.ism-apf-geoscen-empty {
  color: rgba(174, 184, 195, 0.64);
  font-style: italic;
}

@media (max-width: 620px) {
  .ism-apf-geoscen-driver-head {
    grid-template-columns: 1fr;
    gap: 3px;
  }

  .ism-apf-geoscen-driver-head em {
    text-align: left;
  }
}

.ism-apf-oraclechambers {
  display: grid;
  gap: 7px;
  margin: 0 0 10px;
  padding: 8px;
  border: 1px solid rgba(138, 155, 173, 0.14);
  border-top-color: rgba(124, 92, 255, 0.34);
  border-radius: 7px;
  background: rgba(7, 16, 29, 0.34);
}

.ism-apf-oracle-title {
  border-top-color: rgba(124, 92, 255, 0.42);
  color: rgba(170, 147, 255, 0.92);
}

.ism-apf-oracle-verdict {
  display: grid;
  gap: 6px;
}

.ism-apf-oracle-verdict div {
  display: grid;
  gap: 3px;
  padding: 7px;
  border: 1px solid rgba(126, 153, 196, 0.1);
  border-radius: 7px;
  background: rgba(6, 14, 25, 0.48);
}

.ism-apf-oracle-verdict span,
.ism-apf-oracle-confidence span,
.ism-apf-oracle-counts span,
.ism-apf-oracle-dates span {
  color: rgba(138, 155, 173, 0.8);
  font-size: 0.55rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ism-apf-oracle-verdict p {
  margin: 0;
  color: rgba(216, 224, 234, 0.84);
  font-size: 0.64rem;
  line-height: 1.35;
}

.ism-apf-oracle-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
}

.ism-apf-oracle-confidence,
.ism-apf-oracle-counts,
.ism-apf-oracle-dates {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 7px;
  border: 1px solid rgba(126, 153, 196, 0.1);
  border-radius: 7px;
  background: rgba(6, 14, 25, 0.48);
}

.ism-apf-oracle-confidence strong {
  color: #eef3fa;
  font-size: 0.78rem;
}

.ism-apf-oracle-confidence em {
  color: rgba(170, 147, 255, 0.92);
  font-size: 0.62rem;
  font-style: normal;
  font-weight: 800;
}

.ism-apf-oracle-counts {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.ism-apf-oracle-dates {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.ism-apf-oracle-counts p,
.ism-apf-oracle-dates p {
  display: grid;
  gap: 3px;
  margin: 0;
  min-width: 0;
}

.ism-apf-oracle-counts strong,
.ism-apf-oracle-dates strong {
  color: rgba(238, 243, 250, 0.9);
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
  text-align: left;
  white-space: nowrap;
}

.ism-apf-oracle-empty {
  color: rgba(174, 184, 195, 0.64);
  font-size: 0.64rem;
  font-style: italic;
  line-height: 1.35;
}

.ism-apf-component-head,
.ism-apf-component-row {
  grid-template-columns: minmax(160px, 1.45fr) repeat(3, minmax(64px, 0.65fr));
}

.ism-apf-component-title {
  margin-top: 2px;
}

.ism-apf-component-head {
  padding: 5px 0;
  color: rgba(138, 155, 173, 0.72);
  font-size: 0.58rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ism-apf-component-head span:not(:first-child) {
  text-align: right;
}

.ism-apf-component-list {
  display: grid;
  gap: 4px;
}

.ism-apf-component-group {
  display: grid;
  gap: 1px;
}

.ism-apf-component-group + .ism-apf-component-group {
  margin-top: 7px;
  padding-top: 8px;
  border-top: 1px solid rgba(159, 178, 214, 0.2);
}

.ism-apf-component-row {
  align-items: center;
  padding: 7px 0;
  border-top: 1px solid rgba(138, 155, 173, 0.08);
}

.ism-apf-component-main {
  min-width: 0;
}

.ism-apf-component-main strong {
  color: #eef3fa;
  font-size: 0.68rem;
  font-weight: 700;
}

.ism-apf-component-metrics {
  display: contents;
}

.ism-apf-component-metrics span {
  color: #d8e0ea;
  font-size: 0.66rem;
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
}

.ism-apf-component-metrics span:nth-child(1) {
  color: rgba(238, 243, 250, 0.96);
  font-weight: 800;
}

@supports not (display: contents) {
  .ism-apf-component-row {
    grid-template-columns: minmax(160px, 1.45fr) minmax(230px, 2fr);
  }

  .ism-apf-component-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  text-align: right;
  }
}

@media (max-width: 980px) {
  .ism-apf-shell {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .ism-apf-column {
    align-self: start;
  }

  .ism-apf-chamber {
    left: 16px !important;
    right: 16px;
    top: 24px !important;
    width: auto;
    max-height: calc(100vh - 48px);
  }

  .ism-apf-chamber-summary,
  .ism-apf-exec-grid,
  .ism-apf-exec-net,
  .ism-apf-temporal-row,
  .ism-apf-driver-head,
  .ism-apf-driver-metrics,
  .ism-apf-component-head,
  .ism-apf-component-row {
    grid-template-columns: 1fr;
  }

  .ism-apf-driver-head {
    display: grid;
  }

  .ism-apf-driver-head strong {
    text-align: left;
  }

  .ism-apf-component-metrics {
    text-align: left;
  }

  .ism-apf-component-head span:not(:first-child),
  .ism-apf-component-metrics span {
    text-align: left;
  }

  .ism-apf-exec-net {
    gap: 6px;
  }

  .ism-apf-temporal-path {
    grid-template-columns: minmax(46px, 0.74fr) minmax(54px, 0.9fr) minmax(46px, 0.74fr) minmax(54px, 0.9fr) minmax(46px, 0.74fr);
    gap: 5px;
  }

  .ism-apf-spread-timeline {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .ism-apf-spread-timeline-point {
    grid-template-columns: 58px minmax(54px, auto) 1fr;
    grid-template-rows: auto;
    gap: 8px;
    align-items: center;
    padding: 4px 0 10px 18px;
    text-align: left;
  }

  .ism-apf-spread-month,
  .ism-apf-spread-value,
  .ism-apf-spread-state {
    place-self: center start;
  }

  .ism-apf-spread-connector {
    top: calc(100% - 5px);
    bottom: -9px;
    left: 5px;
    right: auto;
    width: 1px;
    height: auto;
  }

  .ism-apf-spread-connector::after {
    top: auto;
    right: -3px;
    bottom: -1px;
    border-top: 5px solid rgba(174, 184, 195, 0.5);
    border-right: 3px solid transparent;
    border-left: 3px solid transparent;
    border-bottom: 0;
  }

  .ism-apf-vector-letters,
  .ism-apf-vector-dots {
    max-width: 100%;
  }

  .ism-apf-oracle-counts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ism-apf-oracle-dates {
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  }
}

.equities-industry-table-wrap {
  display: grid;
  gap: 12px;
}

.equities-industry-section {
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(7, 15, 27, 0.72);
}

.equities-industry-section-title {
  padding: 8px 10px;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a9bad;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.equities-industry-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.76rem;
}

.equities-industry-table th,
.equities-industry-table td {
  padding: 7px 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.equities-industry-table th {
  text-align: left;
  color: #8a9bad;
  font-weight: 600;
}

.equities-industry-table td {
  color: #eef3fa;
}

.equities-industry-table td.num {
  text-align: right;
  white-space: nowrap;
}

.equities-lens-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.equities-lens-tile {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 10px 12px;
  background: rgba(8, 18, 33, 0.55);
}

.equities-lens-tile .label {
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a9bad;
  margin-bottom: 4px;
}

.equities-lens-tile .value {
  font-size: 0.95rem;
  font-weight: 600;
  color: #eef3fa;
}

.equities-lens-notes {
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(7, 15, 27, 0.72);
}

.equities-lens-notes ul {
  margin: 0;
  padding: 10px 18px 12px 28px;
  color: #eef3fa;
  font-size: 0.78rem;
}

.equities-lens-notes li + li {
  margin-top: 6px;
}

.equities-industry-table td.num {
  text-align: right;
  white-space: nowrap;
}

.equities-lens-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.equities-cell-positive {
  color: var(--good) !important;
  font-weight: 600;
}

.equities-cell-negative {
  color: var(--bad) !important;
  font-weight: 600;
}

.equities-cell-neutral {
  color: #eef3fa !important;
  font-weight: 600;
}

.equities-industry-panel .fx-chart {
  border: none;
  background: transparent;
}

.equities-industry-table-wrap {
  flex: 1;
  overflow: visible !important;
  max-height: none !important;
  padding-right: 0;
}

.equities-industry-panel .chart-header-row {
  margin-bottom: 4px;
}

#equities-industry-chart {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}

.equities-index-panel .chart-header-row {
  grid-template-columns: minmax(0, 1.75fr) minmax(120px, 0.85fr);
}

.equities-index-panel #equities-index-focus {
  overflow-wrap: anywhere;
  line-height: 1.25;
}

/* ===== Column Colors ===== */
.pmi-col {
  color: #4b5563;
}

.orders-col {
  color: #f59e0b;
}

/* ===== Center Alignment ===== */
.center-text {
  text-align: center;
}

/* Ensure headers are centered */
.equities-industry-table th {
  text-align: center;
}

/* ===== Vertical Separator ([bar]) ===== */
.group-sep-left {
  border-left: 1px solid rgba(255, 255, 255, 0.08); /* subtle but visible */
}

/* Optional: make it slightly stronger on hover for clarity */
.equities-industry-table td.group-sep-left,
.equities-industry-table th.group-sep-left {
  border-left: 1px solid rgba(255, 255, 255, 0.1);
}

.equities-industry-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.76rem;
  table-layout: fixed;
}

.equities-industry-table .col-code {
  width: 11%;
}

.equities-industry-table .col-industry {
  width: 33%;
}

.equities-industry-table .col-num {
  width: 7%;
}

.equities-industry-table th,
.equities-industry-table td {
  padding: 7px 6px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.equities-industry-table th {
  text-align: center;
  color: #8a9bad;
  font-weight: 600;
  white-space: nowrap;
}

.equities-industry-table td:first-child,
.equities-industry-table th:first-child {
  text-align: left;
}

.equities-industry-table td:first-child {
  line-height: 1.25;
  white-space: nowrap;
  word-break: normal;
  overflow-wrap: normal;
}

.equities-industry-table td.num {
  text-align: center;
  white-space: nowrap;
}

.equities-industry-hover-host {
  position: relative;
  min-width: 0;
  outline: none;
}

.ism-position-trail-shell {
  position: fixed;
  top: var(--ism-trail-top, 12px);
  left: var(--ism-trail-left, 12px);
  right: auto;
  z-index: 1200;
  width: min(760px, calc(100vw - 24px));
  max-height: min(680px, 74vh);
  overflow: auto;
  border: 1px solid rgba(155, 181, 214, 0.46);
  border-radius: 8px;
  background: rgba(6, 12, 22, 0.97);
  box-shadow:
    0 22px 54px rgba(0, 0, 0, 0.58),
    0 0 0 1px rgba(238, 243, 250, 0.05) inset;
  padding: 9px 10px 10px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  pointer-events: none;
  transition:
    opacity 140ms ease,
    transform 140ms ease,
    visibility 140ms ease;
}

.ism-position-open-button,
.ism-position-close {
  border: 1px solid rgba(126, 153, 196, 0.22);
  border-radius: 6px;
  background: rgba(10, 22, 38, 0.82);
  color: #d8e0ea;
  font: inherit;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  cursor: pointer;
}

.ism-position-open-button {
  padding: 6px 9px;
  white-space: nowrap;
}

.ism-position-open-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.ism-position-open-button:hover,
.ism-position-open-button:focus-visible,
.ism-position-close:hover,
.ism-position-close:focus-visible {
  border-color: rgba(213, 179, 124, 0.48);
  color: #eef3fa;
  outline: none;
}

.ism-position-close {
  display: inline-grid;
  place-items: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  padding: 0;
  line-height: 1;
}

.equities-industry-hover-host.ism-position-trail-visible .ism-position-trail-shell {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.ism-position-trail-head {
  display: grid;
  grid-template-columns: max-content max-content minmax(0, 1fr) max-content;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  margin-bottom: 6px;
}

.ism-position-trail-title {
  color: #f7fbff;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.ism-position-view-toggle {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  align-self: center;
  padding: 2px;
  border: 1px solid rgba(126, 153, 196, 0.14);
  border-radius: 6px;
  color: #a9b8c9;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.ism-position-view-toggle span {
  display: inline-grid;
  place-items: center;
  min-height: 20px;
  padding: 2px 6px;
  border-radius: 4px;
  line-height: 1;
}

.ism-position-view-toggle .active {
  background: rgba(126, 153, 196, 0.2);
  color: #f7fbff;
}

.ism-position-trail-key {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #8a9bad;
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.ism-position-code-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 5px;
  color: #8a9bad;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  min-width: 0;
  text-transform: uppercase;
}

.ism-position-etf-label {
  color: #f7fbff;
  white-space: nowrap;
}

.ism-position-code-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #d8e0ea;
  font: inherit;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

.ism-position-code-chip i {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--ism-code-color);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ism-code-color) 22%, transparent);
}

.ism-position-code-separator,
.ism-position-code-empty {
  color: rgba(138, 155, 173, 0.78);
}

.ism-position-code-chip.is-active {
  color: #eef3fa;
}

.ism-position-code-chip.is-active i {
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--ism-code-color) 34%, transparent),
    0 0 12px color-mix(in srgb, var(--ism-code-color) 32%, transparent);
}

.ism-position-mobile-controls {
  display: none;
}

.ism-position-trail-key span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.ism-position-key-dot {
  display: inline-block;
  border-radius: 999px;
}

.ism-position-key-dot.selected {
  width: 10px;
  height: 10px;
  background: #d5b37c;
}

.ism-position-key-dot.universe {
  width: 5px;
  height: 5px;
  background: rgba(138, 155, 173, 0.72);
}

.ism-position-trail-body {
  display: grid;
  gap: 8px;
}

.ism-position-section {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.ism-position-section-title {
  color: #f0c987;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.ism-position-lane {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  min-width: 0;
}

.ism-position-lane-title {
  color: #d7e2ef;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.3;
  padding-top: 4px;
  text-transform: uppercase;
}

.ism-position-chart-panel {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.ism-position-chart-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.ism-position-extreme-labels {
  display: grid;
  grid-template-columns: auto auto auto;
  gap: 10px;
  color: #b8c7d8;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  white-space: nowrap;
}

.ism-position-extreme-labels .positive {
  color: rgba(88, 201, 142, 0.92);
}

.ism-position-extreme-labels .negative {
  color: rgba(216, 106, 100, 0.92);
}

.ism-position-extreme-labels .neutral {
  color: rgba(213, 179, 124, 0.88);
}

.ism-position-chart {
  position: relative;
  height: 156px;
  min-width: 520px;
  border: 1px solid rgba(126, 153, 196, 0.1);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(88, 201, 142, 0.05), transparent 48%, rgba(216, 106, 100, 0.05)),
    rgba(3, 8, 15, 0.28);
  overflow: hidden;
}

.ism-position-plotly-panel {
  overflow-x: auto;
  padding-bottom: 2px;
}

.ism-position-plotly-chart {
  height: 220px;
  min-width: 620px;
  border: 1px solid rgba(155, 181, 214, 0.26);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(88, 201, 142, 0.08), transparent 48%, rgba(216, 106, 100, 0.08)),
    rgba(14, 25, 41, 0.82);
  box-shadow: inset 0 0 0 1px rgba(238, 243, 250, 0.025);
  overflow: hidden;
}

.ism-position-plotly-chart .panel-placeholder {
  height: 100%;
  display: grid;
  place-items: center;
}

.ism-position-plotly-chart .modebar {
  display: none !important;
}

.ism-position-frame-line {
  position: absolute;
  left: 42px;
  right: 16px;
  height: 1px;
  border-top: 1px solid rgba(126, 153, 196, 0.1);
  pointer-events: none;
}

.ism-position-frame-line.max {
  top: 12px;
}

.ism-position-frame-line.min {
  bottom: 24px;
}

.ism-position-zero-waterline {
  position: absolute;
  left: 42px;
  right: 16px;
  top: 50%;
  height: 16px;
  transform: translateY(-50%);
  color: rgba(213, 179, 124, 0.6);
  pointer-events: none;
}

.ism-position-zero-waterline::before {
  content: "~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  overflow: hidden;
  transform: translateY(-52%);
  white-space: nowrap;
  letter-spacing: 1px;
  opacity: 0.62;
}

.ism-position-zero-waterline span {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  transform: translate(-50%, -50%);
  padding: 0 5px;
  background: #07111d;
  color: rgba(238, 243, 250, 0.72);
  font-size: 0.62rem;
  font-weight: 700;
}

.ism-position-trail-svg {
  position: absolute;
  inset: 12px 16px 24px 42px;
  width: calc(100% - 58px);
  height: calc(100% - 36px);
  overflow: visible;
  pointer-events: none;
}

.ism-position-point-layer {
  position: absolute;
  inset: 12px 16px 24px 42px;
}

.ism-position-code-trail {
  fill: none;
  stroke: var(--ism-code-color, #d5b37c);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0;
  transition: opacity 140ms ease;
}

.ism-position-code-trail.is-selected-code {
  opacity: 0.92;
}

.ism-position-chart-point {
  position: absolute;
  transform: translate(-50%, -50%);
  transition:
    opacity 140ms ease,
    box-shadow 140ms ease,
    outline-color 140ms ease;
}

.ism-position-month-axis {
  position: absolute;
  left: 42px;
  right: 16px;
  bottom: 5px;
  height: 14px;
  color: #738397;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  pointer-events: none;
}

.ism-position-month-axis span {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  white-space: nowrap;
}

.ism-position-month-axis span:first-child {
  transform: translateX(0);
}

.ism-position-month-axis span:last-child {
  transform: translateX(-100%);
}

.ism-position-trail-shell.ism-position-has-selection .ism-position-chart-point,
.ism-position-trail-shell.ism-position-has-selection .ism-position-code-chip {
  opacity: 0.46;
}

.ism-position-trail-shell.ism-position-has-selection .ism-position-chart-point.is-selected-code,
.ism-position-trail-shell.ism-position-has-selection .ism-position-code-chip.is-active {
  opacity: 1;
}

.ism-position-trail-shell.ism-position-has-selection .ism-position-chart-point.is-selected-code {
  z-index: 3;
  outline: 1px solid rgba(238, 243, 250, 0.82);
  outline-offset: 2px;
}

.ism-position-month-grid {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.ism-position-month-row {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) 74px;
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 20px;
}

.ism-position-month-label {
  color: #8a9bad;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  white-space: nowrap;
}

.ism-position-month-row.current .ism-position-month-label {
  color: #eef3fa;
}

.ism-position-dot-strip {
  position: relative;
  display: grid;
  grid-template-columns: repeat(18, minmax(5px, 1fr));
  align-items: center;
  gap: 4px;
  min-width: 0;
}

.ism-position-dot-strip::before {
  content: "";
  position: absolute;
  top: 1px;
  bottom: 1px;
  left: var(--ism-boundary, 50%);
  width: 1px;
  background: rgba(202, 78, 78, 0.52);
  box-shadow: 0 0 8px rgba(202, 78, 78, 0.16);
  pointer-events: none;
}

.ism-position-dot {
  position: relative;
  z-index: 1;
  display: block;
  justify-self: center;
  padding: 0;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  line-height: 0;
}

.ism-position-dot.universe {
  width: 5px;
  height: 5px;
  background: rgba(138, 155, 173, 0.58);
}

.ism-position-dot.selected {
  width: 11px;
  height: 11px;
  background: var(--ism-code-color, #d5b37c);
  border: 1px solid rgba(255, 246, 226, 0.9);
  box-shadow: 0 0 0 2px rgba(213, 179, 124, 0.12);
}

.ism-position-dot.positive.universe {
  background: rgba(79, 176, 126, 0.58);
}

.ism-position-dot.negative.universe {
  background: rgba(202, 78, 78, 0.58);
}

.ism-position-dot.neutral.universe {
  background: rgba(174, 184, 195, 0.58);
}

.ism-position-dot.positive.selected {
  background: var(--ism-code-color, #58c98e);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ism-code-color, #58c98e) 22%, transparent);
}

.ism-position-dot.negative.selected {
  background: var(--ism-code-color, #d86a64);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ism-code-color, #d86a64) 22%, transparent);
}

.ism-position-dot.neutral.selected {
  background: var(--ism-code-color, #d5b37c);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ism-code-color, #d5b37c) 22%, transparent);
}

.ism-position-point-layer .ism-position-chart-point {
  position: absolute;
  justify-self: auto;
  transform: translate(-50%, -50%);
}

.ism-position-dot:hover,
.ism-position-dot:focus-visible {
  outline: 1px solid rgba(238, 243, 250, 0.86);
  outline-offset: 2px;
}

.ism-position-month-row.current .ism-position-dot.selected {
  box-shadow: 0 0 0 2px rgba(213, 179, 124, 0.22);
}

.ism-position-range {
  color: #8a9bad;
  font-size: 0.62rem;
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
}

.ism-position-range-separator {
  color: rgba(174, 184, 195, 0.72);
  padding: 0 3px;
}

.ism-position-range-value.positive {
  color: rgba(88, 201, 142, 0.92);
}

.ism-position-range-value.negative {
  color: rgba(216, 106, 100, 0.92);
}

.ism-position-range-value.neutral {
  color: rgba(213, 179, 124, 0.86);
}

.ism-position-detail-card {
  margin-top: 12px;
  padding: 9px;
  border: 1px solid rgba(213, 179, 124, 0.18);
  border-radius: 8px;
  background: rgba(11, 23, 39, 0.98);
}

.ism-position-detail-card[hidden] {
  display: none;
}

.ism-position-detail-title {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
  margin-bottom: 8px;
  color: #eef3fa;
  font-size: 0.72rem;
  font-weight: 700;
  white-space: nowrap;
}

.ism-position-detail-divider {
  color: #d5b37c;
}

.ism-position-detail-table {
  width: 100%;
  border-collapse: collapse;
  color: #aeb8c3;
  font-size: 0.68rem;
}

.ism-position-detail-table th,
.ism-position-detail-table td {
  padding: 4px 6px;
  border-top: 1px solid rgba(138, 155, 173, 0.12);
  text-align: left;
  white-space: nowrap;
}

.ism-position-detail-table th {
  color: #eef3fa;
  font-weight: 700;
}

@media (max-width: 1180px) {
  .ism-position-trail-shell {
    right: auto;
    width: min(720px, calc(100vw - 24px));
  }

  .ism-position-trail-head {
    grid-template-columns: max-content max-content minmax(0, 1fr) max-content;
  }

  .ism-position-lane {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

/* =========================================
   FINAL OC / GEOSCEN PURPLE OVERRIDES
   keep at very bottom of styles.css
   ========================================= */

.top-nav-item.oc-tab,
.top-nav-item.oc-tab:hover,
.top-nav-item.oc-tab:focus,
.top-nav-item.oc-tab:active,
.top-nav-item.oc-tab.active {
  color: #7c5cff !important;
  border-bottom-color: #7c5cff !important;
}

.top-nav-item.oc-tab.active::after,
.top-nav-item.oc-tab:hover::after,
.top-nav-item.oc-tab:focus::after {
  background: linear-gradient(
    90deg,
    transparent,
    #7c5cff,
    transparent
  ) !important;
  box-shadow: 0 0 10px rgba(124, 92, 255, 0.35) !important;
}

.wti-inventory-panel.wti-oc-active {
  border-color: #4c3f7a !important;
  background: #101426 !important;
}

.wti-inventory-panel.wti-oc-active .panel-title,
.wti-inventory-panel.wti-oc-active .panel-source,
.wti-inventory-panel.wti-oc-active .panel-footnote,
.wti-inventory-panel.wti-oc-active #wti-inventory-source,
.wti-inventory-panel.wti-oc-active #wti-inventory-source-prefix,
.wti-inventory-panel.wti-oc-active #wti-inventory-date {
  color: #7c5cff !important;
}

.fx-geoscen,
.fx-geoscen-panel,
.wti-geoscen-panel,
.equities-geoscen-panel {
  border-color: #4c3f7a !important;
  background: #101426 !important;
}

.fx-geoscen .panel-title,
.fx-geoscen .panel-source,
.fx-geoscen .panel-footnote,
.fx-geoscen-panel .panel-title,
.fx-geoscen-panel .panel-source,
.fx-geoscen-panel .panel-footnote,
.wti-geoscen-panel .panel-title,
.wti-geoscen-panel .panel-source,
.wti-geoscen-panel .panel-footnote,
.equities-geoscen-panel .panel-title,
.equities-geoscen-panel .panel-source,
.equities-geoscen-panel .panel-footnote {
  color: #7c5cff !important;
}

.equities-top-right-panel,
.equities-top-right-panel .fx-chart,
.equities-top-right-panel svg {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

.equities-top-right-panel .fx-chart {
  min-height: 0;
}

.equities-top-right-panel svg {
  display: block;
  height: auto;
}

/* ================================
   MOBILE INDUSTRY PANEL (CARDS)
================================ */

@media (max-width: 768px) {
  .equities-industry-table {
    display: none;
  }

  .equities-industry-cards {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
  }

  .industry-card {
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 10px;
    padding: 10px 12px;
    background: rgba(10, 18, 28, 0.6);
  }

  .industry-card-title {
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 6px;
    color: #cfd8e3;
  }

  .industry-row {
    display: flex;
    justify-content: space-between;
    font-size: 0.75rem;
    margin-bottom: 4px;
  }

  .industry-row span {
    flex: 1;
    text-align: center;
  }

  .industry-label {
    text-align: left;
    color: #8fa3b8;
  }

  .industry-footer {
    display: flex;
    justify-content: space-between;
    margin-top: 6px;
    font-size: 0.75rem;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    padding-top: 6px;
  }
}

/* PMI Composite Bars */

.equities-ivt-coordinate-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.equities-ivt-coordinate { min-width: 0; align-items: flex-start; }
.equities-ivt-coordinate .finstate-iv-letter-box { flex: 0 0 36px; }
.equities-ivt-coordinate .finstate-iv-direction { color: #d5b37c; }
.equities-ivt-coordinate .finstate-iv-change { text-transform: capitalize; }
.equities-ivt-coordinate-meta { margin-top: 3px; color: #7f94ad; font-size: .52rem; }

.equities-bar-positive {
  fill: #2dd4bf; /* teal-green (New Orders / growth) */
}

.equities-bar-negative {
  fill: #ef4444; /* soft red (contraction) */
}

.geoscen-purple {
  border-left: 3px solid #a855f7;
  padding-left: 10px;
}

.geoscen-dropdown {
  background: transparent;
  color: #a855f7;
  border: 1px solid #a855f7;
  font-size: 12px;
}

.content-view {
  display: none;
}

.content-view.active {
  display: block;
}

.oc-placeholder-card {
  min-height: 320px;
  border-radius: 18px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: rgba(15, 23, 42, 0.72);
  padding: 24px;
}

#view-oc .content-header {
  margin-bottom: 18px;
}

#view-oc .oc-view {
  min-height: 520px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#view-oc .oc-content {
  width: 100%;
  max-width: 840px;
  text-align: center;
}

#view-oc .oc-image {
  display: block;
  width: 100%;
  max-width: 840px;
  height: auto;
  margin: 0 auto;
  border-radius: 14px;
  opacity: 0.94;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
}

#view-oc .oc-text {
  margin-top: 18px;
  font-size: 0.9rem;
  letter-spacing: 0.12em;
  color: rgba(200, 210, 230, 0.78);
  text-transform: uppercase;
}

.macro-riskstack-panel .panel-title {
  margin-bottom: 12px;
}

#macro-isovector-contract {
  gap: 8px;
}

#macro-isovector-contract .macro-metric-tile {
  min-height: 44px;
  padding: 9px 12px;
}

/* ===== HEADER ===== */

.iv-header {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(126, 153, 196, 0.14);
}

.iv-title-main {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.5rem;
  line-height: 1;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #f2f5fa;
}

.iv-title-main .iso-part {
  font-family: serif;
  color: #ffffff;
}

.iv-title-main .vector-part {
  font-family: serif;
  color: #9aa6b2; /* steel grey */
}

.iv-title-sub {
  font-size: 0.60rem;
  font-weight: 700;
  color: #d5b37c;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

/* ===== GROUP CONTAINER ===== */

.iv-contract-group {
  margin-top: 12px;
  padding: 12px 12px 16px;
  border-radius: 12px;

  border: 1px solid rgba(126, 153, 196, 0.12);

  background: linear-gradient(
    180deg,
    rgba(10, 18, 30, 0.65),
    rgba(8, 14, 24, 0.85)
  );

  backdrop-filter: blur(6px);
}

/* ===== GROUP TITLE ===== */

.iv-group-title {
  margin-bottom: 8px;
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #9fb3c8;
}

/* ===== METRIC STACK ===== */

.iv-contract-group .macro-metric-stack {
  gap: 8px;
}

.iv-contract-group .macro-metric-tile {
  min-height: 42px;
  padding: 8px 11px;
}

/* ===== LEFT ACCENT BARS ===== */

.iv-group-pressure {
  border-left: 3px solid rgba(142, 201, 163, 0.55);
}

.iv-group-fragility {
  border-left: 3px solid rgba(126, 155, 196, 0.55);
}

.iv-group-transmission {
  border-left: 3px solid rgba(213, 179, 124, 0.6);
}

.iv-group-outcome {
  border-left: 3px solid rgba(160, 170, 185, 0.65);
}

.iso-part {
  font-family: serif;
  color: #ffffff;
}

.fx-geoscen .panel-placeholder {
  background: #ffffff;
  color: #111827;
  border: 1px solid rgba(160, 170, 185, 0.65);
  border-radius: 10px;
  font-weight: 600;
}

.about-container {
  display: flex;
  justify-content: center;
  padding: 40px 20px;
}

.about-card {
  display: flex;
  max-width: 1100px;
  width: 100%;
  background: #0f1115;
  border-radius: 12px;
  padding: 32px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
  gap: 8px; /* ðŸ”¥ tighter */
}

.about-left {
  flex: 0 0 175px; /* was 140px -- +25% */
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.core-model-visual {
  margin: 8px 0 28px 0;
  display: flex;
  justify-content: center;
}

.core-model-image {
  width: 100%;
  max-width: 950px;
  height: auto;

  border-radius: 8px;
  opacity: 0.88;
}

.about-photo {
  width: 160px; /* was 130px -- +23% */
  aspect-ratio: 1 / 1;
  object-fit: contain;
}

.about-right {
  flex: 1;
  color: #e6e8eb;
}

/* Match font of section header (System Architect) */
about-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 28px;
  font-weight: 600;
  margin-bottom: 2px; /* tight spacing */
}

.about-role {
  font-family: 'Cormorant Garamond', serif; /* same font */
  font-size: 16.5px; /* same as your role-part */
  font-weight: 400;
  color: #ffffff;
  margin: 0;
}

.vector-part {
  font-family: serif;
  color: #8f9aac;
}

/* ðŸ”¹ Larger name */
.about-name .name-part {
  font-family: serif;
  font-size: 30px; /* +1 step */
}

.about-name .name-part-min {
  font-family: serif;
  font-size: 30px; /* +1 step */
}

.about-name .role-part {
  display: inline-block; /* Allows vertical margin to work */
  margin-top: 8px;       /* Adjust this value to get the perfect spacing */
}

/* ðŸ”¹ Divider */
.about-name .divider {
  font-size: 18px;
  color: #9aa4af;
  margin: 0 6px;
}

/* IsoVector + title -- match summary size */
.about-name .role-part {
  font-size: 18px;
  font-weight: 400;
  color: #ffffff; /* â† now white */
}

/* Branding */
.about-name .iso-part {
  color: #ffffff;
}

.about-name .vector-part {
  color: #8f9aac;
}

.about-title {
  font-weight: 400;
  color: #9aa4af;
  font-size: 18px;
}

.about-summary {
  font-size: 15px;
  line-height: 1.6;
  color: #c7cdd6;
  margin-bottom: 20px;
}

.about-meta {
  font-size: 14px;
  margin-bottom: 16px;
  color: #9aa4af;
}

.about-meta div {
  margin-bottom: 6px;
}

.about-education {
  font-size: 14px;
  color: #9aa4af;
}

.about-education div {
  margin-bottom: 4px;
}

.about-container {
  margin-top: 28px;
}

/* REPLACE with this */
.about-meta {
  font-size: 14px;
  margin-bottom: 16px;
  color: #9aa4af;
}

.about-meta div {
  margin-bottom: 6px;
  letter-spacing: 0.01em;
}

.meta-label {
  .meta-label {
    color: #ffffff;
    font-family: serif;
    font-weight: 600;
  }

  .meta-detail {
    color: #9aa4af;
    font-weight: 500;
  }

  .about-meta div,
  .about-education div {
    letter-spacing: 0.01em;
  }

  .meta-label {
    color: #ffffff; /* same as name */
    font-weight: 600; /* slight emphasis */
  }
}

.meta-label {
  color: #ffffff;
  font-family: serif;
  font-weight: 600; /* Optional: makes the white text pop more */
  letter-spacing: 0.05em;
}

/* Keeps the details (U.S., China, etc.) slightly dimmed for hierarchy */
.meta-detail {
  color: rgba(255, 255, 255, 0.7);
}

/* FINAL MACRO LAYOUT */

#view-macro .macro-main-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 0.50fr) minmax(0, 1.25fr) minmax(0, 1.25fr) minmax(0, 1.12fr) !important;
  grid-template-areas:
    'contract drivers lag analogues'
    'contract exposure transmission analogues' !important;

  gap: 18px !important;

  align-items: stretch !important;
}

#view-macro .fx-panel {
  height: 100%;
}

#view-macro .macro-drivers-panel,
#view-macro .macro-lag-panel,
#view-macro .macro-exposure-panel,
#view-macro .macro-transmission-panel {
  display: flex;
  flex-direction: column;
}

#view-macro .fx-panel {
  height: 100% !important;
}

#view-macro .macro-riskstack-panel {
  grid-area: contract !important;
  min-height: 720px !important;
}
#view-macro .macro-drivers-panel {
  grid-area: drivers !important;
}
#view-macro .macro-lag-panel {
  grid-area: lag !important;
}
#view-macro .macro-exposure-panel {
  grid-area: exposure !important;
}
#view-macro .macro-transmission-panel {
  grid-area: transmission !important;
}
#view-macro .macro-regime-analogues-panel {
  grid-area: analogues !important;
  min-height: 720px !important;
}

#view-macro .macro-riskstack-panel {
  grid-area: contract !important;
  display: block !important;
  min-height: 720px !important;
}

#view-macro .macro-drivers-panel {
  grid-area: drivers !important;
}

#view-macro .macro-lag-panel {
  grid-area: lag !important;
}

#view-macro .macro-exposure-panel {
  grid-area: exposure !important;
}

#view-macro .macro-transmission-panel {
  grid-area: transmission !important;
}

#view-macro .macro-regime-analogues-panel {
  grid-area: analogues !important;
  display: block !important;
  min-height: 720px !important;
}

#view-macro .macro-impact-panel {
  display: none !important;
}

.regime-analogue-diagnostics {
  margin-top: 8px;
  color: #c0c0c0;
  font-size: 0.72rem;
}

.regime-analogue-oc-area {
  margin-top: 10px;
  min-height: 140px;

  border-left: 3px solid rgba(148,123,255,0.75);

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 12px 14px;

  background: rgba(255,255,255,0.015);

  color: #ffffff;

  font-size: 0.60rem;
  font-weight: 600;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

/* FINAL FINSTATE CONTAINMENT LOCK */

#view-finstate .finstate-main-grid {
  align-items: stretch !important;
}

#view-finstate .fx-panel {
  overflow: hidden !important;
}

/* Analytic Lens containment */
#view-finstate .finstate-metrics-panel {
  display: flex !important;
  flex-direction: column !important;
}

#view-finstate .finstate-lens-visual {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: 285px !important;
  overflow: hidden !important;
  padding: 10px !important;
}

#view-finstate .finstate-radar-wrap,
#view-finstate .finstate-gauge-wrap {
  min-height: 0 !important;
  height: 100% !important;
  max-height: 265px !important;
  overflow: hidden !important;
}

#view-finstate .finstate-radar-svg,
#view-finstate .finstate-gauge-svg {
  width: 100% !important;
  max-width: 260px !important;
  max-height: 190px !important;
  height: auto !important;
}

#view-finstate .finstate-visual-caption {
  max-width: 100% !important;
  font-size: 0.62rem !important;
  line-height: 1.25 !important;
}

/* Universe table containment */
#view-finstate .finstate-constituents-panel {
  overflow: hidden !important;
}

#view-finstate .finstate-constituents-wrap {
  width: 100% !important;
  overflow-x: auto !important;
}

#view-finstate .finstate-constituents-table {
  width: 100% !important;
  border-collapse: collapse !important;
  table-layout: fixed !important;
  font-size: 0.64rem !important;
}

#view-finstate .finstate-constituents-table th,
#view-finstate .finstate-constituents-table td {
  padding: 6px 5px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#view-finstate .finstate-constituents-table th:nth-child(2),
#view-finstate .finstate-constituents-table td:nth-child(2) {
  width: 28% !important;
}

#view-finstate .finstate-lens-context {
  color: #8f9aac;
  font-size: 0.66rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 6px;
}

#view-finstate .finstate-visual-title {
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #d5b37c;
}

#view-finstate .finstate-visual-caption {
  margin-top: 4px;
  font-size: 0.66rem;
  line-height: 1.3;
  color: #9fb3c8;
}

#view-finstate .finstate-caption-context {
  margin-top: 4px;
  color: #7f8ea3;
  font-size: 0.62rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#view-finstate .finstate-radar-svg {
  max-height: 185px !important;
}

/* FINAL FINSTATE PRESENTATION LOCK */

#view-finstate .finstate-lens-visual {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 285px !important;
  padding: 0 !important;
  overflow: hidden !important;
}

#view-finstate .finstate-radar-wrap,
#view-finstate .finstate-gauge-wrap {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#view-finstate .finstate-radar-svg {
  width: 100% !important;
  max-width: 335px !important;
  max-height: 285px !important;
}

#view-finstate .finstate-gauge-svg {
  width: 100% !important;
  max-width: 340px !important;
  max-height: 240px !important;
}

#view-finstate .finstate-visual-title,
#view-finstate .finstate-lens-context,
#view-finstate .finstate-caption-context,
#view-finstate .finstate-visual-caption {
  display: none !important;
}

/* FINSTATE Universe table presentation */
#view-finstate .finstate-constituents-table {
  width: 100% !important;
  table-layout: fixed !important;
  border-collapse: collapse !important;
  font-size: 0.68rem !important;
}

#view-finstate .finstate-col-ticker {
  width: 10%;
}

#view-finstate .finstate-col-company {
  width: 30%;
}

#view-finstate .finstate-col-core {
  width: 10%;
}

#view-finstate .finstate-col-engine {
  width: 10%;
}

#view-finstate .finstate-constituents-table th {
  font-weight: 700 !important;
  color: #d9e2ef !important;
  text-align: center !important;
  padding: 7px 6px !important;
  border-bottom: 1px solid rgba(126, 153, 196, 0.22) !important;
}

#view-finstate .finstate-constituents-table td {
  padding: 7px 6px !important;
  border-bottom: 1px solid rgba(126, 153, 196, 0.1) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#view-finstate .finstate-constituents-table td:nth-child(1),
#view-finstate .finstate-constituents-table td:nth-child(3),
#view-finstate .finstate-constituents-table td:nth-child(4),
#view-finstate .finstate-constituents-table td:nth-child(5),
#view-finstate .finstate-constituents-table td:nth-child(6),
#view-finstate .finstate-constituents-table td:nth-child(7),
#view-finstate .finstate-constituents-table td:nth-child(8) {
  text-align: center !important;
}

#view-finstate .finstate-constituents-table td:nth-child(2) {
  text-align: left !important;
  color: #eef3fa !important;
}

/* FINSTATE visual reclaim */

#view-finstate .finstate-metrics-panel {
  display: flex;
  flex-direction: column;
}

#view-finstate .finstate-metrics-panel .panel-footnote {
  margin-top: auto;
}

#view-finstate #finstate-lens-visual {
  flex: 1 1 auto;
  min-height: 300px !important;
  height: 100% !important;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
}

/* remove inherited spacing pressure */
#view-finstate .chart-header-row,
#view-finstate .panel-subtitle,
#view-finstate .chart-stat {
  display: none !important;
}

.finstate-iv-vector-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
}

.finstate-iv-vector-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid rgba(213, 179, 124, 0.28);
  border-radius: 12px;
  background: rgba(8, 18, 30, 0.72);
}

.finstate-iv-letter-box {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d5b37c;
  border-radius: 10px;
  color: #d5b37c;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  background: rgba(213, 179, 124, 0.08);
}

.finstate-iv-meta {
  min-width: 0;
  flex: 1;
}

.finstate-iv-topline,
.finstate-iv-bottomline {
  display: flex;
  align-items: center;
  gap: 6px;
}

.finstate-iv-name {
  color: #eef3fa;
  font-size: 0.72rem;
  font-weight: 700;
}

.finstate-iv-direction {
  color: #d5b37c;
  font-size: 0.8rem;
}

.finstate-iv-layer {
  margin-top: 2px;
  color: #9fb3c8;
  font-size: 0.62rem;
  letter-spacing: 0.03em;
}

.finstate-iv-value {
  margin-top: 4px;
  color: #eef3fa;
  font-size: 0.72rem;
  font-weight: 700;
}

.finstate-iv-period,
.finstate-iv-change {
  margin-top: 4px;
  color: #9fb3c8;
  font-size: 0.6rem;
}

@media (max-width: 900px) {
  .finstate-iv-vector-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* =========================================
   FINSTATE | IV[t] VECTOR COLORS
   ========================================= */

.finstate-iv-vector-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.finstate-iv-vector-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid rgba(126, 153, 196, 0.14);
  border-radius: 12px;
  background: rgba(7, 15, 27, 0.72);
}

.finstate-iv-letter-box {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.2rem;
  font-weight: 700;
}

.finstate-iv-plm {
  color: #dff7ea;
  border: 1px solid rgba(82, 168, 126, 0.42);
  background: linear-gradient(
    180deg,
    rgba(16, 52, 37, 0.96),
    rgba(9, 33, 24, 0.96)
  );
}

.finstate-iv-fd {
  color: #e4eeff;
  border: 1px solid rgba(90, 132, 201, 0.42);
  background: linear-gradient(
    180deg,
    rgba(16, 34, 60, 0.96),
    rgba(8, 20, 39, 0.96)
  );
}

.finstate-iv-xc {
  color: #f7ecef;
  border: 1px solid rgba(179, 92, 107, 0.42);
  background: linear-gradient(
    180deg,
    rgba(60, 20, 28, 0.96),
    rgba(35, 10, 16, 0.96)
  );
}

.finstate-iv-s {
  color: #eef2f7;
  border: 1px solid rgba(185, 193, 205, 0.38);
  background: linear-gradient(
    180deg,
    rgba(52, 58, 68, 0.96),
    rgba(28, 33, 41, 0.96)
  );
}

.finstate-iv-name {
  color: #eef3fa;
  font-size: 0.72rem;
  font-weight: 700;
}

.finstate-iv-layer,
.finstate-iv-period,
.finstate-iv-change {
  color: #9fb3c8;
  font-size: 0.62rem;
}

.finstate-iv-vector {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.iv-layer-group {
  border: 1px solid rgba(126, 153, 196, 0.14);
  border-radius: 12px;
  padding: 10px;
  background: linear-gradient(
    180deg,
    rgba(7, 15, 27, 0.92),
    rgba(5, 11, 20, 0.92)
  );
}

.iv-layer-group-title {
  margin-bottom: 10px;
  color: #8fa1b8;
  font-size: 0.64rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.iv-layer-stack {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.iv-layer-card {
  min-height: 42px;
  padding: 0 14px;
  border-radius: 10px;

  display: flex;
  align-items: center;

  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;

  border: 1px solid rgba(255, 255, 255, 0.06);

  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.02),
    0 2px 10px rgba(0, 0, 0, 0.22);

  transition:
    background 180ms ease,
    border-color 180ms ease,
    transform 180ms ease;
}

.iv-layer-card:hover {
  transform: translateY(-1px);
}

/* =========================================
   PRESSURE / LIQUIDITY / MOMENTUM
   GREENISH
   ========================================= */

.iv-plm {
  color: #dff7ea;

  border-color: rgba(82, 168, 126, 0.34);

  background: linear-gradient(
    180deg,
    rgba(16, 52, 37, 0.96),
    rgba(9, 33, 24, 0.96)
  );
}

/* =========================================
   FRAGILITY / DISPERSION
   BLUEISH
   ========================================= */

.iv-fd {
  color: #e4eeff;

  border-color: rgba(90, 132, 201, 0.34);

  background: linear-gradient(
    180deg,
    rgba(16, 34, 60, 0.96),
    rgba(8, 20, 39, 0.96)
  );
}

/* =========================================
   CROSS-ASSET / COHERENCE
   MUTED RED
   ========================================= */

.iv-xc {
  color: #b35c6b;
}

/* =========================================
   SYSTEMICITY
   SILVER
   ========================================= */

.iv-s {
  color: #eef2f7;

  border-color: rgba(185, 193, 205, 0.32);

  background: linear-gradient(
    180deg,
    rgba(52, 58, 68, 0.96),
    rgba(28, 33, 41, 0.96)
  );
}

/* =========================================
   IV[t] CONTRIBUTOR FAMILY â€” DEPLOY OVERRIDES
   ========================================= */

/* FX */
#view-fx .fx-main-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-areas:
    'context price spread'
    'context depth sigma' !important;
  align-items: stretch;
  gap: 18px;
}

#view-fx .fx-context-column {
  grid-area: context !important;
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-height: 0;
  height: 100%;
}

#view-fx .fx-iv-panel {
  grid-area: iv !important;
  flex: 0 0 auto;
  min-height: 0;
  height: auto;
}
#view-fx .fx-price-panel {
  grid-area: price !important;
}
#view-fx .fx-price-panel .fx-chart {
  min-height: 300px;
}
#view-fx .fx-spread-panel {
  grid-area: spread !important;
}
#view-fx .fx-geoscen-panel {
  grid-area: geoscen !important;
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}
#view-fx .fx-depth-panel {
  grid-area: depth !important;
}
#view-fx .fx-sigma-panel {
  grid-area: sigma !important;
}
/* RATES */
#view-rates .rates-iv-panel {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

#view-rates .rates-curve-panel {
  grid-column: 2 !important;
  grid-row: 1 !important;
}

#view-rates .rates-policy-panel {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

#view-rates .rates-geoscen-panel,
#view-rates .rates-reserved-left-panel {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

#view-rates .rates-spread-panel {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

#view-rates .rates-sigma-panel {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

#view-rates .rates-state-engine-panel {
  grid-column: 1 / span 3 !important;
  grid-row: 3 !important;
}

#view-rates .rates-chamber-panel {
  grid-column: 1 / span 3 !important;
  grid-row: 3 !important;
}

/* EQUITIES */
#view-equities .equities-iv-panel {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: start !important;
  height: auto !important;
  min-height: unset !important;
}

#view-equities .equities-index-panel {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: start !important;
  height: auto !important;
  min-height: unset !important;
}

#view-equities .equities-top-right-panel {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

#view-equities .equities-geoscen-panel {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

#view-equities .equities-industry-panel {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

#view-equities .equities-sigma-panel {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

#view-equities.equities-sector-focus .equities-top-right-panel,
#view-equities.equities-sector-focus .equities-sigma-panel {
  display: none !important;
}

#view-equities.equities-sector-focus .equities-main-grid {
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) !important;
  grid-template-rows: auto !important;
  align-items: start !important;
}

#view-equities.equities-sector-focus .equities-left-stack {
  display: grid !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  grid-template-rows: auto auto;
  gap: 18px;
  align-items: start;
  min-width: 0;
}

#view-equities.equities-sector-focus .equities-left-top-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
  min-width: 0;
}

#view-equities.equities-sector-focus .equities-iv-panel {
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: stretch !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin-top: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

#view-equities.equities-sector-focus .equities-index-panel {
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: stretch !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin-top: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

#view-equities.equities-sector-focus .equities-geoscen-panel {
  grid-column: 1 / -1 !important;
  grid-row: auto !important;
  height: auto !important;
  min-height: 260px !important;
  align-self: start !important;
}

#view-equities.equities-sector-focus .equities-industry-panel {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: start !important;
}

#view-equities .equities-chamber-panel {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  grid-column: 3 !important;
  grid-row: 3 !important;
}

#view-equities.equities-sector-focus .equities-chamber-panel {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  grid-column: 3 !important;
  grid-row: 2 !important;
}

.rates-state-engine-panel,
.rates-chamber-panel {
  border-color: rgba(124, 92, 255, 0.42);
  background:
    linear-gradient(180deg, rgba(16, 20, 38, 0.94), rgba(8, 14, 28, 0.88)),
    radial-gradient(circle at top center, rgba(124, 92, 255, 0.12), transparent 48%);
}

.rates-state-engine-panel .panel-title,
.rates-chamber-panel .panel-title {
  color: #7c5cff;
}

/* MOBILE */
@media (max-width: 820px) {
  #view-fx .fx-context-column {
    display: contents;
  }

  #view-fx .fx-main-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      'iv'
      'depth'
      'price'
      'spread'
      'geoscen'
      'sigma' !important;
  }

  #view-rates .rates-iv-panel {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }
  #view-rates .rates-curve-panel {
    grid-column: 1 !important;
    grid-row: 2 !important;
  }
  #view-rates .rates-policy-panel {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }
  #view-rates .rates-geoscen-panel,
  #view-rates .rates-reserved-left-panel {
    grid-column: 1 !important;
    grid-row: 4 !important;
  }
  #view-rates .rates-spread-panel {
    grid-column: 1 !important;
    grid-row: 5 !important;
  }
  #view-rates .rates-sigma-panel {
    grid-column: 1 !important;
    grid-row: 6 !important;
  }
  #view-rates .rates-state-engine-panel {
    grid-column: 1 !important;
    grid-row: 7 !important;
  }
  #view-rates .rates-chamber-panel {
    grid-column: 1 !important;
    grid-row: 8 !important;
  }

  #view-equities .equities-iv-panel {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }
  #view-equities .equities-index-panel {
    grid-column: 1 !important;
    grid-row: 2 !important;
  }
  #view-equities .equities-top-right-panel {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }
  #view-equities .equities-geoscen-panel {
    grid-column: 1 !important;
    grid-row: 4 !important;
  }
  #view-equities .equities-industry-panel {
    grid-column: 1 !important;
    grid-row: 5 !important;
  }
  #view-equities .equities-sigma-panel {
    grid-column: 1 !important;
    grid-row: 6 !important;
  }
  #view-equities .equities-chamber-panel {
    grid-column: 1 !important;
    grid-row: 7 !important;
  }

  #view-equities.equities-sector-focus .equities-top-right-panel,
  #view-equities.equities-sector-focus .equities-sigma-panel {
    display: none !important;
  }

  #view-equities.equities-sector-focus .equities-main-grid {
    grid-template-columns: 1fr !important;
  }

  #view-equities.equities-sector-focus .equities-left-stack,
  #view-equities.equities-sector-focus .equities-left-top-grid {
    display: contents !important;
  }

  #view-equities.equities-sector-focus .equities-iv-panel,
  #view-equities.equities-sector-focus .equities-index-panel {
    height: auto !important;
    min-height: unset !important;
    max-height: none !important;
    overflow: visible !important;
  }

  #view-equities.equities-sector-focus .equities-geoscen-panel {
    grid-column: 1 !important;
    grid-row: 4 !important;
    min-height: 260px !important;
  }

  #view-equities.equities-sector-focus .equities-industry-panel {
    grid-column: 1 !important;
    grid-row: 5 !important;
  }

  #view-equities.equities-sector-focus .equities-chamber-panel {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    grid-column: 1 !important;
    grid-row: 6 !important;
  }
}

.iv-module-question {
  margin: 2px 0 12px;
  color: #d5b37c;
  font-size: 0.78rem;
  line-height: 1.35;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.fx-depth-panel {
  grid-area: depth;
  min-height: 320px;
}

.fx-depth-head {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 12px;
}

.fx-depth-title-center {
  text-align: center;
  width: 100%;
}

.fx-depth-live-area-positive {
  fill: rgba(142, 201, 163, 0.22);
  stroke: none;
}

.fx-depth-live-area-negative {
  fill: rgba(209, 121, 121, 0.22);
  stroke: none;
}

/* ---------------------------------
   FX DEPTH LOCKED BUTTONS
---------------------------------- */

.fx-depth-btn-locked {
  pointer-events: none;
  cursor: default;
  opacity: 0.65;
}

.fx-depth-btn {
  background: transparent;
  border: none;
  box-shadow: none;
}

.fx-depth-btn {
  position: relative;
}

.fx-depth-btn::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0;
  height: 1px;
  background: currentColor;
  transition: width 0.2s ease;
}

.fx-depth-btn:hover::after {
  width: 100%;
}

.fx-toolbar-spreads {
  flex-direction: row !important;
}

.about-name .divider {
  display: block;
  content: "";
  margin-bottom: 6px; /* Controls the exact vertical spacing between the lines */
}

#fx-spreads {
  min-width: 180px;
  max-width: none;
}

/* FINAL OC SECTION CONTAINMENT */

body.view-oc .sidebar-panel {
  display: none !important;
}

body.view-oc .main-grid {
  grid-template-columns: 1fr !important;
}

body.view-oc #view-oc {
  grid-column: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

body.view-oc #view-oc .oc-view {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 520px !important;
  max-height: calc(100vh - 180px) !important;
  overflow: hidden !important;
}

body.view-oc #view-oc .oc-content {
  width: 100% !important;
  max-width: 680px !important;
  margin: 0 auto !important;
}

body.view-oc #view-oc .oc-image {
  display: block !important;
  width: 100% !important;
  max-width: 680px !important;
  max-height: 400px !important;
  object-fit: contain !important;
  margin: 0 auto !important;
}


/* This targets just the 'R' */
.name-part .initial-accent {
  font-family: "Blackadder ITC", cursive;
  
  /* Optional: Blackadder runs a bit small/thin compared to standard fonts. 
     You may want to bump up the size or weight slightly so it balances out. */
  font-size: 1.2em; 
  font-weight: normal; 
}

/* This targets the rest of the name */
.name-part {
  /* Your existing font styles for the rest of the text go here */
  font-family: sans-serif; 
}


.architect-title {
  letter-spacing: normal;
}

:root {
  --vector-silver-bright: #d0d7df;
  --architect-brass: #a98c3d;
}

.initial-accent {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 600;
  letter-spacing: -0.05em;
  vertical-align: -0.08em;
  margin-right: -0.02em;
}

.initial-system {
  color: var(--vector-silver-bright);
}

.initial-architect,
.initial-rand {
  color: var(--architect-brass);
}

.initial-blue {
  color: var(--iv-blue);
}

.initial-green {
  color: var(--iv-green);
}

.initial-gold {
  color: var(--iv-gold);
}

.creator-word,
.architect-word {
  color: var(--architect-brass);
}

.creator-word .initial-accent,
.architect-word .initial-accent {
  font-size: 1.25em;
  line-height: 0;
}

.architect-brass {
  color: var(--architect-brass);
}

.role-initial {
  color: var(--architect-brass);
  font-size: 1.18em;
  vertical-align: -0.05em;
}

.role-divider {
  color: var(--vector-silver-bright);
}

/* ==========================================
   IV[t] COLOR TAXONOMY
========================================== */

.iv-formula {
  letter-spacing: 0.01em;
}

.iv-green {
  color: #34633d;
}

.iv-blue {
  color: #274080;
}


.iv-burgundy{
  color: #800020
}
.iv-gold {
  color: #655125;
}

.iv-systemicity {
  color: #C0C0C0;

  font-family:
    "Blackadder ITC",
    "Edwardian Script ITC",
    cursive;

  font-size: 1.12em;

  font-weight: 400;

  position: relative;
  top: 0.03em;
}


.iv-systemicity2 {
  color: #C0C0C0;

  font-family:
    "Blackadder ITC",
    "Edwardian Script ITC",
    cursive;

  font-size: 1.28em;   /* was smaller before */
  font-weight: 400;

  position: relative;
  top: 0.03em;
}

.iv-systemicity3 {
  color: #999999;
}

.iv-technical {
  color: #FFFFFF;
  font-family:
    "Blackadder ITC",
    "Edwardian Script ITC";
}

.iv-systemicity-letter {
  color: #C0C0C0;

  font-family:
    "Blackadder ITC",
    "Edwardian Script ITC",
    cursive;

  font-size: 1.35em;
  font-weight: 400;
  line-height: 1;

  position: relative;
  top: 0.03em;
}

/* same typography treatment as Rand's R */
.role-initial {
  font-size: 0.82em;
  vertical-align: 0.08em;
  letter-spacing: -0.04em;
  margin-right: -0.02em;
  font-weight: 700;
}

/* Creator = Vector silver */
.creator-role {
  color: var(--vector-silver-bright);
}

/* C = gold */
.creator-role .role-initial {
  color: var(--accent-gold);
}

/* Architect = brass */
.architect-role {
  color: var(--architect-brass);
}

/* A = gold */
.architect-role .role-initial {
    color: var(--accent-gold);
    font-weight: 600;
    }

/* separator */
.role-divider {
  color: var(--vector-silver-bright);
  margin: 0 0.35rem;
}


.founder-initial {
  font-family: "Great Vibes", "Edwardian Script ITC", cursive;

  font-size: 1.40em;
  line-height: 0;

  position: relative;
  top: 0.08em;

  margin-right: -0.08em;

  color: var(--accent-gold);
}
  .core-model-visual {
  position: relative;
  margin: 10px 0 28px 0;
  display: flex;
  justify-content: center;
}

.core-model-image {
  width: 100%;
  max-width: 950px;
  height: auto;
  display: block;

  border-radius: 8px;
  opacity: 0.88;

  mask-image: radial-gradient(
    ellipse at center,
    rgba(0,0,0,1) 58%,
    rgba(0,0,0,0.85) 72%,
    rgba(0,0,0,0.45) 88%,
    rgba(0,0,0,0) 100%
  );

  -webkit-mask-image: radial-gradient(
    ellipse at center,
    rgba(0,0,0,1) 58%,
    rgba(0,0,0,0.85) 72%,
    rgba(0,0,0,0.45) 88%,
    rgba(0,0,0,0) 100%
  );
}

#core-model-iv-vector {
  margin: 4px 0 18px;
}

#core-model-iv-vector .iv-module-question {
  color: var(--accent);
  font-size: 0.76rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 12px;
}

.oc-observation-card {
  border-color: rgba(124, 92, 255, 0.45);
  background:
    linear-gradient(180deg, rgba(16, 20, 38, 0.94), rgba(8, 14, 28, 0.88)),
    radial-gradient(circle at top center, rgba(124, 92, 255, 0.14), transparent 48%);
}

.oc-observation-card .metric-detail-head strong,
.geoscen-obs {
  color: #7c5cff;
}

/* ==========================================
   CORE MODEL IV COMPONENT CARD COLORS
========================================== */

.iv-card-green {
  border-color: rgba(105, 197, 123, 0.45);
  background:
    linear-gradient(180deg, rgba(10, 32, 24, 0.94), rgba(6, 18, 16, 0.88)),
    radial-gradient(circle at top center, rgba(105, 197, 123, 0.14), transparent 48%);
}

.iv-card-green .metric-detail-head strong,
.iv-card-green .metric-detail-example {
  color: #69c57b;
}

.iv-card-blue {
  border-color: rgba(79, 127, 255, 0.45);
  background:
    linear-gradient(180deg, rgba(10, 22, 44, 0.94), rgba(6, 14, 30, 0.88)),
    radial-gradient(circle at top center, rgba(79, 127, 255, 0.14), transparent 48%);
}

.iv-card-blue .metric-detail-head strong,
.iv-card-blue .metric-detail-example {
  color: #4f7fff;
}

.iv-card-gold {
  border-color: rgba(201, 162, 74, 0.48);
  background:
    linear-gradient(180deg, rgba(36, 28, 12, 0.94), rgba(18, 14, 8, 0.88)),
    radial-gradient(circle at top center, rgba(201, 162, 74, 0.16), transparent 48%);
}

.iv-card-gold .metric-detail-head strong,
.iv-card-gold .metric-detail-example {
  color: #c9a24a;
}

.iv-card-s {
  border-color: rgba(192, 192, 192, 0.5);
  background:
    linear-gradient(180deg, rgba(28, 32, 38, 0.94), rgba(12, 15, 20, 0.88)),
    radial-gradient(circle at top center, rgba(192, 192, 192, 0.13), transparent 48%);
}

.iv-card-s .metric-detail-example {
  color: #c0c0c0;
}

.iv-card-s .iv-systemicity2 {
  color: #c0c0c0;
}

/* ISO PHILOSOPHY RECONFIGURATION */

.iso-discipline-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
  gap: 26px;
  align-items: stretch;
}

.iso-discipline-left {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.iso-governance-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.iso-governance-grid .info-card {
  min-height: 160px;
}

.iso-discipline-image-card {
  border: 1px solid var(--border);
  border-radius: 16px;
  overflow: hidden;
  min-height: 100%;
  background: #03070d;
}

.iso-forest-image {
  width: 100%;
  height: 100%;
  min-height: 640px;
  object-fit: cover;
  display: block;
  opacity: 0.88;
}

@media (max-width: 980px) {
  .iso-discipline-layout {
    grid-template-columns: 1fr;
  }

  .iso-governance-grid {
    grid-template-columns: 1fr;
  }

  .iso-forest-image {
    min-height: 360px;
  }
}

.vector-quote-card {
  flex-direction: column;
  gap: 16px;
  padding-top: 18px;
  padding-bottom: 22px;
}

.vector-quote-image {
  width: 100%;
  max-width: 420px;
  height: auto;
  display: block;
  opacity: 0.88;
  border-radius: 10px;

  -webkit-mask-image: linear-gradient(
    90deg,
    transparent 0%,
    black 10%,
    black 90%,
    transparent 100%
  );

  mask-image: linear-gradient(
    90deg,
    transparent 0%,
    black 10%,
    black 90%,
    transparent 100%
  );
}

.about-right,
.about-right p,
.about-right div,
.about-right span,
.about-summary,
.about-meta {
  font-style: normal;
}

.laymen-tag {
  display: inline-block;
  margin-bottom: 0.65rem;

  color: #6ea8ff; /* Iso blue */

  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.22em;

  text-transform: uppercase;
}

.iso-discipline-image-card {
  height: 560px;
  overflow: hidden;
  border-radius: 16px;
}

.iso-forest-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.wti-inv-index-svg {
  width: 100%;
  height: 100%;
  display: block;
}

.wti-inv-line {
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.wti-inv-line.min {
  stroke: rgba(126, 168, 126, 0.75);
  stroke-dasharray: 6 4;
}

.wti-inv-line.avg {
  stroke: rgba(160, 166, 176, 0.75);
  stroke-dasharray: 5 5;
}

.wti-inv-line.max {
  stroke: rgba(180, 100, 100, 0.75);
  stroke-dasharray: 6 4;
}

.wti-inv-line.current {
  stroke: #eef3fa;
  stroke-width: 2.8;
}

.wti-inv-title,
.wti-inv-axis {
  fill: #9fb3c8;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Final RATES containment lock */
#view-rates .rates-main-grid {
  grid-template-rows: 380px 320px auto !important;
  align-items: stretch !important;
}

#view-rates .rates-geoscen-panel,
#view-rates .rates-spread-panel,
#view-rates .rates-sigma-panel {
  height: 320px !important;
  min-height: 320px !important;
  max-height: 320px !important;
  overflow: hidden !important;
}

#view-rates .rates-geoscen-panel .panel-placeholder {
  min-height: 185px !important;
  max-height: 185px !important;
  overflow: hidden !important;
}

#view-rates .rates-spread-panel .fx-chart,
#view-rates .rates-sigma-panel .fx-chart {
  height: 210px !important;
  min-height: 210px !important;
  max-height: 210px !important;
  overflow: hidden !important;
}

#view-rates .rates-policy-panel.rates-metric-blank .chart-shell {
  display: none !important;
}

#view-rates .rates-geoscen-context {
  display: block;
  height: 166px !important;
  min-height: 166px !important;
  max-height: 166px !important;
  padding: 0;
  border: 1px solid rgba(203, 208, 218, 0.9);
  border-radius: 8px;
  background: #f8f8f8;
  color: #030712;
  overflow: hidden;
}

#view-rates .rates-geoscen-panel {
  min-height: 430px !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

#view-rates .rates-geoscen-context {
  min-height: 360px !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

#view-rates .rates-geoscen-panel .panel-placeholder {
  min-height: 360px !important;
  max-height: none !important;
  overflow: visible !important;
}

#view-rates .rates-geoscen-evidence-block {
  min-height: 360px;
}

#view-rates .rates-geoscen-body {
  gap: 12px;
}

#view-rates .rates-geoscen-context-list {
  display: grid;
  gap: 10px;
  line-height: 1.55;
  font-size: 0.82rem;
  text-align: left;
}

.central-bank-language-block {
  width: 100%;
  height: 100%;
  padding: 10px 12px 12px;
  color: #030712;
  text-align: center;
  user-select: text;
  cursor: text;
}

.central-bank-language-topbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 18px;
  min-height: 24px;
}

.central-bank-language-meta,
.central-bank-language-brand,
.central-bank-language-dot,
.central-bank-language-date {
  color: #030712;
  font-size: 0.74rem;
  font-weight: 700;
  font-family: "IBM Plex Sans", "Inter", sans-serif;
  line-height: 1.05;
  white-space: nowrap;
  user-select: text;
}

.central-bank-language-strip,
.central-bank-language-segment,
.central-bank-language-bracket,
.central-bank-language-pipe {
  color: #030712;
  font-size: 0.74rem;
  font-weight: 700;
  font-family: "IBM Plex Mono", "Courier New", monospace;
  line-height: 1.05;
  white-space: nowrap;
  user-select: text;
}

.central-bank-language-meta {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.central-bank-language-strip {
  justify-self: end;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 3px 7px;
  background: #ffffff;
}

.central-bank-language-segment {
  white-space: nowrap;
}

.policy-pct-empty {
  color: #7e899b;
}

.central-bank-language-segment-sh {
  color: var(--rates-ladder-sh);
}

.central-bank-language-segment-mh {
  color: var(--rates-ladder-mh);
}

.central-bank-language-segment-n {
  color: var(--rates-ladder-n);
}

.central-bank-language-segment-md {
  color: var(--rates-ladder-md);
}

.central-bank-language-segment-sd {
  color: var(--rates-ladder-sd);
}

.central-bank-language-rule {
  height: 1px;
  margin: 11px 24px 13px;
  background: linear-gradient(
    90deg,
    transparent 0,
    rgba(3, 7, 18, 0) 0,
    rgba(3, 7, 18, 0.88) 9%,
    rgba(3, 7, 18, 0.88) 91%,
    transparent 100%
  );
}

.central-bank-language-body {
  min-height: 88px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding-top: 0;
}

.central-bank-language-context {
  color: #030712;
  font-size: 1.04rem;
  font-weight: 800;
  line-height: 1.1;
}

.central-bank-language-context-value {
  color: #111827;
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.15;
}

.central-bank-language-state-label {
  color: #30333a;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.central-bank-language-state-wrap {
  margin-top: 2px;
  color: #030712;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.15;
}

.rates-sigma-stack {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 12px;
  height: 100%;
  justify-content: center;
}

.rates-sigma-row {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) 54px;
  align-items: center;
  gap: 10px;
  min-height: 24px;
}

.rates-sigma-label span {
  display: block;
  color: #eef3fa;
  font-size: 0.72rem;
  font-weight: 700;
}

.rates-sigma-label small {
  display: block;
  color: #7f8ea3;
  font-size: 0.52rem;
  text-transform: uppercase;
}

.rates-sigma-track {
  height: 7px;
  border-radius: 999px;
  background: rgba(126, 153, 196, 0.13);
  overflow: hidden;
}

.rates-sigma-bar {
  height: 100%;
  border-radius: 999px;
  background: rgba(213, 179, 124, 0.78);
}

.rates-sigma-row.selected .rates-sigma-bar {
  background: #d5b37c;
  box-shadow: 0 0 12px rgba(213, 179, 124, 0.35);
}

.rates-sigma-row.blank {
  opacity: 0.72;
}

.rates-sigma-row.blank .rates-sigma-bar {
  width: 0 !important;
}

.rates-sigma-row.blank .rates-sigma-label small,
.rates-sigma-row.blank .rates-sigma-value {
  color: #7f8ea3;
}

.rates-sigma-value {
  text-align: right;
  color: #eef3fa;
  font-size: 0.72rem;
  font-weight: 700;
}

/* ===========================
   Oracle Labs
=========================== */

#view-oc .oracle-labs-section {
  width: min(1120px, 100%);
  margin: 16px auto 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

#view-oc .oracle-labs-image {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto 28px;
}

#view-oc .oracle-labs-header {
  margin-bottom: 28px;
  text-align: center;
}

#view-oc .oracle-labs-header h2 {
  margin: 0;
  color: rgba(226, 232, 240, 0.92);
  font-size: 1.02rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  line-height: 1.4;
  text-transform: uppercase;
}

#view-oc .oracle-labs-header .oc-title-main {
  font-family: 'Papyrus', 'Palatino', serif;
  font-style: italic;
  text-transform: none;
}

#view-oc .oracle-labs-divider {
  color: #7c5cff;
  margin: 0 8px;
}

#view-oc .oracle-labs-group {
  margin: 28px 0;
}

#view-oc .oracle-labs-group:first-of-type {
  margin-top: 0;
}

#view-oc .oracle-labs-group:last-of-type {
  margin-bottom: 0;
}

#view-oc .oracle-labs-label {
  margin-bottom: 16px;
  color: rgba(159, 179, 200, 0.94);
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  line-height: 1.4;
  text-align: center;
  text-transform: none;
}

body.view-oc #view-oc .oracle-labs-label .initial-accent {
  font-family: "Blackadder ITC", cursive !important;
  font-size: 1.65em !important;
  font-weight: normal !important;
  line-height: 0 !important;
  vertical-align: -0.04em !important;
  letter-spacing: -0.03em !important;
  margin-right: 0.01em !important;
}

#view-oc .oracle-labs-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

#view-oc .oracle-labs-card {
  min-height: 108px;
  padding: 16px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 8px;
  background: rgba(8, 18, 29, 0.88);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
  color: inherit;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font: inherit;
  transition:
    border-color 0.18s ease,
    transform 0.18s ease,
    background 0.18s ease;
}

#view-oc .oracle-labs-card:hover,
#view-oc .oracle-labs-card:focus-visible {
  border-color: rgba(124, 92, 255, 0.58);
  background: rgba(12, 24, 40, 0.94);
  transform: translateY(-2px);
  outline: none;
}

#view-oc .oracle-labs-card-title {
  color: rgba(226, 232, 240, 0.92);
  font-size: 0.84rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1.35;
  text-align: center;
  text-transform: uppercase;
}

#view-oc .oracle-labs-research-placeholder {
  width: min(420px, 100%);
  min-height: 108px;
  margin: 0 auto;
  border: 1px solid rgba(124, 92, 255, 0.2);
  border-radius: 8px;
  background: rgba(11, 17, 31, 0.82);
  color: rgba(159, 179, 200, 0.62);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
}

body.view-oc #view-oc .oc-text,
body.view-oc #view-oc .oc-view {
  display: none !important;
}

body.oracle-labs-modal-open {
  overflow: hidden;
}

.oracle-labs-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
}

.oracle-labs-modal.is-open {
  display: flex;
}

.oracle-labs-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 7, 13, 0.74);
  backdrop-filter: blur(5px);
}

.oracle-labs-modal-panel {
  position: relative;
  z-index: 1;
  width: min(760px, 100%);
  max-height: min(82vh, 760px);
  overflow: auto;
  padding: 28px;
  border: 1px solid rgba(124, 92, 255, 0.36);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(16, 20, 38, 0.98), rgba(8, 14, 28, 0.98)),
    radial-gradient(circle at top center, rgba(124, 92, 255, 0.12), transparent 54%);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.62);
}

.oracle-labs-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 32px;
  height: 32px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 8px;
  background: rgba(8, 18, 29, 0.88);
  color: rgba(226, 232, 240, 0.9);
  cursor: pointer;
  font-size: 1.1rem;
  line-height: 1;
}

.oracle-labs-modal-close:hover,
.oracle-labs-modal-close:focus-visible {
  border-color: rgba(124, 92, 255, 0.58);
  outline: none;
}

.oracle-labs-modal-panel h3 {
  margin: 0 42px 22px 0;
  color: rgba(242, 245, 250, 0.96);
  font-size: 1.02rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 1.35;
  text-transform: uppercase;
}

.oracle-labs-modal-body {
  display: grid;
  gap: 16px;
}

.oracle-labs-modal-field {
  padding-top: 14px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
}

.oracle-labs-modal-field span {
  display: block;
  margin-bottom: 7px;
  color: rgba(159, 179, 200, 0.94);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.oracle-labs-modal-field p {
  margin: 0;
  color: rgba(210, 220, 232, 0.88);
  font-size: 0.88rem;
  line-height: 1.62;
}

.oracle-labs-modal-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 24px;
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
  color: rgba(210, 220, 232, 0.82);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  line-height: 1.4;
  text-align: center;
  text-transform: uppercase;
}

.oracle-modal-section-label.purpose {
  color: var(--accent, #d5b37c);
}

.oracle-modal-section-label.origin {
  color: var(--good, #8ec9a3);
}

.oracle-modal-section-label.methodology {
  color: #c0c0c0;
}

.oracle-labs-modal-links .oracle-footer-bullet,
.oracle-labs-modal-links .oracle-footer-separator {
  color: inherit;
}

.oracle-labs-modal-links a.oracle-footer-link,
.oracle-labs-modal-links a.oracle-footer-link:visited {
  color: inherit;
  cursor: pointer;
  text-decoration: none;
  transition: color 0.18s ease;
}

.oracle-labs-modal-links a.oracle-footer-link:hover,
.oracle-labs-modal-links a.oracle-footer-link:focus-visible {
  color: #d5b37c;
  outline: none;
  text-decoration: none;
}

@media (max-width: 980px) {
  #view-oc .oracle-labs-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  #view-oc .oracle-labs-section,
  .oracle-labs-modal-panel {
    padding: 18px;
  }

  #view-oc .oracle-labs-grid {
    grid-template-columns: 1fr;
  }

  #view-oc .oracle-labs-card,
  #view-oc .oracle-labs-research-placeholder {
    min-height: 96px;
  }
}
/* ===========================
   FINAL OC HARD RESET
=========================== */

body.view-oc .sidebar-panel {
  display: none !important;
}

body.view-oc .main-grid {
  display: block !important;
  grid-template-columns: 1fr !important;
}

body.view-oc #view-oc,
body.view-oc #view-oc.active {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 10 !important;
  width: 100% !important;
  min-height: calc(100vh - 140px) !important;
  overflow: visible !important;
}

body.view-oc #view-oc .oc-view,
body.view-oc #view-oc .oc-content {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

body.view-oc #view-oc .oracle-labs-section {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: min(1120px, 100%) !important;
  margin: 32px auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body.view-oc #view-oc .oracle-labs-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

body.view-oc #view-oc .oracle-labs-card {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 96px !important;
  padding: 18px !important;
  border: 1px solid rgba(124, 92, 255, 0.42) !important;
  border-radius: 12px !important;
  background: rgba(8, 18, 32, 0.95) !important;
  color: #eef3fa !important;
  cursor: pointer !important;
}

body.view-oc #view-oc .oracle-labs-card-title,
body.view-oc #view-oc .oracle-labs-label,
body.view-oc #view-oc .oracle-labs-header {
  color: #eef3fa !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body.view-oc #view-oc .oracle-labs-research-placeholder {
  display: block !important;
  text-align: center !important;
  color: #7f8ea3 !important;
  font-size: 2rem !important;
  padding: 18px 0 !important;
}

/* HARD OC VISIBILITY RESET - final rule wins */
body.view-oc #view-oc,
body.view-oc #view-oc.active,
body.view-oc #view-oc .oc-view,
body.view-oc #view-oc .oc-content,
body.view-oc #view-oc .oracle-labs-section {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  width: 100% !important;
  max-width: none !important;
  overflow: visible !important;
  transform: none !important;
  clip: auto !important;
  clip-path: none !important;
}

body.view-oc .sidebar-panel {
  display: none !important;
}

body.view-oc .main-grid {
  grid-template-columns: 1fr !important;
}

body.view-oc #view-oc .oracle-labs-section {
  width: min(1120px, 100%) !important;
  margin: 24px auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body.view-oc #view-oc .oracle-labs-image {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto 28px !important;
}

body.view-oc #view-oc .oracle-labs-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

body.view-oc #view-oc .oracle-labs-card {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 96px !important;
  border: 1px solid rgba(124, 92, 255, 0.35) !important;
  background: rgba(8, 18, 32, 0.95) !important;
  color: #eef3fa !important;
}

body:not(.view-oc) #view-oc,
#view-oc:not(.active) {
  display: none !important;
}

/* Oracle Labs maturity states */
body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card {
  border-color: rgba(190, 199, 210, 0.42) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 8px 18px rgba(0, 0, 0, 0.12) !important;
  transition: border-color 0.18s ease !important;
}

body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card:hover,
body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card:focus-visible {
  border-color: rgba(226, 232, 240, 0.58) !important;
  background: rgba(8, 18, 32, 0.95) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 8px 18px rgba(0, 0, 0, 0.12) !important;
  transform: none !important;
}

body.view-oc #view-oc .oracle-labs-group-development .oracle-labs-card {
  border-color: rgba(105, 151, 205, 0.42) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    0 0 14px rgba(88, 146, 214, 0.08) !important;
}

body.view-oc #view-oc .oracle-labs-group-development .oracle-labs-card:hover,
body.view-oc #view-oc .oracle-labs-group-development .oracle-labs-card:focus-visible {
  border-color: rgba(128, 171, 220, 0.56) !important;
  background: rgba(9, 20, 35, 0.96) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 0 16px rgba(88, 146, 214, 0.1) !important;
  transform: none !important;
}

body.view-oc #view-oc .oracle-labs-research-placeholder {
  min-height: auto !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(159, 179, 200, 0.52) !important;
}

/* Oracle Labs deployed wash treatments */
body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card::before,
body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card::before {
  opacity: 0.12;
}

body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card::after {
  opacity: 0.06;
  background:
    linear-gradient(112deg, transparent 0 22%, rgba(255, 255, 255, 0.18) 28%, transparent 36%),
    linear-gradient(78deg, transparent 0 58%, rgba(255, 255, 255, 0.12) 64%, transparent 72%),
    radial-gradient(circle at 18% 24%, rgba(255, 255, 255, 0.18), transparent 16%);
}

body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card-title {
  position: relative !important;
  z-index: 1 !important;
}

body.view-oc #view-oc .oracle-labs-card--inflation::before {
  background:
    radial-gradient(ellipse at 30% 22%, rgba(213, 179, 124, 0.82), transparent 38%),
    radial-gradient(ellipse at 78% 70%, rgba(154, 108, 58, 0.36), transparent 42%),
    linear-gradient(145deg, rgba(213, 179, 124, 0.18), transparent 56%);
}

body.view-oc #view-oc .oracle-labs-card--hknsl::before {
  background:
    radial-gradient(ellipse at 30% 64%, rgba(174, 184, 195, 0.58), transparent 34%),
    radial-gradient(ellipse at 70% 38%, rgba(118, 128, 140, 0.42), transparent 42%),
    linear-gradient(12deg, transparent 0 48%, rgba(205, 211, 218, 0.22) 49% 51%, transparent 52%);
}

body.view-oc #view-oc .oracle-labs-card--vinv::before {
  background:
    radial-gradient(ellipse at 28% 30%, rgba(142, 201, 163, 0.62), transparent 38%),
    radial-gradient(ellipse at 76% 72%, rgba(66, 121, 92, 0.36), transparent 42%),
    linear-gradient(150deg, rgba(142, 201, 163, 0.16), transparent 58%);
}

body.view-oc #view-oc .oracle-labs-card--fedspeak::before {
  background:
    radial-gradient(ellipse at 34% 40%, rgba(205, 212, 221, 0.42), transparent 34%),
    radial-gradient(ellipse at 78% 28%, rgba(42, 50, 62, 0.72), transparent 46%),
    linear-gradient(132deg, rgba(24, 30, 40, 0.44), transparent 62%);
}

body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card:hover,
body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card:focus-visible {
  border-color: rgba(226, 232, 240, 0.64) !important;
}

/* Oracle Labs gallery refinement */
body.view-oc #view-oc .oracle-labs-label {
  font-size: 0.84rem !important;
}

body.view-oc #view-oc .oracle-labs-card {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transform: none !important;
  transition:
    transform 0.18s ease,
    color 0.18s ease !important;
}

body.view-oc #view-oc .oracle-labs-card:hover,
body.view-oc #view-oc .oracle-labs-card:focus-visible,
body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card:hover,
body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card:focus-visible,
body.view-oc #view-oc .oracle-labs-group-development .oracle-labs-card:hover,
body.view-oc #view-oc .oracle-labs-group-development .oracle-labs-card:focus-visible {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: translateY(-2px) !important;
  outline: none !important;
}

body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card::before,
body.view-oc #view-oc .oracle-labs-group-deployed .oracle-labs-card::after {
  opacity: 0.05;
}

body.view-oc #view-oc .oracle-labs-card-title {
  position: relative !important;
  z-index: 1 !important;
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: center !important;
  color: rgba(226, 232, 240, 0.9) !important;
  transition: color 0.18s ease !important;
}

body.view-oc #view-oc .oracle-labs-card-title::after {
  content: "";
  display: block;
  width: 56%;
  min-width: 32px;
  max-width: 82px;
  height: 7px;
  margin-top: 9px;
  opacity: 0.06;
  background:
    radial-gradient(ellipse at 18% 52%, rgba(238, 243, 250, 0.86), transparent 56%),
    radial-gradient(ellipse at 48% 46%, rgba(238, 243, 250, 0.72), transparent 54%),
    radial-gradient(ellipse at 78% 58%, rgba(238, 243, 250, 0.5), transparent 58%),
    linear-gradient(90deg, transparent 0%, rgba(238, 243, 250, 0.56) 18%, rgba(238, 243, 250, 0.46) 74%, transparent 100%);
  filter: blur(0.35px);
  transform: skewX(-8deg);
  transition: opacity 0.18s ease !important;
}

body.view-oc #view-oc .oracle-labs-card:hover .oracle-labs-card-title,
body.view-oc #view-oc .oracle-labs-card:focus-visible .oracle-labs-card-title {
  color: rgba(248, 250, 252, 0.98) !important;
}

body.view-oc #view-oc .oracle-labs-card:hover .oracle-labs-card-title::after,
body.view-oc #view-oc .oracle-labs-card:focus-visible .oracle-labs-card-title::after {
  opacity: 0.13;
}

/* Oracle Labs compact gallery sizing */
body.view-oc #view-oc .oracle-labs-grid {
  justify-items: center !important;
  gap: 34px 42px !important;
}

body.view-oc #view-oc .oracle-labs-card {
  width: auto !important;
  min-width: max-content !important;
  min-height: auto !important;
  padding: 10px 14px 14px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.view-oc #view-oc .oracle-labs-card-title {
  display: inline-flex !important;
  width: auto !important;
  white-space: nowrap !important;
}

body.view-oc #view-oc .oracle-labs-card-title::after {
  width: 100% !important;
  min-width: 42px !important;
  max-width: 150px !important;
  height: 7px !important;
  margin: 9px auto 0 !important;
}

body.view-oc #view-oc .oracle-labs-card:hover,
body.view-oc #view-oc .oracle-labs-card:focus-visible {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.view-oc #view-oc .oracle-labs-section {
  margin-top: 0 !important;
  scroll-snap-type: y mandatory;
}

body.view-oc #view-oc .oracle-labs-hero.oracle-image-fixed {
  position: fixed !important;
  top: 90px;
  left: 0;
  right: 0;
  height: calc(100vh - 90px);
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: auto;
  cursor: pointer;
}

body.view-oc #view-oc .oracle-labs-hero:focus-visible {
  outline: none;
}

body.view-oc #view-oc .oracle-labs-hero .oracle-labs-image {
  max-height: calc(100vh - 110px);
  max-width: 92vw;
  width: auto;
  object-fit: contain;
}

body.view-oc #view-oc .oracle-labs-scroll-cue {
  align-self: end;
  color: rgba(159, 179, 200, 0.32);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.24em;
  line-height: 1;
  text-transform: uppercase;
}

body.view-oc #view-oc .oracle-chamber-track {
  position: relative;
  z-index: 10;
  min-height: 400vh;
  padding-top: calc(100vh - 90px);
  scroll-snap-type: y mandatory;
}

body.view-oc #view-oc .oracle-chamber-panel {
  --oracle-cup-stop: 72vh;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  scroll-snap-align: start;
  transform: translateY(14px);
  transition:
    opacity 0.34s ease,
    transform 0.34s ease;
}

body.view-oc #view-oc .oracle-chamber-panel.is-active {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

body.view-oc #view-oc .oracle-chamber-panel .oracle-labs-group {
  width: 100%;
  margin: 0 !important;
}

body.view-oc #view-oc .oracle-chamber-controls {
  position: fixed;
  right: clamp(18px, 3vw, 42px);
  bottom: clamp(22px, 5vh, 54px);
  z-index: 12;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

body.view-oc #view-oc .oracle-chamber-control {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: rgba(159, 179, 200, 0.36);
  cursor: pointer;
  font: inherit;
  font-size: 0.86rem;
  line-height: 1;
  transition:
    color 0.18s ease,
    transform 0.18s ease;
}

body.view-oc #view-oc .oracle-chamber-control:hover,
body.view-oc #view-oc .oracle-chamber-control:focus-visible {
  color: rgba(213, 179, 124, 0.72);
  outline: none;
  transform: translateY(-1px);
}

@media (max-width: 620px) {
  body.view-oc #view-oc .oracle-labs-hero {
    min-height: 92svh;
    padding-bottom: 28px;
  }

  body.view-oc #view-oc .oracle-labs-hero .oracle-labs-image {
    max-height: calc(92svh - 100px) !important;
  }

  body.view-oc #view-oc .oracle-chamber-panel {
    min-height: 92svh;
    height: 92svh;
    padding-top: 66vh;
  }
}

/* Oracle Chamber immersive scale */
body.view-oc #view-oc .oracle-labs-hero {
  min-height: 100vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

body.view-oc #view-oc .oracle-labs-hero .oracle-labs-image,
body.view-oc #view-oc .oc-image {
  width: auto !important;
  height: min(80vh, 900px) !important;
  max-width: 90vw !important;
  max-height: 80vh !important;
  object-fit: contain !important;
  margin: 0 auto !important;
}

body.view-oc #view-oc .oracle-labs-scroll-cue {
  position: absolute;
  left: 50%;
  bottom: 5vh;
  transform: translateX(-50%);
}

body.view-oc #view-oc .oracle-chamber-panel {
  --oracle-cup-stop: 72vh;
}

@media (max-width: 620px) {
  body.view-oc #view-oc .oracle-labs-hero .oracle-labs-image,
  body.view-oc #view-oc .oc-image {
    height: min(74vh, 720px) !important;
    max-height: 74vh !important;
  }

body.view-oc #view-oc .oracle-chamber-panel {
    padding-top: 68vh !important;
  }
}

/* OC-only immersive containment */
body.view-oc .topbar {
  display: grid !important;
  z-index: 5000;
}

body.view-oc .sidebar-panel {
  display: none !important;
}

body.view-oc .main-grid {
  display: block !important;
  grid-template-columns: 1fr !important;
  padding-top: 118px !important;
}

body.view-oc #view-oc {
  display: block !important;
  min-height: 100vh !important;
}

/* OC-only standalone architecture */
body.view-oc .topbar {
  display: grid !important;
  z-index: 5000;
}

body.view-oc .sidebar-panel {
  display: none !important;
}

body.view-oc .main-grid {
  display: block !important;
  grid-template-columns: 1fr !important;
  padding: 90px 0 0 !important;
}

body.view-oc #view-oc {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: calc(100vh - 90px) !important;
}

body.view-oc #view-oc .oracle-labs-section,
body.view-oc #view-oc .oracle-stage,
body.view-oc #view-oc .oracle-labs-hero {
  margin: 0 !important;
  padding: 0 !important;
}

body.view-oc #view-oc .oracle-labs-hero {
  min-height: calc(100vh - 90px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.view-oc #view-oc .oracle-labs-hero .oracle-labs-image,
body.view-oc #view-oc .oc-image {
  width: auto !important;
  height: auto !important;
  max-height: calc(100vh - 90px) !important;
  max-width: 90vw !important;
  object-fit: contain !important;
  margin: 0 auto !important;
}

/* OC-only centered chamber composition */
body.view-oc #view-oc .oracle-labs-section {
  width: min(1400px, 100%) !important;
  max-width: 1400px !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

body.view-oc #view-oc .oracle-stage,
body.view-oc #view-oc .oracle-labs-hero,
body.view-oc #view-oc .oracle-chamber-track {
  width: 100% !important;
  max-width: 1400px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.view-oc #view-oc .oracle-labs-hero {
  flex-direction: column !important;
  text-align: center !important;
}

body.view-oc #view-oc .oracle-labs-hero .oracle-labs-image,
body.view-oc #view-oc .oc-image {
  display: block !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.view-oc #view-oc .oracle-chamber-panel,
body.view-oc #view-oc .oracle-labs-group,
body.view-oc #view-oc .oracle-labs-grid,
body.view-oc #view-oc .oracle-labs-research-placeholder {
  margin-right: auto !important;
  margin-left: auto !important;
  text-align: center !important;
}

/* OC-only fixed Oracle image lock */
body.view-oc #view-oc .oracle-labs-hero.oracle-image-fixed {
  position: fixed !important;
  top: 90px !important;
  left: 0 !important;
  right: 0 !important;
  width: auto !important;
  max-width: none !important;
  height: calc(100vh - 90px) !important;
  min-height: 0 !important;
  z-index: 5 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: auto;
}

body.view-oc #view-oc .oracle-labs-hero .oracle-labs-image {
  max-height: calc(100vh - 110px) !important;
  max-width: 92vw !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}

body.view-oc #view-oc .oracle-chamber-track {
  position: relative;
  z-index: 10;
  min-height: 400vh;
  padding-top: calc(100vh - 90px);
}

body.view-oc #view-oc .oracle-chamber-panel {
  position: relative;
  min-height: 100vh !important;
  height: 100vh !important;
  display: block !important;
  padding: 0 !important;
  transform: none !important;
}

body.view-oc #view-oc .oracle-chamber-panel .oracle-labs-group {
  position: fixed !important;
  top: var(--oracle-cup-y, 85vh) !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: min(100%, 900px);
  z-index: 20;
  text-align: center;
}

.ism-apf-activity {
  border-color: rgba(105, 151, 205, 0.45);
}

.ism-apf-pressure {
  border-color: rgba(213, 179, 124, 0.52);
}

.ism-apf-flow {
  border-color: rgba(142, 201, 163, 0.45);
}
  
.ism-apf-activity {
  border-color: rgba(105, 151, 205, 0.45);
}

.ism-apf-pressure {
  border-color: rgba(213, 179, 124, 0.52);
}

.ism-apf-flow {
  border-color: rgba(142, 201, 163, 0.45);
}


.ism-family-card:nth-child(1) .ism-family-title {
  color: #d5b37c; /* ACTIVITY */
}

.ism-family-card:nth-child(2) .ism-family-title {
  color: #c79a63; /* PRESSURE */
}

.ism-family-card:nth-child(3) .ism-family-title {
  color: #8ec9a3; /* FLOW */
}


.ism-apf-activity .ism-apf-column-title {
  color: #6997cd !important;
}

.ism-apf-pressure .ism-apf-column-title {
  color: #d5b37c !important;
}

.ism-apf-flow .ism-apf-column-title {
  color: #8ec9a3 !important;
}

.ism-apf-column-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.ism-apf-title-glyph {
  width: 30px;
  height: 18px;
  object-fit: contain;
  opacity: 0.68;
  flex: 0 0 auto;
  pointer-events: none;
}

.ism-apf-activity .ism-apf-column-title {
  color: #6997cd !important;
}

.ism-apf-pressure .ism-apf-column-title {
  color: #d5b37c !important;
}

.ism-apf-flow .ism-apf-column-title {
  color: #8ec9a3 !important;
}

.ism-apf-column-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.ism-apf-title-glyph {
  display: block;
  width: 30px;
  height: 18px;
  object-fit: contain;
  flex: 0 0 auto;
  opacity: 0.68;
  pointer-events: none;
  user-select: none;
}

.ism-apf-activity .ism-apf-column-title {
  color: #6997cd !important;
}

.ism-apf-pressure .ism-apf-column-title {
  color: #d5b37c !important;
}

.ism-apf-flow .ism-apf-column-title {
  color: #8ec9a3 !important;
}

.ism-apf-column-title {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
}

.ism-apf-title-dot {
  color: currentColor;
  opacity: 0.75;
  font-size: 0.72rem;
  line-height: 1;
}

.ism-apf-title-glyph {
  display: block;
  width: 42px;
  height: 22px;
  object-fit: contain;
  opacity: 0.9;
  pointer-events: none;
  user-select: none;
}


.ism-apf-column-title {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: 4px;
  white-space: nowrap;
}

.ism-apf-title-label,
.ism-apf-title-dot,
.ism-apf-title-glyph {
  display: inline-block !important;
  flex: 0 0 auto;
}

.ism-apf-title-dot {
  line-height: 1;
}

.ism-apf-title-glyph {
  width: 42px;
  height: 22px;
  object-fit: contain;
}

.ism-apf-title-glyph-wrap {
  width: 42px;
  height: 24px;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 42px;
}

.ism-apf-title-glyph {
  display: block !important;
  width: 110px !important;
  height: 74px !important;
  max-width: none !important;
  object-fit: contain;
  flex: none !important;
  pointer-events: none;
}

.ism-position-detail-card {
  position: absolute;
  right: 14px;
  top: 50px;
  z-index: 5;
  max-width: min(560px, calc(100% - 28px));
  margin-top: 0;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.42);
}

/* ==================================================================================
   FX GEOSCEN POLICY-LANGUAGE TOOLBAR
   ================================================================================== */

.fx-policy-toolbar {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin: 0 0 14px;
  padding: 10px 12px 12px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.32);
}

.fx-policy-toolbar-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  font-size: 0.72rem;
}

.fx-policy-toolbar-meta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex: 0 0 116px;
  white-space: nowrap;
}

.fx-policy-toolbar-strip {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
}

.fx-policy-toolbar-evolution {
  border: 0;
  padding: 0;
  margin-left: 8px;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.policy-language-evolution-popover {
  position: relative;
  box-sizing: border-box;
  width: min(100%, 344px);
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 8px;
  background: #0f172a;
  color: #e2e8f0;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.35);
  font-size: 12px;
}

.fx-geoscen-evolution-tray-host {
  display: flex;
  justify-content: flex-end;
  align-self: stretch;
  width: auto;
  min-width: 0;
  box-sizing: border-box;
}

.fx-geoscen-evolution-tray {
  margin: 10px 0;
}

.policy-language-evolution-popover-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.fx-geoscen-evolution-tray__title {
  min-width: 0;
  font-weight: 700;
}

.fx-geoscen-evolution-tray__subtitle {
  margin-top: 4px;
  color: #94a3b8;
}

.policy-language-evolution-popover-table {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

.policy-language-evolution-popover-table-inner {
  min-width: 288px;
}

#fx-policy-spread-evolution-popover {
  position: fixed;
  z-index: 9999;
  width: 344px;
  max-width: calc(100vw - 24px);
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 8px;
  background: #0f172a;
  color: #e2e8f0;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.35);
  font-size: 12px;
}

.fx-policy-spread-popover-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.fx-policy-spread-popover-header button {
  border: 0;
  padding: 0;
  background: transparent;
  color: #cbd5e1;
  cursor: pointer;
  font: inherit;
}

.fx-policy-spread-popover-subtitle {
  margin-top: 4px;
  color: #94a3b8;
}

.fx-policy-spread-history-row {
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: 8px;
  align-items: start;
  margin-top: 10px;
}

.fx-policy-spread-history-date {
  color: #94a3b8;
}

.fx-policy-spread-history-values {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
}

.fx-policy-spread-history-empty {
  margin-top: 10px;
  color: #94a3b8;
}

@media (max-width: 899px) {
  .fx-policy-toolbar-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .fx-policy-toolbar-meta {
    flex-basis: auto;
  }

  .fx-policy-toolbar-strip {
    flex-wrap: wrap;
    white-space: normal;
  }
}

/* ==================================================================================
   FX GEOSCEN POLICY TOOLBAR
   Embedded treatment matching RATES GeoScen.
================================================================================== */

#view-fx .fx-geoscen-panel > .panel-placeholder .fx-policy-toolbar {
  margin: 0 0 16px;
  padding: 0 0 12px;
  border: 0;
  border-bottom: 1px solid rgba(15, 23, 42, 0.18);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #0f172a;
  text-align: left;
}

#view-fx .fx-geoscen-panel > .panel-placeholder .fx-policy-toolbar-row {
  color: #0f172a;
}

#view-fx .fx-geoscen-panel > .panel-placeholder .fx-policy-toolbar-meta,
#view-fx .fx-geoscen-panel > .panel-placeholder .fx-policy-toolbar-strip {
  color: #0f172a;
}

#view-fx .fx-geoscen-panel > .panel-placeholder .fx-policy-toolbar-evolution,
#view-fx .fx-geoscen-panel > .panel-placeholder [data-policy-language-evolution] {
  color: #0f172a !important;
}

/* ==================================================================================
   FX GEOSCEN TOOLBAR REFINEMENT
   Toolbar row + dedicated GeoScen Context row.
================================================================================== */

#view-fx .fx-geoscen-panel > .panel-placeholder {
  display: block;
}

#view-fx .fx-geoscen-panel > .panel-placeholder .fx-policy-toolbar {
  display: block;
  width: 100%;
  box-sizing: border-box;
}

#view-fx .fx-geoscen-panel .fx-geoscen-context-row {
  display: flex;
  width: 100%;
  min-height: 76px;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  text-align: center;
}

/* Spread is a comparative diagnostic, visually separate from either institution. */

#view-fx .fx-policy-toolbar-row-spread,
#view-fx .fx-policy-toolbar-row-spread .fx-policy-toolbar-meta,
#view-fx .fx-policy-toolbar-row-spread .fx-policy-toolbar-strip {
  color: #191970;
}

#view-fx .fx-policy-toolbar-row-spread .fx-policy-toolbar-meta strong {
  color: #191970;
}

#view-fx .fx-policy-toolbar-row-spread .central-bank-language-segment,
#view-fx .fx-policy-toolbar-row-spread .central-bank-language-pipe,
#view-fx .fx-policy-toolbar-row-spread .central-bank-language-bracket {
  color: inherit;
}

#view-fx .fx-policy-toolbar-row-spread .fx-policy-toolbar-evolution {
  color: #191970;
}

/* ==================================================================================
   FX GEOSCEN â€” FINAL ROW LAYOUT CORRECTION

   Required structure:
   ECB row
   FedSpeak row
   Spread row
   GeoScen Context row
================================================================================== */

/* White GeoScen card must stack its children vertically, never as columns. */

#view-fx .fx-geoscen-panel > .panel-placeholder {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  gap: 14px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  text-align: left !important;
}

/* Toolbar occupies the first full-width row. */

#view-fx .fx-geoscen-panel > .panel-placeholder > .fx-policy-toolbar {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  gap: 7px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 0 12px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(15, 23, 42, 0.18) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Each policy entry is one horizontal row. */

#view-fx .fx-policy-toolbar-row {
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Keep institution / date metadata on one line. */

#view-fx .fx-policy-toolbar-meta {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  text-align: left !important;
}

/* Keep distribution & Evolution on one line where space permits. */

#view-fx .fx-policy-toolbar-strip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: 4px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  text-align: left !important;
}

/* Prevent labels & Evolution from becoming separate vertical blocks. */

#view-fx .fx-policy-toolbar-meta strong,
#view-fx .fx-policy-toolbar-meta span,
#view-fx .fx-policy-toolbar-strip span,
#view-fx .fx-policy-toolbar-strip button {
  display: inline !important;
  width: auto !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Spread is comparative evidence, not another institution. */

#view-fx .fx-policy-toolbar-row-spread .fx-policy-toolbar-meta strong {
  color: #191970 !important;
}

/* Preserve bucket-specific colors inside Spread. */

#view-fx .fx-policy-toolbar-row-spread .central-bank-language-segment-sh {
  color: #7f1d1d !important;
}

#view-fx .fx-policy-toolbar-row-spread .central-bank-language-segment-mh {
  color: #e87979 !important;
}

#view-fx .fx-policy-toolbar-row-spread .central-bank-language-segment-n {
  color: #a9874f !important;
}

#view-fx .fx-policy-toolbar-row-spread .central-bank-language-segment-md {
  color: #4f9560 !important;
}

#view-fx .fx-policy-toolbar-row-spread .central-bank-language-segment-sd {
  color: #5f7356 !important;
}

/* GeoScen Context occupies the second full-width row. */

#view-fx .fx-geoscen-panel .fx-geoscen-context-row {
  display: flex !important;
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 68px !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 10px 12px !important;
  text-align: center !important;
}

/* Compact layouts may wrap the analytical strip, but remain rowsâ€”not columns. */

@media (max-width: 900px) {
  #view-fx .fx-policy-toolbar-row {
    grid-template-columns: 1fr !important;
    row-gap: 3px !important;
  }

  #view-fx .fx-policy-toolbar-strip {
    flex-wrap: wrap !important;
  }
}

/* ==================================================================================
   FX GEOSCEN POLICY TOOLBAR â€” FINAL COSMETIC ALIGNMENT

   Required visual result:
   ECB             â€¢| ... |â€¢ Evolution
   FedSpeak        â€¢| ... |â€¢ Evolution
   Spread â€¢ Jun '26 â€¢| ... |â€¢ Evolution
================================================================================== */

/* -------------------------------------------------------------------------------
   Row geometry
   Keep labels on the left & make every analytical strip use the same right edge.
-------------------------------------------------------------------------------- */

#view-fx .fx-geoscen-panel .fx-policy-toolbar-row {
  display: grid !important;
  grid-template-columns: 116px minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* -------------------------------------------------------------------------------
   ECB / FedSpeak / Spread labels
   Spread is no longer given a separate navy label treatment.
-------------------------------------------------------------------------------- */

#view-fx .fx-geoscen-panel .fx-policy-toolbar-meta,
#view-fx .fx-geoscen-panel .fx-policy-toolbar-meta strong,
#view-fx .fx-geoscen-panel .fx-policy-toolbar-row-spread .fx-policy-toolbar-meta,
#view-fx .fx-geoscen-panel .fx-policy-toolbar-row-spread .fx-policy-toolbar-meta strong {
  color: #0f172a !important;
}

/* Keep the retained Spread date black. */

#view-fx .fx-geoscen-panel .fx-policy-toolbar-date,
#view-fx .fx-geoscen-panel .fx-policy-toolbar-dot,
#view-fx .fx-geoscen-panel .fx-policy-toolbar-row-spread .fx-policy-toolbar-date,
#view-fx .fx-geoscen-panel .fx-policy-toolbar-row-spread .fx-policy-toolbar-dot {
  color: #0f172a !important;
}

/* -------------------------------------------------------------------------------
   Analytical strip alignment
   All three strips occupy the full available width & align to the right.
-------------------------------------------------------------------------------- */

#view-fx .fx-geoscen-panel .fx-policy-toolbar-strip {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  min-width: 0 !important;
  gap: 4px !important;
  white-space: nowrap !important;
  text-align: right !important;
}

/* Evolution occupies the same right-side position in every row. */

#view-fx .fx-geoscen-panel .fx-policy-toolbar-strip
  [data-policy-language-evolution],
#view-fx .fx-geoscen-panel .fx-policy-toolbar-strip
  [data-fx-policy-spread-evolution] {
  display: inline-block !important;
  flex: 0 0 66px !important;
  width: 66px !important;
  margin: 0 0 0 8px !important;
  padding: 0 !important;
  color: #0f172a !important;
  text-align: right !important;
  white-space: nowrap !important;
}

/* -------------------------------------------------------------------------------
   Shared policy-language colors
   Spread now follows exactly the same left-to-right color system as ECB/FedSpeak.
-------------------------------------------------------------------------------- */

#view-fx .fx-geoscen-panel
  .central-bank-language-segment-sh {
  color: #7f1d1d !important;
}

#view-fx .fx-geoscen-panel
  .central-bank-language-segment-mh {
  color: #e87979 !important;
}

#view-fx .fx-geoscen-panel
  .central-bank-language-segment-n {
  color: #b18b4d !important;
}

#view-fx .fx-geoscen-panel
  .central-bank-language-segment-md {
  color: #4f9560 !important;
}

#view-fx .fx-geoscen-panel
  .central-bank-language-segment-sd {
  color: #5f7356 !important;
}

/* Pipes & framing marks remain black for all rows. */

#view-fx .fx-geoscen-panel
  .central-bank-language-pipe,
#view-fx .fx-geoscen-panel
  .central-bank-language-bracket {
  color: #0f172a !important;
}

/* Remove any earlier Spread-wide inherited color override. */

#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-row-spread,
#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-row-spread .fx-policy-toolbar-strip {
  color: #0f172a !important;
}

/* -------------------------------------------------------------------------------
   Compact-width safety
   Preserve rows while allowing the strip to wrap only on small screens.
-------------------------------------------------------------------------------- */

@media (max-width: 900px) {
  #view-fx .fx-geoscen-panel .fx-policy-toolbar-row {
    grid-template-columns: 1fr !important;
    row-gap: 3px !important;
  }

  #view-fx .fx-geoscen-panel .fx-policy-toolbar-strip {
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    text-align: left !important;
  }

  #view-fx .fx-geoscen-panel .fx-policy-toolbar-strip
    [data-policy-language-evolution],
  #view-fx .fx-geoscen-panel .fx-policy-toolbar-strip
    [data-fx-policy-spread-evolution] {
    width: auto !important;
    flex-basis: auto !important;
    text-align: left !important;
  }
}

/* ==================================================================================
   FX GEOSCEN POLICY TOOLBAR â€” AUTHORITATIVE FIXED GRID
================================================================================== */

/* Toolbar must consume the entire white GeoScen card width. */

#view-fx .fx-geoscen-panel
  > .panel-placeholder
  > .fx-policy-toolbar {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  gap: 2px !important;
}

/* Every toolbar row uses exactly the same two-column geometry. */

#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-row {
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 8px !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Left-side labels. */

#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-meta {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 4px !important;
  width: 112px !important;
  min-width: 112px !important;
  max-width: 112px !important;
  color: #0f172a !important;
  white-space: nowrap !important;
  text-align: left !important;
}

/* ECB, FedSpeak, Spread & Jun '26 all use the same black treatment. */

#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-meta strong,
#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-row-spread .fx-policy-toolbar-meta strong,
#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-date,
#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-dot {
  color: #0f172a !important;
}

/* Remove every earlier inherited Spread-wide color. */

#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-row-spread,
#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-row-spread .fx-policy-toolbar-meta,
#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-row-spread .fx-policy-toolbar-strip {
  color: #0f172a !important;
}

/*
Exact analytical grid:

â€¢| | SH | | | MH | | | N | | | MD | | | SD | |â€¢ | Evolution
*/

#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-strip {
  display: grid !important;

  grid-template-columns:
    14px
    58px
    8px
    58px
    8px
    58px
    8px
    58px
    8px
    58px
    14px
    70px !important;

  align-items: center !important;
  justify-content: end !important;
  justify-self: stretch !important;

  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;

  column-gap: 2px !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
  text-align: right !important;
}

/* Normalize every direct child so grid columns control alignment. */

#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-strip > * {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
}

/* Bucket values align consistently inside their fixed columns. */

#view-fx .fx-geoscen-panel
  .central-bank-language-segment {
  text-align: right !important;
}

/* Framing marks & pipes remain black. */

#view-fx .fx-geoscen-panel
  .central-bank-language-bracket,
#view-fx .fx-geoscen-panel
  .central-bank-language-pipe {
  color: #0f172a !important;
  text-align: center !important;
}

/* Identical left-to-right bucket color coding across all three rows. */

#view-fx .fx-geoscen-panel
  .central-bank-language-segment-sh {
  color: #7f1d1d !important;
}

#view-fx .fx-geoscen-panel
  .central-bank-language-segment-mh {
  color: #e87979 !important;
}

#view-fx .fx-geoscen-panel
  .central-bank-language-segment-n {
  color: #b18b4d !important;
}

#view-fx .fx-geoscen-panel
  .central-bank-language-segment-md {
  color: #4f9560 !important;
}

#view-fx .fx-geoscen-panel
  .central-bank-language-segment-sd {
  color: #5f7356 !important;
}

/* Evolution is always the final fixed-width column. */

#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-strip
  [data-policy-language-evolution],
#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-strip
  [data-fx-policy-spread-evolution] {
  display: block !important;
  width: 70px !important;
  min-width: 70px !important;
  max-width: 70px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #0f172a !important;
  text-align: right !important;
  white-space: nowrap !important;
}

#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-strip
  [data-fx-policy-spread-evolution][aria-disabled="true"] {
  cursor: default !important;
  opacity: 0.6 !important;
  pointer-events: none !important;
  text-decoration: none !important;
}

#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-strip
  [data-fx-policy-spread-evolution][aria-disabled="true"]:hover,
#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-strip
  [data-fx-policy-spread-evolution][aria-disabled="true"]:focus,
#view-fx .fx-geoscen-panel
  .fx-policy-toolbar-strip
  [data-fx-policy-spread-evolution][aria-disabled="true"]:focus-visible {
  color: #0f172a !important;
  cursor: default !important;
  opacity: 0.6 !important;
  outline: 0 !important;
  text-decoration: none !important;
}

/* Small screens may stack, but desktop retains the exact grid. */

@media (max-width: 700px) {
  #view-fx .fx-geoscen-panel
    .fx-policy-toolbar-row {
    grid-template-columns: 1fr !important;
    row-gap: 3px !important;
  }

  #view-fx .fx-geoscen-panel
    .fx-policy-toolbar-meta {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  #view-fx .fx-geoscen-panel
    .fx-policy-toolbar-strip {
    display: flex !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    width: 100% !important;
  }
}
/* ISO-VECTOR TOP TOOLBAR â€” BORDERLESS MODULE LINKS */

/*
  Remove only the rectangular module-navigation boxes.

  Do not affect:
  - IV[t] cards
  - control buttons
  - pair/horizon selectors
  - GeoScen cards
  - modal buttons
*/

header nav a,
header nav button,
.app-header nav a,
.app-header nav button,
.top-nav a,
.top-nav button,
.main-nav a,
.main-nav button,
.module-nav a,
.module-nav button,
.workspace-nav a,
.workspace-nav button,
[data-navigation="modules"] a,
[data-navigation="modules"] button {
  border-color: transparent !important;
  border-width: 0 !important;
  border-style: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/*
  Preserve calm hover feedback without recreating a box.
*/
header nav a:hover,
header nav button:hover,
.app-header nav a:hover,
.app-header nav button:hover,
.top-nav a:hover,
.top-nav button:hover,
.main-nav a:hover,
.main-nav button:hover,
.module-nav a:hover,
.module-nav button:hover,
.workspace-nav a:hover,
.workspace-nav button:hover,
[data-navigation="modules"] a:hover,
[data-navigation="modules"] button:hover {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

/*
  Preserve accessibility. Keyboard users still receive a visible focus cue,
  but it appears as an underline rather than a rectangular box.
*/
header nav a:focus-visible,
header nav button:focus-visible,
.app-header nav a:focus-visible,
.app-header nav button:focus-visible,
.top-nav a:focus-visible,
.top-nav button:focus-visible,
.main-nav a:focus-visible,
.main-nav button:focus-visible,
.module-nav a:focus-visible,
.module-nav button:focus-visible,
.workspace-nav a:focus-visible,
.workspace-nav button:focus-visible,
[data-navigation="modules"] a:focus-visible,
[data-navigation="modules"] button:focus-visible {
  outline: none !important;
  box-shadow: inset 0 -2px 0 currentColor !important;
}

/*
  Preserve the active module indicator.
*/
header nav a[aria-current="page"],
header nav button[aria-current="page"],
.app-header nav a[aria-current="page"],
.app-header nav button[aria-current="page"],
.top-nav a[aria-current="page"],
.top-nav button[aria-current="page"],
.main-nav a[aria-current="page"],
.main-nav button[aria-current="page"],
.module-nav a[aria-current="page"],
.module-nav button[aria-current="page"],
.workspace-nav a[aria-current="page"],
.workspace-nav button[aria-current="page"],
[data-navigation="modules"] a[aria-current="page"],
[data-navigation="modules"] button[aria-current="page"],
header nav .active,
.app-header nav .active,
.top-nav .active,
.main-nav .active,
.module-nav .active,
.workspace-nav .active {
  border: 0 !important;
  background: transparent !important;
  box-shadow: inset 0 -2px 0 currentColor !important;
}

/* END ISO-VECTOR TOP TOOLBAR â€” BORDERLESS MODULE LINKS */


#view-fx .fx-production-geoscen-panel {
  border-style: solid;
  flex: 0 0 auto;
  align-self: flex-start;
  min-height: 0;
  height: auto;
  overflow: visible;
}

#view-fx .fx-production-geoscen-body {
  display: grid;
  align-content: start;
  gap: 8px;
  text-align: left;
}

#view-fx .fx-geoscen-context-card {
  display: block;
  position: static;
  align-self: start;
  gap: 0;
  min-width: 0;
  border: 1px solid rgba(15, 23, 42, 0.16);
  border-radius: 8px;
  background: #f8f8f8;
  color: #030712;
  overflow: hidden;
}

#view-fx .fx-geoscen-context-card .fx-policy-toolbar {
  align-self: stretch;
  width: auto !important;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 10px 14px 6px;
  border: 0;
  background: transparent;
  color: #030712;
}

#view-fx .fx-geoscen-context-card .fx-policy-toolbar-meta,
#view-fx .fx-geoscen-context-card .fx-policy-toolbar-date {
  color: #111827;
}

#view-fx .fx-geoscen-card-rule {
  height: 1px;
  margin: 4px 18px 10px;
  background: linear-gradient(
    90deg,
    transparent 0,
    rgba(3, 7, 18, 0.88) 10%,
    rgba(3, 7, 18, 0.88) 90%,
    transparent 100%
  );
}

#view-fx .fx-geoscen-card-body {
  display: grid;
  gap: 12px;
  padding: 0 16px 14px;
}

#view-fx .fx-geoscen-headline {
  margin: 0;
  color: #111827;
  font-size: 0.86rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.3;
  text-align: center;
}

#view-fx .fx-geoscen-claim-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  color: #111827;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.45;
  list-style: none;
}

#view-fx .fx-geoscen-claim-list li::before {
  content: "ï¿½ ";
}

#view-fx .fx-geoscen-guardrails {
  display: grid;
  justify-items: center;
  gap: 3px;
  color: #111827;
  font-size: 11px;
}

#view-fx .fx-geoscen-guardrails-title {
  color: #4b5563;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

#view-fx .fx-geoscen-guardrails-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 5px 10px;
  line-height: 1.35;
}

@media (max-width: 900px) {
  #view-fx .fx-geoscen-context-card .fx-policy-toolbar-row {
    grid-template-columns: 1fr !important;
    row-gap: 4px !important;
  }

  #view-fx .fx-geoscen-context-card .fx-policy-toolbar-meta {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  #view-fx .fx-geoscen-context-card .fx-policy-toolbar-strip {
    display: flex !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    white-space: normal !important;
    text-align: left !important;
  }

  #view-fx .fx-geoscen-context-card .fx-policy-toolbar-strip > * {
    flex: 0 1 auto !important;
  }

  #view-fx .fx-geoscen-evolution-tray {
    width: 100%;
  }
}
/* =========================================================
   SYS PHASE 1
========================================================= */

body.view-sys-events .sidebar-panel,
body.view-sys-history .sidebar-panel {
  display: none !important;
}

body.view-sys-events .main-grid,
body.view-sys-history .main-grid {
  grid-template-columns: 1fr !important;
}

#view-sys-events,
#view-sys-history {
  width: 100%;
  min-width: 0;
}

.top-nav-item.sys-tab.active,
.top-nav-item.sys-tab[aria-expanded="true"] {
  color: #d0d7df;
}

.sys-dropdown-item {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 42px;
  height: auto;
  cursor: pointer;
}

.sys-dropdown-item:hover,
.sys-dropdown-item:focus-visible,
.sys-dropdown-item.active {
  color: #eef3fa;
  background: rgba(143, 154, 172, 0.12);
}

.sys-dropdown-item.active {
  box-shadow: inset 2px 0 0 var(--vector-silver);
}

.sys-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 20px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(143, 154, 172, 0.16);
}

.sys-page-header h1 {
  margin: 8px 0 0;
  font-family: "Cormorant Garamond", serif;
  font-size: clamp(2.4rem, 4vw, 4rem);
  line-height: 1;
  color: #eef3fa;
}

.sys-title-separator {
  color: var(--vector-silver);
}

.sys-page-subtitle {
  margin: 10px 0 0;
  color: var(--text-soft);
  font-size: 1rem;
}

.sys-phase-badge,
.sys-locked-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(143, 154, 172, 0.22);
  background: rgba(143, 154, 172, 0.07);
  color: #aeb8c5;
  border-radius: 999px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.sys-phase-badge {
  min-height: 34px;
  padding: 0 13px;
  font-size: 0.68rem;
}

.sys-locked-badge {
  min-height: 26px;
  padding: 0 9px;
  font-size: 0.6rem;
}

.sys-page-notice,
.sys-capability-panel,
.sys-framework-card {
  border: 1px solid rgba(126, 153, 196, 0.14);
  border-radius: 14px;
  background:
    linear-gradient(
      180deg,
      rgba(8, 18, 32, 0.9),
      rgba(6, 14, 25, 0.82)
    );
}

.sys-page-notice {
  margin-bottom: 18px;
  padding: 18px 20px;
  border-left: 3px solid rgba(143, 154, 172, 0.68);
}

.sys-page-notice-label {
  margin-bottom: 7px;
  color: var(--accent);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.sys-page-notice p {
  margin: 0;
  color: #aeb8c5;
  font-size: 0.86rem;
  line-height: 1.65;
}

/* =========================================================
   SYS TOOLBARS
   Matches existing IsoVector module-control styling.
========================================================= */

.sys-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px 12px;
  width: 100%;
  margin: 0 0 18px;
  padding: 10px 14px;
  border: 1px solid rgba(126, 153, 196, 0.14);
  border-radius: 12px;
  background:
    linear-gradient(
      180deg,
      rgba(8, 18, 32, 0.9),
      rgba(6, 14, 25, 0.84)
    );
}

.sys-toolbar .fx-control-group {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

.sys-toolbar .fx-control-group label {
  margin: 0;
  color: var(--text-muted);
  font-size: 0.66rem;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.sys-toolbar .fx-control-group select {
  width: auto;
  min-width: 150px;
  height: 36px;
  padding: 0 30px 0 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(8, 18, 32, 0.95);
  color: var(--text);
  font: inherit;
  white-space: nowrap;
}

.sys-toolbar .fx-control-group select:disabled {
  cursor: not-allowed;
  color: #9aa6b8;
  opacity: 0.62;
}

.sys-toolbar-separator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 20px;
}

.sys-toolbar-separator .quote-sub2 {
  font-size: 0.92rem;
}

.sys-toolbar-separator .sep-dot {
  color: #c0c0c0;
}

.sys-toolbar-separator .sep-bar {
  color: #4a90e2;
}

.sys-framework-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

/* =========================================================
   SYS ARCHITECTURE
========================================================= */

body.view-sys-architecture .sidebar-panel,
body.view-sys-events .sidebar-panel,
body.view-sys-history .sidebar-panel {
  display: none !important;
}

body.view-sys-architecture .main-grid,
body.view-sys-events .main-grid,
body.view-sys-history .main-grid {
  grid-template-columns: 1fr !important;
}

#view-sys-architecture,
#view-sys-events,
#view-sys-history {
  width: 100%;
  min-width: 0;
}

.sys-dropdown-divider {
  height: 1px;
  margin: 7px 4px;
  background: rgba(143, 154, 172, 0.16);
}

.sys-dropdown-item:disabled::after {
  content: "PLANNED";
  flex: 0 0 auto;
  margin-left: auto;

  color: rgba(143, 154, 172, 0.62);
  font-size: 0.5rem;
  letter-spacing: 0.1em;
}

.sys-dropdown-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.sys-architecture-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sys-flow-panel {
  margin-top: 18px;
  padding: 20px;
  border: 1px solid rgba(126, 153, 196, 0.14);
  border-radius: 14px;
  background:
    linear-gradient(
      180deg,
      rgba(8, 18, 32, 0.9),
      rgba(6, 14, 25, 0.82)
    );
}

.sys-flow-sequence {
  display: grid;
  grid-template-columns:
    minmax(100px, 1fr) auto
    minmax(100px, 1fr) auto
    minmax(120px, 1fr) auto
    minmax(120px, 1fr) auto
    minmax(100px, 1fr) auto
    minmax(100px, 1fr) auto
    minmax(100px, 1fr) auto
    minmax(110px, 1fr) auto
    minmax(100px, 1fr);
  align-items: center;
  gap: 8px;
  margin-top: 16px;
}

.sys-flow-sequence span {
  min-height: 54px;
  display: grid;
  place-items: center;
  padding: 9px;
  border: 1px solid rgba(143, 154, 172, 0.14);
  border-radius: 8px;
  background: rgba(8, 16, 28, 0.64);
  color: #d6deea;
  font-size: 0.66rem;
  letter-spacing: 0.07em;
  text-align: center;
  text-transform: uppercase;
}

.sys-flow-sequence b {
  color: var(--vector-silver);
  font-size: 0.9rem;
  font-weight: 400;
  transform: rotate(-90deg);
}
.sys-card-number {
  margin-bottom: 28px;
  color: rgba(143, 154, 172, 0.54);
  font-size: 0.68rem;
  letter-spacing: 0.12em;
}

.sys-framework-card h2 {
  margin: 0 0 10px;
  color: #eef3fa;
  font-family: "Cormorant Garamond", serif;
  font-size: 1.45rem;
}

.sys-framework-card p {
  margin: 0;
  color: #9da9ba;
  font-size: 0.8rem;
  line-height: 1.6;
}

.sys-architecture-details {
  display: grid;
  gap: 9px;
  margin: 18px 0 0;
}

.sys-architecture-detail {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  gap: 8px;
  min-width: 0;
}

.sys-architecture-detail dt {
  color: #748195;
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.sys-architecture-detail dd {
  display: grid;
  gap: 3px;
  min-width: 0;
  margin: 0;
  color: #9da9ba;
  font-size: 0.66rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.sys-architecture-detail dd span + span::before {
  content: "ï¿½ ";
  color: #748195;
}

.sys-card-status {
  display: inline-block;
  margin-top: 20px;
  color: var(--accent);
  font-size: 0.58rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.sys-page-footer {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(143, 154, 172, 0.1);
  color: var(--text-muted);
  font-size: 0.66rem;
}

@media (max-width: 1200px) {
.sys-architecture-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sys-flow-sequence {
  grid-template-columns: 1fr;
}

.sys-flow-sequence b {
  transform: none;
}
}

@media (max-width: 760px) {
  .sys-page-header {
    flex-direction: column;
  }

  .sys-capability-grid,
  .sys-framework-grid {
    grid-template-columns: 1fr;
  }
}
.mobile-drawer-group {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.mobile-drawer-group-label {
  padding: 14px 16px 8px;
  color: var(--text-muted);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.mobile-drawer-group .mobile-drawer-item {
  padding-left: 28px;
}

body.view-sys-architecture .sys-page-header,
body.view-sys-events .sys-page-header,
body.view-sys-history .sys-page-header {
  display: block;
}

body.view-sys-architecture .sys-toolbar,
body.view-sys-events .sys-toolbar,
body.view-sys-history .sys-toolbar {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

body.view-sys-architecture .sys-framework-grid,
body.view-sys-events .sys-framework-grid,
body.view-sys-history .sys-framework-grid,
body.view-sys-architecture .sys-architecture-grid {
  grid-template-columns: 1fr !important;
}

body.view-sys-architecture .sys-flow-sequence {
  grid-template-columns: 1fr;
}

body.view-sys-architecture .sys-flow-sequence b {
  transform: none;
  text-align: center;
}

/* =========================================================
   SYS GOVERNED REGISTRIES
========================================================= */

.sys-loading-card,
.sys-empty-state,
.sys-error-state {
  display: grid;
  place-items: center;
  gap: 8px;
  min-height: 180px;
  padding: 24px;
  border: 1px dashed rgba(143, 154, 172, 0.24);
  border-radius: 12px;
  background: rgba(8, 16, 28, 0.42);
  color: #8f9aac;
  text-align: center;
}

.sys-empty-state strong,
.sys-error-state strong {
  color: #d6deea;
  font-family: "Cormorant Garamond", serif;
  font-size: 1.25rem;
  font-weight: 600;
}

.sys-empty-state span,
.sys-error-state span {
  max-width: 680px;
  color: #8f9aac;
  font-size: 0.78rem;
  line-height: 1.6;
}

.sys-error-state {
  border-color: rgba(209, 121, 121, 0.28);
}

.sys-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 20px;
}

.sys-record-section {
  padding: 18px;
  border: 1px solid rgba(126, 153, 196, 0.14);
  border-radius: 14px;
  background:
    linear-gradient(
      180deg,
      rgba(8, 18, 32, 0.9),
      rgba(6, 14, 25, 0.82)
    );
}

.sys-record-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
}

.sys-record-count {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(143, 154, 172, 0.18);
  border-radius: 999px;
  background: rgba(143, 154, 172, 0.06);
  color: #9da9ba;
  font-size: 0.58rem;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

.sys-record-list {
  display: grid;
  gap: 12px;
}

.sys-record-card {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 18px;
  padding: 18px;
  border: 1px solid rgba(143, 154, 172, 0.13);
  border-radius: 11px;
  background: rgba(7, 15, 27, 0.68);
}

.sys-record-date {
  color: #d5b37c;
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.68rem;
  letter-spacing: 0.05em;
}

.sys-record-kicker {
  color: #8f9aac;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.sys-record-body h2 {
  margin: 7px 0 8px;
  color: #eef3fa;
  font-family: "Cormorant Garamond", serif;
  font-size: 1.35rem;
  font-weight: 600;
}

.sys-record-body p {
  margin: 0;
  color: #9da9ba;
  font-size: 0.8rem;
  line-height: 1.6;
}

.sys-record-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin-top: 14px;
  color: #748195;
  font-size: 0.62rem;
}

.sys-approval-state {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border: 1px solid rgba(143, 154, 172, 0.16);
  border-radius: 999px;
  font-size: 0.56rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.sys-approval-state.is-approved {
  border-color: rgba(142, 201, 163, 0.24);
  color: #8ec9a3;
}

.sys-approval-state.is-shadow {
  border-color: rgba(213, 179, 124, 0.24);
  color: #d5b37c;
}

.sys-approval-state.is-experimental {
  border-color: rgba(105, 151, 205, 0.25);
  color: #6997cd;
}

.sys-approval-state.is-deprecated {
  border-color: rgba(209, 121, 121, 0.25);
  color: #d17979;
}

@media (max-width: 760px) {
  .sys-record-heading {
    flex-direction: column;
  }

  .sys-record-card {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .sys-card-meta {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* =========================================================
   SYS DESKTOP LAYOUT ï¿½ FINAL OVERRIDE
   Must remain at the absolute bottom of styles.css
========================================================= */

@media (min-width: 1201px) {
  /* ---------------------------------------------------------
     SYS toolbar: one horizontal row, aligned right
  --------------------------------------------------------- */

  body.view-sys-architecture .sys-toolbar,
  body.view-sys-events .sys-toolbar,
  body.view-sys-history .sys-toolbar {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: 10px 12px !important;
    width: 100% !important;
    min-height: 58px !important;
    margin: 0 0 18px !important;
    padding: 10px 16px !important;
  }

  body.view-sys-architecture .sys-toolbar .fx-control-group,
  body.view-sys-events .sys-toolbar .fx-control-group,
  body.view-sys-history .sys-toolbar .fx-control-group {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    width: auto !important;
    min-width: 0 !important;
    gap: 8px !important;
    margin: 0 !important;
  }

  body.view-sys-architecture .sys-toolbar .fx-control-group label,
  body.view-sys-events .sys-toolbar .fx-control-group label,
  body.view-sys-history .sys-toolbar .fx-control-group label {
    display: inline-block !important;
    width: auto !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  body.view-sys-architecture .sys-toolbar .fx-control-group select,
  body.view-sys-events .sys-toolbar .fx-control-group select,
  body.view-sys-history .sys-toolbar .fx-control-group select {
    display: inline-block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 128px !important;
    max-width: 210px !important;
    height: 36px !important;
    margin: 0 !important;
  }

  body.view-sys-events #sys-events-view,
  body.view-sys-history #sys-history-view {
    min-width: 180px !important;
  }

  body.view-sys-events #sys-events-module,
  body.view-sys-history #sys-history-module,
  body.view-sys-architecture #sys-architecture-domain {
    min-width: 150px !important;
  }

  body.view-sys-architecture .sys-toolbar-separator,
  body.view-sys-events .sys-toolbar-separator,
  body.view-sys-history .sys-toolbar-separator {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 22px !important;
    margin: 0 !important;
  }

  /* ---------------------------------------------------------
     Architecture operating flow: three compact horizontal bands
  --------------------------------------------------------- */

  body.view-sys-architecture .sys-flow-panel {
    margin-top: 18px !important;
    padding: 18px !important;
  }

  body.view-sys-architecture .sys-flow-bands {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 14px !important;
    margin-top: 14px !important;
  }

  body.view-sys-architecture .sys-flow-band {
    display: grid !important;
    grid-template-rows: auto 1fr !important;
    gap: 12px !important;
    min-width: 0 !important;
    padding: 14px !important;
    border: 1px solid rgba(143, 154, 172, 0.14) !important;
    border-radius: 10px !important;
    background: rgba(8, 16, 28, 0.64) !important;
  }

  body.view-sys-architecture .sys-flow-band-label {
    padding-bottom: 9px !important;
    border-bottom: 1px solid rgba(143, 154, 172, 0.12) !important;
    color: #d5b37c !important;
    font-size: 0.62rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.11em !important;
    text-transform: uppercase !important;
  }

  body.view-sys-architecture .sys-flow-band-steps {
    display: grid !important;
    grid-template-columns:
      minmax(0, 1fr)
      auto
      minmax(0, 1fr)
      auto
      minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 8px !important;
  }

  body.view-sys-architecture .sys-flow-band-steps span {
    display: grid !important;
    place-items: center !important;
    min-width: 0 !important;
    min-height: 52px !important;
    padding: 8px !important;
    border: 1px solid rgba(143, 154, 172, 0.13) !important;
    border-radius: 8px !important;
    background: rgba(5, 13, 24, 0.72) !important;
    color: #d6deea !important;
    font-size: 0.58rem !important;
    letter-spacing: 0.06em !important;
    line-height: 1.35 !important;
    text-align: center !important;
    text-transform: uppercase !important;
  }

  body.view-sys-architecture .sys-flow-band-steps b {
    display: block !important;
    color: var(--vector-silver, #8f9aac) !important;
    font-size: 0.9rem !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    transform: none !important;
  }

  /* Older flow must not influence the new flow */
  body.view-sys-architecture .sys-flow-sequence {
    display: none !important;
  }
}



/* =========================================================
   SYS TABLET / MOBILE FLOW
========================================================= */

@media (max-width: 1200px) {
  .sys-flow-bands {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 14px;
  }

  .sys-flow-band {
    padding: 14px;
    border: 1px solid rgba(143, 154, 172, 0.14);
    border-radius: 10px;
    background: rgba(8, 16, 28, 0.64);
  }

  .sys-flow-band-label {
    margin-bottom: 12px;
    color: #d5b37c;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
  }

  .sys-flow-band-steps {
    display: grid;
    grid-template-columns:
      minmax(0, 1fr)
      auto
      minmax(0, 1fr)
      auto
      minmax(0, 1fr);
    align-items: center;
    gap: 8px;
  }

  .sys-flow-band-steps span {
    display: grid;
    place-items: center;
    min-height: 48px;
    padding: 8px;
    border: 1px solid rgba(143, 154, 172, 0.13);
    border-radius: 8px;
    text-align: center;
  }

  .sys-flow-band-steps b {
    transform: none;
  }
}

@media (max-width: 760px) {
  .sys-flow-band-steps {
    grid-template-columns: 1fr;
  }

  .sys-flow-band-steps b {
    text-align: center;
    transform: rotate(90deg);
  }
}

/* SYS PHASE 4 ï¿½ GOVERNED CONTROLS START */

/* Desktop SYS controls: one row, right aligned */
@media (min-width: 1201px) {
  body.view-sys-architecture .sys-toolbar,
  body.view-sys-events .sys-toolbar,
  body.view-sys-history .sys-toolbar {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: 10px 12px !important;
    width: 100% !important;
    min-height: 58px !important;
    margin: 0 0 18px !important;
    padding: 10px 16px !important;
  }

  body.view-sys-architecture .sys-toolbar .fx-control-group,
  body.view-sys-events .sys-toolbar .fx-control-group,
  body.view-sys-history .sys-toolbar .fx-control-group {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    width: auto !important;
    min-width: 0 !important;
    gap: 8px !important;
    margin: 0 !important;
  }

  body.view-sys-architecture .sys-toolbar .fx-control-group select,
  body.view-sys-events .sys-toolbar .fx-control-group select,
  body.view-sys-history .sys-toolbar .fx-control-group select {
    display: inline-block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 128px !important;
    max-width: 220px !important;
    height: 36px !important;
    margin: 0 !important;
  }

  body.view-sys-events #sys-events-view,
  body.view-sys-history #sys-history-view {
    min-width: 180px !important;
  }

  body.view-sys-architecture .sys-toolbar-separator,
  body.view-sys-events .sys-toolbar-separator,
  body.view-sys-history .sys-toolbar-separator {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 22px !important;
  }

  body.view-sys-architecture .sys-flow-bands {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
    margin-top: 14px !important;
  }

  body.view-sys-architecture .sys-flow-band {
    display: grid !important;
    grid-template-rows: auto 1fr !important;
    gap: 12px !important;
    min-width: 0 !important;
    padding: 14px !important;
    border: 1px solid rgba(143, 154, 172, 0.14) !important;
    border-radius: 10px !important;
    background: rgba(8, 16, 28, 0.64) !important;
  }

  body.view-sys-architecture .sys-flow-band-label {
    padding-bottom: 9px !important;
    border-bottom: 1px solid rgba(143, 154, 172, 0.12) !important;
    color: #d5b37c !important;
    font-size: 0.62rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.11em !important;
    text-transform: uppercase !important;
  }

  body.view-sys-architecture .sys-flow-band-steps {
    display: grid !important;
    grid-template-columns:
      minmax(0, 1fr)
      auto
      minmax(0, 1fr)
      auto
      minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 8px !important;
  }

  body.view-sys-architecture .sys-flow-band-steps span {
    display: grid !important;
    place-items: center !important;
    min-height: 52px !important;
    padding: 8px !important;
    border: 1px solid rgba(143, 154, 172, 0.13) !important;
    border-radius: 8px !important;
    background: rgba(5, 13, 24, 0.72) !important;
    color: #d6deea !important;
    font-size: 0.58rem !important;
    line-height: 1.35 !important;
    text-align: center !important;
    text-transform: uppercase !important;
  }

  body.view-sys-architecture .sys-flow-band-steps b {
    color: var(--vector-silver, #8f9aac) !important;
    font-weight: 400 !important;
    transform: none !important;
  }
}

/* Tablet */
@media (min-width: 761px) and (max-width: 1200px) {
  .sys-flow-bands {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .sys-flow-band-steps {
    display: grid;
    grid-template-columns:
      minmax(0, 1fr)
      auto
      minmax(0, 1fr)
      auto
      minmax(0, 1fr);
    align-items: center;
    gap: 8px;
  }
}

/* Mobile */
@media (max-width: 760px) {
  .sys-flow-bands,
  .sys-flow-band-steps {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .sys-flow-band-steps b {
    text-align: center;
    transform: rotate(90deg);
  }
}

/* Enabled controls */
.sys-toolbar select:not(:disabled) {
  cursor: pointer;
  color: var(--text);
  opacity: 1;
}

.sys-toolbar select:not(:disabled):focus {
  border-color: rgba(105, 151, 205, 0.62);
  outline: 2px solid rgba(105, 151, 205, 0.18);
  outline-offset: 1px;
}

/* SYS PHASE 4 ï¿½ GOVERNED CONTROLS END */
/* =========================================================
   SYS HEADER TOOLBAR ï¿½ FINAL SAME-LINE OVERRIDE
   Keep at absolute bottom of styles.css
========================================================= */

@media (min-width: 1201px) {
  body.view-sys-architecture
    #view-sys-architecture
    > .sys-page-header.content-header-with-toolbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    column-gap: 24px !important;

    width: 100% !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  body.view-sys-architecture
    #view-sys-architecture
    > .sys-page-header
    > .sys-page-heading {
    grid-column: 1 !important;
    min-width: 0 !important;
    width: auto !important;
  }

  body.view-sys-architecture
    #view-sys-architecture
    > .sys-page-header
    > .sys-page-heading
    h2 {
    margin: 0 !important;
    white-space: nowrap !important;
    line-height: 1.15 !important;
  }

  body.view-sys-architecture
    #view-sys-architecture
    > .sys-page-header
    > .sys-toolbar {
    grid-column: 2 !important;

    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;

    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 8px 12px !important;

    border: 1px solid rgba(126, 153, 196, 0.16) !important;
    border-radius: 10px !important;
    background: rgba(8, 18, 32, 0.84) !important;
    gap: 10px !important;
  }

  body.view-sys-architecture
    #view-sys-architecture
    > .sys-page-header
    > .sys-toolbar
    .fx-control-group {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;

    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  body.view-sys-architecture
    #view-sys-architecture
    > .sys-page-header
    > .sys-toolbar
    select {
    width: auto !important;
    min-width: 130px !important;
    max-width: 190px !important;
  }

  body.view-sys-architecture
    #view-sys-architecture
    > .sys-page-header
    > .sys-toolbar
    .sys-toolbar-separator {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
  }
}

.invisible-dot{
    visibility:hidden;
}


/* ==========================================
   ABOUT BRANDING
========================================== */

.about-tab .about-iso{
    color: #F3F4F7;
}

.about-tab .about-vector{
    color: #8F9AAC;
}

/* ABOUT / SYS compact navigation-state labels */
.top-nav-item:is(.about-tab, .sys-tab) {
  min-width: 4.25rem;
}

.nav-state-label {
  display: grid;
  min-height: 1.95rem;
  place-items: center;
  line-height: 0.82;
}

.nav-state-label-stacked,
.nav-state-label-horizontal {
  grid-area: 1 / 1;
}

.nav-state-label-stacked {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  row-gap: 1px;
}

.nav-state-label-horizontal {
  display: none;
  line-height: 1;
  white-space: nowrap;
}

.top-nav-item:is(.about-tab, .sys-tab):is(.active, [aria-current="page"]) .nav-state-label-stacked {
  display: none;
}

.top-nav-item:is(.about-tab, .sys-tab):is(.active, [aria-current="page"]) .nav-state-label-horizontal {
  display: inline;
}

.nav-label-white {
  color: #FFFFFF;
}

.nav-label-silver {
  color: #8F9AAC;
}

@media (forced-colors: active) {
  .nav-label-white,
  .nav-label-silver {
    color: CanvasText;
  }
}



/* FX GeoScen Evolution must overlay the dashboard, never expand its grid. */
#policy-language-evolution-popover.policy-language-evolution-popover {
  position: fixed !important;
  z-index: 10000 !important;
  width: 344px !important;
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100vh - 24px) !important;
  margin: 0 !important;
  overflow: auto !important;
}

.fx-geoscen-evolution-tray-host:empty {
  display: none !important;
}

/* FINAL FX EVOLUTION OVERLAY OVERRIDE */
body > #policy-language-evolution-popover {
  position: fixed !important;
  inset: auto auto auto auto !important;
  display: block !important;
  width: min(344px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100vh - 24px) !important;
  margin: 0 !important;
  overflow: auto !important;
  z-index: 2147483647 !important;
  contain: layout paint !important;
}

.fx-geoscen-evolution-tray-host {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* ============================================================
   FX + RATES EVOLUTION INTERACTION REPAIR
   ============================================================ */

/* Evolution controls must remain clickable. */
[data-policy-language-evolution],
[data-fx-policy-spread-evolution],
[data-policy-language-evolution-close] {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* FX policy-language segments must receive hover events
   so their evidence/title information remains available. */
#view-fx .central-bank-language-segment,
#view-fx .central-bank-language-bracket,
#view-fx [title] {
  pointer-events: auto !important;
}

/* Do not globally hide the host. The popup itself is appended
   to document.body, while an empty host may remain hidden. */
.fx-geoscen-evolution-tray-host {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

.fx-geoscen-evolution-tray-host:empty {
  display: none !important;
  height: 0 !important;
}

/* Popup remains outside dashboard layout. */
body > #policy-language-evolution-popover,
body > #fx-policy-spread-evolution-popover {
  position: fixed !important;
  z-index: 2147483647 !important;
  width: min(344px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px) !important;
  max-height: calc(100vh - 24px) !important;
  margin: 0 !important;
  overflow: auto !important;
  pointer-events: auto !important;
}

.iv-identity-image {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-bottom: 18px;
    border-radius: 18px;
    overflow: hidden;
}

.iv-identity-image img {
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    border-radius: inherit;
}


.iv-uni-axiom {
  font-size: 19px;
  font-weight: 600;
  letter-spacing: 0.16em;
  margin-bottom: 34px;
}

.iv-uni-copy p {
  margin-bottom: 22px;
}

.iv-uni-copy p:last-child {
  margin-bottom: 0;
}

.iv-uni-axiom-text {
  color: #8fa6c2;
}

.iv-uni-axiom-mark {
  color: #d6ae6a;
  letter-spacing: 0.08em;
}


/* =========================
   EQUITIES ï¿½ LIQUIDITY / FLOWS
   Certified L presentation
   ========================= */

.equities-liquidity-lens {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.equities-liquidity-scale {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  color: #7f8ea3;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.equities-liquidity-scale span:nth-child(2) {
  text-align: center;
}

.equities-liquidity-row {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 52px;
  align-items: center;
  gap: 12px;
}

.equities-liquidity-horizon {
  color: #9fb3c8;
  font-size: 0.75rem;
  font-weight: 600;
}

.equities-liquidity-track {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(126, 153, 196, 0.12);
}

.equities-liquidity-fill {
  height: 100%;
  border-radius: inherit;
  background: var(--iv-green);
  opacity: 0.68;
}

.equities-liquidity-row.is-selected .equities-liquidity-fill {
  opacity: 1;
}

.equities-liquidity-row.is-selected .equities-liquidity-horizon,
.equities-liquidity-row.is-selected .equities-liquidity-value {
  color: #eef3fa;
}

.equities-liquidity-value {
  color: #d5b37c;
  font-size: 0.78rem;
  font-weight: 700;
  text-align: right;
}
/* System Architect AI / LLM stack shares the frozen OC navigation family. */
#view-system-architect .about-technical-stack .stack-iv-burgundy {
  color: #7c5cff;
}

/* 45px lower than current */
.hero-visual .iso-landing-art {
  transform: translateY(0px);
}
.cflow-governed-diagnostics {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 6px;
}

#cflow-regime-summary.cflow-activity-layout {
  display: block;
  align-items: initial;
  justify-content: initial;
  text-align: initial;
}

#cflow-regime-summary.cflow-activity-layout .cflow-governed-diagnostics,
#cflow-regime-summary.cflow-activity-layout .cflow-metric-chart {
  width: 100%;
  max-width: none;
}

#cflow-regime-summary.cflow-activity-layout .cflow-metric-chart {
  height: 310px;
  min-height: 290px;
  margin-top: 6px;
}

.cflow-quality-panel.cflow-activity-refined .chart-header-row {
  display: none;
}

/* Persistent TOP-MIDDLE tooltip contrast invariant. */
.cflow-quality-panel {
  --top-middle-tooltip-text-color: #000000;
}

.cflow-quality-panel .hoverlayer .hovertext text,
.cflow-quality-panel .hoverlayer .hovertext tspan,
.cflow-quality-panel .hoverlayer .legend text,
.cflow-quality-panel .hoverlayer .legend tspan {
  color: var(--top-middle-tooltip-text-color) !important;
  fill: var(--top-middle-tooltip-text-color) !important;
}

#cflow-regime-summary.cflow-logistics-layout {
  display: block;
  align-items: initial;
  justify-content: initial;
  text-align: initial;
}

#cflow-regime-summary.cflow-logistics-layout .cflow-governed-diagnostics,
#cflow-regime-summary.cflow-logistics-layout .cflow-wti-semantic-label,
#cflow-regime-summary.cflow-logistics-layout .cflow-metric-chart {
  width: 100%;
  max-width: none;
}

.cflow-quality-panel.cflow-logistics-refined .chart-header-row {
  display: none;
}

#cflow-regime-summary.cflow-logistics-layout {
  min-height: 330px;
}

.cflow-logistics-level-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.cflow-logistics-level {
  min-width: 0;
  padding: 6px 8px;
  border: 1px solid rgba(126, 153, 196, 0.18);
  border-radius: 7px;
  background: rgba(4, 13, 25, 0.34);
}

.cflow-logistics-level span,
.cflow-logistics-level small {
  display: block;
  color: var(--iv-text-secondary);
  font-size: 0.61rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cflow-logistics-level strong {
  display: block;
  margin: 2px 0;
  color: var(--iv-text-primary);
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
}

.cflow-logistics-diagnostics {
  margin-top: 7px;
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(126, 153, 196, 0.12);
}

#cflow-regime-summary.cflow-logistics-layout .cflow-metric-chart {
  min-height: 270px;
  margin-top: 6px;
}

.cflow-quality-panel.cflow-logistics-disabled-panel {
  align-self: start;
}

#cflow-regime-summary.cflow-logistics-disabled {
  min-height: 0;
  padding: 0;
}

.cflow-disabled-card {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 5px 12px;
  align-items: center;
  padding: 10px 12px;
  border: 1px dashed rgba(126, 153, 196, 0.28);
  border-radius: 7px;
  color: var(--iv-text-secondary);
}

.cflow-disabled-card strong {
  color: var(--iv-text-primary);
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.cflow-disabled-card p {
  grid-column: 1 / -1;
  margin: 0;
  font-size: 0.68rem;
}

.cflow-disabled-badge {
  padding: 3px 7px;
  border: 1px solid rgba(174, 184, 198, 0.4);
  border-radius: 999px;
  color: #aeb8c6;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cflow-diagnostic-row {
  min-width: 0;
  padding: 2px 5px;
  border-left: 2px solid transparent;
  border-radius: 3px;
  color: var(--iv-text-secondary);
  line-height: 1.25;
}

.cflow-wti-semantic-label {
  margin: 8px 5px 4px;
  color: var(--iv-text-secondary);
  font-size: 0.68rem;
  line-height: 1.35;
}

.cflow-diagnostic-value {
  color: var(--iv-text-primary);
  font-variant-numeric: tabular-nums;
}

.cflow-diagnostic-state {
  margin-left: 4px;
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.iv-sigma-state {
  --iv-sigma-tone: #9aa4b2;
  border-left-color: var(--iv-sigma-tone);
  background: color-mix(in srgb, var(--iv-sigma-tone) 12%, transparent);
}

.iv-sigma-state .cflow-diagnostic-value,
.iv-sigma-state .cflow-diagnostic-state {
  color: var(--iv-sigma-tone);
}

.iv-sigma-indifferent { --iv-sigma-tone: #aeb8c6; }
.iv-sigma-leaning-down,
.iv-sigma-leaning-up { --iv-sigma-tone: #d5b37c; }
.iv-sigma-moderate-negative { --iv-sigma-tone: #dc9292; }
.iv-sigma-moderate-positive { --iv-sigma-tone: #9bcfaf; }
.iv-sigma-strong-negative { --iv-sigma-tone: #e47e85; }
.iv-sigma-strong-positive { --iv-sigma-tone: #83c69c; }
.iv-sigma-severe-negative { --iv-sigma-tone: #dd737d; }
.iv-sigma-severe-positive { --iv-sigma-tone: #75b98e; }
.iv-sigma-very-bad { --iv-sigma-tone: #ef9aa6; }
.iv-sigma-very-good { --iv-sigma-tone: #acd6b6; }

html[data-theme="light"] .iv-sigma-indifferent { --iv-sigma-tone: #596779; }
html[data-theme="light"] .iv-sigma-leaning-down,
html[data-theme="light"] .iv-sigma-leaning-up { --iv-sigma-tone: #7d6232; }
html[data-theme="light"] .iv-sigma-moderate-negative { --iv-sigma-tone: #9f4b51; }
html[data-theme="light"] .iv-sigma-moderate-positive { --iv-sigma-tone: #347254; }
html[data-theme="light"] .iv-sigma-strong-negative { --iv-sigma-tone: #91353e; }
html[data-theme="light"] .iv-sigma-strong-positive { --iv-sigma-tone: #28724d; }
html[data-theme="light"] .iv-sigma-severe-negative { --iv-sigma-tone: #7f2634; }
html[data-theme="light"] .iv-sigma-severe-positive { --iv-sigma-tone: #205f40; }
html[data-theme="light"] .iv-sigma-very-bad { --iv-sigma-tone: #681827; }
html[data-theme="light"] .iv-sigma-very-good { --iv-sigma-tone: #174d33; }
/* ==================================================================
   MACRO_HBR_RIGHT_RAIL_V1
   Diagnostics Contract narrower; current GeoScen + analogue hierarchy.
   ================================================================== */

#view-macro .iv-group-title {
  white-space: nowrap;
}

#view-macro .macro-regime-analogues-panel {
  display: grid !important;
  grid-template-rows: auto 1fr !important;
  align-content: stretch !important;
  gap: 18px !important;
  padding: 16px !important;
}

#view-macro .macro-howl-section,
#view-macro .macro-analogues-section {
  min-width: 0;
}

#view-macro .macro-howl-section {
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(148, 123, 255, 0.24);
}

#view-macro .macro-right-rail-heading {
  margin-bottom: 12px;
  text-align: center;
  font-size: 0.86rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#view-macro .macro-geoscen-current-card,
#view-macro .macro-analogue-card {
  min-height: 142px;
  padding: 18px 16px;
  border-left: 3px solid rgba(148, 123, 255, 0.75);
  background: rgba(8, 17, 28, 0.34);

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  text-align: center;
}

#view-macro .macro-geoscen-current-card {
  min-height: 170px;
}

#view-macro .macro-right-rail-kicker,
#view-macro .macro-analogue-card span {
  color: rgba(148, 123, 255, 0.92);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

#view-macro .macro-geoscen-current-card strong,
#view-macro .macro-analogue-card strong {
  margin-top: 8px;
  color: #f2d8a7;
  font-size: 0.94rem;
  letter-spacing: 0.08em;
}

#view-macro .macro-geoscen-current-card em,
#view-macro .macro-analogue-card em {
  margin-top: 8px;
  color: rgba(215, 224, 235, 0.68);
  font-size: 0.66rem;
  font-style: normal;
  line-height: 1.4;
}

#view-macro .macro-analogues-section {
  display: grid;
  align-content: start;
  gap: 12px;
}

#view-macro .macro-main-analogue {
  min-height: 155px;
}

#view-macro .macro-supporting-analogue {
  min-height: 140px;
}

#view-macro .macro-supporting-analogue[hidden] {
  display: none !important;
}

/* Supporting analogue becomes available only when explicitly authorized. */
#view-macro .macro-supporting-analogue[data-supporting-analogue-status="AVAILABLE"] {
  display: flex !important;
}

@media (max-width: 1200px) {
  #view-macro .iv-group-title {
    white-space: normal;
  }
}

/* MACRO_HBR_RIGHT_RAIL_V1 */

/* ==================================================================
   MACRO_HBR_RIGHT_RAIL_V2
   Final local visual authority for GeoScen / Regime Analogues rail.
   ================================================================== */

.macro-regime-analogues-panel {
  display: grid !important;
  grid-template-rows: minmax(250px, 0.85fr) minmax(300px, 1.15fr) !important;
  align-content: stretch !important;
  gap: 18px !important;
  padding: 16px !important;
  overflow: hidden !important;
}

.macro-howl-section,
.macro-analogues-section {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.macro-howl-section {
  display: flex;
  flex-direction: column;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(148, 123, 255, 0.28);
}

.macro-analogues-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.macro-right-rail-heading {
  display: block;
  width: 100%;
  margin: 0 0 14px 0;

  text-align: center;
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.macro-geoscen-current-card,
.macro-analogue-card {
  width: 100%;
  box-sizing: border-box;

  padding: 18px 16px;

  border: 1px solid rgba(126, 153, 196, 0.12);
  border-left: 3px solid rgba(148, 123, 255, 0.75);
  border-radius: 10px;

  background:
    linear-gradient(
      180deg,
      rgba(8, 17, 28, 0.72),
      rgba(7, 14, 24, 0.58)
    );

  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  text-align: center;
}

.macro-geoscen-current-card {
  flex: 1 1 auto;
  min-height: 180px;
}

.macro-main-analogue {
  min-height: 175px;
}

.macro-right-rail-kicker,
.macro-analogue-card span {
  display: block;

  color: rgba(148, 123, 255, 0.95);
  font-size: 0.68rem;
  font-weight: 700;

  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.macro-geoscen-current-card strong,
.macro-analogue-card strong {
  display: block;

  margin-top: 10px;

  color: #f2d8a7;
  font-size: 1rem;
  font-weight: 700;

  letter-spacing: 0.08em;
}

.macro-geoscen-current-card em,
.macro-analogue-card em {
  display: block;

  max-width: 90%;
  margin-top: 10px;

  color: rgba(215, 224, 235, 0.70);
  font-size: 0.68rem;
  font-style: normal;
  line-height: 1.45;
}

.macro-supporting-analogue[hidden] {
  display: none !important;
}

.macro-supporting-analogue[data-supporting-analogue-status="AVAILABLE"] {
  display: flex !important;
}

/* Further contract-rail compression after removal of "Layer". */

#view-macro .macro-riskstack-panel {
  padding-left: 12px !important;
  padding-right: 12px !important;
}

#view-macro .iv-contract-group {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

#view-macro .iv-contract-group .macro-metric-tile {
  padding-left: 9px !important;
  padding-right: 9px !important;
}

/* Longest remaining heading is the left-rail width proxy. */

#view-macro .iv-group-title {
  white-space: nowrap;
  letter-spacing: 0.09em;
}

/* MACRO_HBR_RIGHT_RAIL_V2 */

/* ==================================================================
   MACRO_HBR_GRID_INTRINSIC_V3

   Zero intrinsic minimums are required so the contract track can
   actually surrender width to the analogue/GeoScen track.
   ================================================================== */

#view-macro .macro-main-grid > * {
  min-width: 0 !important;
  box-sizing: border-box !important;
}

#view-macro .fx-panel {
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/*
   Final right-rail authority.
   This intentionally supersedes the earlier:
     #view-macro .macro-regime-analogues-panel {
       display: block !important;
     }
*/

#view-macro .macro-regime-analogues-panel {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows:
    minmax(250px, 0.85fr)
    minmax(300px, 1.15fr) !important;

  align-content: stretch !important;
  gap: 18px !important;
  padding: 16px !important;

  min-width: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

#view-macro .macro-howl-section {
  display: flex !important;
  flex-direction: column !important;

  min-width: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;

  padding-bottom: 18px !important;
  border-bottom: 1px solid rgba(148, 123, 255, 0.28) !important;
}

#view-macro .macro-analogues-section {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;

  min-width: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

#view-macro .macro-right-rail-heading {
  display: block !important;

  width: 100% !important;
  margin: 0 0 14px 0 !important;

  text-align: center !important;
  font-size: 0.86rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

#view-macro .macro-geoscen-current-card,
#view-macro .macro-analogue-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;

  padding: 18px 16px !important;

  border: 1px solid rgba(126, 153, 196, 0.12) !important;
  border-left: 3px solid rgba(148, 123, 255, 0.75) !important;
  border-radius: 10px !important;

  background:
    linear-gradient(
      180deg,
      rgba(8, 17, 28, 0.72),
      rgba(7, 14, 24, 0.58)
    ) !important;

  text-align: center !important;
}

#view-macro .macro-geoscen-current-card {
  min-height: 180px !important;
  flex: 1 1 auto !important;
}

#view-macro .macro-main-analogue {
  min-height: 175px !important;
}

#view-macro .macro-supporting-analogue[hidden] {
  display: none !important;
}

#view-macro .macro-supporting-analogue[data-supporting-analogue-status="AVAILABLE"] {
  display: flex !important;
}

/* MACRO_HBR_GRID_INTRINSIC_V3 */

/* ==================================================================
   MACRO_HBR_TRANSMISSION_TITLE_NORMALIZATION_V1

   Normalize TRANSMISSION to the same visual hierarchy as the other
   center diagnostic panel headings.
   ================================================================== */

#view-macro .macro-transmission-title {
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

/* MACRO_HBR_TRANSMISSION_TITLE_NORMALIZATION_V1 */

/* ==================================================================
   MACRO_HBR_CENTER_PANEL_QUESTIONS_V1_1
   Same-line interpretive questions aligned to IV[t].
   Pressure = green
   Dispersion = blue
   Coherence = burgundy
   Systemicity = silver
   ================================================================== */

#view-macro .macro-center-title {
  display: flex;
  align-items: baseline;
  gap: 0.42rem;
  min-width: 0;
  white-space: nowrap;
}

#view-macro .macro-panel-question {
  font-size: 0.72rem;
  font-weight: 400;
  font-style: italic;
  line-height: 1.2;
  letter-spacing: 0.01em;
  text-transform: none;
  white-space: nowrap;
}

#view-macro .macro-panel-question-pressure {
  color: inherit;
}

#view-macro .macro-panel-question-dispersion {
  color: inherit;
}

#view-macro .macro-panel-question-coherence {
  color: inherit;
}

#view-macro .macro-panel-question-systemicity {
  color: inherit;
}

/* MACRO_HBR_CENTER_PANEL_QUESTIONS_V1_1 */

/* C•FLOW governed indicator emphasis */
.cflow-member-name {
  color: var(--iv-blue);
  font-weight: 700;
}


/* C•FLOW Activity evidence-bounded economic synthesis */
.cflow-insight {
  color: var(--iv-gold);
  font-weight: 700;
}


/* C•FLOW compact Evidence Guard — presentation only */
.cflow-evidence-guard-rail {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 3px 14px;
  padding-top: 4px;
  color: #9ca3af;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.035em;
  text-align: center;
}

.cflow-evidence-guard-rail span:not(:last-child)::after {
  content: " •";
  margin-left: 14px;
  color: #64748b;
}


/* C•FLOW Evidence Guard final visual hierarchy */
.geoscen-evidence-guard > h4 {
  text-align: center;
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.045em;
  margin-bottom: 8px;
}

.cflow-evidence-guard-rail {
  font-size: 9.5px;
  font-weight: 700;
  line-height: 1.35;
  gap: 4px 12px;
}

.cflow-evidence-guard-rail span:not(:last-child)::after {
  margin-left: 12px;
}

