/* EquiSense — Overview Deep-Dive Tab Styles */

/* ─── Deep Dive Landing — Ive-inspired: radical simplicity ─────────── */
.dd-landing {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.dd-landing-hero {
  text-align: center;
  padding: 32px 24px 0;
  max-width: 520px;
  width: 100%;
}

.dd-landing-logo {
  margin-bottom: 20px;
  opacity: 0.9;
}

.dd-landing-title {
  font-size: 32px;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 10px;
  font-family: var(--font-heading);
  letter-spacing: -0.025em;
}

.dd-landing-subtitle {
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-tertiary);
  margin: 0 auto 32px;
  letter-spacing: -0.006em;
}

/* Popular company chips */
.dd-landing-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 8px;
}

.dd-landing-chip {
  padding: 8px 16px;
  border-radius: 20px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--accent);
  font-size: 12px;
  font-weight: 600;
  font-family: var(--font-mono, monospace);
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: all 0.15s ease;
  -webkit-user-select: none;
  user-select: none;
}

.dd-landing-chip:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: var(--accent-tint);
}

.dd-landing-chip:active {
  transform: scale(0.96);
}

/* ── Feature Cards ────────────────────────────────────────────────────── */
.dd-feat-strip {
  display: flex;
  gap: 1px;
  margin-top: 48px;
  width: 100%;
  max-width: 900px;
  background: var(--border);
  border-radius: 16px;
  overflow: hidden;
}

.dd-feat-card {
  flex: 1;
  min-width: 0;
  padding: 28px 20px;
  background: var(--card-bg);
  display: flex;
  flex-direction: column;
}

.dd-feat-icon {
  color: var(--accent);
  margin-bottom: 14px;
  line-height: 0;
}
.dd-feat-icon svg { display: block; }

.dd-feat-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 8px;
  letter-spacing: -0.01em;
}

.dd-feat-desc {
  font-size: 11.5px;
  line-height: 1.55;
  color: var(--text-tertiary);
  margin: 0;
}

/* Responsive — tablet: 3+2 wrap */
@media (max-width: 768px) {
  .dd-feat-strip {
    flex-wrap: wrap;
    max-width: 600px;
  }
  .dd-feat-card {
    flex: 1 1 calc(50% - 1px);
    min-width: calc(50% - 1px);
  }
}

/* Responsive — mobile: vertical stack */
@media (max-width: 480px) {
  .dd-landing-title { font-size: 26px; }
  .dd-landing-subtitle { font-size: 14px; }
  .dd-landing-chip { padding: 7px 14px; font-size: 12px; }

  .dd-feat-strip {
    flex-direction: column;
    margin-top: 32px;
    max-width: none;
    border-radius: 14px;
  }

  .dd-feat-card {
    flex-direction: row;
    align-items: flex-start;
    gap: 14px;
    padding: 18px 16px;
  }

  .dd-feat-icon {
    margin-bottom: 0;
    flex-shrink: 0;
    margin-top: 1px;
  }

  .dd-feat-title { margin-bottom: 4px; }
  .dd-feat-desc { font-size: 11px; }
}

/* ─── Overview: Research Note with Subtle Surface Hierarchy ────────── */
/*
 * Sections use quiet surface tints for containment. No harsh borders.
 * Hierarchy through spacing + surface color + heading weight.
 * Dense like a terminal, precise like Bloomberg, readable like Koyfin.
 */
.ov-sections {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Uniform card surface — matches Kavach/WTT */
.ov-sections > .card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px 24px;
  animation: none;
}

/* Section headings — matches Kavach 12px/0.06em + border-bottom separator */
.ov-sections > .card > .card-title,
.ov-sections .card-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
  margin: 0 0 16px;
  padding: 0 0 10px;
  border-bottom: 1px solid var(--tint-5);
}

/* ── Section: EquiSense Signals (compact inline layout) ── */
.ov-signals-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ov-sig-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: var(--tint-2);
  border-radius: 8px;
  border: 1px solid var(--tint-4);
  transition: border-color 0.15s, background 0.15s;
}
.ov-sig-item:hover {
  border-color: var(--tint-8);
  background: var(--tint-3);
}
.ov-signal-clickable {
  cursor: pointer;
}
.ov-sig-label {
  font-size: 10px;
  font-weight: 700;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  white-space: nowrap;
}
.ov-sig-val {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

/* ── Section: Core Business ── */
/* Identity card — no special border in wiki style */
.ov-core-biz {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ov-core-biz-text {
  font-size: 14px;
  line-height: 1.7;
  color: var(--text-secondary);
}
.ov-trait-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.ov-trait-badge {
  font-size: 12px;
  font-weight: 600;
}
.ov-trait-sep {
  color: var(--text-tertiary);
  font-size: 10px;
}
.ov-niche-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.ov-niche-tag {
  font-size: 11px;
  font-weight: 500;
  padding: 2px 8px;
  border-radius: 10px;
  background: var(--tint-5);
  color: var(--text-secondary);
}

/* ── Key Thesis (bull/bear) ── */
/* Investment Case — no special border in wiki style */
.ov-thesis {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ov-thesis-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.ov-thesis-cols.ov-thesis-single {
  grid-template-columns: 1fr;
}
.ov-thesis-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 8px;
}
.ov-thesis-bull .ov-thesis-label {
  color: var(--green);
}
.ov-thesis-bear .ov-thesis-label {
  color: var(--red);
}
.ov-thesis-item {
  font-size: 14px;
  line-height: 1.7;
  color: var(--text-secondary);
  padding-left: 12px;
  position: relative;
  margin-bottom: 4px;
}
.ov-thesis-item::before {
  content: '\2022';
  position: absolute;
  left: 0;
  color: var(--text-tertiary);
}

/* ── Supply Chain Compact View ── */
.ov-sc-themes {
  display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 10px;
}
.ov-sc-theme {
  font-size: 12px; font-weight: 600; padding: 5px 12px;
  border-radius: 6px; cursor: pointer;
  background: var(--tint-4); color: var(--text-secondary);
  transition: all 0.15s; border: 1px solid transparent;
}
.ov-sc-theme:hover { background: var(--tint-6); }
.ov-sc-theme.selected {
  background: var(--accent-tint); color: var(--accent);
  border-color: var(--accent);
}
.ov-sc-theme-lvl {
  font-size: 10px; font-weight: 500; opacity: 0.7;
}

/* Metro line */
/* ── Interactive Metro Line ── */
/* ═══════════════════════════════════════════════════════════════════════════
   Metro Line — Jony Ive redesign: radical simplicity, precision, breathing
   ═══════════════════════════════════════════════════════════════════════════ */
.ov-sc-metro {
  display: flex; align-items: flex-start; padding: 20px 0 8px;
  gap: 0; width: 100%;
  outline: none;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.ov-sc-metro::-webkit-scrollbar { display: none; }

/* Node — generous touch target, quiet by default */
.ov-sc-node {
  display: flex; flex-direction: column; align-items: center;
  min-width: 64px; flex-shrink: 0;
  cursor: pointer; transition: opacity 0.2s;
}
.ov-sc-node:hover { opacity: 0.85; }

/* Dot — clean circles, no competing borders */
.ov-sc-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--tint-10);
  flex-shrink: 0; transition: all 0.25s ease;
}
.ov-sc-dot.active {
  width: 14px; height: 14px;
  background: var(--blue);
  margin: -2px 0;
}
.ov-sc-dot.bottleneck {
  width: 12px; height: 12px;
  background: var(--red);
  margin: -1px 0;
}
/* Selected — single ring, no glow chaos */
.ov-sc-dot.selected {
  box-shadow: 0 0 0 3px var(--tint-6);
}
.ov-sc-dot.active.selected {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent);
}
.ov-sc-dot.bottleneck.selected {
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.2);
}

/* Line — thin, understated */
.ov-sc-line-wrap {
  flex: 1; min-width: 16px;
  display: flex; flex-direction: column; align-items: center;
  margin-top: 4px; position: relative;
}
.ov-sc-line {
  height: 1.5px; width: 100%; background: var(--tint-6);
  transition: background 0.2s;
}
.ov-sc-line-wrap.is-active .ov-sc-line {
  background: color-mix(in srgb, var(--accent) 40%, transparent);
}

/* Label — clean, readable */
.ov-sc-node-label {
  font-size: 11px; font-weight: 500; color: var(--text-tertiary);
  margin-top: 8px; text-align: center; max-width: 110px;
  line-height: 1.35; word-wrap: break-word;
  transition: color 0.2s, font-weight 0.2s;
}
.ov-sc-node-label.active {
  color: var(--text-primary); font-weight: 700;
}
.ov-sc-node-label.selected {
  color: var(--text-primary); font-weight: 600;
}
.ov-sc-node-label.bottleneck {
  color: var(--text-tertiary); font-weight: 500;
}

/* Signal badges — legible, not shouting */
.ov-sc-sig {
  display: block;
  font-size: 9px;
  font-weight: 600;
  margin-top: 4px;
  padding: 2px 6px;
  border-radius: 4px;
  white-space: nowrap;
  letter-spacing: 0.01em;
}
.ov-sc-sig-growth { color: var(--green); background: rgba(16, 185, 129, 0.08); }
.ov-sc-sig-bn { color: var(--red); background: rgba(239, 68, 68, 0.08); }
.ov-sc-sig-margin { color: var(--blue); background: rgba(59, 130, 246, 0.08); }
.ov-sc-sig-import { color: var(--amber); background: rgba(245, 158, 11, 0.08); }
.ov-sc-sig-emerging { color: #8b5cf6; background: rgba(139, 92, 246, 0.08); }
.ov-sc-sig-commodity { color: var(--text-tertiary); background: var(--tint-3); }
.ov-sc-sig-consolidating { color: var(--text-secondary); background: var(--tint-4); }

/* Company star — quiet, not competing with the dot */
.ov-sc-you {
  display: block;
  font-size: 9px; font-weight: 600;
  color: var(--accent);
  letter-spacing: 0.02em;
  margin-top: 2px;
  opacity: 0.7;
}

/* ── Layer Detail Strip — connected to selected node via spatial proximity ── */
.ov-vc-strip {
  padding: 16px 20px 14px;
  margin: 4px 0 0;
  border-radius: 10px;
  background: var(--tint-2);
  border: 1px solid var(--tint-4);
  animation: stripFadeIn 0.2s ease-out;
  transition: border-color 0.2s;
}
.ov-vc-strip.accent-active {
  border-color: color-mix(in srgb, var(--accent) 20%, var(--tint-4));
}
.ov-vc-strip.accent-bn {
  border-color: color-mix(in srgb, var(--red) 20%, var(--tint-4));
}
@keyframes stripFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ── Compact popover for non-company layers ── */
.ov-vc-popover {
  padding: 12px 16px;
  margin: 4px 0 0;
  border-radius: 10px;
  background: var(--tint-2);
  border: 1px solid var(--tint-4);
  animation: stripFadeIn 0.15s ease-out;
}
.ov-vc-popover.ov-vc-pop-bn {
  border-color: color-mix(in srgb, var(--red) 15%, var(--tint-4));
}
.ov-vc-pop-name {
  font-size: 14px; font-weight: 700;
  color: var(--text-primary);
  margin-right: 8px;
}
.ov-vc-pop-context {
  font-size: 14px; line-height: 1.6;
  color: var(--text-secondary);
  margin: 6px 0 0;
}
.ov-vc-pop-footer {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin-top: 6px;
  font-size: 12px; color: var(--text-tertiary);
}
.ov-vc-pop-meta { font-weight: 500; }
.ov-vc-pop-chips {
  display: flex; gap: 4px; flex-wrap: wrap;
}

/* Header */
.ov-vc-strip-hdr {
  display: flex; align-items: baseline; gap: 8px;
  flex-wrap: wrap; margin-bottom: 10px;
}
.ov-vc-strip-name {
  font-size: 14px; font-weight: 700;
  color: var(--text-primary); line-height: 1.2;
  letter-spacing: -0.01em;
}

/* India insight — the alpha (primary content) */
.ov-vc-strip-narrative {
  font-size: 14px; color: var(--text-secondary);
  line-height: 1.7; margin: 0 0 10px;
}
/* Demand driver — chain linkage (secondary) */
.ov-vc-strip-driver {
  font-size: 12px; color: var(--text-tertiary);
  line-height: 1.5; margin: 0 0 8px;
}
/* Growth + competitive meta */
.ov-vc-strip-meta {
  font-size: 12px; color: var(--text-secondary);
  margin-bottom: 8px;
  display: flex; align-items: center; gap: 4px; flex-wrap: wrap;
}
.ov-vc-meta-label {
  font-size: 10px; font-weight: 700; color: var(--text-tertiary);
  text-transform: uppercase; letter-spacing: 0.04em;
}
.ov-vc-meta-sep {
  color: var(--tint-10); margin: 0 6px;
}
.ov-vc-strip-link {
  font-weight: 700; color: var(--accent);
  cursor: pointer; transition: opacity 0.15s;
}
.ov-vc-strip-link:hover { opacity: 0.75; text-decoration: underline; }

/* Company chips */
.ov-vc-strip-chips {
  display: flex; flex-wrap: wrap; gap: 4px;
}

/* ── Ecosystem: Revenue Bar + Risk Tags (inside VC card) ── */
.ov-eco-level {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 1px 6px;
  border-radius: 4px;
  margin-left: 6px;
  vertical-align: middle;
}
.ov-eco-level-major { color: var(--accent); background: var(--accent-tint); }
.ov-eco-level-moderate { color: var(--amber); background: rgba(245, 158, 11, 0.12); }
.ov-eco-level-minor { color: var(--text-tertiary); background: var(--tint-4); }

.ov-eco-revenue, .ov-eco-risks {
  margin-top: 24px;
}
.ov-eco-sub-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
  display: block;
  margin-bottom: 6px;
}
.ov-eco-bar {
  display: flex;
  height: 6px;
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 6px;
}
.ov-eco-bar-seg {
  min-width: 4px;
  transition: opacity 0.15s;
}
.ov-eco-bar-seg:hover { opacity: 0.8; }
.ov-eco-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
}
.ov-eco-legend-item {
  font-size: 11px;
  font-weight: 500;
  color: var(--text-secondary);
  display: flex;
  align-items: center;
  gap: 4px;
}
.ov-eco-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}
.ov-eco-trend-up { color: var(--green); font-size: 9px; }
.ov-eco-trend-down { color: var(--red); font-size: 9px; }

/* Compact Exposure (fallback when no VC) */
.ov-exposure-compact {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ov-exp-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ov-exp-tag {
  font-size: 11px;
  font-weight: 500;
  padding: 3px 10px;
  border-radius: 12px;
  background: var(--tint-4);
  color: var(--text-secondary);
  cursor: default;
  white-space: nowrap;
}
.ov-exp-tag-cat {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-tertiary);
  margin-right: 3px;
}

/* ── Exposure Profile — tailwinds vs risks (two-column) ── */
.ov-risk-profile {
  margin-top: 0;
}
.ov-risk-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.ov-risk-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  line-height: 1.4;
  padding: 5px 12px;
  border-radius: 20px;
  cursor: help;
  white-space: nowrap;
}
.ov-risk-chip-pos {
  background: rgba(16, 185, 129, 0.1);
  color: var(--green);
  border: 1px solid rgba(16, 185, 129, 0.2);
}
.ov-risk-chip-neg {
  background: rgba(239, 68, 68, 0.06);
  color: var(--text-secondary);
  border: 1px solid rgba(239, 68, 68, 0.15);
}

/* Bull / Bear cases */
.ov-bull-bear {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ov-bb-item {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 14px;
  line-height: 1.7;
  color: var(--text-secondary);
}
.ov-bb-icon {
  flex-shrink: 0;
  font-size: 10px;
  margin-top: 4px;
}
.ov-bb-bull .ov-bb-icon { color: var(--green); }
.ov-bb-bear .ov-bb-icon { color: var(--red); }
.ov-bb-text {
  flex: 1;
  min-width: 0;
}

/* Moat line */
.ov-moat-line {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.7;
}
.ov-moat-label {
  font-weight: 700;
  color: var(--text-tertiary);
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: 0.06em;
  margin-right: 6px;
}

/* ── Section 2: Risk & Opportunity Flags ── */
.ov-flags-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 4px;
}
.ov-flags-col {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* ── Stock DNA / Market Metrics (shared) ── */
.ov-snap-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.ov-snap-stat {
  padding: 14px;
  background: var(--tint-2);
  border-radius: 8px;
  border: 1px solid var(--tint-5);
}
.ov-snap-label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 6px;
}
.ov-snap-value {
  display: block;
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
  line-height: 1.1;
  letter-spacing: -0.01em;
  font-family: var(--font-data);
}
.ov-snap-sub {
  display: block;
  font-size: 10px;
  color: var(--text-tertiary);
  margin-top: 3px;
}

/* ── Last Results / PEAD ── */
.ov-pead-reason {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.7;
  margin-bottom: 12px;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  cursor: pointer;
  position: relative;
}
.ov-pead-reason:not(.expanded)::after {
  content: '... Read more';
  position: absolute;
  bottom: 0;
  right: 0;
  background: linear-gradient(90deg, transparent, var(--bg-card) 30%);
  padding-left: 40px;
  color: var(--accent);
  font-size: 12px;
}
.ov-pead-reason.expanded {
  -webkit-line-clamp: unset;
  overflow: visible;
  cursor: default;
}
.ov-pead-reason.expanded::after { display: none; }
.ov-pead-metrics {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 10px 14px;
  background: var(--tint-2);
  border-radius: 8px;
  border: 1px solid var(--tint-5);
  margin-bottom: 10px;
}
.ov-pead-metric-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
}
.ov-pead-sep {
  width: 1px;
  align-self: stretch;
  background: var(--tint-8);
}

/* Delivery hint */
.ov-delivery-hint {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
  padding: 6px 10px;
  border-radius: 6px;
  background: var(--tint-2);
  font-size: 11px;
  font-weight: 600;
}
.ov-delivery-val {
  font-size: 11px;
  color: var(--text-tertiary);
  font-family: var(--font-data);
}

/* ── Shareholding History Table (inside Smart Money section) ── */
.ov-sh-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0 -4px;
  padding: 0 4px;
}
/* Right-edge fade affordance when table overflows */
.ov-smart-money-section {
  overflow: hidden;
  position: relative;
}
.ov-smart-money-section::after {
  content: '';
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: 32px;
  background: linear-gradient(to left, var(--card-bg), transparent);
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  transition: opacity 0.2s;
}
.ov-smart-money-section.has-scroll::after {
  opacity: 1;
}
.ov-sh-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  white-space: nowrap;
}
.ov-sh-table thead th {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-tertiary);
  padding: 6px 10px;
  text-align: right;
  border-bottom: 1px solid var(--tint-5);
}
.ov-sh-label-col {
  text-align: left !important;
  font-weight: 600;
  color: var(--text-secondary);
  padding: 8px 12px 8px 0;
  min-width: 80px;
  font-size: 12px;
}
.ov-sh-q-col {
  min-width: 72px;
}
.ov-sh-table tbody td {
  padding: 6px 10px;
  text-align: right;
  color: var(--text-primary);
  border-bottom: 1px solid var(--tint-3);
}
.ov-sh-table tbody tr:last-child td {
  border-bottom: none;
}
.ov-sh-val.ov-sh-up {
  color: var(--green);
}
.ov-sh-val.ov-sh-down {
  color: var(--red);
}

/* ─── Ownership: visual bar ──────────────────────────────────── */
.ov-sh-bar {
  display: flex;
  height: 32px;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 14px;
  gap: 1px;
}
.ov-sh-bar-seg {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.95);
  overflow: hidden;
  white-space: nowrap;
  letter-spacing: 0.01em;
  transition: opacity 0.15s;
}
.ov-sh-bar-seg:hover { opacity: 0.85; }
.ov-sh-seg-promoter { background: #6366f1; }
.ov-sh-seg-fii { background: #f59e0b; }
.ov-sh-seg-dii { background: #3b82f6; }
.ov-sh-seg-retail { background: #10b981; }
.ov-sh-seg-others { background: #94a3b8; }

/* Category rows — bold, clickable, visually primary */
.ov-sh-cat-tr td {
  font-weight: 700;
  color: var(--text-primary);
  border-bottom: 1px solid var(--tint-4);
}
.ov-sh-cat-tr.ov-sh-clickable {
  cursor: pointer;
}
.ov-sh-cat-tr.ov-sh-clickable:hover td {
  background: var(--tint-2);
}
.ov-sh-arrow {
  font-size: 11px;
  color: var(--text-tertiary);
  display: inline-block;
  transition: transform 0.15s;
  margin-left: 2px;
}
.ov-sh-cat-tr.ov-sh-open .ov-sh-arrow {
  transform: rotate(90deg);
}

/* Holder sub-rows — lighter, indented, visually subordinate */
.ov-sh-holder-tbody {
  display: none;
}
.ov-sh-holder-tbody.ov-sh-expanded {
  display: table-row-group;
}
.ov-sh-holder-tr td {
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 400;
  color: var(--text-secondary);
  border-bottom: 1px solid var(--tint-2);
}
.ov-sh-holder-label {
  padding-left: 20px !important;
  text-align: left !important;
  color: var(--text-secondary);
  font-weight: 400;
  white-space: nowrap;
}
.ov-sh-holder-val {
  text-align: right;
  color: var(--text-tertiary);
}
.ov-sh-hint {
  color: var(--text-tertiary);
  font-weight: 400;
  font-size: 11px;
}
.ov-sh-info-hover {
  padding: 4px 10px !important;
  position: relative;
}
.ov-sh-info-icon {
  font-size: 12px;
  color: var(--text-tertiary);
  cursor: help;
  opacity: 0.5;
}
.ov-sh-info-tooltip {
  display: none;
  position: absolute;
  bottom: 100%;
  left: 10px;
  background: var(--bg-elevated, #1e293b);
  color: var(--text-secondary);
  font-size: 11px;
  padding: 6px 10px;
  border-radius: 4px;
  border: 1px solid var(--border);
  white-space: nowrap;
  z-index: 10;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}
.ov-sh-info-icon:hover + .ov-sh-info-tooltip,
.ov-sh-info-icon:focus + .ov-sh-info-tooltip {
  display: block;
}
.ov-sh-cat-badge {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-secondary);
  background: var(--tint-5);
  padding: 2px 5px;
  border-radius: 3px;
  margin-left: 6px;
  vertical-align: middle;
  flex-shrink: 0;
}

.ov-sh-total-shares {
  font-size: 11px;
  color: var(--text-tertiary);
  padding: 6px 0 0;
  font-family: var(--font-data, var(--font-mono, monospace));
}
/* 52W range bar */
.ov-52w-track {
  position: relative;
  height: 6px;
  background: var(--tint-6);
  border-radius: 3px;
  margin: 8px 0 4px;
}
.ov-52w-dot {
  position: absolute;
  top: -3px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--accent);
  border: 2px solid var(--card-bg);
  transform: translateX(-50%);
}
.ov-52w-labels {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: var(--text-tertiary);
  font-family: var(--font-data);
}

/* ── Section 5: Guidance ── */
.ov-promises-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}
.ov-promise-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 10px 14px;
  background: var(--tint-2);
  border-radius: 8px;
  border: 1px solid var(--tint-5);
}
.ov-promise-verdict {
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  min-width: 56px;
  padding-top: 2px;
}
.ov-promise-icon {
  flex-shrink: 0;
  width: 6px;
  height: 6px;
  margin-top: 7px;
  border-radius: 50%;
  background: var(--accent);
}
.ov-promise-text {
  font-size: 14px;
  font-weight: 400;
  color: var(--text-secondary);
  line-height: 1.7;
}
.ov-promise-tf {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-tertiary);
  white-space: nowrap;
  margin-left: auto;
  flex-shrink: 0;
  align-self: center;
}
.ov-mgmt-track {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 12px;
  padding: 8px 12px;
  background: var(--tint-2);
  border-radius: 6px;
}
.ov-mgmt-guidance {
  margin-bottom: 10px;
}
.ov-mgmt-guidance .kavach-prose {
  font-size: 14px;
  line-height: 1.7;
  color: var(--text-secondary);
}

/* ── Section 6: Growth Drivers & Key Risks ── */
.ov-catalysts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 4px;
}
.ov-catalysts-col {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ov-catalysts-heading {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 4px;
}
.ov-catalysts-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ov-catalyst-item {
  font-size: 14px;
  line-height: 1.7;
  color: var(--text-secondary);
  padding-left: 14px;
  position: relative;
}
.ov-catalyst-item::before {
  content: '\2022';
  position: absolute;
  left: 0;
  color: var(--text-tertiary);
}

/* "View full analysis" link */
.ov-tab-link {
  display: inline-block;
  margin-top: 14px;
  font-size: 12px;
  font-weight: 700;
  color: var(--accent);
  cursor: pointer;
  transition: opacity 0.15s, transform 0.15s;
}
.ov-tab-link:hover { opacity: 0.85; transform: translateX(2px); }

/* ── Section 7: Peer Comparison ── */

/* Star marker for target company */
.ov-pc-bars-star {
  color: var(--accent);
  font-size: 10px;
  margin-left: 5px;
}

/* Peer metrics table */
.ov-pc-table {
  margin: 16px 0;
  border: 1px solid var(--tint-5);
  border-radius: 8px;
  overflow: hidden;
}
.ov-vc-peer-label {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
  margin-top: 20px;
  margin-bottom: -8px;
}
/* ── Peer Comparison Table (upgraded) ── */
.ov-pc-wrap {
  margin-top: 24px;
}
.ov-pc-wrap .card-title {
  margin-bottom: 8px;
}
/* Chain insight — auto-generated "so what?" takeaway */
.ov-chain-insight {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-secondary);
  margin-top: 12px;
  padding: 10px 14px;
  background: var(--tint-3);
  border-radius: 8px;
  border: 1px solid var(--tint-5);
  line-height: 1.55;
}
.ov-pc-table {
  border: 1px solid var(--tint-6);
  border-radius: 8px;
  overflow: hidden;
}
.ov-pc-table-hdr {
  display: flex;
  align-items: center;
  padding: 10px 14px;
  background: var(--tint-3);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
  border-bottom: 1px solid var(--tint-5);
}
.ov-pc-table-row {
  display: flex;
  align-items: center;
  padding: 10px 14px;
  border-top: 1px solid var(--tint-5);
  font-size: 12px;
  color: var(--text-primary);
  cursor: pointer;
  transition: background 0.15s;
}
.ov-pc-table-row:hover {
  background: var(--tint-3);
}
.ov-pc-table-row.is-target {
  background: rgba(96, 165, 250, 0.06);
  font-weight: 700;
}
.ov-pc-table-row.is-target:hover {
  background: rgba(96, 165, 250, 0.1);
}
.ov-pc-table-cell {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ov-pc-table-name {
  flex: 2;
  font-weight: 600;
}
.ov-pc-table-val {
  text-align: right;
  font-family: var(--font-data);
}
.ov-pc-table-mcap {
  flex: 1.5;
  text-align: right;
}
.ov-pc-mcap-val {
  text-align: right; display: block;
}
.ov-pc-mcap-bar {
  height: 3px; width: 100%;
  background: var(--tint-4);
  border-radius: 2px;
  overflow: hidden;
}
.ov-pc-mcap-fill {
  height: 100%; border-radius: 2px;
  background: var(--text-tertiary);
  opacity: 0.3;
  transition: width 0.4s ease-out;
}
.ov-pc-mcap-fill.is-target {
  background: var(--blue);
}
.ov-pc-match-basis {
  font-size: 11px;
  color: var(--text-secondary);
  margin-bottom: 8px;
  letter-spacing: 0.3px;
}
.ov-peer-unlisted {
  font-size: 11px;
  color: var(--text-tertiary);
  margin-top: 10px;
  font-style: italic;
}

/* -- Section: Value Chain (Metro Line) -- */
.ov-vc {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ov-vc-theme {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-tertiary);
}
.ov-vc-themes {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.ov-vc-theme-chip {
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 14px;
  border: 1px solid var(--tint-10);
  color: var(--text-tertiary);
  cursor: pointer;
  transition: all 0.15s;
}
.ov-vc-theme-chip:hover {
  border-color: var(--accent);
  color: var(--text-primary);
}
.ov-vc-theme-chip.selected {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--card-bg);
}
/* Value chain opening narrative */
.ov-vc-narrative {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.7;
  margin-bottom: 4px;
}
.ov-vc-narrative strong {
  color: var(--text-primary);
  font-weight: 600;
}

/* Bottleneck callout */
.ov-vc-bottleneck {
  font-size: 12px;
  color: var(--text-secondary);
  line-height: 1.5;
  margin: 6px 0;
}
.ov-vc-bottleneck strong {
  color: var(--text-primary);
}
.ov-vc-bn-tag {
  font-size: 10px; font-weight: 700;
  color: var(--amber);
  background: rgba(245, 158, 11, 0.12);
  padding: 2px 6px; border-radius: 3px;
  margin-right: 2px;
}

/* Chain position column in peer table */
.ov-pc-table-chain {
  font-size: 10px !important;
  color: var(--text-tertiary) !important;
  max-width: 140px;
  white-space: normal !important;
  line-height: 1.3;
}

/* Multi-chain chips */
.ov-vc-chains {
  display: flex; gap: 6px; flex-wrap: wrap;
  margin: 4px 0 2px;
}
.ov-vc-chain-chip {
  font-size: 11px; font-weight: 600;
  padding: 4px 12px; border-radius: 6px;
  background: var(--tint-4); color: var(--text-tertiary);
  cursor: pointer; transition: all 0.2s ease;
  border: 1px solid transparent;
}
.ov-vc-chain-chip:hover { background: var(--tint-6); color: var(--text-secondary); border-color: var(--tint-8); }
.ov-vc-chain-chip.selected {
  background: var(--accent-tint); color: var(--accent);
  border-color: var(--accent);
}

/* Investment thesis */
.ov-vc-why {
  font-size: 12px;
  color: var(--text-tertiary);
  line-height: 1.55;
  font-style: italic;
  margin: 4px 0;
}

/* Layer signal badges */
.ov-vc-sig {
  font-size: 10px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 3px;
  white-space: nowrap;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}
.ov-vc-sig-high-growth { color: var(--green); background: rgba(16, 185, 129, 0.12); }
.ov-vc-sig-bottleneck { color: var(--red); background: rgba(239, 68, 68, 0.10); }
.ov-vc-sig-margin-expansion { color: var(--blue); background: rgba(59, 130, 246, 0.12); }
.ov-vc-sig-import-substitution { color: var(--amber); background: rgba(245, 158, 11, 0.12); }
.ov-vc-sig-commoditized { color: var(--text-tertiary); background: var(--tint-4); }
.ov-vc-sig-emerging { color: #8b5cf6; background: rgba(139, 92, 246, 0.12); }
.ov-vc-sig-consolidating { color: var(--text-secondary); background: var(--tint-5); }

/* ── Flow Timeline (Vertical Supply Chain) ── */
.ov-flow {
  margin: 12px 0 8px;
}

.ov-flow-step {
  display: flex;
  gap: 0;
  min-height: 40px;
}

/* Left rail: dot + vertical line */
.ov-flow-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 24px;
  flex-shrink: 0;
}
.ov-flow-dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--tint-8);
  border: 2.5px solid var(--tint-14);
  flex-shrink: 0;
  position: relative;
  z-index: 1;
  margin-top: 3px;
}
.ov-flow-dot.is-active {
  width: 16px;
  height: 16px;
  background: var(--accent);
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-tint);
  margin-top: 2px;
}
.ov-flow-dot.is-bottleneck {
  background: var(--red);
  border-color: var(--red);
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.15);
}
.ov-flow-line {
  width: 2px;
  flex: 1;
  background: var(--tint-8);
  min-height: 16px;
}

/* Right content */
.ov-flow-content {
  flex: 1;
  padding: 0 0 16px 10px;
  min-width: 0;
}

.ov-flow-title-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.ov-flow-name {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.3;
}
.ov-flow-here {
  color: var(--accent);
  font-size: 12px;
}

.ov-flow-desc {
  font-size: 12px;
  color: var(--text-secondary);
  line-height: 1.5;
  margin-top: 3px;
}

.ov-flow-meta {
  font-size: 11px;
  color: var(--text-tertiary);
  font-weight: 500;
  margin-top: 2px;
}

.ov-flow-india {
  font-size: 11px;
  color: var(--text-tertiary);
  font-style: italic;
  margin-top: 2px;
  line-height: 1.4;
}

.ov-flow-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 5px;
}
.ov-flow-chip {
  font-size: 11px;
  font-weight: 500;
  color: var(--text-secondary);
  background: var(--tint-4);
  padding: 2px 8px;
  border-radius: 3px;
  cursor: pointer;
  transition: all 0.15s;
}
.ov-flow-chip:hover {
  color: var(--accent);
  background: var(--accent-tint);
}
.ov-flow-chip.is-target {
  color: var(--accent);
  background: var(--accent-tint);
  font-weight: 700;
  cursor: default;
}
.ov-flow-more {
  color: var(--text-tertiary);
  cursor: default;
}

/* Demand driver label — sits between layers */
.ov-flow-driver {
  font-size: 10px;
  color: var(--text-tertiary);
  background: var(--tint-3);
  padding: 2px 8px;
  border-radius: 3px;
  margin-top: 6px;
  display: inline-block;
  line-height: 1.4;
  font-style: italic;
}

/* Last step: no bottom padding */
.ov-flow-step.is-last .ov-flow-content {
  padding-bottom: 4px;
}

.ov-vc-direction {
  display: flex;
  justify-content: space-between;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-tertiary);
  padding: 0 4px;
}
.ov-vc-track-wrap {
  overflow: hidden;
  padding: 12px 0 8px;
}
.ov-vc-track {
  display: flex;
  align-items: flex-start;
  position: relative;
  padding: 0 24px;
  gap: 4px;
}
.ov-vc-track::before {
  content: '';
  position: absolute;
  top: 11px;
  left: 24px;
  right: 24px;
  height: 3px;
  background: var(--tint-8);
  border-radius: 2px;
  z-index: 0;
}
.ov-vc-node {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  min-width: 100px;
  max-width: 160px;
  position: relative;
  z-index: 1;
  padding: 0 4px;
}
.ov-vc-dot {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--tint-6);
  border: 2.5px solid var(--tint-14);
  flex-shrink: 0;
  cursor: default;
  position: relative;
  transition: all 0.2s;
}
.ov-vc-dot.active {
  width: 22px;
  height: 22px;
  background: var(--accent);
  border-color: var(--accent);
  box-shadow: 0 0 0 4px var(--accent-tint), 0 2px 8px rgba(0,0,0,0.12);
  margin-top: -3px;
}
.ov-vc-label {
  font-size: 11px;
  font-weight: 500;
  color: var(--text-tertiary);
  margin-top: 10px;
  text-align: center;
  line-height: 1.35;
  max-width: 120px;
  word-wrap: break-word;
}
.ov-vc-dot.active + .ov-vc-label {
  color: var(--text-primary);
  font-weight: 700;
  font-size: 12px;
}
.ov-vc-companies {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  margin-top: 6px;
}
.ov-vc-company {
  font-size: 11px;
  font-weight: 500;
  color: var(--text-secondary);
  cursor: pointer;
  transition: color 0.15s;
  white-space: nowrap;
}
.ov-vc-company:hover {
  color: var(--accent);
}
.ov-vc-star {
  font-size: 11px;
  color: var(--accent);
  font-weight: 700;
}
.ov-vc-count {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-tertiary);
  margin-top: 8px;
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  border-radius: 50%;
  background: var(--tint-5);
  border: 1px solid var(--tint-8);
  cursor: default;
  position: relative;
}
.ov-vc-more {
  font-size: 10px;
  color: var(--text-tertiary);
  cursor: default;
  position: relative;
}
.ov-vc-tip-below {
  position: absolute;
  top: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--card-bg);
  border: 1px solid var(--tint-10);
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 11px;
  font-weight: 500;
  color: var(--text-secondary);
  line-height: 1.4;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s;
  z-index: 10;
}
.ov-vc-count:hover .ov-vc-tip-below,
.ov-vc-more:hover .ov-vc-tip-below {
  opacity: 1;
}
.ov-vc-desc-bar {
  font-size: 12px;
  color: var(--text-tertiary);
  line-height: 1.5;
  min-height: 20px;
  padding: 0 4px;
  opacity: 0;
  transition: opacity 0.2s;
}
.ov-vc-desc-bar.visible {
  opacity: 1;
}

/* ── Section: Exposure Profile ── */
.ov-exposure {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ov-exp-zone {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.ov-exp-divider {
  height: 1px;
  background: var(--tint-6);
  margin: 2px 0;
}
.ov-exp-sub {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ov-exp-sub-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
}

/* Stacked bar */
.ov-exp-bar {
  display: flex;
  height: 8px;
  border-radius: 4px;
  overflow: hidden;
  background: var(--tint-4);
}
.ov-exp-bar-seg {
  height: 100%;
  min-width: 2px;
}

/* Legend */
.ov-exp-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
}
.ov-exp-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  color: var(--text-secondary);
  cursor: default;
}
.ov-exp-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}
.ov-exp-legend-name {
  font-weight: 500;
}
.ov-exp-legend-pct {
  font-weight: 700;
  font-family: var(--font-data);
  color: var(--text-primary);
}
.ov-exp-trend {
  font-size: 9px;
  font-weight: 800;
  margin-left: -2px;
}
.ov-exp-trend-up { color: var(--green); }
.ov-exp-trend-down { color: var(--red); }
.ov-exp-trend-flat { color: var(--text-tertiary); }

/* Badges (commodity / currency / policy) */
.ov-exp-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ov-exp-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 8px;
  background: var(--tint-2);
  border: 1px solid var(--tint-6);
  cursor: default;
  transition: border-color 0.15s;
}
.ov-exp-badge:hover {
  border-color: var(--tint-10);
}
.ov-exp-badge-name {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-primary);
}
.ov-exp-badge-type {
  font-size: 10px;
  font-weight: 500;
  color: var(--text-tertiary);
}
.ov-exp-badge-level {
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 1px 5px;
  border-radius: 4px;
}
.ov-exp-lvl-major .ov-exp-badge-level {
  color: var(--red);
  background: rgba(239, 68, 68, 0.12);
}
.ov-exp-lvl-moderate .ov-exp-badge-level {
  color: var(--amber);
  background: rgba(245, 158, 11, 0.12);
}
.ov-exp-lvl-minor .ov-exp-badge-level {
  color: var(--text-tertiary);
  background: var(--tint-4);
}

/* ─── Overview Responsive: Tablet ──────────────────────────────────── */
@media (max-width: 768px) {
  .ov-snap-grid { grid-template-columns: repeat(2, 1fr); }
  .ov-sections > .card { padding: 16px 18px; }
  .ov-promise-item { gap: 8px; }
  .ov-catalysts { gap: 12px; }
  .ov-vc-node { min-width: 80px; max-width: 140px; }
  .ov-vc-label { font-size: 11px; max-width: 100px; }
  .ov-exp-legend { gap: 8px 12px; }
  .ov-thesis-cols { grid-template-columns: 1fr; gap: 12px; }
}

/* ─── Overview Responsive: Mobile ──────────────────────────────────── */
@media (max-width: 480px) {
  .ov-sections { gap: 12px; }
  .ov-sections > .card { padding: 16px; }
  .ov-snap-grid { grid-template-columns: 1fr; gap: 8px; }
  .ov-snap-stat { padding: 10px 12px; }
  .ov-snap-value { font-size: 14px; }
  .ov-promise-item { gap: 8px; }
  .ov-promise-tf { display: none; }
  .ov-signals-grid { grid-template-columns: repeat(2, 1fr); }
  .ov-signal-val { font-size: 12px; }
  .ov-flags-grid { grid-template-columns: 1fr; }
  .ov-catalysts { grid-template-columns: 1fr; }
  .ov-score-value { font-size: 26px; }
  .ov-pc-hide-mobile { display: none; }
  .ov-pc-table-name { flex: 2; }
  .ov-vc-node { min-width: 64px; max-width: 110px; }
  .ov-vc-label { font-size: 10px; max-width: 80px; }
  .ov-vc-company { font-size: 10px; }
  .ov-exp-badge { padding: 5px 8px; }
  .ov-exp-badge-name { font-size: 11px; }
  .ov-exp-badge-type { font-size: 9px; }
  .ov-exp-legend-item { font-size: 10px; }
  .ov-thesis-item { font-size: 14px; }

  /* Smart Money — mobile */
  .ov-sh-bar { height: 26px; border-radius: 6px; }
  .ov-sh-bar-seg { font-size: 9px; }
  .ov-sm-ownership-header { flex-direction: column; gap: 2px; }
  .ov-sh-table { font-size: 12px; }
  .ov-sh-label-col { font-size: 11px; min-width: 64px; }
  .ov-sh-table thead th { font-size: 10px; padding: 5px 8px; }
  .ov-sh-table tbody td { padding: 5px 8px; }
  .ov-sh-q-col { min-width: 60px; }
}

/* ─── Tags row — themes + classification tags ──────────────────────── */
.ov-tags-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0 4px;
}
.ov-tag-chip {
  font-size: 11px;
  font-weight: 500;
  padding: 3px 10px;
  border-radius: 12px;
  background: var(--tint-4);
  color: var(--text-tertiary);
  white-space: nowrap;
}
.ov-tag-major {
  background: rgba(16, 185, 129, 0.1);
  color: var(--green);
  font-weight: 600;
}
.ov-tag-moderate {
  background: rgba(59, 130, 246, 0.1);
  color: var(--blue);
  font-weight: 600;
}

/* ─── Identity Card — structured key-value table ───────────────────── */

.ov-biz-summary {
  font-size: 14px;
  line-height: 1.7;
  color: var(--text-secondary);
  margin-bottom: 22px;
}
.ov-biz-summary strong {
  color: var(--text-primary);
  font-weight: 700;
}

.ov-id-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 12px;
}

.ov-id-table td {
  padding: 6px 0;
  vertical-align: top;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 50%, transparent);
}

.ov-id-table tr:last-child td { border-bottom: none; }

td.ov-id-label {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-tertiary);
  white-space: nowrap;
  width: 100px;
  padding-right: 16px;
}

td.ov-id-value {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.5;
}

.ov-id-sep {
  color: var(--text-tertiary);
  margin: 0 8px;
}

.ov-id-subtle {
  font-size: 11px;
  color: var(--text-tertiary);
  font-style: italic;
  margin-top: 3px;
}

.ov-about-toggle {
  margin-top: 14px;
}
.ov-about-toggle summary {
  font-size: 12px;
  color: var(--accent);
  cursor: pointer;
  user-select: none;
  list-style: none;
}
.ov-about-toggle summary::-webkit-details-marker { display: none; }
.ov-about-toggle summary::before {
  content: '\25B6  ';
  font-size: 9px;
}
.ov-about-toggle[open] summary::before { content: '\25BC  '; }
.ov-about-toggle summary:hover { text-decoration: underline; }
.ov-about-toggle .ov-core-biz-text {
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--text-secondary);
}

/* ─── Investment Case — Edge/Threat table + Bull/Bear columns ─────── */
.ov-et-table { margin-bottom: 14px; }
.ov-et-table + .ov-thesis-cols {
  margin-top: 22px;
}

/* ─── Signal pills clickable state ─────────────────────────────────── */
.ov-signal-clickable { cursor: pointer; transition: opacity 0.15s; }
.ov-signal-clickable:hover { opacity: 0.8; }

/* ─── Section header icons (SVG, matches Kavach icon pattern) ──────── */
.ov-section-icon {
  display: inline-flex;
  margin-right: 6px;
  color: var(--text-tertiary);
  vertical-align: middle;
}

/* ─── Shared utility classes (replacing inline styles) ─────────────── */
.ov-empty-cta {
  text-align: center;
  padding: 32px 24px;
}
.ov-empty-cta-text {
  font-size: 12px;
  color: var(--text-tertiary);
  margin: 8px 0 14px;
  line-height: 1.6;
}
.ov-loading-placeholder {
  text-align: center;
  padding: 20px 0;
  color: var(--text-tertiary);
  font-size: 12px;
}
.ov-signals-title {
  display: flex;
  align-items: center;
  gap: 6px;
}
.ov-pead-badge {
  font-weight: 700;
}
.ov-pead-quarter {
  color: var(--text-tertiary);
  font-weight: 500;
  margin-left: 6px;
}

/* ── 8-Section Narrative Layout ─────────────────────────────────────────── */

.ov-sections { margin-top: 20px; }
.ov-section { padding: 20px; }

.ov-section-header {
  display: flex; align-items: center; gap: 12px; margin-bottom: 16px;
}
.ov-section-num {
  width: 28px; height: 28px; border-radius: 6px;
  background: var(--tint-6); color: var(--text-tertiary);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800; font-family: var(--font-mono, monospace);
  flex-shrink: 0;
}
.ov-section-title {
  font-size: 14px; font-weight: 800; letter-spacing: 0.5px;
  text-transform: uppercase; color: var(--text-primary);
  font-family: var(--font-heading);
}
.ov-section-subtitle {
  font-size: 11px; color: var(--text-tertiary); margin-top: 1px;
}

.ov-prose {
  font-size: 14px; line-height: 1.7; color: var(--text-secondary);
  margin-bottom: 8px;
}
/* Overview-section kavach-prose (moat narrative, fin story) — match the
   14px body baseline used in expanded "Show details" content. Scoped to
   .ov-section so the 360°/Kavach tab keeps its own 13px sizing. */
.ov-section .kavach-prose {
  font-size: 14px; line-height: 1.7;
}
/* THE STORY "What they do" specialization items — body-tier reading text,
   so match the 14px baseline rather than the previous inline 11px which
   sat awkwardly below the lead narrative. */
.ov-section .ov-spec-item {
  font-size: 14px;
  line-height: 1.7;
  color: var(--text-secondary);
}
.ov-section .ov-spec-item + .ov-spec-item { margin-top: 4px; }
.ov-section .ov-spec-item strong { color: var(--text-primary); }
.ov-fin-story { margin-top: 8px; }

/* Metrics grid */
.ov-metrics-label {
  font-size: 11px; font-weight: 700; color: var(--text-tertiary);
  text-transform: uppercase; letter-spacing: 0.3px; margin-bottom: 8px;
}
.ov-metrics-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 8px;
}
.ov-metric-card {
  padding: 8px 10px; border-radius: 8px; background: var(--tint-4);
}
.ov-metric-label {
  font-size: 10px; color: var(--text-tertiary); font-weight: 600;
  text-transform: uppercase; margin-bottom: 2px;
}
.ov-metric-value {
  font-size: 14px; font-weight: 800; color: var(--text-primary);
  font-family: var(--font-heading);
}

/* Flags grid (Good & Bad) */
.ov-flags-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
}
@media (max-width: 600px) {
  .ov-flags-grid { grid-template-columns: 1fr; }
}
.ov-flags-heading {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.8px; margin-bottom: 14px; opacity: 0.55;
}
.ov-flags-good .ov-flags-heading { color: var(--green); }
.ov-flags-bad .ov-flags-heading { color: var(--red); }
.ov-flag-item {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 10px 12px; margin-bottom: 8px;
  border-radius: 8px; background: var(--tint-3);
  border: 1px solid var(--tint-5);
  transition: background 0.15s ease;
}
.ov-flag-item:hover { background: var(--tint-4); }
.ov-flag-item:last-child { margin-bottom: 0; }
.ov-flag-dot {
  width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0;
  margin-top: 5px;
}
.ov-flag-green .ov-flag-dot { background: var(--green); box-shadow: 0 0 6px rgba(var(--green-rgb, 0,200,100), 0.4); }
.ov-flag-red .ov-flag-dot { background: var(--red); box-shadow: 0 0 6px rgba(var(--red-rgb, 255,80,80), 0.4); }
.ov-flag-content { flex: 1; min-width: 0; }
.ov-flag-title {
  font-size: 14px; font-weight: 600; color: var(--text-primary);
  line-height: 1.3; margin-bottom: 3px;
}
.ov-flag-desc {
  font-size: 11.5px; color: var(--text-tertiary); line-height: 1.45;
}

/* Wave badge */
.ov-wave-badge {
  display: inline-block; padding: 2px 10px; border-radius: 5px;
  background: var(--tint-6); color: var(--accent); font-size: 10px;
  font-weight: 700; text-transform: uppercase; letter-spacing: 0.3px;
  vertical-align: middle; margin-left: 4px;
}

/* People */
.ov-mgmt-badges { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.ov-mgmt-type {
  font-size: 12px; font-weight: 700; color: var(--accent);
  padding: 3px 10px; border-radius: 6px; background: rgba(var(--accent-rgb, 0,200,150), 0.1);
}
.ov-mgmt-dna {
  font-size: 12px; font-weight: 600; color: var(--text-secondary);
  padding: 3px 10px; border-radius: 6px; background: var(--tint-4);
}
.ov-people-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px; margin-bottom: 12px;
}
.ov-person {
  padding: 8px 10px; border-radius: 8px; background: var(--tint-4);
}
.ov-person-name { font-size: 12px; font-weight: 700; color: var(--text-primary); }
.ov-person-role { font-size: 10px; color: var(--text-tertiary); }
.ov-mgmt-signals { display: flex; gap: 8px; flex-wrap: wrap; }
.ov-mgmt-pill {
  font-size: 11px; padding: 3px 10px; border-radius: 6px;
  background: var(--tint-4); color: var(--text-secondary); font-weight: 600;
}

/* Competitors */
.ov-competitors {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 8px; margin: 12px 0;
}
.ov-competitor-card {
  padding: 10px 12px; border-radius: 8px; border: 1px solid var(--border);
  transition: border-color 0.2s;
}
.ov-competitor-card:hover { border-color: var(--accent); }
.ov-comp-header { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ov-comp-name { font-size: 14px; font-weight: 700; color: var(--text-primary); }
.ov-comp-symbol { font-size: 10px; color: var(--text-tertiary); }
.ov-comp-private {
  font-size: 9px; padding: 1px 6px; border-radius: 4px;
  background: var(--tint-6); color: var(--text-tertiary); font-weight: 600;
}
.ov-comp-meta { display: flex; gap: 10px; margin-top: 4px; }
.ov-comp-price { font-size: 12px; font-weight: 700; color: var(--text-primary); }
.ov-comp-ecs { font-size: 11px; color: var(--accent); font-weight: 600; }
.ov-comp-pos { font-size: 11px; color: var(--text-tertiary); margin-top: 4px; line-height: 1.4; }

/* Competitive position */
.ov-comp-pos-row {
  display: flex; align-items: baseline; gap: 8px; margin-bottom: 14px; flex-wrap: wrap;
}
.ov-comp-pos-badge {
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.4px;
  padding: 3px 10px; border-radius: 6px;
  background: rgba(var(--accent-rgb, 0,200,150), 0.1); color: var(--accent);
}
.ov-comp-pos-detail {
  font-size: 12px; color: var(--text-secondary); line-height: 1.5;
}

/* Peer table */
.ov-pt-wrap { overflow-x: auto; margin: 0 -20px; padding: 0 20px; }
.ov-peer-table { font-size: 12px; border-collapse: collapse; width: 100%; }
.ov-peer-table th {
  font-size: 10px; letter-spacing: 0.4px; text-transform: uppercase;
  padding: 6px 12px 6px 0; color: var(--text-tertiary); font-weight: 700;
  border-bottom: 2px solid var(--tint-6); text-align: left; white-space: nowrap;
}
.ov-peer-table td {
  padding: 9px 12px 9px 0; border-bottom: 1px solid var(--tint-4);
  text-align: left; white-space: nowrap; color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}
.ov-pt-name { font-weight: 600; color: var(--accent); }
.ov-pt-why, .ov-pt-why-th {
  white-space: normal; font-size: 11px;
  color: var(--text-tertiary); line-height: 1.4;
}
.ov-peer-table tbody tr { transition: background 0.12s ease; }
.ov-peer-table tbody tr:hover { background: var(--tint-4); }

/* Others (Private/Global) — whitespace separates from peer table above. */
.ov-pt-global-label {
  font-size: 10px; font-weight: 700; color: var(--text-tertiary);
  text-transform: uppercase; letter-spacing: 0.5px; margin: 24px 0 8px;
}

/* ── Smart Money — unified narrative + ownership ── */
.ov-sm-narrative {
  font-size: 14px; line-height: 1.7; color: var(--text-secondary);
}
.ov-sm-verdict {
  display: inline; margin-left: 6px;
  font-size: 10px; font-weight: 700; letter-spacing: 0.04em;
  text-transform: uppercase; padding: 3px 8px; border-radius: 4px;
  white-space: nowrap;
}
.ov-sm-verdict-buy {
  background: rgba(16, 185, 129, 0.12); color: var(--green);
}
.ov-sm-verdict-good {
  background: rgba(245, 158, 11, 0.12); color: var(--amber);
}
.ov-sm-verdict-sell {
  background: rgba(239, 68, 68, 0.12); color: var(--red);
}
.ov-sm-verdict-neutral {
  background: var(--tint-5); color: var(--text-tertiary);
}
.ov-sm-narrative + .ov-sm-ownership {
  margin-top: 20px;
}
.ov-sm-loading {
  font-size: 12px; color: var(--text-tertiary);
  padding: 16px 0;
  letter-spacing: 0.01em;
}
.ov-sm-signals {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-top: 12px;
}
.ov-sm-ownership {
  margin-top: 22px;
}
.ov-sm-signals + .ov-sm-ownership {
  margin-top: 16px;
}
.ov-sm-ownership-header {
  display: flex; align-items: baseline; gap: 8px; margin-bottom: 14px;
}
.ov-sm-ownership-title {
  font-size: 12px; font-weight: 700; color: var(--text-primary);
  letter-spacing: 0.04em; text-transform: uppercase;
}
.ov-sm-ownership-meta {
  font-size: 11px; color: var(--text-tertiary); font-weight: 400;
}

/* ── ECS: THE FULL PICTURE ─────────────────────────────────────────── */

.ov-verdict-card { }

/* ── Layer 1: THE NUMBER ── */
.ov-ecs-hero {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 20px;
}
.ov-ecs-score-block {
  display: flex; align-items: baseline; gap: 2px;
}
.ov-ecs-score {
  font-size: 48px; font-weight: 900;
  font-family: var(--font-mono, monospace);
  line-height: 1; letter-spacing: -2px;
}
.ov-ecs-score-of {
  font-size: 16px; font-weight: 500; color: var(--text-tertiary);
  font-family: var(--font-mono, monospace);
}
.ov-ecs-signal {
  font-size: 12px; font-weight: 700; letter-spacing: 0.03em;
  padding: 5px 14px; border-radius: 20px;
}
.ov-ecs-sig-pos { background: rgba(16, 185, 129, 0.12); color: var(--green); }
.ov-ecs-sig-neg { background: rgba(239, 68, 68, 0.12); color: var(--red); }
.ov-ecs-sig-neu { background: var(--tint-5); color: var(--text-tertiary); }

/* ── "How we computed this" label ── */
.ov-ecs-how-label {
  font-size: 12px; font-weight: 700; color: var(--text-tertiary);
  letter-spacing: 0.02em; margin: 22px 0 10px;
}

.ov-ecs-how-info {
  font-size: 12px; color: var(--text-tertiary); cursor: help;
  position: relative; margin-left: 2px;
}
.ov-ecs-how-tooltip {
  display: none; position: absolute; left: 50%; bottom: calc(100% + 6px);
  transform: translateX(-50%); white-space: nowrap;
  font-size: 11px; font-weight: 500; color: var(--text-primary);
  background: var(--card-bg); border: 1px solid var(--tint-6);
  padding: 5px 10px; border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15); z-index: 10;
  pointer-events: none;
}
.ov-ecs-how-info:hover + .ov-ecs-how-tooltip,
.ov-ecs-how-info:focus + .ov-ecs-how-tooltip {
  display: block;
}

/* ── Two pillars ── */
.ov-ecs-pillars {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  margin-bottom: 16px;
}
@media (max-width: 600px) {
  .ov-ecs-pillars { grid-template-columns: 1fr; }
}
.ov-ecs-pillar {
  padding: 14px 16px; border-radius: 10px;
  background: var(--tint-3); border: 1px solid var(--tint-5);
}
.ov-ecs-p-head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 8px;
}
.ov-ecs-p-q {
  font-size: 11px; font-weight: 800; text-transform: uppercase;
  letter-spacing: 0.3px; color: var(--text-primary);
}
.ov-ecs-p-score {
  font-size: 12px; font-weight: 600;
  font-family: var(--font-mono, monospace);
}
.ov-ecs-p-label {
  font-family: var(--font-sans, sans-serif);
  font-weight: 600; font-size: 11px; letter-spacing: 0.2px;
}
.ov-ecs-bar {
  height: 3px; background: var(--tint-6); border-radius: 2px;
  overflow: hidden; margin-bottom: 10px;
}
.ov-ecs-bar-fill {
  height: 100%; border-radius: 2px; transition: width 0.5s;
}

/* Pillar sub-rows */
.ov-ecs-p-rows { }
.ov-ecs-r {
  display: flex; align-items: baseline; gap: 6px;
  padding: 5px 0; border-top: 1px solid var(--tint-4);
  flex-wrap: nowrap;
}
.ov-ecs-r-label {
  font-size: 11px; font-weight: 600; color: var(--text-secondary);
  flex: 1; min-width: 0;
}
.ov-ecs-r-detail {
  font-size: 11px; font-weight: 600; color: var(--text-secondary);
  white-space: nowrap; flex-shrink: 0; margin-left: auto;
}
.ov-ecs-r-val {
  font-size: 14px; font-weight: 800;
  font-family: var(--font-mono, monospace);
  flex-shrink: 0;
}

/* AI summary */
.ov-ecs-summary {
  font-size: 14px; line-height: 1.6; color: var(--text-secondary);
  margin-top: 22px;
}

@media (max-width: 480px) {
  .ov-ecs-score { font-size: 32px; }
  .ov-ecs-gap { padding: 12px; }
  .ov-ecs-p-score { font-size: 16px; }
  .ov-ecs-pillar { padding: 12px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   AI REVENUE OUTLOOK — Quarterly projection section
   ═══════════════════════════════════════════════════════════════════════════ */

.ov-ai-outlook {
  border: 1px solid var(--accent-border-soft);
  background: var(--accent-gradient);
}

.ov-aio-title-row {
  display: flex; align-items: center; justify-content: space-between;
}
.ov-aio-subheader {
  display: flex; align-items: center; gap: 10px; margin: -4px 0 16px;
}
.ov-aio-conf {
  font-family: var(--font-data); font-size: 12px; font-weight: 700;
  padding: 3px 10px; border-radius: 4px;
  background: var(--tint-4);
}
.ov-aio-inline-disclaimer {
  font-size: 10px; color: var(--text-tertiary); opacity: 0.6;
}

/* ── Quarterly Revenue Bars ──────────────────────────────────────────── */
.ov-aio-bars {
  display: flex; justify-content: center; gap: 24px;
  padding: 8px 0 20px; align-items: flex-end;
}
.ov-aio-bar-group {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  min-width: 70px;
}
.ov-aio-bar-wrap {
  width: 40px; height: 100px; background: var(--tint-3);
  border-radius: 6px 6px 0 0; position: relative; overflow: hidden;
  display: flex; align-items: flex-end;
}
.ov-aio-bar {
  width: 100%; background: var(--accent); border-radius: 6px 6px 0 0;
  transition: height 0.5s ease; min-height: 4px;
}
.ov-aio-bar-rev {
  font-family: var(--font-data); font-size: 12px; font-weight: 800;
  color: var(--text-primary); letter-spacing: -0.02em;
}
.ov-aio-bar-qtr {
  font-family: var(--font-data); font-size: 10px; font-weight: 700;
  color: var(--accent); letter-spacing: 0.02em;
}

/* ── Quarter Details ─────────────────────────────────────────────────── */
.ov-aio-details {
  display: flex; flex-direction: column; gap: 8px;
  margin: 16px 0;
}
.ov-aio-q-detail {
  padding: 10px 14px; border-radius: 8px;
  background: var(--tint-2); border: 1px solid var(--border);
}
.ov-aio-q-label {
  font-family: var(--font-data); font-size: 11px; font-weight: 700;
  color: var(--accent);
}
.ov-aio-q-rev {
  font-family: var(--font-data); font-size: 14px; font-weight: 800;
  color: var(--text-primary); margin-left: 10px;
}
.ov-aio-q-reason {
  font-size: 12px; color: var(--text-secondary); line-height: 1.6;
  margin-top: 4px;
}

/* ── Reasoning ───────────────────────────────────────────────────────── */
.ov-aio-reasoning {
  font-size: 12px; color: var(--text-secondary); line-height: 1.6;
  padding: 12px 14px; border-radius: 8px;
  background: var(--tint-1); border-left: 3px solid var(--accent);
  margin-bottom: 12px;
}

/* ── Footer: Sources + Disclaimer ────────────────────────────────────── */
.ov-aio-footer {
  border-top: 1px solid var(--border); padding-top: 10px;
  margin-top: 8px;
}
.ov-aio-sources {
  font-size: 10px; color: var(--text-tertiary); margin-bottom: 4px;
}
.ov-aio-disclaimer {
  font-size: 10px; color: var(--text-tertiary); opacity: 0.7;
}

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width: 480px) {
  .ov-aio-bars { gap: 12px; }
  .ov-aio-bar-wrap { width: 32px; height: 80px; }
  .ov-aio-bar-rev { font-size: 11px; }
  .ov-aio-bar-group { min-width: 55px; }
}

/* Mobile rhythm tuning — narrow columns need tighter line-height and a
   stronger section-title-vs-body hierarchy. Sizes stay on the unified
   scale; only line-height and the title size shift. text-wrap: pretty
   lets the browser look ahead and balance line lengths so prose doesn't
   end short before a long word wraps. */
@media (max-width: 600px) {
  .ov-prose,
  .ov-section .kavach-prose,
  .ov-mgmt-guidance .kavach-prose,
  .ov-sm-narrative,
  .ov-ecs-summary {
    line-height: 1.55;
    text-wrap: pretty;
    text-align: justify;
    hyphens: auto;
    -webkit-hyphens: auto;
  }

  .ov-section-title { font-size: 16px; }
}

/* ── Lock state — see-but-can't-touch ──────────────────────────────────
   2026-04-26 redesign: locked sections stay readable in shape but the
   actual values are blurred. A small neutral strip (.ov-lock-strip) sits
   on top of the blurred body carrying the variant-aware copy and a
   "View Plans →" link straight to /pricing. No modal — mobile-first
   audience finds modal takeovers hostile.

   Why brand emerald (--accent), not amber:
   Amber is reserved for warning/red-flag governance signals across the
   product (Kavach flags, decline indicators). Reusing it for paywalls
   was confusing the reader's lizard brain — "is this stock risky?" vs
   "is this content locked?" One disciplined brand accent does premium
   work for the action. The surface itself stays neutral so the blurred
   content is the visual hero; the strip is the polite narrator on top.

   .ov-locked goes on the inner content stack only (not the section
   wrapper) so the strip above it stays sharp and clickable. The blur
   intensity (5px) is calibrated for 390px mobile viewports — heavier
   blur at that width starts looking like a render bug. */
.ov-locked {
  pointer-events: none;
  user-select: none;
  filter: blur(5px);
  opacity: 0.85;
}

/* Inline lock strip — appears above each blurred section when expanded.
   Same visual language as the existing dd-empty-state used by whole-tab
   paywalls (kavach, wtt). One voice across page-level and section-level
   lock states. */
.ov-lock-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 12px;
  padding: 10px 14px;
  font-size: 13px;
  color: var(--text-secondary);
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 10px;
}
.ov-lock-strip-msg { display: flex; align-items: center; gap: 8px; min-width: 0; }
.ov-lock-strip-msg svg { width: 14px; height: 14px; color: var(--text-secondary); }
.ov-lock-strip-msg > span { overflow-wrap: anywhere; color: var(--text-primary); }
.ov-lock-strip-cta {
  flex-shrink: 0;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  background: transparent;
  border: 1px solid var(--accent-border);
  border-radius: 6px;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: background 120ms ease, border-color 120ms ease;
}
.ov-lock-strip-cta:hover {
  background: var(--accent-tint-bg);
  border-color: var(--accent-border-vivid);
}

@media (max-width: 600px) {
  .ov-lock-strip { font-size: 12px; padding: 8px 12px; flex-wrap: wrap; }
  .ov-lock-strip-cta { padding: 4px 10px; font-size: 11px; }
}

/* ── Trust Receipt Badge — top of 360° Profile ──────────────────────────
   2026-05-01 (v4 — Ive pass refined): the receipt is *status*, not a
   feature. It sits on the page surface like instrument-panel chrome —
   present, calm, almost invisible until you look at it.

   Composition:
     ●  Verified moments ago · nothing new
        AI AGENTS  reading every market-moving disclosure on this stock — 24/7
        ──────────  ──────────────────────────────────────────────────────
        small-caps  luminance shimmer (5s, right-to-left)
        tag-style   tertiary→secondary→tertiary

   Three signals doing three jobs:
     1. Dot pulse (3.6s)   — the system is alive
     2. "AI AGENTS" tag    — there is an actor (typographic, no animation)
     3. Sub-line shimmer   — that actor is working right now (5s)
   Three different cadences, three different elements. No competition.

   Apple's section labels (SYSTEM, GENERAL, BLUETOOTH) are small-caps +
   tracked-out + medium weight — they read as labels, not shouting.
   We use the same treatment for "AI AGENTS" so it stops being prose
   and starts being a tag. */
.ov-receipt {
  display: grid;
  grid-template-columns: auto 1fr;
  /* Two implicit rows. Dot lives in row 1 only (grid-row: 1) so it
     vertically centres on the headline, not the whole block — the dot
     belongs to the status line, not the strip. */
  grid-template-rows: auto auto;
  column-gap: 10px;
  row-gap: 6px;
  margin: 0 0 18px;
  padding: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--text-secondary);
}
.ov-receipt-head {
  grid-column: 2;
  grid-row: 1;
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
  color: var(--text-primary);
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: -0.005em;
}
.ov-receipt-sub {
  grid-column: 2;
  grid-row: 2;
  font-size: 12px;
  font-weight: 400;
  color: var(--text-tertiary);
}
/* "EquiSense Agent" brand — bolded as the subject of the sentence.
   Carries the emerald shimmer as a deliberate accent on the actor;
   the description below stays static tertiary so the receipt reads as
   one sentence with a focused trust signal on the brand only.

   Gradient base is text-primary (off-white) — so the brand always
   reads as visually distinct primary text, with the emerald peak as
   an occasional flash on top, never blending into the description's
   tertiary grey between sweeps.

   Gradient stops: base is text-primary, peak is --accent emerald. The
   peak has a 10% flat plateau (so the full brand stays lit) plus 20%
   fade on each side (so the highlight blooms in and out instead of
   snapping). Negative animation-delay starts the cycle mid-stream so
   motion is visible immediately on page load.
   Reduced-motion: collapses to flat text-primary. */
.ov-receipt-brand {
  font-weight: 600;
  background: linear-gradient(
    90deg,
    var(--text-primary) 0%,
    var(--text-primary) 25%,
    var(--accent) 45%,
    var(--accent) 55%,
    var(--text-primary) 75%,
    var(--text-primary) 100%
  );
  background-size: 200% 100%;
  background-position: 100% 0;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  animation: ov-receipt-shimmer 5s linear infinite;
  animation-delay: -1.5s;
}
.ov-receipt-sub-list {
  color: var(--text-tertiary);
}
@keyframes ov-receipt-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -100% 0; }
}

/* Source-breakdown chip — outlined token, no colour fill. Quiet by
   default; reads as informational, not a CTA. */
.ov-receipt-chip {
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.01em;
  white-space: nowrap;
}

/* Indicator dot — 6px, emerald (--accent), slow breath at ~resting
   heartbeat tempo (3.6s). Lives in row 1 only so it pins to the
   headline's vertical centre, not the whole block. */
.ov-receipt-dot {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  width: 6px;
  height: 6px;
  margin: 0 1px;
  border-radius: 50%;
  background: var(--accent);
  animation: ov-receipt-pulse 3.6s ease-in-out infinite;
}
@keyframes ov-receipt-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.35; }
}

/* State variants — minimal differentiation; copy carries the meaning.

   State A (loading): hollow ring, no breath — nothing has been read
   yet, so don't pretend the system is alive on this stock yet. */
.ov-receipt-loading .ov-receipt-dot {
  background: transparent;
  box-shadow: inset 0 0 0 1px var(--text-tertiary);
  animation: none;
}
/* State D (refresh in progress): faster breath. */
.ov-receipt-progress .ov-receipt-dot {
  animation-duration: 1.6s;
}
/* State E (pending — new docs detected, refresh queued): amber.
   Semantically different from "alive baseline", so it gets its own
   colour — but still a single dot, no halo. */
.ov-receipt-pending .ov-receipt-dot {
  background: var(--amber);
}

/* State F (refresh completed mid-view — clickable CTA): the receipt is
   the click target, so it needs an affordance. Cursor + hover
   underline on the headline make this clear without adding chrome.
   The ↻ arrow is a persistent visual signal that the receipt is
   actionable, not just informational. */
.ov-receipt-ready { cursor: pointer; }
.ov-receipt-ready:hover .ov-receipt-head,
.ov-receipt-ready:focus-visible .ov-receipt-head {
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-underline-offset: 3px;
}
.ov-receipt-ready:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 4px;
  border-radius: 2px;
}
.ov-receipt-cta-arrow {
  display: inline-block;
  margin-left: 6px;
  color: var(--accent);
  font-weight: 600;
  font-size: 14px;
  /* Slow rotation idle hint — telegraphs "click to refresh" without
     the dot pulse competing for attention. */
  animation: ov-receipt-cta-spin 2.4s ease-in-out infinite;
}
@keyframes ov-receipt-cta-spin {
  0%, 60%, 100% { transform: rotate(0deg); }
  80% { transform: rotate(180deg); }
}
@media (prefers-reduced-motion: reduce) {
  .ov-receipt-cta-arrow { animation-name: none; }
}

/* Reduced-motion: kill the breath + the shimmer. Dot stays solid
   emerald at full opacity; sub-line text collapses to flat tertiary.
   Every operational signal still readable. Longhand `animation-name:
   none` is used (not the shorthand) — Chrome's getComputedStyle
   returns empty string for `animation-name` when the `animation: none`
   shorthand resets it, which breaks deterministic assertions. */
@media (prefers-reduced-motion: reduce) {
  .ov-receipt-dot {
    animation-name: none;
    opacity: 1;
  }
  .ov-receipt-brand {
    animation-name: none;
    background: none;
    -webkit-text-fill-color: var(--text-primary);
    color: var(--text-primary);
  }
}

@media (max-width: 600px) {
  .ov-receipt {
    margin-bottom: 14px;
    column-gap: 8px;
    row-gap: 5px;
  }
  .ov-receipt-head { font-size: 12.5px; }
  .ov-receipt-sub { font-size: 11.5px; gap: 7px; }
  .ov-receipt-brand { font-size: 10px; }
  .ov-receipt-chip { font-size: 10.5px; padding: 1px 6px; }
}
