.results{max-width:88rem}
.breadcrumb{font-size:var(--type-body);color:var(--ink2);margin-bottom:22px}
.breadcrumb a,.results a{color:var(--accent)}
.metrics-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:24px 0}
.metric{padding:16px;border:1px solid var(--rule);border-radius:10px;background:var(--panel)}
.metric dt{font-size:var(--type-body);color:var(--ink2)}
.metric dd{font-size:var(--type-body);font-weight:650;margin:6px 0 0;font-variant-numeric:tabular-nums;letter-spacing:-.04em}
.metric small{display:block;color:var(--ink2);font-size:var(--type-small);margin-top:5px}
.trial-links{display:flex;gap:7px;flex-wrap:wrap}
.trial-link{display:inline-flex;align-items:center;justify-content:center;min-width:33px;height:33px;padding:0 7px;border:1px solid var(--rule);border-radius:6px;text-decoration:none;font-weight:650;background:var(--panel)}
.trial-link.pass{border-color:var(--ok);color:var(--ok)}
.trial-link.fail{border-color:#ac584f;color:#ac584f}
.trial-link[aria-current]{outline:2px solid var(--accent);outline-offset:2px}
.pill{display:inline-block;padding:3px 9px;font-size:var(--type-body);border:1px solid var(--rule);border-radius:20px}
.pass{color:var(--ok)}.fail{color:#b14b40}
.trace-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:24px;align-items:start;margin-top:22px}
.player-panel{position:sticky;top:16px;min-width:0}
.trace-video{display:block;width:100%;background:#121416;border-radius:10px;aspect-ratio:2/1}
.playback-bar{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin:12px 0;font-size:var(--type-body)}
.results button,.results input,.results select{font:inherit;color:var(--ink);background:var(--panel);border:1px solid var(--rule);border-radius:6px;padding:7px 10px}
.results button{cursor:pointer}.results button:hover{border-color:var(--accent)}
.results button:focus-visible,.results input:focus-visible,.results select:focus-visible,.tablewrap:focus-visible{outline:2px solid var(--accent);outline-offset:3px}


.transcript{height:76vh;min-height:420px;overflow-y:auto;border:1px solid var(--rule);border-radius:10px;background:var(--panel);scroll-behavior:smooth;position:relative}
.waypoint{padding:14px 16px;border-bottom:1px solid var(--rule);border-left:3px solid transparent}
.waypoint.active{border-left-color:var(--accent);background:color-mix(in srgb,var(--accent) 4%,var(--panel))}
.waypoint-header{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:12px;color:var(--ink2);font-size:var(--type-body)}
.waypoint-header button{font-size:var(--type-body);padding:4px 8px}
.event{margin:13px 0;min-width:0}
.event-label{font-size:var(--type-small);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink2);margin-bottom:4px}
.event-text{font-size:var(--type-body);white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6}
.event.does,.event.result{padding:10px 12px;border:1px solid var(--rule);border-radius:6px;background:var(--bg)}
.event pre{margin:5px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;font: var(--type-body)/1.5 ui-monospace,SFMono-Regular,monospace}
.event img{display:block;width:100%;height:auto;border-radius:5px;border:1px solid var(--rule)}
.event summary{cursor:pointer;font-size:var(--type-body);color:var(--ink2)}
.grade{border:1px solid var(--rule);border-radius:10px;padding:16px;background:var(--panel);margin-top:16px}
.grade h2{border:0;margin:0 0 8px;padding:0;font-size:var(--type-body)}
.grade ul{padding-left:20px;font-size:var(--type-body)}
.metric-detail{display:grid;grid-template-columns:1fr 1fr;gap:6px 20px;margin:12px 0;font-size:var(--type-body)}
.metric-detail dt{color:var(--ink2)}.metric-detail dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
.details-panel{margin-top:16px;padding:12px 16px;border:1px solid var(--rule);border-radius:10px;background:var(--panel)}
.metric-breakdown h2{margin:0;padding:0;border:0;font-size:var(--type-body);font-weight:550}
.details-panel summary{cursor:pointer;font-weight:550;font-size:var(--type-body)}
.details-panel p,.details-panel pre{font-size:var(--type-body);white-space:pre-wrap;overflow-wrap:anywhere}
.results .tablewrap{margin-top:22px}.results table{font-size:var(--type-body)}
.results th,.results td{padding:13px 14px}
.source-note{font-size:var(--type-body);color:var(--ink2);margin-top:14px}
[hidden]{display:none!important}
@media(max-width:1050px){.metrics-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:800px){.trace-layout{grid-template-columns:1fr}.player-panel{position:static}.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric dd{font-size:var(--type-body)}.transcript{height:65vh}.results{padding:26px 16px}}
/* Compact model results without changing the trace layout. */
body[data-view=run] .results{max-width:80rem;padding:22px 20px 32px}
body[data-view=run] .breadcrumb{margin-bottom:12px}
body[data-view=run] .page-heading{margin-bottom:14px}
body[data-view=run] .page-heading h1{font-size:var(--type-title)}
body[data-view=run] .eyebrow{margin-bottom:4px}
body[data-view=run] .page-heading .sub{margin-top:4px;font-size:var(--type-body)}
body[data-view=run] .results>h2{font-size:var(--type-body);margin:16px 0 8px;padding-bottom:4px}
body[data-view=run] .tablewrap{margin:10px 0 8px;border-radius:8px}
body[data-view=run] .results th,body[data-view=run] .results td{padding:8px 10px}
body[data-view=run] .trial-links{gap:5px;flex-wrap:nowrap}
body[data-view=run] .trial-link{height:27px;min-width:29px;padding:0 6px;font-size:var(--type-small)}
body[data-view=run] .results>.note{font-size:var(--type-body);margin:8px 0}
.task-histogram{margin:16px 0 12px;padding:12px 14px 8px;border:1px solid var(--rule);border-radius:8px;background:var(--panel)}
.task-histogram figcaption{display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:4px}
.task-histogram h2{font-size:var(--type-body);margin:0;padding:0;border:0}
.task-histogram figcaption span{font-size:var(--type-small);color:var(--ink2)}
.histogram-unit{display:flex;gap:2px;padding:2px;border:1px solid var(--rule);border-radius:6px;margin-left:auto}
.histogram-unit button{border:0;border-radius:4px;background:transparent;color:var(--ink2);padding:3px 9px;font-size:var(--type-small);cursor:pointer}
.histogram-unit button[aria-pressed=true]{background:var(--accent);color:#fff}
.histogram-unit button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.histogram-scroll{overflow-x:auto}
.task-histogram svg{display:block;width:100%;min-width:480px;max-height:230px}
.task-histogram text{font-size:var(--type-small);fill:var(--ink2);font-variant-numeric:tabular-nums}
.task-histogram .histogram-axis-title{font-size:var(--type-small);fill:var(--ink)}
.histogram-grid{stroke:var(--rule);stroke-width:1}
.histogram-bar{fill:var(--accent);opacity:.75}
.histogram-hit{fill:transparent}
.histogram-bin:hover .histogram-bar,.histogram-bin:focus .histogram-bar{opacity:1}
.histogram-bin:focus{outline:1px solid var(--accent)}
.task-histogram .histogram-value{fill:var(--ink);font-size:var(--type-small)}
/* The trace has a compact header, replay, turn timeline, and a chart rail. */
body[data-view=trace] .site-nav{min-height:68px}
.trace-page{max-width:100rem;padding:12px 18px 28px}
.trace-page .breadcrumb{margin-bottom:6px}
.trace-page .page-heading{margin-bottom:0}
.trace-page .page-heading h1{font-size:var(--type-body)}
.trace-title-line{display:flex;align-items:center;justify-content:space-between;gap:12px}
.trace-title-line h1{margin:0}
.trace-meta-line{display:flex;align-items:center;gap:6px 12px;margin-top:6px;overflow-x:auto;padding:3px}
.trace-meta-line>*{flex-shrink:0;white-space:nowrap}
.trace-meta-line .sub{margin:0;font-size:var(--type-body)}
.trace-meta-line .trial-links{gap:5px;flex-wrap:nowrap}
.trace-meta-line .trial-link{min-width:26px;height:26px;font-size:var(--type-small)}
.trace-page .eyebrow{display:none}
.trace-page .metrics-grid{margin:16px 0;gap:10px}
.trace-page .metric{padding:10px 14px}
.trace-page .metric dd{font-size:var(--type-body);margin:3px 0}
.trace-page .metric small{font-size:var(--type-small)}
.trace-page .trace-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.2fr) minmax(190px,.48fr);gap:12px;margin-top:8px;grid-template-areas:"player timeline charts"}
.trace-page .player-panel{grid-area:player}
.trace-page .playback-bar{gap:7px;margin:8px 0}
.trace-page .metric-breakdown{margin-top:10px;padding:9px 10px}
.trace-page .metric-detail{gap:4px 14px;margin:8px 0 0}
.timeline-panel{grid-area:timeline;min-width:0}
.timeline-heading{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.timeline-heading h2{white-space:nowrap;font-size:var(--type-body);margin:0;padding:0;border:0}
.timeline-heading label{font-size:var(--type-small);color:var(--ink2)}
.timeline-heading #search{min-width:60px;width:140px;max-width:160px;flex:1;padding:5px 8px;font-size:var(--type-small)}
.timeline-heading #turn-jump{width:84px;margin-left:auto;padding:5px 8px;font-size:var(--type-small)}
.trace-tabs{display:flex;gap:18px;border-bottom:1px solid var(--rule);margin-bottom:8px}
.trace-tabs [role=tab]{border:0;border-bottom:2px solid transparent;border-radius:0;background:none;padding:6px 0;font-size:var(--type-body);color:var(--ink2)}
.trace-tabs [aria-selected=true]{border-bottom-color:var(--accent);color:var(--ink);font-weight:600}
.task-prompt-panel{padding:16px;border:1px solid var(--rule);border-radius:10px;background:var(--panel)}
.task-prompt-panel p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:var(--type-body);line-height:1.65}



.trace-page .transcript{height:calc(100vh - 130px);min-height:440px}
.model-turn{display:grid;grid-template-columns:72px minmax(0,1fr);padding:0}
.turn-gutter{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:7px 8px;border-right:1px solid var(--rule);font:var(--type-small)/1.45 ui-monospace,SFMono-Regular,monospace;color:var(--ink2)}
.turn-body{min-width:0;padding:2px 10px 5px}
.turn-number{font-weight:700;text-decoration:none;font-size:var(--type-body)}
.turn-cost{color:var(--ink)}
.turn-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:var(--type-small);color:var(--ink2);padding:4px 0;border-bottom:1px solid var(--rule)}
.turn-meta button{font-size:var(--type-small);padding:2px 6px;margin-left:auto}
.trace-page .event-text{font-size:var(--type-body);line-height:1.45}.trace-page .event-label{font-size:var(--type-small);margin-bottom:2px}
.trace-page .event pre{font-size:var(--type-small);line-height:1.4;margin-top:3px}
.trace-page .event.does strong{font:600 var(--type-small)/1.45 ui-monospace,SFMono-Regular,monospace;overflow-wrap:anywhere}
.trace-page .event.does,.trace-page .event.result{padding:5px 8px}
.trace-page .event{margin:4px 0}
.turn-body>.event:last-child{margin-bottom:0}
.chart-rail{grid-area:charts;position:sticky;top:16px;min-width:0}
.turn-chart{padding:7px;margin:0 0 7px;background:var(--panel);border:1px solid var(--rule);border-radius:8px}
.turn-chart figcaption{display:flex;justify-content:space-between;gap:8px;font-size:var(--type-small);color:var(--ink2);margin:0 0 8px}
.turn-chart figcaption strong{font-weight:600;color:var(--ink)}
.turn-chart svg{width:100%;height:68px;display:block;overflow:visible;cursor:crosshair}
.chart-bar{fill:var(--accent);opacity:.65}.chart-line{fill:none;stroke:var(--accent);stroke-width:1.8}.chart-area{fill:var(--accent);opacity:.1}
.chart-hit{fill:transparent}.chart-hit:hover{fill:var(--accent);opacity:.16}
.chart-cursor{stroke:var(--ink);stroke-width:1;stroke-dasharray:2 2;pointer-events:none}
.chart-axis{display:flex;justify-content:space-between;font-size:var(--type-small);color:var(--ink2);margin-top:4px}
.chart-readout{display:grid;gap:4px;font-size:var(--type-small);padding:10px;border:1px solid var(--rule);border-radius:8px;background:var(--panel)}
.chart-rail .source-note{font-size:var(--type-small)}
@media(max-width:1150px){.trace-page .trace-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);grid-template-areas:"player timeline" "charts timeline"}.chart-rail{position:static;display:grid;grid-template-columns:1fr 1fr;gap:10px}.chart-readout,.chart-rail>.source-note{grid-column:1/-1}.turn-chart{margin:0}.trace-page .player-panel{position:static}}
@media(max-width:750px){.trace-page{padding:16px 14px}.trace-page .trace-layout{grid-template-columns:1fr;grid-template-areas:"player" "charts" "timeline"}.trace-page .transcript{height:70vh}.trace-page .metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.trace-page .metric:last-child{grid-column:1/-1}}
.observation-link{display:block;text-decoration:none}
.observation-link span{display:block;font-size:var(--type-small);color:var(--ink2);padding-top:4px}
.trace-page .event img{max-height:360px;object-fit:contain;background:var(--bg)}

.breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:var(--type-body)}

@media(max-width:750px){.model-turn{grid-template-columns:60px minmax(0,1fr)}.turn-gutter{padding:7px 6px;font-size:var(--type-small)}.turn-body{padding:2px 8px 5px}}
@media(max-width:750px){.timeline-heading{flex-wrap:wrap}}

.trace-play{font-size:var(--type-small);margin-right:4px;opacity:.8}
.trial-link:hover{box-shadow:0 0 0 1px currentColor;text-decoration:underline;text-underline-offset:3px}

/* Stable trace layout while the private replay data is in flight. */
.trace-loading .loading-video{aspect-ratio:2/1;border-radius:10px;background:var(--rule)}
.trace-loading .loading-metrics{height:240px;margin-top:12px}
.trace-loading .loading-metrics,.trace-loading .loading-turns,.trace-loading .loading-chart{border:1px solid var(--rule);border-radius:8px;background:var(--panel)}
.trace-loading .trace-tabs{padding:6px 0;font-size:var(--type-body)}
.trace-loading .loading-turn{padding:12px;border-bottom:1px solid var(--rule)}
.trace-loading .loading-turn:last-child{border:0}
.trace-loading .loading-turn span{display:block;height:10px;background:var(--rule);margin:8px 0;border-radius:3px}
.trace-loading .loading-turn span:first-child{width:35%}
.trace-loading .loading-turn span:last-child{width:70%}
.trace-loading .loading-chart{height:110px;margin-bottom:7px}

.event .tool-invocation{display:block;white-space:pre-wrap;overflow-wrap:anywhere;font:var(--type-small)/1.45 ui-monospace,SFMono-Regular,monospace}
.event .tool-invocation strong{font:inherit;font-weight:600}