/* RT vs TP recordings: paired clips per game with five-run means. */
.bench-compare{margin-top:34px;border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:26px}
.bench-compare>h3{font-size:22px;letter-spacing:-.5px;margin:0 0 8px}
.bench-compare>.body-copy{font-size:14px;margin:0 0 6px;max-width:820px}
.bench-compare .gallery-controls{margin:18px 0 18px}
.bench-compare .segmented button small.bc-soon{margin-left:6px;font-size:9px;padding:1px 5px;border-radius:5px;background:#14161a12;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.bench-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.bench-grid{grid-auto-rows:1fr}.bc-card{display:flex;flex-direction:column}.bc-means{margin-top:auto}
.bc-card{border:1px solid var(--line);border-radius:14px;background:var(--surface-2);padding:16px;transition:box-shadow .35s,border-color .3s,transform .35s var(--ease,ease)}
.bc-card:hover{box-shadow:0 2px 6px #14161a0d,0 14px 36px #14161a16;border-color:#cfd8f4}
html[data-theme=dark] .bc-card:hover{border-color:#34406a}
.bc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}
.bc-head h4{margin:0;font-size:16px;letter-spacing:-.3px}
.bc-model{font-size:11px;color:var(--muted);font-weight:600}
.bc-sync{flex:none;width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ours);font-size:16px;line-height:1;transition:background .2s,color .2s,border-color .2s}
.bc-sync:hover{background:var(--ours);color:#fff;border-color:var(--ours)}
.bc-sync.spin{animation:bcSpin .6s var(--ease,ease)}
@keyframes bcSpin{to{transform:rotate(-360deg)}}
.bc-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bc-clip{margin:0;min-width:0}
.bc-tag{display:inline-block;margin-bottom:6px;font-size:10px;font-weight:700;letter-spacing:.5px;color:var(--secondary);text-transform:uppercase}
.bc-clip.rt .bc-tag{color:var(--down)}
.bc-frame{position:relative;aspect-ratio:16/9;border-radius:9px;overflow:hidden;background:#080b13;box-shadow:inset 0 0 0 1px #ffffff12}
.bench-grid[data-bench=oga] .bc-frame{aspect-ratio:5/2}
.bc-clip.rt .bc-frame{box-shadow:0 0 0 2px #d64c4c55}
.bc-frame video{width:100%;height:100%;object-fit:contain;display:block;cursor:pointer}
.bc-time{position:absolute;left:0;right:0;bottom:0;height:3px;background:#ffffffcc;transform-origin:left;transform:scaleX(0);pointer-events:none}
.bc-clip.rt .bc-time{background:var(--down)}
.bc-clip figcaption{display:flex;align-items:baseline;gap:8px;margin-top:7px;font-size:11px;color:var(--muted)}
.bc-clip figcaption b{font-size:15px;color:var(--ink);font-variant-numeric:tabular-nums}
.bc-clip.rt figcaption b{color:var(--ours)}
.bc-solved{font-style:normal;font-size:10px;font-weight:700;color:var(--up);background:#1f9d6b18;padding:1px 7px;border-radius:99px}
.bc-failed{font-style:normal;font-size:10px;font-weight:700;color:var(--down);background:#d64c4c18;padding:1px 7px;border-radius:99px}
.bench-grid[data-bench=mcu] .bc-clip figcaption em{font-size:12px;padding:2px 9px}
.bc-means{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);display:grid;gap:7px}
.bc-mean{display:grid;grid-template-columns:62px 1fr 46px;gap:10px;align-items:center;font-size:11px;color:var(--secondary)}
.bc-mean b{text-align:right;font-size:12px;font-variant-numeric:tabular-nums;color:var(--ink)}
.bc-track{height:9px;border-radius:5px;background:var(--baseline-soft);overflow:hidden}
.bc-track i{display:block;height:100%;border-radius:5px;background:var(--baseline);transition:width .9s var(--ease,ease)}
.bc-mean.rt .bc-track i{background:linear-gradient(90deg,#6d8bff,var(--ours))}
.bc-mean.rt b{color:var(--ours)}
.bc-delta{margin:2px 0 0;font-size:11px;color:var(--secondary)}
.bc-delta b{font-variant-numeric:tabular-nums}.bc-delta.up b{color:var(--up)}.bc-delta.down b{color:var(--down)}
.bc-placeholder .bc-empty{display:grid;place-items:center;background:repeating-linear-gradient(135deg,var(--alt) 0 10px,var(--surface) 10px 20px);box-shadow:inset 0 0 0 1px var(--line)}
.bc-placeholder .bc-empty span{font-size:12px;font-weight:600;color:var(--muted)}
.bc-note{margin:12px 0 0;font-size:12px;color:var(--muted)}
@media(max-width:900px){.bench-grid{grid-template-columns:1fr}}
@media(max-width:520px){.bench-compare{padding:18px 14px}.bc-pair{grid-template-columns:1fr}}

/* Odd counts: center the last card on its own row. */
.bench-grid:not([data-bench=mcu]) .bc-card:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc(50% - 9px)}
@media(max-width:900px){.bench-grid:not([data-bench=mcu]) .bc-card:last-child:nth-child(odd){width:100%}}

/* Cropped clips: the video is positioned inside the frame so only the game area shows. */
.bc-frame.bc-cropped video{position:absolute;max-width:none;object-fit:fill}
/* Larger players: one game per row, the two clips side by side at full card width. */
.bench-grid{grid-template-columns:1fr!important}
.bench-grid .bc-card:last-child:nth-child(odd){width:auto!important;justify-self:stretch!important}
.bc-card{display:flex;flex-direction:column}
.bc-card .bc-pair{gap:14px}
.bc-card .bc-means{display:grid;grid-template-columns:1fr 1fr;column-gap:28px;row-gap:6px}
.bc-card .bc-means .bc-delta{grid-column:1/-1}
.bench-grid[data-bench=oga] .bc-frame{aspect-ratio:auto}
@media(max-width:700px){.bc-card .bc-means{grid-template-columns:1fr}}


/* Aggregate metrics are centered over each recording, with the protocol left and change right. */
#bench-grid .bc-inline-metrics .bc-head h4{overflow-wrap:anywhere}
#bench-grid .bc-inline-metrics .bc-clip{container:bench-clip / inline-size}
#bench-grid .bc-clip-head{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:21px 24px 21px;align-items:center;gap:6px 0;margin-bottom:10px}
#bench-grid .bc-clip-head .bc-tag{grid-row:1;grid-column:1;margin:0;font-size:14px;letter-spacing:.25px;white-space:nowrap;justify-self:start}
#bench-grid .bc-rate{grid-row:2;grid-column:1;justify-self:center;font-size:16px;font-weight:600;line-height:1.5;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
#bench-grid .bc-lift{grid-row:3;grid-column:1;justify-self:end;font-size:14px;font-weight:600;line-height:1.5;white-space:nowrap;font-variant-numeric:tabular-nums}
#bench-grid .bc-lift.up{color:var(--up)}
#bench-grid .bc-lift.down{color:var(--down)}
@container bench-clip (min-width:480px){
  #bench-grid .bc-clip-head{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-rows:minmax(34px,auto);gap:0 12px}
  #bench-grid .bc-clip-head .bc-tag{grid-column:1;grid-row:1}
  #bench-grid .bc-rate{grid-column:2;grid-row:1}
  #bench-grid .bc-lift{grid-column:3;grid-row:1}
}
@media(max-width:700px){
  #bench-grid .bc-inline-metrics .bc-pair{grid-template-columns:1fr;gap:24px}
  #bench-grid .bc-clip-head{grid-template-rows:none}
}
