:root {
  color-scheme: dark;
  --bg: #02070d;
  --panel: #07111e;
  --panel-strong: #0a1727;
  --line: #1c3349;
  --line-soft: rgba(74, 117, 151, 0.24);
  --text: #f4f7fb;
  --muted: #8ca3b7;
  --blue: #60a5fa;
  --green: #53e0a0;
  --orange: #fb923c;
  --danger: #fb7185;
  --focus: #93c5fd;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); }
body { min-width: 320px; }
button, input, select, summary { font: inherit; }
button, select { cursor: pointer; }
a { color: inherit; }
[hidden] { display: none !important; }

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

.control-shell {
  position: relative;
  z-index: 20;
  background: linear-gradient(180deg, #07111d, #040a12);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.2);
}

.app-header,
.controls,
.workspace {
  width: calc(100% - 28px);
  margin-inline: auto;
}

.app-header {
  min-height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 7px 4px 6px;
}

.heading-group,
.header-actions,
.stock-picker,
.control-group,
.pane-controls {
  display: flex;
  align-items: center;
}

.heading-group { gap: 14px; }
.app-header .heading-group > div { display: grid; grid-template-columns: auto auto; align-items: baseline; column-gap: 10px; }
.app-header .heading-group .eyebrow { grid-column: 1 / -1; }
.home-link { color: var(--green); font-size: 13px; font-weight: 900; letter-spacing: .18em; text-decoration: none; }
.heading-divider { width: 1px; height: 31px; background: var(--line); }
.eyebrow { margin: 0 0 2px; color: var(--blue); font-size: 10px; font-weight: 850; letter-spacing: .18em; }
h1 { margin: 0; font-size: clamp(20px, 1.45vw, 27px); line-height: 1.05; }
.page-subtitle { margin: 2px 0 0; color: var(--muted); font-size: 11px; font-weight: 650; }
.header-actions { gap: 9px; }
.language-link { min-width: 40px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 8px; text-align: center; text-decoration: none; color: var(--muted); font-weight: 800; }

.controls {
  display: flex;
  align-items: end;
  gap: 11px;
  padding: 5px 4px 6px;
  border-top: 1px solid rgba(255, 255, 255, 0.025);
}

.stock-picker { position: relative; flex: 1 1 760px; display: grid; grid-template-columns: auto minmax(230px, 1fr) auto minmax(180px, .9fr); align-items: end; gap: 8px; }
.market-field { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.market-field label,
.control-label,
.compact-control label { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.search-wrap { position: relative; flex: 1 1 300px; min-width: 190px; }
input, select {
  min-height: 34px;
  border: 1px solid #27425b;
  border-radius: 8px;
  background: #0b1726;
  color: var(--text);
  outline: none;
}
input { width: 100%; padding: 7px 12px; }
select { padding: 6px 32px 6px 10px; }
input:focus, select:focus, button:focus-visible, a:focus-visible, summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

.search-results {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  left: 0;
  z-index: 100;
  max-height: 330px;
  overflow: auto;
  padding: 5px;
  border: 1px solid #31506d;
  border-radius: 10px;
  background: #081320;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .58);
}
.search-result { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 9px 10px; border: 0; border-radius: 7px; background: transparent; color: var(--text); text-align: left; }
.search-result:hover, .search-result:focus-visible, .search-result.active { background: #10243a; }
.search-result.active { box-shadow: inset 3px 0 0 var(--blue); }
.search-result strong, .search-result span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-result span { color: var(--muted); font-size: 12px; }
.search-message { margin: 8px; color: var(--muted); font-size: 13px; }

.cluster-picker { position: relative; align-self: end; }
.cluster-trigger {
  min-height: 34px;
  max-width: min(220px, 28vw);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 11px;
  border: 1px solid #2a4a67;
  border-radius: 8px;
  background: #0b1929;
  color: #d9e9f7;
  font-size: 12px;
  font-weight: 850;
}
.cluster-trigger-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cluster-trigger-icon { flex: 0 0 auto; color: var(--muted); font-size: 10px; transition: transform .14s ease; }
.cluster-trigger[aria-expanded="true"] { border-color: #4b78a0; background: #10233a; }
.cluster-trigger[aria-expanded="true"] .cluster-trigger-icon { transform: rotate(180deg); }
.cluster-picker.customized .cluster-trigger { border-color: rgba(216, 180, 254, .48); color: #e9d5ff; }
.cluster-picker.incomplete .cluster-trigger { border-color: rgba(251, 191, 36, .52); color: #fcd34d; }
.cluster-dialog {
  inset: 0;
  width: min(760px, calc(100vw - 28px));
  max-width: none;
  height: min(760px, calc(100dvh - 36px));
  max-height: none;
  padding: 0;
  margin: auto;
  overflow: hidden;
  border: 1px solid #315674;
  border-radius: 16px;
  background: #07121f;
  color: var(--text);
  box-shadow: 0 32px 100px rgba(0, 0, 0, .76), 0 0 0 1px rgba(96, 165, 250, .08);
}
html.cluster-dialog-open,
html.cluster-dialog-open body { overflow: hidden; }
.cluster-dialog::backdrop { background: rgba(0, 5, 11, .76); backdrop-filter: blur(5px); }
.cluster-dialog-surface { height: 100%; display: grid; grid-template-rows: auto auto auto auto auto auto minmax(0, 1fr); gap: 11px; padding: 17px; }
.cluster-dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.cluster-dialog-header h2 { margin: 2px 0 0; font-size: 22px; }
.cluster-dialog-close { width: 40px; height: 40px; display: grid; place-items: center; padding: 0 0 3px; border: 1px solid #29465f; border-radius: 10px; background: #0b1b2b; color: #c7d7e4; font-size: 24px; line-height: 1; }
.cluster-dialog-help { margin: -5px 0 0; color: var(--muted); font-size: 12px; }
.custom-cluster-toolbar { min-width: 0; display: flex; align-items: center; gap: 10px; }
.custom-cluster-toolbar .button { flex: 0 0 auto; }
.custom-cluster-status { min-width: 0; overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.custom-cluster-status.error { color: #fda4af; }
.custom-cluster-form { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(130px, auto) minmax(130px, auto) auto; align-items: end; gap: 9px; padding: 10px; border: 1px solid rgba(96, 165, 250, .34); border-radius: 10px; background: rgba(11, 29, 47, .76); }
.custom-cluster-field { min-width: 0; display: grid; gap: 4px; }
.custom-cluster-field label { color: var(--muted); font-size: 10px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.custom-cluster-field input,
.custom-cluster-field select { width: 100%; min-width: 0; }
.custom-cluster-form-error { grid-column: 1 / -1; margin: 0; color: #fda4af; font-size: 11px; }
.custom-cluster-form-actions { display: flex; gap: 6px; }
.cluster-category-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.cluster-category { min-height: 34px; padding: 6px 12px; border: 1px solid #28465f; border-radius: 999px; background: #091726; color: #9fb4c4; font-size: 12px; font-weight: 800; }
.cluster-category[aria-pressed="true"] { border-color: rgba(96, 165, 250, .72); background: #173958; color: #edf7ff; box-shadow: inset 0 0 0 1px rgba(96, 165, 250, .2); }
.cluster-search { min-height: 40px; background: #091827; }
.cluster-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 9px;
  min-height: 0;
  overflow-y: auto;
  padding: 2px 4px 4px 2px;
  scrollbar-color: #31506d transparent;
}
.cluster-option { width: 100%; min-height: 142px; display: grid; align-content: start; gap: 7px; padding: 12px; border: 1px solid rgba(61, 96, 125, .62); border-radius: 11px; background: linear-gradient(145deg, rgba(16, 37, 58, .86), rgba(7, 20, 34, .92)); color: var(--text); text-align: left; }
.cluster-option:hover, .cluster-option:focus-visible { border-color: rgba(96, 165, 250, .72); background: linear-gradient(145deg, rgba(23, 54, 84, .96), rgba(9, 27, 46, .98)); }
.cluster-option.selected { border-color: rgba(83, 224, 160, .62); box-shadow: inset 3px 0 0 var(--green), 0 0 22px rgba(83, 224, 160, .08); }
.cluster-option-custom { position: relative; padding: 0; overflow: hidden; }
.cluster-option-custom-select { width: 100%; min-height: 104px; display: grid; align-content: start; gap: 7px; padding: 12px 12px 8px; border: 0; background: transparent; color: var(--text); text-align: left; }
.cluster-option-custom-select:hover { background: rgba(96, 165, 250, .06); }
.cluster-option-actions { display: flex; justify-content: flex-end; gap: 6px; padding: 7px 9px 9px; border-top: 1px solid var(--line-soft); }
.cluster-option-action { min-height: 30px; padding: 4px 8px; border: 1px solid #294a64; border-radius: 7px; background: #0b1b2b; color: #bfd1df; font-size: 10px; font-weight: 800; }
.cluster-option-action.danger { border-color: rgba(251, 113, 133, .5); color: #fecdd3; }
.cluster-option-heading { display: flex; justify-content: space-between; gap: 12px; }
.cluster-option-heading strong { min-width: 0; font-size: 14px; line-height: 1.25; }
.cluster-option-heading span { flex: 0 0 auto; color: #8eabc0; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.cluster-option-preview { color: #c0d0dc; font-size: 11px; }
.cluster-option-preview { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cluster-option-description { color: #8fa7b8; font-size: 11px; line-height: 1.38; }
.cluster-option-meta { margin-top: auto; color: #70a9cd; font-size: 10px; font-weight: 800; letter-spacing: .035em; text-transform: uppercase; }
.cluster-empty { margin: 12px 2px; color: var(--muted); font-size: 13px; }
.control-group { gap: 7px; }
.control-group:not(.compact-control) { flex-direction: column; align-items: flex-start; }
.compact-control { align-self: stretch; flex-direction: column; align-items: flex-start; justify-content: flex-end; gap: 3px; }
.segmented { display: inline-flex; padding: 3px; border: 1px solid #28445e; border-radius: 9px; background: #07101b; }
.segmented button { min-height: 30px; padding: 5px 11px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); font-size: 12px; font-weight: 800; }
.segmented button:hover { color: var(--text); }
.segmented button.active { background: #183859; color: #e5f2ff; box-shadow: inset 0 0 0 1px rgba(96, 165, 250, .35); }
.segmented button:disabled { cursor: not-allowed; opacity: .38; }
.button { min-height: 36px; padding: 7px 13px; border-radius: 8px; font-size: 12px; font-weight: 850; }
.button.primary { border: 1px solid #2f8f70; background: #0f5b47; color: #e9fff7; }
.button.secondary { border: 1px solid #2a4a67; background: #0b1929; color: #d9e9f7; }
.button:hover { filter: brightness(1.14); }

.selected-stocks-shell { position: relative; min-width: 0; min-height: 34px; align-self: end; }
.selected-stocks-shell::before,
.selected-stocks-shell::after { position: absolute; top: 1px; bottom: 1px; z-index: 1; width: 42px; opacity: 0; pointer-events: none; transition: opacity .16s ease; content: ''; }
.selected-stocks-shell::before { left: 1px; border-radius: 8px 0 0 8px; background: linear-gradient(90deg, #0b1726 24%, transparent); }
.selected-stocks-shell::after { right: 1px; border-radius: 0 8px 8px 0; background: linear-gradient(270deg, #0b1726 24%, transparent); }
.selected-stocks-shell.can-scroll-left::before,
.selected-stocks-shell.can-scroll-right::after { opacity: 1; }
.selected-stocks { width: 100%; display: flex; min-width: 0; min-height: 34px; align-items: center; gap: 6px; padding: 2px 3px; overflow-x: auto; overflow-y: hidden; overscroll-behavior-inline: contain; scroll-behavior: smooth; scroll-padding-inline: 34px; border: 1px solid rgba(39, 66, 91, .72); border-radius: 8px; background: rgba(11, 23, 38, .55); scrollbar-width: none; }
.selected-stocks::-webkit-scrollbar { display: none; }
.selected-stocks-nav { position: absolute; top: 50%; z-index: 2; width: 28px; height: 28px; display: grid; place-items: center; padding: 0 0 2px; transform: translateY(-50%); border: 1px solid rgba(96, 165, 250, .42); border-radius: 50%; background: rgba(10, 30, 49, .94); box-shadow: 0 6px 18px rgba(0, 0, 0, .42); color: #dceeff; font-size: 20px; line-height: 1; backdrop-filter: blur(8px); }
.selected-stocks-previous { left: 4px; }
.selected-stocks-next { right: 4px; }
.selected-stocks-nav:hover:not(:disabled) { border-color: rgba(125, 211, 252, .84); background: #173a5b; }
.selected-stocks-nav:disabled { opacity: 0; pointer-events: none; }
.stock-chip { display: inline-flex; align-items: center; flex: 0 0 auto; min-height: 34px; padding: 2px 3px; border: 1px solid color-mix(in srgb, var(--chip-color) 55%, #183147); border-radius: 999px; background: color-mix(in srgb, var(--chip-color) 12%, #07111e); transition: border-color .14s ease, box-shadow .14s ease, opacity .14s ease; }
.stock-chip-focus { min-width: 0; min-height: 28px; display: inline-flex; align-items: center; gap: 6px; padding: 3px 6px; border: 0; border-radius: 999px 5px 5px 999px; background: transparent; color: inherit; }
.stock-chip-focus:hover:not(:disabled) { background: color-mix(in srgb, var(--chip-color) 14%, transparent); }
.stock-chip-focus:disabled { cursor: default; }
.stock-chip.focused-series { border-color: var(--chip-color); box-shadow: 0 0 0 1px color-mix(in srgb, var(--chip-color) 38%, transparent), 0 0 18px color-mix(in srgb, var(--chip-color) 22%, transparent); }
.stock-chip.dimmed-series { opacity: .48; }
.stock-chip .swatch { width: 8px; height: 8px; border-radius: 50%; background: var(--chip-color); box-shadow: 0 0 10px var(--chip-color); }
.stock-chip strong { font-size: 12px; }
.stock-chip span { color: var(--muted); font-size: 10px; }
.stock-chip-remove { width: 28px; height: 28px; flex: 0 0 28px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.07); color: #c7d5e1; }
.stock-chip-remove:hover { background: rgba(251, 113, 133, .16); color: #fecdd3; }
.selection-help { color: var(--muted); font-size: 12px; }

.view-options { position: relative; align-self: end; }
.view-options > summary {
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border: 1px solid #2a4a67;
  border-radius: 8px;
  background: #0b1929;
  color: #d9e9f7;
  font-size: 12px;
  font-weight: 850;
  cursor: pointer;
  list-style: none;
}
.view-options > summary::-webkit-details-marker { display: none; }
.view-options > summary::after { content: '▾'; color: var(--muted); font-size: 10px; }
.view-options[open] > summary { border-color: #4b78a0; background: #10233a; }
.view-options[open] > summary::after { transform: rotate(180deg); }
.view-options-panel {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 90;
  width: 220px;
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid #31506d;
  border-radius: 10px;
  background: #081320;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .58);
}
.view-options-panel .button, .view-options-panel select { width: 100%; }

.workspace { min-height: calc(100vh - 125px); padding: 8px 0 16px; }
.broadcast-heading { display: none; }
.comparison-insight {
  min-height: 54px;
  display: grid;
  grid-template-columns: minmax(180px, auto) minmax(260px, 1fr) minmax(250px, auto);
  align-items: center;
  gap: 10px 18px;
  margin-bottom: 7px;
  padding: 6px 13px;
  border: 1px solid rgba(70, 112, 148, .38);
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(14, 34, 55, .94), rgba(7, 20, 34, .78));
}
.insight-main { font-size: 14px; line-height: 1.25; }
.insight-main.positive { color: var(--green); }
.insight-main.negative { color: var(--danger); }
.insight-detail { color: #d0deea; font-size: 12px; font-variant-numeric: tabular-nums; }
.insight-risk { justify-self: end; color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.chart-card { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: linear-gradient(180deg, rgba(10, 23, 39, .98), rgba(3, 10, 18, .98)); box-shadow: 0 18px 55px rgba(0,0,0,.22); }
.chart-toolbar { min-height: 59px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 14px; border-bottom: 1px solid var(--line-soft); }
.chart-heading { min-width: 0; display: grid; grid-template-columns: auto auto; align-items: center; column-gap: 12px; }
.chart-heading h2 { grid-column: 1 / -1; }
.chart-toolbar h2 { margin: 0 0 3px; font-size: 17px; }
.chart-toolbar p { margin: 0; color: var(--muted); font-size: 12px; }
.chart-status { margin-top: 3px !important; color: #8299ad !important; font-size: 11px !important; line-height: 1.25; }
.chart-status.error, .chart-status.limited { display: inline-block; padding: 3px 7px; border-radius: 5px; }
.chart-status.error { color: #fecdd3 !important; background: rgba(190, 24, 93, .13); }
.chart-status.limited { color: #fed7aa !important; background: rgba(154, 52, 18, .13); }
.chart-controls { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.pane-controls { gap: 9px; color: var(--muted); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.reference-control { display: flex; align-items: center; gap: 7px; }
.reference-control label { color: var(--muted); font-size: 11px; font-weight: 800; white-space: nowrap; }
.reference-control select { min-height: 32px; max-width: 230px; font-size: 11px; }

.chart-stage { position: relative; min-height: 480px; height: clamp(480px, 57vh, 700px); }
.chart-host { position: absolute; inset: 0; }
.chart-host:focus-visible { outline: 2px solid var(--focus); outline-offset: -3px; box-shadow: inset 0 0 0 1px rgba(147, 197, 253, .24); }
.chart-empty { position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; padding: 30px; color: var(--muted); text-align: center; }
.chart-empty-content { width: min(430px, 100%); display: grid; justify-items: center; gap: 9px; padding: 24px; border: 1px solid rgba(76, 127, 166, .32); border-radius: 13px; background: radial-gradient(circle at 50% 0, rgba(56, 189, 248, .09), transparent 58%), rgba(6, 17, 29, .9); box-shadow: 0 18px 48px rgba(0, 0, 0, .28); }
.chart-empty-icon { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(96, 165, 250, .46); border-radius: 50%; background: rgba(96, 165, 250, .1); color: #93c5fd; font-size: 20px; font-weight: 900; }
.chart-empty-content strong { color: #e7f1f8; font-size: 16px; }
.chart-empty-content p { max-width: 360px; margin: 0; color: #91a8ba; font-size: 12px; line-height: 1.5; }
.chart-empty-retry { margin-top: 4px; min-width: 112px; }
.chart-card.has-error-state .chart-empty-content { border-color: rgba(251, 113, 133, .34); background: radial-gradient(circle at 50% 0, rgba(251, 113, 133, .1), transparent 58%), rgba(18, 10, 20, .92); }
.chart-card.has-error-state .chart-empty-icon { border-color: rgba(251, 113, 133, .55); background: rgba(251, 113, 133, .1); color: #fda4af; }
.chart-card.has-empty-state .chart-stage { min-height: 310px; height: clamp(310px, 42vh, 430px); }
.chart-card.has-empty-state .chart-controls, .chart-card.has-empty-state .lower-pane-label, .chart-card.has-empty-state .legend { display: none; }
.lower-pane-label { position: absolute; left: 16px; bottom: 27%; z-index: 4; padding: 3px 7px; border-radius: 4px; background: rgba(2, 7, 13, .72); color: #86a3bb; font-size: 11px; font-weight: 850; letter-spacing: .09em; pointer-events: none; }
.chart-tooltip { position: absolute; z-index: 8; width: min(310px, calc(100% - 20px)); overflow: hidden; border: 1px solid rgba(102, 164, 211, .55); border-radius: 11px; background: linear-gradient(145deg, rgba(11, 31, 50, .98), rgba(3, 12, 21, .98)); box-shadow: 0 20px 55px rgba(0, 0, 0, .48), 0 0 0 1px rgba(125, 211, 252, .06) inset; color: #dceaf4; pointer-events: none; backdrop-filter: blur(12px); }
.chart-tooltip[hidden] { display: none; }
.chart-tooltip::before { position: absolute; top: 0; bottom: 0; left: 0; width: 3px; background: linear-gradient(180deg, #38bdf8, #8b5cf6 55%, #2dd4bf); content: ''; }
.chart-tooltip-header { display: flex; align-items: end; justify-content: space-between; gap: 14px; padding: 11px 13px 10px 16px; border-bottom: 1px solid rgba(102, 143, 177, .22); background: radial-gradient(circle at 12% 0, rgba(56, 189, 248, .15), transparent 55%); }
.chart-tooltip-header > div { min-width: 0; display: grid; gap: 2px; }
.chart-tooltip-header strong { overflow: hidden; color: #f0f7fc; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.chart-tooltip-eyebrow { color: #7dd3fc; font-size: 9px; font-weight: 900; letter-spacing: .15em; }
.chart-tooltip-metric { flex: none; color: #7893a8; font-size: 9px; font-weight: 800; text-align: right; }
.chart-tooltip-list { display: grid; padding: 5px 7px 7px 10px; }
.chart-tooltip-row { min-width: 0; display: grid; grid-template-columns: 22px 8px minmax(0, 1fr) auto; align-items: center; gap: 7px; min-height: 36px; padding: 4px 6px; border-radius: 7px; }
.chart-tooltip-row + .chart-tooltip-row { border-top: 1px solid rgba(83, 121, 151, .13); }
.chart-tooltip-row.is-leader { background: linear-gradient(90deg, color-mix(in srgb, var(--tooltip-series-color) 14%, transparent), transparent); }
.chart-tooltip-rank { color: #718ca3; font-size: 9px; font-weight: 900; font-variant-numeric: tabular-nums; }
.chart-tooltip-row.is-leader .chart-tooltip-rank { color: var(--tooltip-series-color); }
.chart-tooltip-swatch { width: 7px; height: 7px; border-radius: 50%; background: var(--tooltip-series-color); box-shadow: 0 0 10px color-mix(in srgb, var(--tooltip-series-color) 72%, transparent); }
.chart-tooltip-identity { min-width: 0; display: grid; line-height: 1.15; }
.chart-tooltip-identity strong { overflow: hidden; color: #dce9f3; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.chart-tooltip-identity span { overflow: hidden; color: #6f899d; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.chart-tooltip-value { color: #e8f2f8; font-size: 12px; font-weight: 900; font-variant-numeric: tabular-nums; }
.chart-tooltip-value.positive { color: #4adeb3; }
.chart-tooltip-value.negative { color: #fb7185; }
.anomaly-banner { margin: 0 14px 8px; padding: 8px 10px; border: 1px solid rgba(251, 146, 60, .34); border-radius: 7px; background: rgba(154, 52, 18, .12); color: #fed7aa; font-size: 12px; }

.edge-view {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: radial-gradient(circle at 50% 0, rgba(30, 73, 105, .22), transparent 38%), linear-gradient(180deg, #091827, #030b13 72%);
  box-shadow: 0 18px 55px rgba(0, 0, 0, .24);
}
.edge-header { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 8px 14px; border-bottom: 1px solid var(--line-soft); }
.edge-eyebrow { margin: 0 0 2px; color: #6ee7b7; font-size: 10px; font-weight: 900; letter-spacing: .18em; }
.edge-title { margin: 0; font-size: 18px; line-height: 1.1; }
.edge-context { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.edge-data-status { color: #7696ae; }
.edge-latest { min-height: 34px; padding: 6px 11px; border: 1px solid #315575; border-radius: 8px; background: #0b1b2d; color: #d9e9f7; font-size: 11px; font-weight: 850; }
.edge-latest:hover { border-color: #6091ba; background: #102740; }
.edge-latest.is-at-latest,
.cluster-latest.is-at-latest { display: none; }

.edge-hero { min-height: 78px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, .75fr) minmax(0, 1fr); align-items: center; gap: 16px; padding: 8px 18px; border-bottom: 1px solid rgba(70, 112, 148, .22); background: rgba(4, 13, 22, .68); }
.edge-participant { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 2px 9px; padding-left: 12px; border-left: 3px solid var(--participant-color); }
.edge-participant:last-child { grid-template-columns: minmax(0, 1fr) auto; padding: 0 12px 0 0; border-right: 3px solid var(--participant-color); border-left: 0; text-align: right; }
.edge-participant:last-child .edge-participant-symbol { grid-column: 2; }
.edge-participant:last-child .edge-participant-name { grid-column: 1; grid-row: 1; }
.edge-participant:last-child .edge-participant-value { grid-column: 1 / -1; }
.edge-participant-symbol { color: var(--participant-color); font-size: 17px; }
.edge-participant-name { min-width: 0; overflow: hidden; color: #8199ae; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.edge-participant-value { grid-column: 1 / -1; color: #f1f7fb; font-size: clamp(22px, 2vw, 30px); font-weight: 900; font-variant-numeric: tabular-nums; }
.edge-hero-center { display: grid; justify-items: center; gap: 1px; text-align: center; }
.edge-hero-label { color: #9eb3c4; font-size: 11px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.edge-hero-value { color: #edf6fc; font-size: clamp(19px, 1.75vw, 27px); font-weight: 900; font-variant-numeric: tabular-nums; }
.edge-hero-date { color: #6f879a; font-size: 10px; }
.edge-a-text { color: var(--edge-a); }
.edge-b-text { color: var(--edge-b); }

.edge-chart-shell { position: relative; width: 100%; height: auto; min-height: 300px; max-height: 560px; aspect-ratio: 10 / 3; border-bottom: 1px solid var(--line-soft); background: rgba(2, 8, 14, .52); }
.edge-chart { width: 100%; height: 100%; display: block; outline: none; }
.edge-chart:focus-visible { outline: 2px solid var(--focus); outline-offset: -3px; }
.edge-grid-line { stroke: rgba(92, 126, 154, .18); stroke-width: 1; stroke-dasharray: 3 5; vector-effect: non-scaling-stroke; }
.edge-grid-line.vertical { stroke: rgba(92, 126, 154, .12); }
.edge-zero-line { stroke: #8aa6bb; stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.edge-axis-label, .edge-time-label { fill: #7891a5; font-size: 11px; font-weight: 650; }
.edge-zone-label { font-size: 11px; font-weight: 900; letter-spacing: .12em; opacity: .8; }
.edge-zone-a { fill: var(--edge-a); }
.edge-zone-b { fill: var(--edge-b); }
.edge-lead-area { fill: url(#edge-lead-gradient); opacity: .16; }
.edge-lead-line { fill: none; stroke-width: 3; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.edge-selection-line { stroke: rgba(220, 233, 243, .72); stroke-width: 1; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; pointer-events: none; }
.edge-selection-dot { fill: var(--selection-color); stroke: #f8fbfd; stroke-width: 2; vector-effect: non-scaling-stroke; pointer-events: none; }
.edge-interaction-layer { fill: transparent; cursor: crosshair; touch-action: pan-y; }
.edge-tooltip { position: absolute; top: 15px; z-index: 5; min-width: 205px; display: grid; gap: 5px; padding: 9px 10px; border: 1px solid #355572; border-radius: 8px; background: rgba(4, 13, 23, .94); box-shadow: 0 12px 30px rgba(0, 0, 0, .38); font-size: 11px; pointer-events: none; transform: translateX(12px); }
.edge-tooltip.align-right { transform: translateX(calc(-100% - 12px)); }
.edge-tooltip > strong { color: #e3eef6; }
.edge-tooltip-row { display: flex; justify-content: space-between; gap: 18px; color: #9bb0c1; }
.edge-tooltip-row strong { color: #edf5fb; font-variant-numeric: tabular-nums; }

.edge-statistics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--line-soft); }
.edge-stat-card { min-height: 70px; display: grid; align-content: center; gap: 5px; padding: 10px 14px; border-right: 1px solid var(--line-soft); }
.edge-stat-card:last-child { border-right: 0; }
.edge-stat-card span { color: #7891a5; font-size: 10px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.edge-stat-card strong { overflow: hidden; color: #e4eef6; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }

.edge-supporting { display: grid; grid-template-columns: minmax(310px, .85fr) minmax(480px, 1.15fr); }
.edge-panel { min-width: 0; padding: 12px 14px 14px; }
.edge-panel + .edge-panel { border-left: 1px solid var(--line-soft); }
.edge-panel h3 { margin: 0 0 9px; color: #d9e6ef; font-size: 13px; }
.edge-event-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.edge-event { min-width: 0; min-height: 44px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 7px 8px; border: 1px solid rgba(70, 112, 148, .3); border-radius: 7px; background: rgba(11, 28, 46, .62); color: #d9e6ef; text-align: left; }
.edge-event:hover { border-color: rgba(96, 165, 250, .62); background: rgba(18, 44, 70, .72); }
.edge-event-date { color: #7f9ab0; font-size: 10px; white-space: nowrap; }
.edge-event strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.edge-event-value { color: #adc1d0; font-size: 10px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.edge-panel-empty { color: var(--muted); font-size: 12px; }
.edge-h2h-header, .edge-h2h-row { display: grid; grid-template-columns: minmax(90px, 1fr) minmax(130px, .85fr) minmax(90px, 1fr); align-items: center; gap: 8px; text-align: center; }
.edge-h2h-header { margin-bottom: 3px; color: #6f899e; font-size: 10px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.edge-series-heading { color: var(--series-heading-color); }
.edge-h2h-row { min-height: 29px; border-top: 1px solid rgba(70, 112, 148, .17); color: #8fa6b8; font-size: 11px; }
.edge-h2h-row strong { color: #dbe7f0; font-size: 12px; font-variant-numeric: tabular-nums; }
.edge-h2h-row .is-advantage { color: var(--green); }
.edge-empty { min-height: 420px; display: grid; place-items: center; margin: 0; padding: 30px; color: var(--muted); text-align: center; }

.cluster-lens { position: relative; min-width: 0; display: grid; }
.cluster-header { min-height: 66px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 10px 15px; border-bottom: 1px solid var(--line-soft); }
.cluster-eyebrow { margin: 0 0 3px; color: #67e8f9; font-size: 10px; font-weight: 900; letter-spacing: .18em; }
.cluster-title { margin: 0; font-size: 19px; line-height: 1.12; }
.cluster-context, .cluster-panel-heading p, .cluster-panel-date, .cluster-cohesion-panel p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.cluster-header-actions { display: flex; align-items: center; gap: 8px; }
.cluster-status-pill { padding: 4px 7px; border: 1px solid #395a75; border-radius: 999px; color: #b7cede; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.cluster-status-pill.incomplete { border-color: rgba(251, 191, 36, .45); background: rgba(146, 64, 14, .16); color: #fcd34d; }
.cluster-latest, .cluster-filter-button { min-height: 32px; padding: 5px 10px; border: 1px solid #315575; border-radius: 7px; background: #0b1b2d; color: #d9e9f7; font-size: 11px; font-weight: 850; }
.cluster-latest:hover, .cluster-filter-button:hover, .cluster-filter-button[aria-pressed="true"] { border-color: #6091ba; background: #15314e; }
.cluster-data-quality { margin: 9px 14px; border: 1px solid var(--line); border-radius: 7px; background: rgba(8, 22, 36, .72); color: #a9bdcc; font-size: 11px; }
.cluster-data-quality.has-issues { border-color: rgba(251, 191, 36, .32); }
.cluster-data-quality[open] { border-color: rgba(251, 191, 36, .42); }
.cluster-data-quality > summary { display: flex; align-items: center; gap: 8px; padding: 8px 10px; color: #d8e6f0; font-weight: 800; cursor: pointer; }
.cluster-quality-badge { margin-left: auto; padding: 2px 6px; border: 1px solid rgba(251, 191, 36, .34); border-radius: 999px; background: rgba(146, 64, 14, .16); color: #fcd34d; font-size: 9px; font-weight: 900; letter-spacing: .03em; }
.cluster-quality-content { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; padding: 0 10px 10px; }
.cluster-quality-section { min-width: 0; }
.cluster-quality-section strong { color: #d8e6f0; }
.cluster-quality-section ul { margin: 6px 0 0; padding-left: 18px; }
.cluster-quality-section li { overflow-wrap: anywhere; }
.cluster-anomaly-warnings { color: #fed7aa; }
.cluster-anomaly-warnings strong { color: #fdba74; }
.cluster-anomaly-warnings p { margin: 6px 0 0; }

.cluster-hero { display: grid; grid-template-columns: minmax(290px, 1.75fr) repeat(3, minmax(0, 1fr)); border-bottom: 1px solid var(--line-soft); background: rgba(4, 13, 22, .68); }
.cluster-hero-card { min-width: 0; min-height: 94px; display: grid; align-content: center; gap: 5px; padding: 12px 14px; border-right: 1px solid var(--line-soft); }
.cluster-hero-card:last-child { border-right: 0; }
.cluster-hero-cluster { background: radial-gradient(circle at 0 0, rgba(96, 165, 250, .13), transparent 58%); }
.cluster-hero-label { color: #7891a5; font-size: 11px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.cluster-hero-value { overflow: hidden; color: #edf6fc; font-size: clamp(18px, 1.65vw, 25px); font-weight: 900; font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }
.cluster-hero-cluster .cluster-hero-value { font-size: clamp(26px, 2.4vw, 38px); }
.cluster-hero-meta { overflow: hidden; color: #91a9bb; font-size: 11px; line-height: 1.35; text-overflow: ellipsis; }
.cluster-lens .positive { color: var(--green); }
.cluster-lens .negative { color: var(--danger); }
.cluster-lens .neutral { color: #d7e4ee; }
.cluster-insight { margin: 2px 0 0; color: #c0d5e4; font-size: 12px; font-weight: 700; }

.cluster-chart-panel { min-width: 0; border-bottom: 1px solid var(--line-soft); }
.cluster-panel-heading { min-height: 51px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 8px 14px; }
.cluster-panel-heading h3, .cluster-panel h3 { margin: 0; color: #dce8f1; font-size: 13px; }
.cluster-focus-controls { display: flex; gap: 5px; }
.cluster-chart-shell { position: relative; min-width: 0; overflow: hidden; background: rgba(2, 8, 14, .52); }
.cluster-chart { width: 100%; display: block; outline: none; touch-action: pan-y; }
.cluster-chart:focus-visible { outline: 2px solid var(--focus); outline-offset: -3px; }
.cluster-grid line { stroke: rgba(92, 126, 154, .2); stroke-width: 1; stroke-dasharray: 3 5; vector-effect: non-scaling-stroke; }
.cluster-grid .cluster-zero-line { stroke: rgba(203, 222, 237, .52); stroke-dasharray: 2 3; }
.cluster-time-grid line { stroke: rgba(92, 126, 154, .12); stroke-width: 1; stroke-dasharray: 2 6; vector-effect: non-scaling-stroke; }
.cluster-grid text, .cluster-date-label { fill: #7891a5; font-size: 11px; font-weight: 650; }
.cluster-band { fill: rgba(96, 165, 250, .13); stroke: none; }
.cluster-median-line { fill: none; stroke: #8ca3b7; stroke-width: var(--cluster-median-line-width, 1.5); stroke-dasharray: 5 4; opacity: .8; vector-effect: non-scaling-stroke; }
.cluster-member-line { fill: none; stroke-width: var(--cluster-member-line-width, 1.5); stroke-linecap: round; stroke-linejoin: round; opacity: .42; vector-effect: non-scaling-stroke; transition: opacity 120ms ease, stroke-width 120ms ease; }
.cluster-member-line.focused { stroke-width: var(--cluster-focused-line-width, 3.5); opacity: 1; }
.cluster-member-line.dimmed { opacity: .08; }
.cluster-index-line { fill: none; stroke: #f8fafc; stroke-width: var(--cluster-index-line-width, 3); stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 4px rgba(248, 250, 252, .18)); vector-effect: non-scaling-stroke; }
.cluster-date-cursor { stroke: rgba(248, 250, 252, .7); stroke-width: 1; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.cluster-label-rail { position: absolute; top: 0; right: 7px; bottom: 0; z-index: 2; width: 140px; pointer-events: none; }
.cluster-end-label { position: absolute; right: 0; width: 134px; min-height: 20px; display: block; padding: 2px 6px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--label-color) 45%, #183046); border-radius: 4px; background: color-mix(in srgb, var(--label-color) 16%, rgba(3, 11, 19, .94)); color: color-mix(in srgb, var(--label-color) 78%, white); font-size: 10px; font-weight: 850; font-variant-numeric: tabular-nums; line-height: 15px; text-align: left; text-overflow: ellipsis; white-space: nowrap; pointer-events: auto; }
.cluster-end-label-index { border-color: rgba(248, 250, 252, .62); background: rgba(248, 250, 252, .12); color: #fff; }
.cluster-tooltip { position: absolute; top: 10px; z-index: 4; width: min(390px, calc(100% - 24px)); max-height: calc(100% - 20px); overflow: auto; padding: 10px; border: 1px solid #3b6382; border-radius: 10px; background: rgba(4, 13, 23, .96); box-shadow: 0 18px 48px rgba(0, 0, 0, .48); color: #c9d9e5; font-size: 11px; font-variant-numeric: tabular-nums; pointer-events: none; transform: translateX(-10%); backdrop-filter: blur(10px); }
.cluster-tooltip-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 7px; border-bottom: 1px solid rgba(94, 139, 174, .25); }
.cluster-tooltip-ranking { display: grid; gap: 3px; margin-top: 6px; }
.cluster-tooltip-row { display: grid; grid-template-columns: 20px 8px minmax(120px, 1fr) auto auto; align-items: center; gap: 7px; min-height: 27px; }
.cluster-tooltip-rank { color: #718ca1; font-size: 10px; font-weight: 900; }
.cluster-tooltip-swatch, .cluster-rank-swatch { width: 8px; height: 8px; border-radius: 50%; background: var(--series-color); box-shadow: 0 0 8px color-mix(in srgb, var(--series-color) 64%, transparent); }
.cluster-tooltip-identity { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px; align-items: baseline; }
.cluster-tooltip-identity span { overflow: hidden; color: #8ea6b8; text-overflow: ellipsis; white-space: nowrap; }

.cluster-panels { display: grid; grid-template-columns: minmax(360px, 1.15fr) minmax(260px, .85fr); border-bottom: 1px solid var(--line-soft); }
.cluster-panel { min-width: 0; padding: 12px 14px 14px; }
.cluster-panel + .cluster-panel { border-left: 1px solid var(--line-soft); }
.cluster-ranking-list { display: grid; gap: 4px; margin-top: 9px; }
.cluster-ranking-row { width: 100%; min-width: 0; min-height: 39px; display: grid; grid-template-columns: 24px 8px minmax(150px, 1fr) auto minmax(118px, auto); align-items: center; gap: 8px; padding: 5px 8px; border: 1px solid transparent; border-radius: 6px; background: rgba(255, 255, 255, .018); color: #dce8f1; text-align: left; }
.cluster-ranking-row:hover, .cluster-ranking-row.focused { border-color: rgba(96, 165, 250, .48); background: rgba(28, 64, 96, .42); }
.cluster-ranking-row.dimmed { opacity: .38; }
.cluster-rank-number { color: #6f8ba2; font-size: 11px; font-weight: 900; }
.cluster-rank-identity { min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 7px; }
.cluster-rank-ticker { font-size: 11px; }
.cluster-rank-name { overflow: hidden; color: #8fa8ba; font-size: 11px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.cluster-ranking-row > strong, .cluster-ranking-row > span:last-child { font-size: 11px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cluster-breadth-panel { display: grid; align-content: start; gap: 9px; }
.cluster-breadth-summary { margin-top: 7px; font-size: 22px; font-variant-numeric: tabular-nums; }
.cluster-breadth-track { height: 12px; display: flex; overflow: hidden; border-radius: 999px; background: rgba(111, 139, 161, .2); }
.cluster-breadth-segment { display: block; height: 100%; min-width: 0; transition: width .16s ease; }
.cluster-breadth-positive { background: linear-gradient(90deg, #22d3ee, #53e0a0); }
.cluster-breadth-neutral { background: #71879a; }
.cluster-breadth-negative { background: linear-gradient(90deg, #fb923c, #fb7185); }
.cluster-breadth-details { margin: 0; color: #9cb2c3; font-size: 11px; }

.cluster-dna-panel { border-bottom: 1px solid var(--line-soft); }
.cluster-dna-scroll { overflow-x: auto; padding: 0 14px 14px; }
.cluster-dna-table { width: 100%; min-width: 670px; border-collapse: separate; border-spacing: 3px; }
.cluster-dna-table th { color: #7891a5; font-size: 10px; font-weight: 850; text-align: center; }
.cluster-dna-table th:first-child { position: sticky; left: 0; z-index: 2; min-width: 150px; background: #06111d; text-align: left; }
.cluster-dna-table tbody tr.dimmed { opacity: .34; }
.cluster-dna-table tbody tr.focused th:first-child { box-shadow: inset 3px 0 0 var(--series-color, var(--blue)); }
.cluster-dna-member { width: 100%; min-height: 34px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 6px; padding: 4px 7px; border: 0; border-left: 3px solid var(--series-color); border-radius: 5px; background: #0b1b2b; color: #dbe8f1; font-size: 11px; font-weight: 900; text-align: left; }
.cluster-dna-member span { overflow: hidden; color: #849eb2; font-size: 10px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.cluster-dna-cell { width: 100%; min-width: 54px; min-height: 34px; padding: 3px 5px; border: 1px solid transparent; border-radius: 5px; color: #f4f8fb; font-size: 11px; font-weight: 800; font-variant-numeric: tabular-nums; }
.cluster-dna-cell:hover, .cluster-dna-cell.selected { border-color: rgba(248, 250, 252, .82); box-shadow: 0 0 0 1px rgba(2, 8, 14, .58); }
.cluster-cohesion-panel { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line-soft); }
.cluster-cohesion-copy { color: #b2c7d6 !important; font-size: 12px !important; }
.cluster-cohesion-value { color: #e0edf5; font-size: 21px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cluster-method { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; padding: 10px 14px; color: #8fa7ba; font-size: 10px; line-height: 1.45; }
.cluster-method strong { color: #c9d9e6; }
.cluster-method p { margin: 0; }
.cluster-method-copy { display: grid; gap: 3px; }
.cluster-incomplete { min-height: 420px; display: grid; place-content: center; justify-items: center; gap: 9px; padding: 30px; text-align: center; }
.cluster-incomplete h2, .cluster-incomplete p { margin: 0; }
.cluster-incomplete > p:not(.cluster-eyebrow) { max-width: 610px; color: var(--muted); font-size: 12px; }
.cluster-incomplete-meta { color: #fbbf24 !important; }
.cluster-incomplete .cluster-data-quality { width: min(620px, 100%); text-align: left; }

.legend { border-top: 1px solid var(--line-soft); }
.legend-header, .legend-row { display: grid; grid-template-columns: minmax(190px, 1.5fr) repeat(7, minmax(82px, 1fr)); align-items: center; gap: 9px; padding: 7px 13px; }
.legend.spread-mode .legend-header, .legend.spread-mode .legend-row { grid-template-columns: minmax(190px, 1.5fr) repeat(8, minmax(82px, 1fr)); }
.legend:not(.spread-mode) .legend-header > :last-child, .legend:not(.spread-mode) .metric-difference { display: none; }
.legend-header { color: #8199ae; font-size: 11px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.legend-row { min-height: 46px; border-top: 1px solid rgba(79, 112, 139, .16); background: rgba(255,255,255,.012); font-size: 12px; }
.legend-row:hover { background: rgba(96, 165, 250, .035); }
.legend-identity { min-width: 0; display: flex; align-items: center; gap: 9px; }
.legend-toggle { min-width: 24px; min-height: 24px; display: inline-grid; place-items: center; flex: 0 0 auto; padding: 0; border: 1px solid color-mix(in srgb, var(--series-color) 52%, #284158); border-radius: 6px; background: color-mix(in srgb, var(--series-color) 10%, #07111e); }
.legend-toggle-swatch { width: 10px; height: 10px; border-radius: 3px; background: var(--series-color); box-shadow: 0 0 8px color-mix(in srgb, var(--series-color) 65%, transparent); }
.legend-toggle-label { display: none; }
.legend-row.hidden-series { opacity: .46; }
.legend-name { min-width: 0; }
.legend-name strong, .legend-name span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.legend-name span { color: var(--muted); font-size: 11px; }
.legend-focus { position: relative; flex: 1; min-width: 0; padding: 3px 54px 3px 5px; border: 0; border-radius: 6px; background: transparent; color: inherit; text-align: left; }
.legend-name .legend-focus-cue { position: absolute; top: 50%; right: 5px; display: inline-flex; align-items: center; min-height: 20px; padding: 2px 6px; overflow: visible; border: 1px solid rgba(126, 161, 189, .28); border-radius: 999px; color: #8ca8bd; font-size: 8px; font-weight: 900; letter-spacing: .05em; line-height: 1; text-transform: uppercase; transform: translateY(-50%); }
.legend-focus[aria-pressed="true"] .legend-focus-cue { border-color: color-mix(in srgb, var(--series-color) 62%, #29445b); background: color-mix(in srgb, var(--series-color) 13%, transparent); color: color-mix(in srgb, var(--series-color) 82%, white); }
.legend-focus:hover, .legend-focus:focus-visible, .legend-focus[aria-pressed="true"] { background: color-mix(in srgb, var(--series-color) 13%, transparent); }
.legend-row.focused-series { box-shadow: inset 3px 0 0 var(--series-color); }
.legend-row.dimmed-series { opacity: .58; }
.metric { font-variant-numeric: tabular-nums; white-space: nowrap; }
.metric-period, .metric-drawdown { font-size: 13px; font-weight: 800; }
.metric.positive { color: var(--green); }
.metric.negative { color: var(--danger); }
.metric.muted { color: var(--muted); }

.methodology { margin-top: 9px; border-left: 2px solid #2d5b7c; background: rgba(7, 17, 30, .76); color: #93a8ba; font-size: 11px; line-height: 1.45; }
.methodology > summary { padding: 8px 12px; color: #c9d9e6; font-size: 12px; font-weight: 800; cursor: pointer; }
.methodology-content { padding: 0 13px 9px; }
.methodology p { margin: 0; }
.methodology p + p { margin-top: 3px; }
.credit { padding: 8px 4px 0; color: #647b90; font-size: 10px; text-align: center; }
.credit a { color: #789bb9; }
.broadcast-sensor { display: none; }

html.broadcast-mode,
html.broadcast-mode body { height: 100%; overflow: hidden; }
html.broadcast-mode .control-shell {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1000;
  max-height: min(70vh, 540px);
  overflow: visible;
  transform: translateY(calc(-100% - 3px));
  visibility: hidden;
  pointer-events: none;
  transition: transform 170ms ease, visibility 0s linear 170ms;
}
html.broadcast-mode .control-shell.is-open,
html.broadcast-mode .control-shell:focus-within { transform: translateY(0); visibility: visible; pointer-events: auto; transition: transform 170ms ease; }
html.broadcast-mode .broadcast-sensor { display: block; position: fixed; top: 0; right: 0; left: 0; z-index: 999; width: 100%; height: 13px; padding: 0; border: 0; background: linear-gradient(90deg, transparent 10%, rgba(96,165,250,.8), transparent 90%) top / 100% 2px no-repeat; }
html.broadcast-mode .workspace { width: 100%; height: 100vh; min-height: 0; display: flex; flex-direction: column; padding: 0 8px 6px; }
html.broadcast-mode .broadcast-heading { flex: 0 0 48px; display: flex; align-items: center; justify-content: space-between; padding: 5px 12px 4px; border-bottom: 1px solid var(--line); }
html.broadcast-mode .broadcast-heading .eyebrow { display: none; }
html.broadcast-mode .broadcast-heading h1 { font-size: clamp(20px, 1.35vw, 24px); line-height: 1; }
html.broadcast-mode .broadcast-heading p:last-child { margin: 2px 0 0; color: var(--muted); font-size: 10px; line-height: 1; }
.broadcast-chip { padding: 5px 10px; border: 1px solid rgba(96,165,250,.48); border-radius: 999px; background: rgba(96,165,250,.06); color: #93c5fd; font-size: 10px; font-weight: 900; letter-spacing: .13em; }
.broadcast-chip:hover { border-color: rgba(96,165,250,.82); background: rgba(96,165,250,.14); color: #dbeafe; }
html.broadcast-mode .chart-card { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; border-radius: 5px; }
html.broadcast-mode .chart-toolbar { flex: 0 0 40px; min-height: 40px; padding: 4px 11px; }
html.broadcast-mode .chart-heading { display: flex; align-items: center; gap: 8px; }
html.broadcast-mode .chart-heading h2 { flex: 0 0 auto; margin: 0; }
html.broadcast-mode .chart-heading p { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.broadcast-mode .chart-toolbar .chart-heading p { margin-top: 1px; }
html.broadcast-mode .chart-controls { flex: 0 0 auto; }
html.broadcast-mode .chart-toolbar .segmented { padding: 2px; }
html.broadcast-mode .chart-toolbar .segmented button { min-height: 26px; padding: 3px 8px; font-size: 10px; white-space: nowrap; }
html.broadcast-mode .comparison-insight { flex: 0 0 38px; min-height: 38px; gap: 10px; margin-bottom: 4px; padding: 5px 10px; border-radius: 5px; }
html.broadcast-mode .insight-main { font-size: 12px; }
html.broadcast-mode .insight-detail, html.broadcast-mode .insight-risk { font-size: 10px; }
html.broadcast-mode .edge-view { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; border-radius: 5px; }
html.broadcast-mode .edge-view.cluster-edge-active { overflow: hidden; }
html.broadcast-mode .edge-header { flex: 0 0 52px; min-height: 52px; padding-block: 6px; }
html.broadcast-mode .edge-hero { flex: 0 0 72px; min-height: 72px; }
html.broadcast-mode .edge-chart-shell { flex: 1 1 auto; height: auto; min-height: 280px; max-height: none; aspect-ratio: auto; }
html.broadcast-mode .edge-stat-card { min-height: 58px; padding-block: 7px; }
html.broadcast-mode .edge-supporting { flex: 0 0 auto; }
html.broadcast-mode .edge-panel { padding-block: 8px 9px; }
html.broadcast-mode .edge-event { min-height: 36px; }
html.broadcast-mode .chart-stage { flex: 1 1 auto; min-height: 320px; height: auto; }
html.broadcast-mode .methodology { display: none; }
html.broadcast-mode .credit { flex: 0 0 15px; padding-top: 2px; font-size: 9px; }

@media (min-width: 681px) {
  html.broadcast-mode .legend {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
    padding: 4px;
    overflow: hidden;
    background: rgba(2, 8, 14, .72);
  }
  html.broadcast-mode .legend-header { display: none; }
  html.broadcast-mode .legend-row,
  html.broadcast-mode .legend.spread-mode .legend-row {
    min-width: 0;
    min-height: 29px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px;
    padding: 3px 7px;
    border: 1px solid rgba(70, 112, 148, .2);
    border-radius: 6px;
    background: rgba(255, 255, 255, .018);
  }
  html.broadcast-mode .legend-identity { gap: 5px; }
  html.broadcast-mode .legend-toggle { min-width: 18px; min-height: 18px; border-radius: 5px; }
  html.broadcast-mode .legend-toggle-swatch { width: 8px; height: 8px; }
  html.broadcast-mode .legend-focus { padding: 2px 3px; }
  html.broadcast-mode .legend-focus::before { content: attr(data-broadcast-symbol); font-size: 11px; font-weight: 900; }
  html.broadcast-mode .legend-name strong,
  html.broadcast-mode .legend-name > span,
  html.broadcast-mode .legend-focus-cue,
  html.broadcast-mode .metric:not(.metric-period) { display: none; }
  html.broadcast-mode .metric-period { font-size: 12px; }

  html.broadcast-mode .cluster-lens {
    flex: 1 1 auto;
    width: 100%;
    height: 100%;
    min-height: 0;
    grid-template-columns: minmax(0, 1fr) clamp(286px, 18vw, 350px);
    grid-template-rows: 46px minmax(58px, auto) minmax(0, 1fr);
    grid-template-areas:
      "cluster-header cluster-header"
      "cluster-hero cluster-hero"
      "cluster-chart cluster-rail";
    overflow: hidden;
  }
  html.broadcast-mode .cluster-header {
    grid-area: cluster-header;
    min-height: 0;
    gap: 10px;
    padding: 5px 12px;
  }
  html.broadcast-mode .cluster-header > div:first-child {
    display: none;
  }
  html.broadcast-mode .cluster-header { justify-content: flex-end; }
  html.broadcast-mode .cluster-eyebrow { display: none; }
  html.broadcast-mode .cluster-title { overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
  html.broadcast-mode .cluster-context { overflow: hidden; margin: 0; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
  html.broadcast-mode .cluster-latest { min-height: 28px; padding: 4px 8px; }
  html.broadcast-mode .cluster-data-quality {
    position: absolute;
    top: 7px;
    right: 82px;
    z-index: 7;
    width: auto;
    margin: 0;
    background: rgba(8, 22, 36, .96);
  }
  html.broadcast-mode .cluster-data-quality > summary {
    min-height: 28px;
    display: flex;
    align-items: center;
    padding: 4px 8px;
    font-size: 10px;
    list-style: none;
  }
  html.broadcast-mode .cluster-data-quality > summary::-webkit-details-marker { display: none; }
  html.broadcast-mode .cluster-data-quality > summary::before { content: "ⓘ"; margin-right: 5px; color: #67e8f9; }
  html.broadcast-mode .cluster-data-quality[open] { width: min(620px, calc(100% - 110px)); }
  html.broadcast-mode .cluster-data-quality[open] .cluster-quality-content {
    max-height: min(56vh, 430px);
    overflow: auto;
    padding: 9px 10px 10px;
    border-top: 1px solid var(--line-soft);
    background: rgba(4, 13, 23, .98);
    box-shadow: 0 18px 48px rgba(0, 0, 0, .48);
  }
  html.broadcast-mode .cluster-hero {
    grid-area: cluster-hero;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  html.broadcast-mode .cluster-hero-card {
    min-height: 0;
    align-content: center;
    gap: 1px;
    padding: 5px 11px;
  }
  html.broadcast-mode .cluster-hero-label { font-size: 9px; }
  html.broadcast-mode .cluster-hero-value,
  html.broadcast-mode .cluster-hero-cluster .cluster-hero-value { font-size: clamp(16px, 1.25vw, 21px); }
  html.broadcast-mode .cluster-hero-meta { font-size: 9px; line-height: 1.2; }
  html.broadcast-mode .cluster-insight { display: none; }
  html.broadcast-mode .cluster-chart-panel {
    grid-area: cluster-chart;
    min-height: 0;
    display: grid;
    grid-template-rows: 36px minmax(0, 1fr);
    border-right: 1px solid var(--line-soft);
    border-bottom: 0;
  }
  html.broadcast-mode .cluster-panel-heading { min-height: 0; padding: 4px 10px; }
  html.broadcast-mode .cluster-panel-heading p { margin-top: 1px; font-size: 9px; }
  html.broadcast-mode .cluster-filter-button { min-height: 27px; padding: 3px 8px; font-size: 10px; }
  html.broadcast-mode .cluster-chart-shell { height: 100%; min-height: 260px; }
  html.broadcast-mode .cluster-chart { height: 100%; min-height: 260px; }
  html.broadcast-mode .cluster-panels {
    grid-area: cluster-rail;
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    align-content: start;
    overflow: hidden;
    border-bottom: 0;
  }
  html.broadcast-mode .cluster-panel { padding: 7px 9px; }
  html.broadcast-mode .cluster-panel + .cluster-panel { border-top: 1px solid var(--line-soft); border-left: 0; }
  html.broadcast-mode .cluster-ranking-panel { min-height: 0; display: flex; flex-direction: column; }
  html.broadcast-mode .cluster-ranking-list { min-height: 0; gap: 2px; margin-top: 5px; overflow: hidden; }
  html.broadcast-mode .cluster-ranking-row {
    min-height: 29px;
    grid-template-columns: 16px 7px minmax(0, 1fr) auto minmax(72px, auto);
    gap: 5px;
    padding: 3px 5px;
  }
  html.broadcast-mode .cluster-rank-number,
  html.broadcast-mode .cluster-ranking-row > strong,
  html.broadcast-mode .cluster-ranking-row > span:last-child { font-size: 10px; }
  html.broadcast-mode .cluster-rank-identity { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; gap: 1px; }
  html.broadcast-mode .cluster-rank-ticker,
  html.broadcast-mode .cluster-rank-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  html.broadcast-mode .cluster-rank-name { display: block; color: var(--muted); font-size: 9px; }
  html.broadcast-mode .cluster-breadth-panel { gap: 4px; }
  html.broadcast-mode .cluster-breadth-summary { margin-top: 1px; font-size: 17px; }
  html.broadcast-mode .cluster-breadth-track { height: 8px; }
  html.broadcast-mode .cluster-dna-panel,
  html.broadcast-mode .cluster-cohesion-panel,
  html.broadcast-mode .cluster-method { display: none; }
}

@media (max-width: 1120px) {
  .controls { flex-wrap: wrap; }
  .stock-picker { flex-basis: 100%; }
  .comparison-insight { grid-template-columns: minmax(180px, auto) 1fr; }
  .insight-risk { grid-column: 1 / -1; justify-self: start; }
  .chart-toolbar { align-items: flex-start; }
  .chart-heading { display: block; }
  .chart-controls { flex-wrap: wrap; }
  .legend { overflow-x: auto; }
  .legend-header, .legend-row { min-width: 1040px; }
  .edge-supporting { grid-template-columns: 1fr; }
  .edge-panel + .edge-panel { border-top: 1px solid var(--line-soft); border-left: 0; }
  .cluster-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cluster-hero-cluster { grid-column: 1 / -1; border-right: 0; }
  .cluster-hero-card:nth-child(n+2) { border-top: 1px solid var(--line-soft); }
  .cluster-hero-card:nth-child(3) { border-right: 0; }
  .cluster-hero-card:last-child { grid-column: 1 / -1; }
  .cluster-panels { grid-template-columns: 1fr; }
  .cluster-panel + .cluster-panel { border-top: 1px solid var(--line-soft); border-left: 0; }
}

@media (min-width: 681px) and (max-width: 1120px) {
  html.broadcast-mode .comparison-insight {
    grid-template-columns: minmax(140px, auto) minmax(0, 1fr) auto;
  }
  html.broadcast-mode .comparison-insight > * { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  html.broadcast-mode .insight-risk { grid-column: auto; justify-self: end; }
  html.broadcast-mode .chart-toolbar { align-items: center; }
  html.broadcast-mode .chart-heading { display: flex; align-items: center; gap: 8px; }
  html.broadcast-mode .chart-heading h2 { flex: 0 0 auto; margin: 0; }
  html.broadcast-mode .chart-heading p { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  html.broadcast-mode .cluster-hero { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  html.broadcast-mode .cluster-hero-cluster { grid-column: auto; border-right: 1px solid var(--line-soft); }
  html.broadcast-mode .cluster-hero-card:nth-child(n+2) { border-top: 0; }
  html.broadcast-mode .cluster-hero-card:nth-child(3) { border-right: 1px solid var(--line-soft); }
  html.broadcast-mode .cluster-hero-card:last-child { grid-column: auto; }
}

@media (min-width: 681px) {
  .chart-tooltip { max-height: calc(100dvh - 20px); overflow-y: auto; }
  .controls.many-stocks { flex-wrap: wrap; }
  .controls.many-stocks .stock-picker { flex: 1 1 100%; }
  .controls.many-stocks .selected-stocks-shell { grid-column: 1 / -1; }
  .controls.many-stocks .stock-chip-focus > span:not(.swatch) { display: none; }
  .controls.many-stocks > .stock-picker + .control-group { margin-left: auto; }
}

@media (min-width: 1121px) {
  .app-header { min-height: 48px; padding-block: 4px 3px; }
  .heading-divider { height: 26px; }
  .eyebrow { margin-bottom: 0; font-size: 9px; }
  h1 { font-size: clamp(19px, 1.3vw, 24px); }
  .page-subtitle { margin-top: 0; font-size: 10px; }
  .controls { gap: 9px; padding-block: 3px 4px; }
  .stock-picker { grid-template-columns: auto minmax(220px, 1fr) auto minmax(180px, .9fr); gap: 6px; }
  .market-field label, .control-label { font-size: 10px; }
  .control-group { gap: 4px; }
  .controls.many-stocks { flex-wrap: nowrap; }
  .controls.many-stocks .stock-picker { flex: 1 1 620px; grid-template-columns: auto minmax(190px, 1fr) auto minmax(220px, 1fr); }
  .controls.many-stocks .selected-stocks-shell { grid-column: auto; }
  .controls.many-stocks > .stock-picker + .control-group { margin-left: 0; }
}

@media (min-width: 681px) and (max-width: 820px) {
  .stock-picker { grid-template-columns: auto minmax(190px, 1fr) auto; }
  .selected-stocks-shell { grid-column: 1 / -1; }
  .stock-chip-focus > span:not(.swatch) { display: none; }
  .cluster-label-rail { display: none; }
  .legend { overflow: visible; padding: 7px; background: rgba(2, 8, 14, .42); }
  .legend-header { display: none; }
  .legend-row {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 12px;
    margin-bottom: 7px;
    padding: 11px;
    border: 1px solid rgba(70, 112, 148, .32);
    border-radius: 9px;
    background: linear-gradient(145deg, rgba(13, 29, 48, .95), rgba(6, 16, 28, .94));
  }
  .legend-row:last-child { margin-bottom: 0; }
  .legend-identity { grid-column: 1 / -1; padding-bottom: 7px; border-bottom: 1px solid var(--line-soft); }
  .legend-toggle { min-width: 54px; padding: 0 7px; display: inline-flex; justify-content: center; gap: 5px; }
  .legend-toggle-label { display: inline; color: #d8e7f4; font-size: 10px; font-weight: 800; }
  .legend-name { flex: 1; }
  .legend-name strong, .legend-name span { white-space: normal; overflow-wrap: anywhere; }
  .metric { min-width: 0; display: grid; gap: 2px; white-space: normal; font-size: 12px; }
  .metric::before { content: attr(data-label); color: #7f98ae; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
  .metric-period, .metric-drawdown { padding: 7px 8px; border-radius: 7px; background: rgba(255, 255, 255, .035); font-size: 15px; }
  .metric-difference { grid-column: 1 / -1; }
  html.broadcast-mode .chart-heading #chart-context { display: none; }
  html.broadcast-mode .pane-controls > span:first-child { display: none; }
  html.broadcast-mode .pane-controls .segmented { padding: 2px; }
  html.broadcast-mode .pane-controls .segmented button { min-height: 26px; padding: 3px 7px; font-size: 10px; white-space: nowrap; }
  html.broadcast-mode .legend { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; padding: 4px; overflow: hidden; }
  html.broadcast-mode .legend-row,
  html.broadcast-mode .legend.spread-mode .legend-row {
    min-height: 29px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px;
    margin-bottom: 0;
    padding: 3px 7px;
    border-radius: 6px;
    background: rgba(255, 255, 255, .018);
  }
  html.broadcast-mode .legend-identity { grid-column: auto; gap: 5px; padding-bottom: 0; border-bottom: 0; }
  html.broadcast-mode .legend-toggle { min-width: 18px; padding: 0; display: inline-grid; }
  html.broadcast-mode .legend-toggle-label { display: none; }
  html.broadcast-mode .legend-name strong,
  html.broadcast-mode .legend-name span { white-space: nowrap; }
  html.broadcast-mode .metric { display: block; white-space: nowrap; }
  html.broadcast-mode .metric::before { content: none; }
  html.broadcast-mode .metric-period { padding: 0; background: transparent; font-size: 12px; }
}

@media (min-width: 821px) and (max-width: 1120px) {
  .controls.many-stocks .selected-stocks-shell { grid-column: auto; }
  .cluster-hero { grid-template-columns: minmax(240px, 1.5fr) repeat(3, minmax(0, 1fr)); }
  .cluster-hero-cluster { grid-column: auto; border-right: 1px solid var(--line-soft); }
  .cluster-hero-card:nth-child(n+2) { border-top: 0; }
  .cluster-hero-card:nth-child(3) { border-right: 1px solid var(--line-soft); }
  .cluster-hero-card:last-child { grid-column: auto; }
}

@media (max-width: 680px) {
  html, body { overflow-x: clip; }
  .app-header, .controls, .workspace { width: min(100% - 16px, 1880px); }
  .app-header { min-height: 54px; align-items: flex-start; gap: 8px; }
  .app-header .heading-group > div { display: block; }
  .heading-divider { display: none; }
  .home-link { display: none; }
  .header-actions { flex: 0 0 auto; flex-direction: row; align-items: center; gap: 5px; }
  h1 { font-size: 21px; }
  .page-subtitle { display: none; }
  .controls { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: end; gap: 6px; }
  .stock-picker { grid-column: 1 / -1; display: grid; grid-template-columns: 112px minmax(0, 1fr); width: 100%; }
  .market-field select { width: 100%; min-width: 0; }
  .search-wrap { min-width: 0; }
  .cluster-picker { grid-column: 1 / -1; justify-self: stretch; }
  .cluster-trigger { width: 100%; max-width: none; min-height: 40px; }
  .cluster-dialog { width: calc(100vw - 12px); height: calc(100dvh - 12px); border-radius: 13px; }
  .cluster-dialog-surface { gap: 9px; padding: 13px; }
  .cluster-dialog-header h2 { font-size: 20px; }
  .cluster-category-filters { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
  .cluster-category-filters::-webkit-scrollbar { display: none; }
  .cluster-category { flex: 0 0 auto; min-height: 40px; }
  .cluster-search { min-height: 44px; }
  .custom-cluster-toolbar { align-items: stretch; flex-direction: column; gap: 5px; }
  .custom-cluster-toolbar .button { width: 100%; min-height: 40px; }
  .custom-cluster-status { min-height: 16px; white-space: normal; }
  .custom-cluster-form { grid-template-columns: 1fr 1fr; }
  .custom-cluster-name-field,
  .custom-cluster-form-actions { grid-column: 1 / -1; }
  .custom-cluster-form-actions .button { flex: 1; min-height: 40px; }
  .cluster-options { grid-template-columns: 1fr; }
  .cluster-option { min-height: 132px; }
  .selected-stocks-shell { grid-column: 1 / -1; min-height: 40px; }
  .selected-stocks { min-height: 40px; padding: 3px; scroll-snap-type: x proximity; }
  .stock-chip { min-width: 0; max-width: 100%; }
  .stock-chip { scroll-snap-align: start; }
  .stock-chip-focus > span:not(.swatch) { display: none; }
  .stock-chip strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .control-group { min-width: 0; }
  .controls > .control-group .segmented button { padding-inline: 9px; }
  .view-options { grid-column: auto; justify-self: end; }
  .view-mode-control { align-self: end; }
  .view-options-panel { width: min(270px, calc(100vw - 20px)); }
  .workspace { padding-top: 7px; }
  .comparison-insight { min-height: 0; grid-template-columns: 1fr; gap: 3px; padding: 9px 11px; }
  .insight-main { font-size: 13px; }
  .insight-detail, .insight-risk { justify-self: start; font-size: 11px; }
  .chart-toolbar { min-height: 0; align-items: stretch; flex-direction: column; gap: 8px; padding: 9px 10px; }
  .chart-controls { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 152px); align-items: end; gap: 8px; }
  .pane-controls { min-width: 0; align-items: flex-start; flex-direction: column; gap: 4px; }
  .pane-controls .segmented button { padding-inline: 8px; font-size: 11px; }
  .reference-control { min-width: 0; align-items: flex-start; flex-direction: column; gap: 4px; }
  .reference-control select { width: 100%; max-width: none; }
  .chart-stage { min-height: 430px; height: 54svh; }
  .chart-card.has-empty-state .chart-stage { min-height: 290px; height: 38svh; }
  .chart-empty { padding: 16px; }
  .chart-empty-content { padding: 20px 16px; }
  .chart-tooltip-mobile { position: fixed; top: auto; right: auto; bottom: 12px; left: 50%; z-index: 120; width: min(320px, calc(100vw - 24px)); max-height: min(34svh, 260px); overflow-y: auto; transform: translateX(-50%); overscroll-behavior: contain; }
  .chart-tooltip-mobile .chart-tooltip-header { position: sticky; top: 0; z-index: 1; padding-block: 9px 8px; background: radial-gradient(circle at 12% 0, rgba(56, 189, 248, .18), transparent 55%), rgba(7, 21, 35, .98); }
  .chart-tooltip-mobile .chart-tooltip-list { padding-block: 4px 5px; }
  .chart-tooltip-mobile .chart-tooltip-row { min-height: 25px; padding-block: 2px; }
  .chart-tooltip-mobile .chart-tooltip-identity > span { display: none; }
  .edge-header { min-height: 54px; }
  .edge-context { max-width: 245px; }
  .edge-hero { min-height: 146px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 11px; }
  .edge-hero-center { grid-column: 1 / -1; grid-row: 1; padding-bottom: 7px; border-bottom: 1px solid var(--line-soft); }
  .edge-participant { grid-row: 2; }
  .edge-participant-symbol { font-size: 14px; }
  .edge-participant-name { display: none; }
  .edge-participant-value { font-size: 21px; }
  .edge-chart-shell { height: auto; min-height: 0; max-height: none; aspect-ratio: 48 / 43; }
  .edge-axis-label { font-size: 13px; }
  .edge-time-label { font-size: 12px; }
  .edge-zone-label { font-size: 11px; }
  .edge-tooltip { top: 10px; min-width: min(215px, calc(100% - 24px)); }
  .edge-statistics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .edge-stat-card { min-height: 66px; border-bottom: 1px solid var(--line-soft); }
  .edge-stat-card:nth-child(2) { border-right: 0; }
  .edge-event-list { grid-template-columns: 1fr; }
  .edge-h2h-header, .edge-h2h-row { grid-template-columns: minmax(75px, 1fr) minmax(100px, 1.15fr) minmax(75px, 1fr); }
  .cluster-header { align-items: flex-start; padding: 10px 11px; }
  .cluster-context { line-height: 1.45; }
  .cluster-header-actions { flex-direction: column; align-items: flex-end; }
  .cluster-hero { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cluster-hero-card { min-height: 64px; padding: 8px; border-top: 1px solid var(--line-soft); }
  .cluster-hero-card:nth-child(1) { grid-column: 1 / -1; border-top: 0; border-right: 0; }
  .cluster-hero-card:nth-child(3) { border-right: 1px solid var(--line-soft); }
  .cluster-hero-card:last-child { grid-column: auto; }
  .cluster-hero-label { font-size: 9px; }
  .cluster-hero-value { font-size: 16px; }
  .cluster-hero-meta { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
  .cluster-panel-heading { align-items: flex-start; flex-direction: column; }
  .cluster-focus-controls { width: 100%; }
  .cluster-filter-button { flex: 1; }
  .cluster-chart-shell { overflow: hidden; }
  .cluster-label-rail { display: none; }
  .cluster-tooltip { left: auto !important; right: 8px; max-width: calc(100% - 16px); transform: none; }
  .cluster-latest, .cluster-filter-button, .cluster-dna-cell, .cluster-dna-member { min-height: 40px; }
  .cluster-ranking-row { grid-template-columns: 20px 8px minmax(90px, 1fr) auto; }
  .cluster-ranking-row > span:last-child { grid-column: 3 / -1; }
  .cluster-cohesion-panel { align-items: flex-start; flex-direction: column; gap: 9px; }
  .cluster-method { grid-template-columns: 1fr; gap: 5px; }
  .legend { overflow: visible; padding: 7px; background: rgba(2, 8, 14, .42); }
  .legend-header { display: none; }
  .legend-row {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 12px;
    margin-bottom: 7px;
    padding: 11px;
    border: 1px solid rgba(70, 112, 148, .32);
    border-radius: 9px;
    background: linear-gradient(145deg, rgba(13, 29, 48, .95), rgba(6, 16, 28, .94));
  }
  .legend-row:last-child { margin-bottom: 0; }
  .legend-identity { grid-column: 1 / -1; padding-bottom: 7px; border-bottom: 1px solid var(--line-soft); }
  .legend-toggle { min-width: 54px; padding: 0 7px; display: inline-flex; justify-content: center; gap: 5px; }
  .legend-toggle-label { display: inline; color: #d8e7f4; font-size: 10px; font-weight: 800; }
  .legend-name { flex: 1; }
  .legend-name strong, .legend-name span { white-space: normal; overflow-wrap: anywhere; }
  .metric { min-width: 0; display: grid; gap: 2px; white-space: normal; font-size: 12px; }
  .metric::before { content: attr(data-label); color: #7f98ae; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
  .metric-period, .metric-drawdown { padding: 7px 8px; border-radius: 7px; background: rgba(255, 255, 255, .035); font-size: 15px; }
  .metric-difference { grid-column: 1 / -1; }
  .methodology > summary { min-height: 40px; }
  .credit { font-size: 9px; }
  html.broadcast-mode, html.broadcast-mode body { height: auto; overflow-y: auto; }
  html.broadcast-mode .workspace { height: auto; min-height: 100svh; }
  html.broadcast-mode .broadcast-heading { flex-basis: 62px; }
  html.broadcast-mode .broadcast-heading h1 { font-size: 24px; }
  html.broadcast-mode .comparison-insight { flex-basis: auto; }
  html.broadcast-mode .edge-view { display: block; }
  html.broadcast-mode .edge-hero { min-height: 138px; }
  html.broadcast-mode .edge-chart-shell { height: 52svh; min-height: 330px; }
  html.broadcast-mode .chart-stage { height: 58svh; min-height: 430px; }
  html.broadcast-mode .chart-card.has-empty-state .chart-stage { height: 52svh; min-height: 330px; }
  html.broadcast-mode .legend-header, html.broadcast-mode .legend-row { min-width: 0; }
}

@media (max-width: 359px) {
  body { min-width: 0; }
  .app-header { gap: 5px; }
  .app-header h1 { font-size: 19px; }
  .header-actions .button { min-height: 32px; padding: 5px 8px; font-size: 11px; }
  .language-link { min-width: 32px; padding: 6px; font-size: 11px; }
  .controls { grid-template-columns: minmax(0, 1fr) auto; }
  .view-options { grid-column: 2; }
  .cluster-header { align-items: center; gap: 6px; }
  .cluster-header .cluster-eyebrow,
  .cluster-context { display: none; }
  .cluster-header-actions { flex-direction: row; }
  .cluster-data-quality { margin: 6px 8px; }
  .cluster-hero-meta { display: none; }
  .cluster-insight { margin: 0; font-size: 10px; }
  .cluster-panel-heading { gap: 6px; padding: 6px 8px; }
  .cluster-panel-heading p { display: none; }
}

@media (min-width: 681px) and (max-height: 760px) {
  html.broadcast-mode .broadcast-heading { flex-basis: 44px; padding-block: 4px 3px; }
  html.broadcast-mode .broadcast-heading h1 { font-size: 21px; }
  html.broadcast-mode .edge-header { flex-basis: 45px; min-height: 45px; padding-block: 4px; }
  html.broadcast-mode .edge-eyebrow { margin-bottom: 0; }
  html.broadcast-mode .edge-hero { flex-basis: 62px; min-height: 62px; padding-block: 5px; }
  html.broadcast-mode .edge-chart-shell { min-height: 235px; }
  html.broadcast-mode .edge-stat-card { min-height: 50px; padding-block: 5px; }
  html.broadcast-mode .edge-panel { padding-block: 7px; }
  html.broadcast-mode .edge-panel h3 { margin-bottom: 6px; }
  html.broadcast-mode .edge-event { min-height: 32px; padding-block: 5px; }
  html.broadcast-mode .edge-h2h-row { min-height: 25px; }
  html.broadcast-mode .cluster-lens { grid-template-rows: 42px 52px minmax(0, 1fr); }
  html.broadcast-mode .cluster-chart-panel { grid-template-rows: 32px minmax(0, 1fr); }
  html.broadcast-mode .cluster-data-quality { top: 5px; }
  html.broadcast-mode .cluster-hero-meta { display: none; }
  html.broadcast-mode .cluster-ranking-row { min-height: 25px; }
  html.broadcast-mode .cluster-ranking-row > span:last-child { display: none; }
  html.broadcast-mode .cluster-ranking-row { grid-template-columns: 15px 7px minmax(0, 1fr) auto; }
  html.broadcast-mode .cluster-breadth-details { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html.broadcast-mode .control-shell { transition: none; }
  .cluster-member-line { transition: none; }
  .cluster-trigger-icon { transition: none; }
}