/* Laurenceo Intelligence: compact AGI Observatory (forecasts page #agi.agi--v2).
   Loaded after intelligence.css; reuses its panes, rims, facts, board, log, sources and folds. */

/* hero: tighter, one screen */
.agi--v2 .feature { padding: clamp(20px, 2.6vw, 34px); }
.agi--v2 .agi-hero { grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); gap: clamp(16px, 2.4vw, 28px); }
.agi--v2 .agi-hero__date { margin-top: 12px; font-size: clamp(2.6rem, 1.7rem + 3.2vw, 4.4rem); }
.agi--v2 .feature .agi-hero__away { margin-top: 6px; font-size: var(--fs-body); }
.agi--v2 .feature .agi-hero__moved { margin-top: 12px; }
.agi--v2 .feature .agi-hero__conf { margin-top: 10px; }
.agi--v2 .agi-hero__plot { padding: clamp(14px, 1.8vw, 20px); }
.agi--v2 .feature .agi-read { margin-top: 6px; max-width: 62ch; font-size: var(--fs-small); line-height: 1.5; color: var(--on-brand-2); text-wrap: pretty; }

/* runway: today to the right edge, likely range, estimate, counted forecasts */
.agi-run { position: relative; margin-top: 30px; }
.agi-run__track { position: relative; height: 34px; border-radius: 10px; background: rgba(255, 255, 255, .04); }
.agi-run__band { position: absolute; top: 0; bottom: 0; border-radius: 10px; background: rgba(159, 188, 216, .18); }
.agi-run__now, .agi-run__mid { position: absolute; top: 0; bottom: 0; width: 0; }
.agi-run__now { border-left: 1px dashed rgba(255, 255, 255, .35); }
.agi-run__mid { border-left: 2px solid var(--accent); }
.agi-run em { position: absolute; bottom: calc(100% + 5px); font-style: normal; font-size: .6875rem; font-weight: 600; line-height: 1; white-space: nowrap; }
.agi-run__now em { left: 0; color: var(--on-brand-2); }
.agi-run__mid em { left: 0; transform: translateX(-50%); color: #fff; }
.agi-run__dot { position: absolute; top: 50%; width: var(--s, 12px); height: var(--s, 12px); transform: translate(-50%, -50%); border-radius: 50%; background: var(--sky); box-shadow: 0 0 0 2px rgba(20, 34, 48, .9); }
.agi-run__dot.is-trend { background: var(--mint); }
.agi-run__ticks { position: relative; height: 18px; }
.agi-run__ticks span { position: absolute; top: 5px; transform: translateX(-50%); font-size: .6875rem; color: var(--on-brand-2); }
.agi-run__ticks span.is-end { transform: translateX(-100%); }
.agi-run__key { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 8px; font-size: .75rem; color: var(--on-brand-2); }
.agi-run__key li { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.agi-run__key i { width: 8px; height: 8px; border-radius: 50%; background: var(--sky); }
.agi-run__key i.is-trend { background: var(--mint); }
.agi-run__key b { font-weight: 600; color: #fff; }

/* the path so far */
.agi-spark { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .1); }
.agi-spark__plot { position: relative; min-width: 0; }
.agi-spark svg { display: block; width: 100%; height: 40px; overflow: visible; }
.agi-spark polyline { fill: none; stroke: var(--accent); stroke-width: 2; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.agi-spark__dot { position: absolute; width: 8px; height: 8px; transform: translate(-50%, -50%); border-radius: 50%; background: #fff; }
.agi-spark p { display: grid; gap: 2px; text-align: right; font-size: .75rem; line-height: 1.35; color: var(--on-brand-2); }
.agi-spark b { font-weight: 600; color: #fff; white-space: nowrap; }

/* facts strip: shorter cells */
.agi--v2 .agi-facts dd span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* what to watch, and what moved it: the same rows, the same height, links on one line at the foot */
.agi--v2 .agi-grid { margin-top: 16px; align-items: stretch; }
.agi--v2 .agi-grid > .agi-pane { display: flex; flex-direction: column; }
.agi--v2 .agi-grid .agi-board { flex: 1; align-content: start; }
.agi--v2 .agi-board li { grid-template-columns: 4em minmax(0, 1fr); min-height: 4.6em; padding: 10px 0; }
.agi--v2 .agi-board__p { white-space: nowrap; }
.agi--v2 .agi-board a, .agi--v2 .agi-board__t { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: var(--fs-small); line-height: 1.45; }
.agi--v2 .agi-grid .agi-more { align-self: flex-start; margin-top: 14px; }

/* folds: everything else, one tap away */
.agi-folds { display: grid; gap: 10px; margin-top: 16px; }
.agi--v2 .agi-folds .agi-method-wrap { margin-top: 0; }
.agi--v2 .agi-method-wrap > summary { padding: 15px var(--cp); font-size: var(--fs-small); }
.agi-fold { padding: 4px var(--cp) var(--cp); border-top: 1px solid var(--line); }
.agi-fold--2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 32px; padding-top: 16px; }
.agi-fold .agi-sources { margin-top: 8px; }
.agi-fold .agi-how { margin-top: 14px; }
.agi-fold .agi-tl { margin-top: 12px; }

/* light theme: the hero turns light, so the new text and marks take the page's ink */
html[data-theme="light"] .agi--v2 .feature .agi-read,
html[data-theme="light"] .agi-run__now em,
html[data-theme="light"] .agi-run__ticks span,
html[data-theme="light"] .agi-run__key,
html[data-theme="light"] .agi-spark p { color: var(--text-2); }
html[data-theme="light"] .agi-run__mid em,
html[data-theme="light"] .agi-run__key b,
html[data-theme="light"] .agi-spark b { color: var(--text); }
html[data-theme="light"] .agi-run__track { background: rgba(16, 22, 29, .05); }
html[data-theme="light"] .agi-run__band { background: rgba(46, 90, 140, .14); }
html[data-theme="light"] .agi-run__now { border-left-color: rgba(16, 22, 29, .35); }
html[data-theme="light"] .agi-run__dot { box-shadow: 0 0 0 2px rgba(255, 255, 255, .95); }
html[data-theme="light"] .agi-spark { border-top-color: rgba(16, 22, 29, .1); }
html[data-theme="light"] .agi-spark__dot { background: var(--text); }

@media (max-width: 1079px) {
  .agi--v2 .agi-hero { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 759px) {
  .agi-fold--2 { grid-template-columns: minmax(0, 1fr); }
  .agi--v2 .agi-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .agi--v2 .agi-facts > div:nth-child(2) { border-top: 0; }
}
@media (max-width: 559px) {
  .agi-spark { grid-template-columns: minmax(0, 1fr); }
  .agi-spark p { text-align: left; }
}