/* Section 5 — revision series */

.s5-kicker{
  font-family:var(--font-mono);font-size:.9rem;text-transform:uppercase;letter-spacing:.06em;
  color:var(--text-muted);margin:0 0 12px;
}
.s5-kicker-table{margin-top:56px}
.s5-tablenote{max-width:46em;color:var(--text-secondary);font-size:.95rem}

/* ---- SVG chart primitives (shared by sparkline, featured card, popup) ---- */
.s5-chart{display:block;overflow:visible}
.s5-chart .s5-endlabel{
  font-family:var(--font-mono);font-size:9.5px;fill:var(--text-secondary);font-weight:500;
}
.s5-chart .s5-endlabel-last{fill:var(--accent-ink);font-weight:600}
.s5-chart .s5-axis{font-family:var(--font-mono);font-size:8.5px;fill:var(--text-muted)}
.s5-feat-chart .s5-endlabel,.s5-pop-chart .s5-endlabel{font-size:13px}
.s5-feat-chart .s5-axis,.s5-pop-chart .s5-axis{font-size:10px}

/* ---- Chart point interactivity ---- */
.s5-chart .s5-hit{fill:transparent;cursor:pointer;outline:none}
.s5-chart .s5-hit:hover + .s5-dot,.s5-chart .s5-dot{transition:r .12s}
.s5-chart .s5-hit:hover,.s5-chart .s5-hit:focus-visible{
  fill:var(--accent);fill-opacity:.16;stroke:var(--accent);stroke-width:1;stroke-opacity:.55;
}

/* ---- Featured cards ---- */
/* Two cards side by side must line their charts up even when the titles wrap to
   different heights: the parent owns the row tracks, each card is a subgrid of them. */
.s5-featured{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:20px;margin-bottom:8px;
  grid-template-rows:repeat(7,auto);align-items:start;
}
.s5-feat{
  display:grid;grid-row:span 7;grid-template-rows:subgrid;row-gap:0;align-content:start;
  text-align:left;width:100%;cursor:pointer;font:inherit;color:inherit;
  background:var(--surface-1);border:1px solid var(--border-strong);border-radius:var(--radius-l);
  padding:22px 22px 18px;box-shadow:var(--shadow-1);
  transition:box-shadow .16s,transform .16s,border-color .16s;
}
/* Fallback where subgrid is unavailable: reserve enough header height for a 3-line title. */
@supports not (grid-template-rows:subgrid){
  .s5-featured{grid-template-rows:none}
  .s5-feat{display:block;grid-row:auto}
  .s5-feat h4{min-height:3.54em}
  .s5-feat-hook{min-height:4.4em}
}
.s5-feat:hover{box-shadow:var(--shadow-2);transform:translateY(-2px);border-color:var(--accent)}
.s5-feat-eyebrow{
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent-ink);font-weight:700;margin-bottom:8px;
}
.s5-feat h4{font-family:var(--font-display);font-size:1.28rem;line-height:1.18;margin:0 0 14px;letter-spacing:-.01em;min-height:2.36em}
.s5-feat-chart{
  background:var(--bg-sunken);border:1px solid var(--border);border-radius:var(--radius-m);
  padding:10px 12px;margin-bottom:14px;
}
.s5-feat-chart svg{width:100%;height:auto}
.s5-feat-hook{font-family:var(--font-serif);font-size:.98rem;line-height:1.5;color:var(--text-secondary);margin:0 0 12px}
.s5-feat-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.s5-feat-count{font-family:var(--font-mono);font-size:.7rem;color:var(--text-muted)}
.s5-feat-cta{font-family:var(--font-mono);font-size:.72rem;color:var(--accent-ink);margin-top:12px}

/* ---- "What to revisit" callout ---- */
.s5-revisit{
  background:var(--accent-soft);border-left:3px solid var(--accent);border-radius:0 var(--radius-s) var(--radius-s) 0;
  padding:10px 12px;font-size:.86rem;line-height:1.45;color:var(--text-primary);
}
.s5-revisit span{
  display:block;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent-ink);font-weight:600;margin-bottom:4px;
}
.s5-revisit-pop{margin:12px 0 4px}

/* ---- Table ---- */
.s5-tablewrap{margin-top:14px}
.s5-table td{vertical-align:middle}
.s5-table .s5-row-feat{background:color-mix(in srgb,var(--accent-soft) 45%,transparent)}
.s5-table .s5-row-feat:hover{background:var(--accent-soft)}
.s5-cell-name{min-width:230px;max-width:280px}
.s5-name{display:block;font-weight:600;color:var(--text-primary);line-height:1.3}
.s5-unit{display:block;font-family:var(--font-mono);font-size:.66rem;color:var(--text-muted);margin-top:2px}
.s5-cell-chart{width:230px}
.s5-cell-n{white-space:nowrap}
.s5-cell-n b{font-family:var(--font-mono);font-size:1rem;color:var(--text-primary)}
.s5-cell-n span{display:block;font-family:var(--font-mono);font-size:.66rem;color:var(--text-muted)}
.s5-cell-move{font-family:var(--font-mono);font-size:.78rem;color:var(--text-secondary);white-space:nowrap}
.s5-cell-status{white-space:nowrap}

/* ---- Popup contents ---- */
#popup .s5-pop-hook{font-family:var(--font-serif);font-size:1rem;line-height:1.5;color:var(--text-secondary)}
#popup .s5-pop-chart{
  background:var(--bg-sunken);border:1px solid var(--border);border-radius:var(--radius-m);
  padding:10px 12px;margin:14px 0;
}
#popup .s5-pop-chart svg{width:100%;height:auto}
#popup .s5-pop-h{
  font-family:var(--font-mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;
  color:var(--text-muted);margin:22px 0 10px;padding-top:12px;border-top:1px solid var(--border);
}
#popup .s5-timeline{list-style:none;margin:0;padding:0 0 0 18px;border-left:2px solid var(--border-strong)}
#popup .s5-node{position:relative;padding:0 0 20px 14px}
#popup .s5-node::before{
  content:'';position:absolute;left:-25px;top:5px;width:9px;height:9px;border-radius:50%;
  background:var(--series-1);border:2px solid var(--bg-raised);
}
#popup .s5-node-last::before{background:var(--accent);width:12px;height:12px;left:-27px;top:3px}
#popup .s5-node-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:3px}
#popup .s5-node-date{font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted)}
#popup .s5-node-val{
  font-family:var(--font-mono);font-size:.88rem;font-weight:600;color:var(--accent-ink);
  background:var(--accent-soft);border-radius:var(--radius-s);padding:1px 8px;
}
#popup .s5-node-doc{font-family:var(--font-mono);font-size:.68rem;color:var(--text-muted);margin-bottom:6px}
#popup .s5-node-claim{
  display:block;width:100%;text-align:left;font:inherit;font-size:.92rem;color:var(--text-primary);
  background:none;border:none;border-radius:var(--radius-s);padding:0;cursor:pointer;
}
#popup .s5-node-claim:hover{color:var(--link)}
#popup .s5-node-claim span{
  display:block;font-family:var(--font-mono);font-size:.64rem;color:var(--link);margin-top:2px;opacity:.85;
}
#popup .s5-node .passage{font-size:.86rem;margin:8px 0 0}
#popup .s5-node-cite{font-family:var(--font-mono);font-size:.66rem;color:var(--status-serious-ink);margin-top:6px;font-weight:600}
#popup .s5-node-adj{
  font-size:.84rem;color:var(--text-secondary);margin-top:6px;padding-left:10px;
  border-left:2px solid var(--border-strong);
}
#popup .s5-ev{margin-bottom:12px}
#popup .s5-ev a{font-size:.9rem;font-weight:600;text-decoration:none}
#popup .s5-ev a:hover{text-decoration:underline}
#popup .s5-ev-meta{display:block;font-family:var(--font-mono);font-size:.66rem;color:var(--text-muted);margin-top:2px}
#popup .s5-ev ul{margin:6px 0 0;padding-left:18px;font-size:.86rem}
#popup .s5-ev li{margin-bottom:3px}
#popup .s5-comparability{
  margin-top:20px;padding:12px 14px;background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--radius-s);font-size:.8rem;line-height:1.5;color:var(--text-secondary);
}
#popup .s5-comparability b{font-family:var(--font-mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}

/* ---- Single-point popup extras ---- */
#popup .s5-pop-change{
  font-size:.9rem;line-height:1.5;color:var(--text-secondary);margin:10px 0 0;
  padding-left:10px;border-left:2px solid var(--border-strong);
}
#popup .s5-timeline-solo{border-left-color:var(--accent)}
#popup .s5-node-solo{padding-bottom:4px}
#popup .s5-pop-all{
  display:block;margin-top:18px;width:100%;text-align:left;cursor:pointer;
  font-family:var(--font-mono);font-size:.72rem;color:var(--accent-ink);
  background:var(--accent-soft);border:1px solid var(--border-strong);border-radius:var(--radius-s);
  padding:10px 12px;
}
#popup .s5-pop-all:hover{border-color:var(--accent)}
#popup .s5-srclink{font-weight:600;text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--link) 45%,transparent)}
#popup .s5-srclink:hover{border-bottom-color:var(--link)}
#popup .s5-ev-title{font-size:.9rem;font-weight:600;color:var(--text-primary)}

/* ---- Stat proof popups ---- */
#popup .s5-proof{list-style:none;margin:10px 0 0;padding:0}
#popup .s5-proof li{
  padding:8px 0;border-bottom:1px solid var(--border);font-size:.9rem;line-height:1.45;
}
#popup .s5-proof li:last-child{border-bottom:none}
#popup .s5-proof li b{display:block;color:var(--text-primary);font-weight:600}
#popup .s5-proof li span{
  display:block;font-family:var(--font-mono);font-size:.7rem;color:var(--text-muted);margin-top:2px;
}
#popup .s5-proof li .badge{margin-top:4px}

@media (max-width:820px){
  .s5-featured{grid-template-columns:1fr}
  .s5-cell-name{min-width:170px}
}