/* resultviewer — page-specific styles; theme + chrome from /index.css */
.run-title{font-size:var(--fs-h2);letter-spacing:var(--ls-tight);margin-top:6px}
.run-title a{color:inherit;text-decoration:none}
.run-title a:hover{text-decoration:underline;color:var(--accent)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.chip{font-family:var(--font-mono);font-size:12px;color:var(--ink-soft);
  border:1px solid var(--line);border-radius:var(--radius-pill);padding:5px 12px;
  background:var(--surface)}

.chip-score{border-color:var(--accent);color:var(--accent);font-weight:700}

.tbl{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  box-shadow:var(--shadow-sm);font-size:14.5px;margin-top:14px}
.tbl th,.tbl td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--line-soft);
  font-variant-numeric:tabular-nums}
.tbl thead th{background:var(--navy);color:var(--c-on-dark);font-size:11.5px;
  letter-spacing:.09em;text-transform:uppercase;font-weight:var(--fw-semibold)}
.tbl thead th[data-sort]{cursor:pointer;user-select:none}
.tbl thead th[data-sort]:hover{color:var(--accent)}
/* caret space is always reserved so sorting never reflows the columns */
.tbl thead th i.car{display:inline-block;visibility:hidden;font-style:normal;
  margin-left:8px;width:15px;text-align:left;font-size:15px;line-height:1;
  vertical-align:-1px}
.tbl thead th.sorted i.car{visibility:visible;color:var(--accent)}
.tbl thead th.sorted.desc i.car::after{content:'\25BC'}
.tbl thead th.sorted.asc i.car::after{content:'\25B2'}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl td a{color:var(--accent-2);font-weight:600}
.tbl td a:hover{color:var(--accent)}
.tbl tr.rowlink{cursor:pointer}
.tbl tr.rowlink:hover td{background:var(--bg-alt)}

.pager{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px}
.pager .btn:disabled{opacity:.4;cursor:default}
.hl-grid{margin-bottom:30px}
.card.hl{cursor:pointer}
.card.hl .hl-model{font-size:17px;margin:0 0 4px}
.card.hl .hl-meta{font-size:13px;color:var(--ink-mute);margin:0}
.hl-score{display:block;text-align:center;font-size:clamp(28px,3vw,38px);
  font-weight:var(--fw-heavy);letter-spacing:-.03em;color:var(--accent);
  margin:16px 0 4px}
.hl-nums{display:flex;justify-content:center;gap:22px;margin-top:10px;
  padding-top:12px;border-top:1px solid var(--line-soft)}
.hl-nums span{display:block;text-align:center}
.hl-nums b{display:block;font-size:15px;font-weight:var(--fw-semibold);
  letter-spacing:-.01em;color:var(--ink)}
.hl-nums i{display:block;font-style:normal;font-size:10px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-mute);margin-top:2px}
.card.hl:hover{text-decoration:none}
.card.hl[data-empty]{cursor:default}
.card.hl[data-empty] .hl-nums b{color:var(--ink-mute)}
.card.hl[data-empty]:hover{transform:none;box-shadow:var(--shadow-sm)}
/* compare slider switch + selection tray */
.cmp-sw{display:inline-block;position:relative;width:34px;height:20px;vertical-align:middle}
.cmp-sw input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer;z-index:1}
.cmp-sw i{display:block;height:20px;border-radius:10px;background:var(--bg-alt);
  border:1px solid var(--ink-mute);transition:background .18s ease,border-color .18s ease}
.cmp-sw i::after{content:'';position:absolute;top:3px;left:3px;width:14px;height:14px;
  border-radius:50%;background:var(--ink-mute);transition:transform .18s ease,background .18s ease}
.cmp-sw input:checked + i{background:var(--accent-soft);border-color:var(--accent)}
.cmp-sw input:checked + i::after{transform:translateX(14px);background:var(--accent)}
.cmp-sw input:focus-visible + i{outline:2px solid var(--accent);outline-offset:2px}
.cmp-sw input:disabled{cursor:default}
.cmp-sw input:disabled + i{opacity:.35}
.cmp-tray{position:sticky;top:calc(var(--header-h, 64px) + 10px);z-index:30;
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px;
  padding:12px 16px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.cmp-slots{display:flex;gap:8px;flex-wrap:wrap;margin-right:auto}
.cmp-chip{font-family:var(--font-mono);font-size:12.5px;color:var(--ink);
  border:1px solid var(--line);border-radius:var(--radius-pill);padding:5px 10px;
  display:inline-flex;align-items:center;gap:8px;background:var(--bg-alt)}
.cmp-chip b{cursor:pointer;color:var(--ink-mute);font-weight:700}
.cmp-chip b:hover{color:var(--accent)}

/* detail summary cards */
.sum-grid{margin:30px 0 10px}
.run-notes{margin:22px 0 6px;padding:14px 18px;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--radius);
  font-size:14.5px;line-height:1.55;color:var(--ink-soft);white-space:pre-wrap;
  overflow-wrap:break-word}
.sum-card{padding:16px 18px}
.card.sum-card:hover{transform:none;box-shadow:var(--shadow-sm)}
.sc-label{display:block;font-family:var(--font-mono);font-size:10.5px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute)}
.sc-val{display:block;font-size:clamp(21px,2.3vw,27px);font-weight:var(--fw-heavy);
  letter-spacing:-.02em;color:var(--ink);margin:6px 0 2px}
.sc-sub{display:block;font-style:normal;font-family:var(--font-mono);font-size:11px;
  color:var(--ink-mute)}
.sum-card.accent .sc-val{color:var(--accent)}

/* click-to-expand chart above each table: grid-rows 0fr→1fr animates cleanly */
.plot-anim{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease}
.plot-anim.open{grid-template-rows:1fr}
.plot-anim>div{overflow:hidden;min-height:0}
.plot{position:relative;margin-top:14px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:16px 18px 10px}
.plot svg{display:block;width:100%;height:auto}
.plot .cross{stroke:var(--ink-mute);stroke-width:1;stroke-dasharray:3 3}
.tip{position:absolute;top:0;left:0;pointer-events:none;z-index:5;opacity:0;
  transition:opacity .12s ease;background:var(--navy);color:var(--c-on-dark);
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);
  padding:9px 12px;min-width:150px;font-size:13px;line-height:1.4}
.tip-h{font-weight:var(--fw-semibold);letter-spacing:.01em;margin-bottom:5px;
  border-bottom:1px solid var(--navy-2);padding-bottom:5px;color:var(--c-on-dark)}
.tip-row{display:flex;justify-content:space-between;gap:16px}
.tip-row span{color:var(--c-on-dark-4)}
.tip-row b{font-family:var(--font-mono);font-weight:var(--fw-semibold);color:var(--c-on-dark)}
.plot .gl{stroke:var(--line-soft)}
.plot .bl{stroke:var(--line)}
.plot .tick{fill:var(--ink-mute);font-family:var(--font-mono);font-size:10.5px}
.plot .bar{fill:var(--accent)}
.plot .ln{stroke:var(--accent);fill:none;stroke-width:2;stroke-linejoin:round}
.plot .ln2{stroke:var(--ink-mute);fill:none;stroke-width:1.5;stroke-dasharray:4 4}
.plot .dot{fill:var(--accent);stroke:var(--surface);stroke-width:2}
.plot .band{fill:var(--accent);opacity:.12}
.tbl.clickable{cursor:pointer}

@media(max-width:820px){.tbl{font-size:13px}.tbl th,.tbl td{padding:9px 8px}}
