.app-overview__intro { padding-top: var(--space-xl); }
.app-overview__opening { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-xl); align-items: center; }
.app-overview__name { margin-bottom: var(--space-l); font-size: var(--fs-control); font-weight: var(--fw-ui); }
.app-overview__title { max-width: 19ch; font-size: var(--fs-section); line-height: var(--lh-title); letter-spacing: var(--tracking-title); text-wrap: balance; }
.app-overview__summary { max-width: 48ch; margin-top: var(--space-l); font-size: var(--fs-reading-lead); }
.app-overview__actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-l); margin-top: var(--space-l); }
.app-overview__actions .text-link { font-size: var(--fs-control); }
.app-overview__note { max-width: var(--reading-measure); margin-top: var(--space-l); color: var(--ink-muted); font-size: var(--fs-caption); }
.app-overview__screenshot { min-width: 0; }
.app-overview__screenshot img { width: 100%; height: auto; border: var(--border-thin) solid var(--ink); border-radius: var(--radius-btn); box-shadow: var(--shadow-hard); background: var(--surface); }
.app-overview__screenshot figcaption { margin-top: var(--space-l); color: var(--ink-muted); font-size: var(--fs-caption); }
.app-overview__destinations { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-xl); margin-top: var(--space-xl); }
.app-overview__destination { display: block; padding-block: var(--space-l); border-top: var(--border) solid var(--ink); text-decoration: none; }
.app-overview__destination-title { display: flex; justify-content: space-between; align-items: center; gap: var(--space-m); font-size: var(--fs-card-title); font-weight: var(--fw-title); }
.app-overview__destination-title .icon { flex: none; }
.app-overview__destination > span:last-child { display: block; max-width: 36ch; margin-top: var(--space-s); color: var(--ink-muted); font-size: var(--fs-control); }
.app-overview__destination:hover .app-overview__destination-title { text-decoration: underline; text-underline-offset: .2em; }
.stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-xl); margin-block: var(--space-l) var(--space-xl); padding-block: var(--space-l); border-top: var(--border-thin) solid var(--rail-tie); }
.stats__item { display: flex; flex-direction: row-reverse; align-items: center; justify-content: flex-end; gap: var(--space-m); }
.stats dd { font-family: var(--font-mono); font-weight: var(--fw-title); font-size: var(--fs-metric-m); line-height: 1; }
.stats dt { max-width: 14ch; color: var(--ink-muted); font-size: var(--fs-control); line-height: var(--lh-ui); }
.stats dd a { display: inline-flex; align-items: center; justify-content: center; min-width: var(--target-size); min-height: var(--target-size); text-decoration-thickness: var(--border-thin); text-underline-offset: .15em; }
.app-overview__lead { max-width: var(--reading-measure); margin-top: var(--space-l); font-size: var(--fs-reading-lead); }
.app-overview__agents { background: var(--panel-bg); color: var(--panel-text); }
.app-overview__agent-opening { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--section-pad-y); align-items: center; }
.app-overview__agents .app-overview__name { color: var(--panel-title); }
.app-overview__agents h2 { max-width: 18ch; color: var(--surface); font-size: var(--fs-section); line-height: var(--lh-title); text-wrap: balance; }
.app-overview__agent-scores { display: grid; gap: var(--space-xl); }
.app-overview__agent-score { min-width: 0; }
.app-overview__agent-score h3 { font-size: var(--fs-control-large); font-weight: var(--fw-ui); }
.app-overview__score { display: inline-flex; align-items: baseline; margin-block: var(--space-xs); font-family: var(--font-mono); font-size: var(--fs-section); line-height: var(--lh-title); color: var(--surface); text-decoration: none; }
.app-overview__score:hover { text-decoration: underline; text-decoration-thickness: var(--border-thin); text-underline-offset: .15em; }
.app-overview__score .fraction__max { font-size: var(--fs-card-title); color: var(--panel-text); }
.app-overview__agents .score-meter { width: 100%; }
.app-overview__agents .score-meter__cell { flex-grow: 1; height: 22px; background: transparent; border-color: var(--terminal-comment); }
.app-overview__agents .score-meter__cell--on { background: var(--highlight); border-color: var(--highlight); }
.app-overview__score-branch { display: inline-flex; align-items: center; min-height: var(--target-size); margin-top: var(--space-xs); font-family: var(--font-mono); font-size: var(--fs-caption); text-underline-offset: .25em; overflow-wrap: anywhere; }
.app-overview__agent-score .pending-note { margin-block: var(--space-l); color: var(--panel-text); }
.app-overview__agent-chart { margin-top: var(--space-xl); padding: var(--space-l); border-radius: var(--radius-btn); background: var(--surface); color: var(--ink); }
.app-overview__agent-chart .chart__svg { min-width: 1116px; }
.app-overview__agent-chart figcaption { font-size: var(--fs-card-title); font-weight: var(--fw-title); }
.app-overview__agent-chart .chart__hint { margin-top: var(--space-xs); font-size: var(--fs-caption); }
.app-overview__agent-reading { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--section-pad-y); margin-top: var(--space-xl); }
.app-overview__agent-reading h3 { font-size: var(--fs-card-title); line-height: var(--lh-ui-title); }
.app-overview__criteria { margin-top: var(--space-l); }
.app-overview__criteria > div { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: var(--space-m); padding-block: var(--space-s); border-top: 1px solid var(--terminal-rule); font-size: var(--fs-control); }
.app-overview__criteria dt { color: var(--surface); font-weight: var(--fw-ui); }
.app-overview__agent-next > p:first-child { max-width: 35ch; font-size: var(--fs-card-title); line-height: var(--lh-ui); }
.app-overview__agent-next > .button { margin-top: var(--space-l); }
.app-overview__agent-next > .text-link { display: block; width: fit-content; margin-top: var(--space-l); color: var(--surface); font-size: var(--fs-control); }
.app-overview__agents .app-overview__note { color: var(--panel-text); }
.app-overview__agents :focus-visible { outline-color: var(--surface); }
.app-overview__agent-chart :focus-visible { outline-color: var(--focus); }
.app-overview__origin-opening { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--section-pad-y); align-items: start; }
.app-overview__author { display: flex; align-items: center; gap: var(--space-m); margin-bottom: var(--space-xl); }
.app-overview__author img { width: 72px; height: 72px; border-radius: 50%; border: var(--border-thin) solid var(--ink); }
.app-overview__author p { font-size: var(--fs-control-large); font-weight: var(--fw-title); }
.app-overview__author span { color: var(--ink-muted); font-size: var(--fs-caption); }
.app-overview__origin h2 { max-width: 18ch; font-size: var(--fs-section); line-height: var(--lh-title); text-wrap: balance; }
.app-overview__motivation blockquote { margin-bottom: var(--space-xl); padding: var(--space-l); background: var(--highlight); border-radius: var(--radius-btn); font-size: var(--fs-editorial-title); font-weight: var(--fw-title); line-height: var(--lh-ui-title); text-wrap: balance; }
.app-overview__motivation > p { max-width: var(--reading-measure); margin-top: var(--space-l); font-size: var(--fs-reading); }
.app-overview__origin .ramp { margin-top: var(--space-xl); padding-top: var(--space-l); border-top: var(--border-thin) solid var(--rail-tie); }
.app-overview__origin-next { display: flex; justify-content: center; }
.app-overview__product, .app-overview__community { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); align-items: center; gap: var(--space-xl); padding-block: var(--space-xl); border-top: var(--border-thin) solid var(--rail-tie); }
.app-overview__product h2, .app-overview__community h2 { font-size: var(--fs-card-title); line-height: var(--lh-ui-title); }
.app-overview__product p, .app-overview__community p:not(.app-overview__note) { max-width: var(--reading-measure); margin-top: var(--space-m); font-size: var(--fs-ui-body); }
.app-overview__product-links { display: grid; justify-items: start; gap: var(--space-l); }
.app-overview__product-links a { font-size: var(--fs-control); }
.app-overview__community .app-overview__actions { margin-top: 0; }

@media (max-width: 1000px) {
  .app-overview__opening, .app-overview__agent-opening, .app-overview__agent-reading, .app-overview__origin-opening { gap: var(--space-xl); }
  .app-overview__opening { grid-template-columns: minmax(0, 1fr); }
  .app-overview__title { max-width: 24ch; }
  .app-overview__summary { max-width: var(--reading-measure); }
  .app-overview__screenshot { max-width: 48rem; }
  .app-overview__criteria > div { grid-template-columns: minmax(0, 1fr); gap: var(--space-xs); }
}

@media (max-width: 700px) {
  .app-overview__intro { padding-top: var(--space-l); }
  .app-overview__title { font-size: var(--fs-editorial-title); }
  .app-overview__destinations, .app-overview__agent-opening, .app-overview__agent-reading, .app-overview__origin-opening, .app-overview__product, .app-overview__community { grid-template-columns: minmax(0, 1fr); }
  .app-overview__destinations { gap: 0; }
  .app-overview__destination > span:last-child { max-width: none; }
  .app-overview__actions { align-items: start; flex-direction: column; }
  .app-overview__screenshot img { box-shadow: none; }
  .stats { gap: var(--space-m); }
  .stats__item { flex-direction: column-reverse; align-items: start; justify-content: flex-end; gap: var(--space-xs); }
  .stats dt { font-size: var(--fs-caption); }
  .app-overview__agents h2 { max-width: 22ch; }
  .app-overview__agent-chart { padding: var(--space-m); }
  .app-overview__agent-chart figcaption { font-size: var(--fs-control-large); }
  .app-overview__agent-scores { gap: var(--space-l); }
  .app-overview__agent-score + .app-overview__agent-score { padding-top: var(--space-l); border-top: 1px solid var(--terminal-rule); }
  .app-overview__author { margin-bottom: var(--space-l); }
  .app-overview__motivation blockquote { margin-bottom: var(--space-l); }
  .app-overview__origin-next { justify-content: flex-start; }
}