.comparison-section,.usage-section { margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--line); }
.results-modes { display:flex; gap:6px; margin:24px 0; }
.results-modes button { min-height:44px; padding:10px 14px; border:1px solid #2b00ff4d; border-radius:0; color:var(--blue); background:transparent; font-size:.875rem; cursor:pointer; }
.results-modes button:hover { border-color:var(--blue); }
.results-modes button[aria-pressed="true"] { border-color:var(--blue); }
.analysis-section .usage-section { margin-top: 0; padding-top: 0; border-top: 0; }

.analysis-section > .section-heading { margin-bottom: 32px; }
.insight-heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 12px 24px; }
.insight-heading h3 { font-size: 1.5rem; margin: 0; letter-spacing: -.035em; }
.insight-heading a { font-size: .8125rem; color: var(--blue); }
.insight-tag { font-size: .75rem; color: var(--muted); }
.insight-intro { max-width: 760px; font-size: .9375rem; line-height: 1.8; color: var(--muted); margin: 14px 0 24px; }
.comparison-grid { display: grid; grid-template-columns: minmax(0,1fr); gap: 56px; }
.comparison-figure { margin: 0; min-width: 0; }
.comparison-figure figcaption { padding: 0; border: 0; display: block; }
.comparison-figure h3 { font-size: 1.25rem; font-weight: 400; margin: 0 0 8px; }
.comparison-figure figcaption p { color: var(--muted); font-size: .8125rem; line-height: 1.7; margin: 0 0 20px; max-width: 760px; }
.comparison-chart { position: relative; min-height: 280px; }
.comparison-chart.comparison-compact { min-height:220px; }
.comparison-chart.comparison-empty { min-height:0; }
.comparison-empty .empty-state { padding:32px 16px; }
.comparison-chart svg { display: block; width: 100%; overflow: visible; }
.comparison-chart svg text { font-family: 'Geist Pixel Circle'; font-size: 12px; fill: var(--muted); }
.insight-grid { stroke: var(--line); stroke-opacity: .6; }
.insight-range { stroke: #2b00ff66; stroke-width: 2; }
.insight-point { cursor: pointer; }
.comparison-chart .insight-point:focus,.comparison-chart .insight-point:focus-visible { outline:none; }
.point-selection { fill:var(--paper); stroke:var(--blue); stroke-opacity:.7; stroke-width:1.5; opacity:0; pointer-events:none; }
.insight-point:is(.is-selected,:hover,:focus-visible) .point-selection { opacity:1; }
.insight-point:is(.is-selected,:hover,:focus-visible) .chart-label-leader { stroke-opacity:.9; stroke-width:1.5; }
.insight-empty { position: absolute; top: 28%; left: 50%; width: min(calc(100% - 80px),380px); transform: translateX(-50%); text-align: center; padding: 14px 10px; background: #edededf2; }
.insight-empty strong { font-size: .9375rem; font-weight: 400; }
.insight-empty p { max-width: 310px; margin: 8px auto 0; color: var(--muted); font-size: .8125rem; line-height: 1.7; }
.insight-note { color: var(--muted); font-size: .8125rem; line-height: 1.8; margin: 18px 0 0; max-width: 870px; }
.comparison-chart svg .chart-model-key { fill:var(--blue); font-size:11px; paint-order:stroke; stroke:var(--paper); stroke-width:4px; stroke-linejoin:round; pointer-events:none; }
.insight-point.is-selected circle[r="5"] { stroke:var(--blue); stroke-width:2px; fill:var(--paper); }
.chart-label-leader { stroke:var(--blue); stroke-opacity:.25; stroke-width:1; }
.pareto-toggle { display:block; margin:12px 0 18px auto; padding:9px 12px; border:1px solid var(--line); border-radius:2px; background:transparent; color:var(--muted); font:inherit; font-size:.8125rem; cursor:pointer; }
.pareto-toggle::before { content:''; display:inline-block; width:8px; height:8px; margin-right:9px; border:1px solid currentColor; }
.pareto-toggle[aria-pressed="true"] { color:var(--blue); border-color:var(--blue); }
.pareto-toggle[aria-pressed="true"]::before { background:currentColor; }
.pareto-line { display:none; fill:none; stroke:var(--blue); stroke-width:1.5; stroke-dasharray:5 5; stroke-opacity:.6; pointer-events:none; }
.show-frontier .pareto-line { display:block; }
.provider-marker { paint-order:stroke; }
.insight-point.is-selected .provider-marker { filter:drop-shadow(0 0 3px #2b00ff70); }
.insight-data { font-size: .8125rem; overflow-x: auto; margin-top: 12px; }
.insight-data summary { padding: 12px 0; cursor: pointer; }
.insight-data table { width: 100%; border-collapse: collapse; }
.insight-data :is(th,td) { text-align: left; padding: 8px; border-bottom: 1px solid var(--line); }
.usage-table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: .8125rem; }
.usage-table th { font-weight: 400; text-align: left; }
.usage-table td { text-align:right; }
.usage-table td[data-label="Usage reporting"] { text-align:left; }
.usage-table thead th:not(:first-child):not([data-usage-key="coverage"]) { text-align:right; }
.usage-table thead th:not(:first-child):not([data-usage-key="coverage"]) button { justify-content:flex-end; text-align:right; }
.usage-table tbody tr.is-selected > :is(th,td) { background-color:color-mix(in srgb,var(--blue) 2.4%,var(--paper)); }
.score-value { display:block; color:var(--ink); font-variant-numeric:tabular-nums; }
.score-cell.is-unavailable .score-value { color:var(--muted); }
.insight-data :is(th,td):not(:first-child) { text-align:right; font-variant-numeric:tabular-nums; }
.pareto-toggle:disabled { opacity:.5; cursor:default; }
.show-frontier .insight-point:not(.is-frontier):not(.is-selected) { opacity:.4; }
.show-frontier .is-frontier .point-selection { opacity:1; stroke-dasharray:2 3; }
.show-frontier .is-selected .point-selection { stroke-dasharray:none; }
.usage-table thead th { color: var(--muted); font-size: .75rem; padding: 14px 10px; border-block: 1px solid var(--line); }
.usage-table :is(td,tbody th) { padding: 20px 10px; vertical-align: middle; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
/* Reserve the header's 10px arrow and 8px gap beside each numeric value. */
.usage-table td:not([data-label="Usage reporting"]) { padding-right:28px; }
.usage-table th:first-child { width: 25%; padding-left: 0; }
.usage-table th:last-child { width: 16%; }
.usage-table:not(.benchmark-table) th:last-child { width: 155px; }
.usage-table tbody th span { color: var(--ink); font-size: .875rem; }
.usage-identity { display: flex; align-items: center; gap: 8px; }
.usage-identity img { flex: none; object-fit: contain; }
.usage-table th:has(.usage-identity img) small { margin-left: 28px; }
.usage-table small { display: block; margin-top: 6px; color: var(--muted); font-size: .75rem; }
.token-coverage { display: grid; gap: 0; font-size: .8125rem; }
.token-coverage-button { justify-self:end; padding:0; border:0; background:transparent; color:var(--ink); font:inherit; cursor:help; text-decoration:underline dotted var(--line); text-underline-offset:4px; }
.token-coverage-button:hover { color:var(--blue); text-decoration-color:var(--blue); }
.paper .token-coverage-button:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
.token-coverage-empty { display: block; font-size: .8125rem; }
.token-coverage-label { display: flex; justify-content: space-between; gap: 6px; line-height: 1.4; white-space: nowrap; }
.token-coverage-label > :first-child { color: var(--muted); }
.token-coverage-label > :last-child { white-space: nowrap; }
.token-coverage meter { display: block; width: 100%; height: 2px; margin-top: 5px; border: 0; background: var(--line); border-radius: 0; }
.token-coverage meter::-webkit-meter-bar { height: 2px; border: 0; border-radius: 0; background: var(--line); }
.token-coverage meter::-webkit-meter-optimum-value { background: var(--blue); border-radius: 0; }
.token-coverage meter::-moz-meter-bar { background: var(--blue); }
.observation-toolbar label { display: flex; align-items: center; justify-content: flex-end; gap: 12px; color: var(--muted); margin-left: auto; font-size: .8125rem; }
.insight-select { min-width: 174px; font: inherit; }
.usage-scroll { overflow-x: auto; scrollbar-width: thin; scrollbar-color: #aaa6b8 transparent; }
.usage-table thead th { padding: 0 10px; }
.usage-table thead button { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 52px; padding: 12px 0; background: transparent; border: 0; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.sort-indicator { flex: none; color: var(--muted); font-family: Arial,sans-serif; }
.usage-table [aria-sort] button,.usage-table [aria-sort] .sort-indicator { color: var(--ink); }
.usage-table thead button:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 5px; }
.paper .usage-table thead button:focus-visible { outline: none; box-shadow: inset 0 -2px var(--ink); }
.paper .usage-scroll:focus-visible { outline: 1px solid var(--muted); outline-offset: 4px; }
.usage-sort-note { color: var(--muted); font-size: .75rem; line-height: 1.8; margin: 12px 0; }
.observation-layout { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 32px; align-items: start; }
.observation-copy h3 { margin: 28px 0 8px; font-size: 1rem; }
.observation-copy p { font-size: .9375rem; line-height: 1.85; color: var(--muted); margin: 0; }
.observation-copy a { color: var(--blue); }
.observation-example { min-width: 0; }
.observation-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; font-size: .75rem; color: var(--muted); padding-bottom: 20px; }
.observation-grid { display: grid; grid-template-columns: minmax(0,1fr) 100px; gap: 24px; align-items: center; }
.observation-grid svg { display: block; width: 100%; }
.terrain-grass { fill: #dfdde5; }.terrain-dirt { fill: #c8c0b9; }.terrain-stone { fill: #96929f; }.terrain-water { fill: #b0a1ee; }
.map-self { fill: #2b00ff; stroke: white; stroke-width: 2; }.map-other { fill: #3f3a52; }.map-item { fill: #ad651f; }
.observation-stats { margin: 0; display: grid; gap: 2px; }
.observation-stats dt { color: var(--muted); font-size: .75rem; }
.observation-stats dd { margin: 0 0 12px; font-size: 1rem; }
.map-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 18px 0; color: var(--muted); font-size: .6875rem; }
.map-legend span::before { content: ''; display: inline-block; width: 8px; height: 8px; margin-right: 6px; background: #2b00ff; border-radius: 50%; }
.map-legend .legend-other::before { background: #3f3a52; }.map-legend .legend-item::before { background: #ad651f; border-radius: 0; }
.map-legend .legend-water::before { background: #b0a1ee; border-radius: 0; }.map-legend .legend-stone::before { background: #96929f; border-radius: 0; }
.observation-action { margin: 16px 0 0; font-size: .8125rem; line-height: 1.8; }
.observation-code { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 32px; margin-top: 36px; }
.observation-snippet { display: grid; grid-template-rows: subgrid; grid-row: span 3; min-width: 0; border-top: 1px solid var(--line); }
.observation-snippet summary { margin: 0; padding: 16px 0; font-size: .9375rem; cursor: pointer; }
.observation-snippet::details-content { display: grid; grid-template-rows: subgrid; grid-row: span 2; }
.observation-snippet:not([open])::details-content { display: none; }
.observation-snippet p { margin: 0 0 16px; font-size: .8125rem; line-height: 1.8; color: var(--muted); }
.observation-snippet pre { align-self: start; margin: 0; padding: 20px; background: var(--evidence-paper); white-space: pre-wrap; overflow-wrap: anywhere; font: var(--evidence-font); tab-size: 2; }
.observation-snippet code { font: inherit; }
.archive-models { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px; margin: 0 0 24px -4px; max-height: 280px; overflow-y: auto; padding: 4px; }
.archive-lab-toggle { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 9px 14px; border: 1px solid #2b00ff4d; border-radius: 0; color: var(--ink); background: transparent; font: inherit; font-size:.875rem; cursor: pointer; }
.archive-lab-toggle img { object-fit: contain; }
.archive-lab-toggle:hover, .archive-lab-toggle[aria-expanded="true"] { border-color: var(--blue); }
.archive-lab-menu { position: fixed; inset: auto; box-sizing: border-box; margin: 0; padding: 14px; border: 1px solid var(--line); border-radius: 3px; color: var(--ink); background: #f3f1f7; box-shadow: 0 12px 36px #28213626; overflow-y: auto; max-height: 340px; }
.archive-lab-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 10px; font-size: .875rem; }
.archive-lab-close { border: 0; background: transparent; color: var(--muted); font: inherit; font-size: 1.25rem; cursor: pointer; min-width: 44px; min-height: 44px; }
.archive-lab-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.archive-lab-chips .archive-model { font-size: .8125rem; min-height: 44px; }
.archive-model { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; max-width: 100%; padding: 10px 14px; border: 1px solid #2b00ff4d; border-radius: 0; color: var(--ink); background: transparent; font: inherit; font-size: .875rem; cursor: pointer; text-align: left; }
.archive-model img { flex: none; object-fit: contain; }
.archive-model[aria-pressed="true"] { border-color:var(--blue); }
.archive-model:hover { border-color:var(--blue); }
.archive-attempt { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px; margin-bottom: 16px; color: var(--muted); font-size: .8125rem; }
.archive-attempt select { min-width: 240px; }
#archive-current { min-width: 0; overflow-anchor: none; }
@media (prefers-reduced-motion: no-preference) {
  .archive-enter .run-card { animation: archive-frame 560ms steps(4,end); }
  .archive-enter .run-card > div:first-child { animation: archive-copy 420ms 80ms both; }
}
@keyframes archive-frame {
  from { background-size:0 2px,2px 0,0 2px,2px 0,0 2px,2px 0,0 2px,2px 0; }
  to { background-size:22px 2px,2px 22px,22px 2px,2px 22px,22px 2px,2px 22px,22px 2px,2px 22px; }
}
@keyframes archive-copy {
  from { opacity:0; transform:translateY(6px); }
  to { opacity:1; transform:none; }
}
/* Native selects keep their keyboard and touch behavior, including the picker. */
.paper select,
.paper select::picker(select) { appearance: base-select; }
.paper select {
  color-scheme: light; min-height: 44px; padding: 10px 14px;
  border: 1px solid #c1bbd1; border-bottom-color: #a59bbf; border-radius: 3px;
  color: var(--ink); background: transparent; font: .875rem/1.5 'Geist Pixel Circle';
  box-shadow: none; cursor: pointer; gap: 16px; text-transform: none;
  transition: border-color 160ms ease, background-color 160ms ease;
}
.paper select:enabled:hover { border-color: var(--blue); }
.paper select:open { border-color: var(--blue); background: transparent; }
.paper select:focus-visible { outline: none; box-shadow: inset 0 -2px var(--blue); }
.paper select::picker-icon {
  content: ''; width: 7px; height: 7px; margin: 0 2px 3px auto; flex: none; align-self: center;
  border-right: 1.5px solid var(--blue); border-bottom: 1.5px solid var(--blue);
  rotate: 45deg; transition: rotate 180ms ease;
}
.paper select:open::picker-icon { rotate: 225deg; }
.paper select::picker(select) {
  margin-block: 6px; padding: 5px; border: 1px solid #c1bbd1; border-radius: 3px;
  background: var(--paper); color: var(--ink); box-shadow: 0 10px 24px #24134414; max-width: min(38rem,calc(100vw - 40px)); max-height: min(360px,60vh); overflow-y:auto;
  font: .8125rem/1.5 'Geist Pixel Circle';
}
.paper select option { display: flex; align-items: center; gap: 16px; min-height: 44px; padding: 10px 12px; border-radius: 2px; background: transparent; color: var(--ink); cursor: pointer; }
.paper select option:checked { background: #2b00ff0b; color: var(--blue); }
.paper select option:is(:hover,:focus-visible) { outline: none; background: #2b00ff12; }
.paper select option::checkmark { content: '▪'; order: 1; margin-left: auto; color: var(--blue); }
.paper select:disabled { color: var(--muted); border-color: var(--line); background: transparent; cursor: default; }
.paper select:disabled::picker-icon { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  .archive-model { transition: none; }
  .archive-model:is(:hover,:active) { transform: none; }
  .paper select::picker-icon { transition: none; }
}
@media (max-width: 1000px) {
  .observation-layout { grid-template-columns: 1fr; gap: 28px; }
  .observation-copy { max-width: 720px; }
  .observation-example { max-width: 720px; }
}
@media (max-width: 760px) {
  .observation-section { display: flex; flex-direction: column; }
  .observation-layout { display: contents; }
  .observation-example { order: 2; }
  .observation-code { order: 3; }
  .observation-copy { order: 4; margin-top: 20px; }
  .comparison-figure figcaption { min-height: 0; }
  .comparison-grid { grid-template-columns: 1fr; gap: 40px; }
  .comparison-section,.usage-section { margin-top: 40px; }
  .usage-table { min-width: 800px; }
  .usage-table :is(thead th:first-child,tbody th) { position: sticky; left: 0; z-index: 1; background: var(--paper); box-shadow: 8px 0 10px -10px #726b86; width: 155px; padding-right: 16px; }
  .observation-code { grid-template-columns: 1fr; gap: 24px; }
  .observation-snippet { grid-template-rows: auto auto auto; grid-row: auto; }
  .observation-toolbar { align-items: start; flex-wrap: wrap; }
  .observation-toolbar label { width: 100%; justify-content: space-between; }
  .observation-toolbar label select { min-width: 0; flex: 0 1 174px; }
  .observation-grid { grid-template-columns: 1fr; gap: 16px; }
  .observation-stats { grid-template-columns: repeat(4,1fr); }
  .observation-stats dt { grid-row: 1; }.observation-stats dd { grid-row: 2; }
}

.recording-chart-panel input[type="range"] {
  appearance: none; background: transparent; height: 32px; cursor: pointer;
}
.recording-chart-panel input[type="range"]::-webkit-slider-runnable-track {
  height: 2px; background: #aaa5bd; border: 0; border-radius: 0;
}
.recording-chart-panel input[type="range"]::-webkit-slider-thumb {
  appearance: none; width: 12px; height: 12px; margin-top: -5px;
  border: 0; border-radius: 0; background: var(--blue);
}
.recording-chart-panel input[type="range"]::-moz-range-track {
  height: 2px; background: #aaa5bd; border: 0; border-radius: 0;
}
.recording-chart-panel input[type="range"]::-moz-range-thumb {
  width: 12px; height: 12px; border: 0; border-radius: 0; background: var(--blue);
}

.run-card {
  position: relative; border: 0; border-radius: 0; overflow: clip;
  background:
    linear-gradient(var(--blue),var(--blue)) left top/22px 2px,
    linear-gradient(var(--blue),var(--blue)) left top/2px 22px,
    linear-gradient(var(--blue),var(--blue)) right top/22px 2px,
    linear-gradient(var(--blue),var(--blue)) right top/2px 22px,
    linear-gradient(var(--blue),var(--blue)) left bottom/22px 2px,
    linear-gradient(var(--blue),var(--blue)) left bottom/2px 22px,
    linear-gradient(var(--blue),var(--blue)) right bottom/22px 2px,
    linear-gradient(var(--blue),var(--blue)) right bottom/2px 22px;
  background-repeat: no-repeat;
}
.run-card > .quiet-button { align-self: start; margin-top: 8px; }
.run-card .run-date { color: var(--muted); }
.run-meta { display:flex; flex-wrap:wrap; align-items:center; gap:12px 22px; margin:10px 0 14px; }
.run-date { display:inline-flex; align-items:center; gap:8px; font-size:.8rem; }
.run-calendar { width:14px; height:13px; border:1px solid currentColor; border-radius:2px; position:relative; }
.run-calendar::before { content:""; position:absolute; left:2px; right:2px; top:3px; border-top:1px solid currentColor; }
.run-calendar::after { content:""; position:absolute; left:3px; top:-3px; width:6px; height:4px; border-left:1px solid currentColor; border-right:1px solid currentColor; }
.decision-summary .note-navigation { justify-content:flex-end; gap:4px; margin-bottom:12px; }
.decision-summary .note-position { margin-right:auto; color:var(--ink); }
.decision-summary .note-step { width:44px; padding:8px; border:0; border-radius:0; font-size:1.25rem; }
.decision-summary .note-step:hover:enabled { background:transparent; color:var(--blue); }
.decision-summary .note-step:disabled { opacity:.4; }
.decision-summary .decision-observation-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.decision-summary .note-kind { margin:0; font-size:.6875rem; letter-spacing:.025em; }
.decision-summary .note-stamp { margin:0; color:var(--muted); font-size:.6875rem; }
.decision-summary .note-body { margin:0; }
.decision-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:12px 0 18px; }
.decision-stats > div { display:flex; flex-direction:column-reverse; }
.decision-stats dt { color:var(--muted); font-size:.6875rem; }
.decision-stats dd { margin:0; color:var(--ink); font-size:1.25rem; line-height:1.4; font-variant-numeric:tabular-nums; }
.decision-summary .decision-choice { padding:16px 0; border-top:1px solid var(--line); }
.decision-summary .decision-goal { margin:7px 0 4px; color:var(--blue); font-size:1rem; line-height:1.5; }
.decision-summary .decision-target { margin:0; color:var(--muted); font-size:.8125rem; line-height:1.6; }
.decision-summary .note-action { margin:0; padding:12px 0 0; border-top:1px solid var(--line); }
.decision-action-line { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.decision-action-name { color:var(--blue); font-size:.8125rem; text-align:right; }
button.decision-action-name { padding:0; border:0; background:transparent; font-family:inherit; line-height:inherit; cursor:help; text-decoration:underline dotted var(--line); text-underline-offset:4px; }
button.decision-action-name:is(:hover,:focus-visible) { text-decoration-color:var(--blue); }
.decision-outcome { display:block; margin-top:4px; color:var(--muted); text-align:right; font-size:.6875rem; }
.sort-indicator { position:relative; display:inline-block; width:10px; height:16px; font-size:0; }
.sort-indicator::before,.sort-indicator::after { content:''; position:absolute; left:2px; width:5px; height:5px; border:solid currentColor; border-width:1.5px 0 0 1.5px; opacity:.35; }
.sort-indicator::before { top:3px; transform:rotate(45deg); }
.sort-indicator::after { bottom:3px; transform:rotate(225deg); }
.usage-table [aria-sort] .sort-indicator { color:var(--blue); }
[aria-sort="ascending"] .sort-indicator::before,[aria-sort="descending"] .sort-indicator::after { opacity:1; }
[aria-sort="ascending"] .sort-indicator::after,[aria-sort="descending"] .sort-indicator::before { opacity:.12; }

.run-card { align-content: start; overflow-anchor: none; }

.usage-identity { width:fit-content; max-width:100%; padding:0; border:0; background:transparent; color:inherit; font:inherit; text-align:left; cursor:help; }
.usage-identity:hover { color:var(--blue); }
.usage-table .latency-value { margin-left:auto; text-align:right; }
.usage-note[id^="usage-note-latency-"] { white-space:pre-line; }
.usage-note { position:fixed; inset:auto; margin:0; padding:16px 18px; border:1px solid #b9afd7; border-radius:2px; background:var(--paper); color:var(--muted); font:14px/1.65 'Geist Pixel Circle'; box-shadow:0 8px 24px #21144912; }
.usage-note::backdrop { background:transparent; }
.recording-chart svg { shape-rendering:geometricPrecision; }
.recording-chart .chart-series { stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }
.recording-chart .chart-grid { stroke:#c4c1ce; stroke-dasharray:2 5; }
.recording-chart .chart-cursor { stroke:var(--blue); stroke-opacity:.45; stroke-dasharray:3 5; }
.run-detail .recording-readout { color:var(--blue); padding-block:6px; }
.run-card > .recording-toggle { position:relative; width:max-content; min-width:44px; min-height:44px; justify-self:end; border:0; padding:10px 14px; background:transparent; }
.recording-toggle::before,.recording-toggle::after { content:''; position:absolute; top:0; left:0; width:100%; height:1px; background:currentColor; opacity:.3; }
.recording-toggle::after { top:calc(100% - 1px); }
.recording-toggle-frame { position:absolute; inset:0; border-inline:1px solid currentColor; opacity:.3; pointer-events:none; }
.recording-toggle-label { display:block; white-space:nowrap; }
.recording-toggle-hit { position:absolute; right:0; top:0; width:44px; height:100%; pointer-events:none; }
/* Keep the folding frame's layout, but only the visible close target accepts clicks. */
.recording-toggle.recording-close { pointer-events:none; }
.recording-close .recording-toggle-hit { pointer-events:auto; }
.recording-close:hover .recording-toggle-hit { background:#2b00ff08; }
.recording-toggle.recording-close:focus-visible { outline:none; }
.recording-close:focus-visible .recording-toggle-hit { outline:3px solid #f36b21; outline-offset:5px; }
.recording-toggle:is(:hover,:focus-visible)::before,.recording-toggle:is(:hover,:focus-visible)::after,
.recording-toggle:is(:hover,:focus-visible) .recording-toggle-frame { opacity:1; }
.recording-toggle.recording-close::before,.recording-toggle.recording-close::after { width:20px; left:calc(100% - 32px); top:calc(50% - .5px); opacity:1; transform:rotate(45deg); }
.recording-toggle.recording-close::after { transform:rotate(-45deg); }
.recording-close .recording-toggle-frame { transform:scaleY(0); opacity:0; }
.recording-close .recording-toggle-label { opacity:0; transform:translateX(8px); }
.observation-action { display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 14px; }
.observation-action > span { color:var(--muted); font-size:.75rem; }
.observation-action > strong { font-weight:400; color:var(--blue); }
.observation-outcome { color:var(--muted); font-size:.8125rem; line-height:1.8; margin:6px 0 0; }
@media(prefers-reduced-motion:no-preference) {
  .recording-toggle::before,.recording-toggle::after { transition:width 520ms cubic-bezier(.22,1,.36,1), left 520ms cubic-bezier(.22,1,.36,1), top 520ms cubic-bezier(.22,1,.36,1), transform 520ms cubic-bezier(.22,1,.36,1), opacity 160ms ease; }
  .recording-toggle-frame { transition:transform 520ms cubic-bezier(.22,1,.36,1),opacity 200ms ease; }
  .recording-toggle-label { transition:opacity 200ms ease 100ms,transform 520ms cubic-bezier(.22,1,.36,1); }
  .recording-close .recording-toggle-label { transition-delay:0ms; }
  .recording-toggle.recording-close:is(:hover,:focus-visible)::before { transform:rotate(135deg); }
  .recording-toggle.recording-close:is(:hover,:focus-visible)::after { transform:rotate(45deg); }
  .archive-lab-close { transition:transform 220ms ease; }
  .archive-lab-close:hover { transform:rotate(90deg); }
}

/* All disclosures use the bottom protocol accordion's 22px summary rhythm. */
.protocol-content { padding:0 0 16px; }
.protocol-content > :first-child { margin-top:0; }
.protocol-content > :last-child { margin-bottom:0; }
.cost-value { border:0; padding:0; background:transparent; color:inherit; font:inherit; font-variant-numeric:tabular-nums; white-space:nowrap; cursor:pointer; text-decoration:underline dotted; text-underline-offset:4px; }
.cost-value:is(:hover,:focus-visible) { color:var(--blue); }
.cost-status { white-space:nowrap; }
.exchange-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:12px 20px; margin-bottom:16px; }
.exchange-toolbar label { display:flex; align-items:center; gap:12px; }
.exchange-provenance { margin:0; font-size:.8125rem; color:var(--muted); }
.exchange-code { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; align-items:start; }
.exchange-code > details { min-width:0; border-top:1px solid var(--line); }
.exchange-code summary { padding:22px 0; }
.exchange-code .request-code-frame { margin:0; }
.exchange-code pre { margin:0; padding:16px 20px; max-height:320px; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; font:var(--evidence-font); }
@media(max-width:700px) { .exchange-code { grid-template-columns:1fr; gap:16px; } }

.paper :is(.protocol-details,.insight-data,.recording-transcript,.recording-verification,.recording-request-inspector,.exchange-code details) > summary { padding:22px 0; margin:0; }

.model-exchange { order:5; }

.recording-verification > .detail-metrics { margin:0 0 22px; }
.recording-verification > p:last-child { margin-bottom:22px; }
.usage-table .metric-help { text-decoration:underline dotted var(--line); text-underline-offset:5px; }
.usage-table .metric-help:is(:hover,:focus-visible) { text-decoration-color:var(--blue); }

.usage-note { text-align:left; }

.run-duration { display:inline-flex; align-items:center; gap:8px; color:var(--muted); font-size:.75rem; line-height:1.5; }
.run-duration-clock { position:relative; display:inline-block; width:14px; height:14px; border:1px solid currentColor; border-radius:50%; }
.run-duration-clock::before { content:""; position:absolute; left:5px; top:2px; width:1px; height:4px; background:currentColor; transform-origin:50% 100%; }
.run-duration-clock::after { content:""; position:absolute; left:5px; top:5px; width:4px; height:1px; background:currentColor; }
@media(prefers-reduced-motion:no-preference) {
  .run-duration-clock::before { animation:run-clock-turn 12s linear infinite; }
}
@keyframes run-clock-turn { to { transform:rotate(360deg); } }