/* Insights: the index and the post page. Composed into
   site/assets/insights/insights.css by tools/build-insights.mjs, so it ships
   only when there is a published post. One reading column; exhibits and
   tables may run wider than the text and scroll in their own box on a phone. */
.insight-doc, .insight-index { max-width: 760px; margin: 0 auto; padding-block: var(--ov-space-9) var(--ov-space-10); }
.insight-doc { --insight-text: 688px; }
.insight-doc > header, .insight-doc section > p, .insight-doc section > ul, .insight-doc section > ol,
.insight-doc section > h2, .insight-doc section > h3, .insight-doc section > .insight-kicker { max-width: var(--insight-text); }
.insight-type { font-size: var(--ov-size-meta); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ov-forest-accent); margin: 0 0 var(--ov-space-3); }
.insight-doc h1, .insight-index h1 { font-size: var(--ov-size-title); line-height: var(--ov-leading-title); letter-spacing: var(--ov-track-title); font-weight: 600; margin: 0 0 var(--ov-space-3); text-wrap: balance; }
.insight-subtitle { font-size: var(--ov-size-lead); color: var(--ov-text-muted); margin: 0 0 var(--ov-space-5); }
.insight-meta { display: flex; flex-wrap: wrap; gap: var(--ov-space-1) var(--ov-space-4); font-size: var(--ov-size-label); color: var(--ov-text-muted); margin: 0 0 var(--ov-space-5); }
.insight-meta strong { color: var(--ov-text); font-weight: 600; }
.insight-actions { display: flex; flex-wrap: wrap; gap: var(--ov-space-3); align-items: center; margin: 0 0 var(--ov-space-6); }
.insight-actions .insight-size { font-size: var(--ov-size-label); color: var(--ov-text-muted); }
.insight-hero { display: block; width: 100%; height: auto; border-radius: var(--ov-radius-panel); margin: 0 0 var(--ov-space-6); }
.insight-related { border: 1px solid var(--ov-divider); border-radius: var(--ov-radius-card); background: var(--ov-surface); padding: var(--ov-space-4) var(--ov-space-5); margin: 0 0 var(--ov-space-7); }
.insight-doc .insight-related h2 { font-size: var(--ov-size-meta); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ov-text-muted); margin: 0 0 var(--ov-space-2); }
.insight-doc .insight-related ul { list-style: none; margin: 0; padding: 0; }
.insight-doc .insight-related li { margin: 0; }
.insight-doc a, .insight-index a { color: var(--ov-forest); text-decoration: underline; text-underline-offset: 2px; }
.insight-doc a.btn { text-decoration: none; }
.insight-doc a.btn-primary { color: var(--ov-action-text); }

.insight-doc section { margin-top: var(--ov-space-9); }
.insight-doc section:first-of-type { margin-top: 0; }
.insight-doc section section { margin-top: var(--ov-space-9); }
.insight-kicker { font-size: var(--ov-size-meta); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ov-forest-accent); margin: 0 0 var(--ov-space-2); }
.insight-doc h2 { font-size: var(--ov-size-section); line-height: 1.2; letter-spacing: var(--ov-track-card); font-weight: 600; margin: 0 0 var(--ov-space-5); text-wrap: balance; }
.insight-doc h3 { font-size: var(--ov-size-card); font-weight: 600; margin: var(--ov-space-6) 0 var(--ov-space-2); }
.insight-doc p { margin: 0 0 var(--ov-space-4); line-height: var(--ov-leading-lesson); }
.insight-doc ul, .insight-doc ol { margin: 0 0 var(--ov-space-5); padding-left: 1.25rem; }
.insight-doc ul { list-style: disc; }
.insight-doc li { margin-bottom: var(--ov-space-3); line-height: var(--ov-leading-body); }
.insight-doc strong { font-weight: 600; }
.insight-lead { font-size: var(--ov-size-lead); }

.insight-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ov-space-4); margin: var(--ov-space-6) 0; }
.insight-stat { background: var(--ov-surface-soft); border-radius: var(--ov-radius-card); padding: var(--ov-space-5); }
.insight-stat b { display: block; font-size: 1.75rem; line-height: 1.1; font-weight: 700; color: var(--ov-forest); margin-bottom: var(--ov-space-2); font-variant-numeric: tabular-nums; }
.insight-stat span { display: block; font-size: var(--ov-size-label); line-height: 1.45; }
.insight-ask { background: var(--ov-forest); color: var(--ov-text-on-dark); border-radius: var(--ov-radius-panel); padding: var(--ov-space-6); margin-top: var(--ov-space-6); }
.insight-ask .k { display: block; font-size: var(--ov-size-meta); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ov-mint); margin-bottom: var(--ov-space-2); }
.insight-doc .insight-ask p { margin: 0; font-size: var(--ov-size-lead); line-height: 1.5; color: var(--ov-text-on-dark); }
.insight-pull { border-block: 1px solid var(--ov-divider); padding-block: var(--ov-space-4); margin: var(--ov-space-6) 0; font-size: 1.25rem; line-height: 1.4; font-weight: 600; color: var(--ov-forest); max-width: var(--insight-text); }
.insight-formula { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ov-space-4); background: var(--ov-surface); border: 1px solid var(--ov-divider); border-radius: var(--ov-radius-card); padding: var(--ov-space-5); margin: var(--ov-space-5) 0; max-width: var(--insight-text); }
.insight-formula .lhs { font-weight: 600; }
.insight-formula .frac { display: inline-flex; flex-direction: column; align-items: center; }
.insight-formula .frac span:first-child { border-bottom: 2px solid var(--ov-forest); padding: 0 var(--ov-space-3) var(--ov-space-1); }
.insight-formula .frac span:last-child { padding: var(--ov-space-1) var(--ov-space-3) 0; }
.insight-exhibit { margin: var(--ov-space-7) 0; }
.insight-exhibit img { display: block; width: 100%; height: auto; border: 1px solid var(--ov-divider); border-radius: var(--ov-radius-card); background: var(--ov-white); }
.insight-art { display: block; width: 100%; height: auto; max-height: 280px; object-fit: cover; border-radius: var(--ov-radius-panel); margin: 0 0 var(--ov-space-6); }
.insight-table { overflow-x: auto; margin: var(--ov-space-5) 0 var(--ov-space-6); border: 1px solid var(--ov-divider); border-radius: var(--ov-radius-control); background: var(--ov-surface); }
.insight-table:focus-visible { outline: var(--ov-focus-width) solid var(--ov-focus); outline-offset: var(--ov-focus-offset); }
.insight-moves { width: 100%; min-width: 38rem; border-collapse: collapse; font-size: var(--ov-size-label); line-height: 1.5; }
.insight-moves th, .insight-moves td { text-align: left; vertical-align: top; padding: var(--ov-space-3) var(--ov-space-4); border-bottom: 1px solid var(--ov-divider); }
.insight-moves thead th { background: var(--ov-surface-soft); font-weight: 600; }
.insight-moves td:first-child { font-weight: 600; }
.insight-moves tr:last-child td { border-bottom: 0; }
.insight-next { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ov-space-4); }
.insight-next > div { background: var(--ov-surface); border: 1px solid var(--ov-divider); border-radius: var(--ov-radius-card); padding: var(--ov-space-5); }
.insight-next b { display: block; font-size: var(--ov-size-card); font-weight: 600; margin-bottom: var(--ov-space-2); }
.insight-next span { display: block; font-size: var(--ov-size-label); line-height: 1.5; margin-bottom: var(--ov-space-3); }
.insight-next a { font-weight: 600; }
.insight-about { border-top: 1px solid var(--ov-divider); padding-top: var(--ov-space-7); }
.insight-note { font-size: var(--ov-size-label); color: var(--ov-text-muted); }
.insight-sources { font-size: var(--ov-size-label); list-style: decimal; }
.insight-doc .insight-sources li { margin-bottom: var(--ov-space-2); line-height: 1.5; overflow-wrap: anywhere; }
.insight-foot { font-size: var(--ov-size-label); color: var(--ov-text-muted); margin-top: var(--ov-space-7); }

.insight-index .insight-intro { font-size: var(--ov-size-lead); color: var(--ov-text-muted); margin: 0 0 var(--ov-space-7); }
.insight-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ov-space-5); }
.insight-card { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: var(--ov-space-5); border: 1px solid var(--ov-divider); border-radius: var(--ov-radius-card); background: var(--ov-surface); padding: var(--ov-space-4); }
.insight-card img { width: 100%; height: 100%; min-height: 120px; object-fit: cover; border-radius: var(--ov-radius-control); }
.insight-card h2 { font-size: var(--ov-size-card); line-height: 1.25; font-weight: 600; margin: 0 0 var(--ov-space-2); }
.insight-card h2 a { color: var(--ov-text); text-decoration: none; }
.insight-card h2 a:hover { text-decoration: underline; }
.insight-card p { margin: 0 0 var(--ov-space-3); }
.insight-card .insight-meta { margin: 0; }

@media (max-width: 640px) {
  .insight-stats, .insight-next { grid-template-columns: 1fr; }
  .insight-card { grid-template-columns: 1fr; }
  .insight-card img { max-height: 160px; }
}
@media print {
  .insight-actions, .insight-related { display: none; }
}