.marketing-body main[data-live-voo-showcase] > .marketing-container {
  width: min(1360px, calc(100% - 56px));
}
.live-landing-hero {
  padding-block: 38px 18px;
}
.live-hero-grid {
  display: block;
}
.live-hero-copy h1 {
  max-width: none;
}
.live-hero-copy > p:not(.micro-label) {
  max-width: none;
  margin: 22px 0 0;
  color: var(--text-2);
  font-size: 18px;
  line-height: 1.65;
}
.live-analysis-shell {
  --surface: var(--panel);
  --text-primary: var(--text);
  --text-secondary: var(--text-2);
  --muted: var(--text-2);
  --amber: var(--yellow);
  min-width: 0;
  padding: 20px;
  overflow: hidden;
}
.live-analysis-shell #ticker-chart {
  /* Keep the live chart on the shared warm light product palette without changing
     the surrounding marketing shell or its responsive layout. */
  --panel: #ffffff;
  --panel-2: #faf8f5;
  --border: #e7e3dd;
  --grid: #edeae5;
  --text: #211e1b;
  --text-2: #6a655f;
  --accent: #b8420c;
  --green: #137a4b;
  --red: #b42318;
  --blue: #2558d8;
  --violet: #6f43d6;
  --yellow: #8a6410;
  --amber: #8a6410;
}
.live-chart-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
}
.live-chart-heading h3 {
  margin: 0 0 5px;
  font-size: 18px;
  letter-spacing: -.02em;
}
.live-chart-heading p { margin: 0; }
.live-chart-heading .micro-label { flex: none; margin-top: 3px; }
.live-rule-label { margin-top: 22px; }
.live-legend-up { background: var(--green); }
.live-legend-down { background: var(--red); }
.status {
  display: none;
  margin: 10px 0;
  padding: 9px 11px;
  border: 1px solid transparent;
  border-radius: 9px;
  font-family: var(--mono);
  font-size: 11px;
}
.status.show { display: block; }
.status.ok { border-color: rgba(53,209,143,.28); background: rgba(53,209,143,.08); color: var(--green); }
.status.error { border-color: rgba(255,84,112,.32); background: rgba(255,84,112,.08); color: #ff91a3; }
.chart-toolbar { margin: 12px 0 10px; }
.chart-toolbar-row { width: 100%; }
.chart-date-row { margin-top: 2px; }
.chart-stage {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--panel-2);
}
.chart-svg {
  display: block;
  width: 100%;
  min-width: 780px;
  height: auto;
  aspect-ratio: 1200 / 720;
}
.chart-grid-line { stroke: var(--grid); stroke-width: 1; }
.chart-axis-label { fill: var(--text-2); font-family: var(--mono); font-size: 11px; font-variant-numeric: tabular-nums; }
.chart-projected-label { fill: var(--amber); font-family: var(--mono); font-size: 10px; }
.chart-projection-line { stroke: var(--border); stroke-width: 1; stroke-dasharray: 4 5; }
.ichimoku-cloud { stroke: none; }
.ichimoku-cloud-bull { fill: color-mix(in srgb, var(--green) 20%, transparent); }
.ichimoku-cloud-bear { fill: color-mix(in srgb, var(--red) 17%, transparent); }
.indicator-line { fill: none; stroke-width: 1.45; vector-effect: non-scaling-stroke; }
.span-a-line { stroke: var(--green); opacity: .82; }
.span-b-line { stroke: var(--red); opacity: .8; }
.tenkan-line { stroke: var(--blue); }
.kijun-line { stroke: var(--violet); }
.chikou-line { stroke: var(--amber); stroke-dasharray: 3 3; }
.sma20-line { stroke: var(--blue); }
.sma50-line { stroke: var(--amber); }
.sma200-line { stroke: var(--violet); stroke-width: 1.8; }
.candle-wick { stroke-width: 1; vector-effect: non-scaling-stroke; }
.candle-body { stroke-width: .8; vector-effect: non-scaling-stroke; }
.candle-up { fill: var(--green); stroke: var(--green); }
.candle-down { fill: var(--red); stroke: var(--red); }
.level-line { stroke-width: 1.15; stroke-dasharray: 6 4; vector-effect: non-scaling-stroke; }
.level-label { font-family: var(--mono); font-size: 10px; font-weight: 500; }
.level-support { stroke: var(--green); fill: var(--green); }
.level-resistance { stroke: var(--red); fill: var(--red); }
.level-entry { stroke: var(--accent); fill: var(--accent); stroke-dasharray: 3 4; }
.level-invalidation { stroke: var(--red); fill: var(--red); }
.level-target { stroke: var(--violet); fill: var(--violet); }
.current-price-line { stroke: var(--accent); stroke-width: 1.1; stroke-dasharray: 2 3; }
.current-price-label { fill: var(--accent); font-family: var(--mono); font-size: 10px; font-weight: 500; }
.volume-bar { opacity: .45; }
.volume-up { fill: var(--green); }
.volume-down { fill: var(--red); }
.chart-hit-area { fill: transparent; fill-opacity: 0; stroke: none; pointer-events: all; cursor: crosshair; }
.crosshair-line { stroke: var(--text-2); stroke-width: 1; stroke-dasharray: 3 3; pointer-events: none; }
.chart-crosshair[hidden] { display: none; }
.chart-readout {
  min-height: 38px;
  margin-top: 8px;
  padding: 9px 11px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--panel);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  line-height: 1.55;
}
.live-analysis-shell .chart-lower-workspace,
.live-analysis-shell .chart-momentum-workspace,
.live-analysis-shell .chart-volatility-workspace,
.live-analysis-shell .chart-avwap-workspace,
.live-analysis-shell .chart-structure-workspace {
  margin-top: 22px;
  padding-top: 22px;
  border-top: 1px solid var(--border);
}
.live-decision-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: 14px;
  margin-top: 14px;
}
.live-decision-card {
  min-width: 0;
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(30,24,52,.98), rgba(25,20,44,.98));
  box-shadow: var(--shadow);
}
.live-decision-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.live-decision-head h3 { margin: 0 0 5px; font-size: 21px; }
.live-decision-banner {
  margin: 18px 0;
  padding: 12px 14px;
  border-radius: 10px;
  background: rgba(255,194,71,.13);
  color: var(--yellow);
  font-weight: 750;
}
.live-decision-banner.buy { background: rgba(53,209,143,.12); color: var(--green); }
.live-decision-banner.sell,
.live-decision-banner.avoid { background: rgba(255,84,112,.12); color: var(--red); }
.live-decision-banner.hold { background: rgba(122,215,255,.11); color: var(--blue); }
.live-decision-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 20px;
}
.live-decision-metrics span,
.live-level-facts dt {
  display: block;
  margin-bottom: 5px;
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.live-decision-metrics strong,
.live-level-facts dd {
  margin: 0;
  color: var(--text);
  font-family: var(--mono);
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}
.live-rule-trace {
  margin: 20px 0 0;
  padding: 16px 0 0 18px;
  border-top: 1px solid var(--border);
  color: var(--text-2);
  line-height: 1.55;
}
.live-rule-trace li { margin-bottom: 7px; }
.live-level-group h4 { margin: 18px 0 5px; font-size: 14px; }
.live-level-list { margin: 0; padding: 0; list-style: none; }
.live-level-list li {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid var(--border);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 12px;
}
.live-level-list li strong { color: var(--text); }
.live-level-facts {
  display: grid;
  gap: 11px;
  margin: 20px 0 0;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}
.live-level-facts > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
}
.live-level-facts dt { margin: 0; text-transform: none; letter-spacing: 0; font-family: var(--sans); font-size: 13px; }
.live-level-facts dd { text-align: right; font-size: 12px; }
.depth-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--border);
}
.depth-strip > div { padding: 18px; background: var(--panel); }
.depth-strip strong { display: block; margin-bottom: 5px; font-size: 13px; }
.depth-strip span { color: var(--text-2); font-size: 12px; line-height: 1.5; }

@media (max-width: 980px) {
  .live-decision-grid { grid-template-columns: 1fr; }
  .depth-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .marketing-body main[data-live-voo-showcase] > .marketing-container { width: calc(100% - 30px); }
  .live-landing-hero { padding-block: 34px 16px; }
  .live-hero-copy > p:not(.micro-label) { font-size: 16px; }
  .live-analysis-shell { padding: 14px; border-radius: 12px; }
  .live-chart-heading { flex-direction: column; gap: 7px; }
  .chart-stage { margin-inline: -6px; border-radius: 9px; }
  .chart-svg { min-width: 720px; }
  .live-decision-card { padding: 18px; }
  .live-decision-metrics,
  .depth-strip { grid-template-columns: 1fr; }
  .live-level-facts > div { align-items: flex-start; flex-direction: column; gap: 4px; }
  .live-level-facts dd { text-align: left; }
}