.live-intro { padding: clamp(32px, 6vw, 64px) 0 32px; max-width: 850px; }
.live-intro h1 { font-size: clamp(2.5rem, 6vw, 4.4rem); }
.investigation { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 24px; align-items: start; }
.question-sheet, .evidence-sheet { min-width: 0; padding: clamp(18px, 3vw, 28px); background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
.investigation h2 { font: 600 25px/1.2 var(--display); margin: 0 0 20px; letter-spacing: -.02em; }
.prompt-list { display: grid; gap: 8px; margin-bottom: 24px; }
.prompt { display: flex; justify-content: space-between; gap: 12px; text-align: left; color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: 8px; padding: 12px; min-height: 44px; font: 500 14px/1.4 var(--text); cursor: pointer; transition: border-color var(--t-quick), transform var(--t-quick); }
.prompt:hover { border-color: var(--accent); }.prompt:active { transform: translateX(2px); }
label { display: block; font-weight: 500; margin-bottom: 8px; }
textarea { display: block; resize: vertical; width: 100%; min-height: 150px; padding: 12px; background: var(--paper); color: var(--ink); border: 1px solid var(--line); border-radius: 8px; font: 400 15px/1.5 var(--text); }
.fine { font-size: 13px; color: var(--muted); overflow-wrap: anywhere; }
#agentTask { width:100%; min-height:44px; margin-bottom:18px; padding:10px; border:1px solid var(--line); border-radius:8px; background:var(--paper); color:var(--ink); font:14px var(--text); }
.live-consent { display: flex; align-items: flex-start; gap: 8px; font: 400 14px/1.5 var(--text); margin: 18px 0; cursor: pointer; }
.live-consent input { accent-color: var(--accent); min-width: 40px; min-height: 40px; margin: -8px 0 0 -8px; }
.error { color: var(--bad); font-size: 14px; }
.run-boundaries { border-top: 1px solid var(--line); margin-top: 24px; padding-top: 20px; font-size: 14px; color: var(--muted); }.run-boundaries b { color: var(--ink); }
.run-boundaries p { margin: 8px 0; }
.sheet-head { display: flex; align-items: start; justify-content: space-between; gap: 12px; flex-wrap: wrap; }.sheet-head .tag { margin-bottom: 12px; }
.sheet-head h2 { margin-bottom: 8px; }.sheet-head .eyebrow { margin-bottom: 8px; }
#runStatus { overflow-wrap: anywhere; }.running #runState { color: var(--accent); border-color: var(--accent); }
.tool-trace { list-style: none; margin: 24px 0 0; padding: 0; counter-reset: call; }
.tool-trace > li { position: relative; border-left: 2px solid var(--accent); padding: 0 0 24px 18px; counter-increment: call; animation: receipt-in var(--t-std) var(--ease); }
.tool-trace > li::before { content: ''; position: absolute; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); left: -5px; top: 7px; }
.tool-title { font: 500 14px/1.5 var(--mono); display: flex; gap: 10px; flex-wrap: wrap; overflow-wrap: anywhere; }.tool-title::before { content: counter(call, decimal-leading-zero); color: var(--accent); }
.tool-time { color: var(--muted); font: 400 12px/1.6 var(--mono); }.tool-result { font-size: 14px; overflow-wrap: anywhere; margin: 8px 0; }
.tool-trace details { min-width: 0; }.tool-trace summary { cursor: pointer; font-size: 14px; padding: 10px 0; min-height: 40px; }
.tool-trace pre { max-height: 380px; overflow: auto; font-size: 12px; background: var(--paper); border: 1px solid var(--line); border-radius: 8px; padding: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.gate-values { overflow-x: auto; margin: 12px 0; font-size: 12px; }.gate-values table { border-collapse: collapse; width: 100%; min-width: 410px; font-variant-numeric: tabular-nums; }.gate-values caption { text-align: left; color: var(--muted); padding-bottom: 8px; font-family: var(--mono); }.gate-values th,.gate-values td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--line); }.gate-values .tool-result { font-size: 13px; min-width: 240px; }
.trace-empty { border: 1px dashed var(--line); border-radius: 8px; padding: 20px; color: var(--muted); font-size: 14px; }.trace-empty .mono { display: block; font-size: 12px; overflow-wrap: anywhere; }
.agent-answer { border-top: 1px solid var(--line); padding-top: 16px; margin-top: 8px; }.agent-answer h3 { font-family: var(--display); margin: 0; }
#answer { overflow-wrap: anywhere; font-size: 15px; } #answer p { margin: 12px 0; } #answer ul { padding-left: 20px; }
.live-footnote { display: flex; gap: 16px; align-items: baseline; padding: 32px 0; font-size: 14px; color: var(--muted); }.live-footnote p { margin: 0; }.live-footnote .tag { flex-shrink: 0; }
@keyframes receipt-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (max-width: 800px) { .investigation { grid-template-columns: minmax(0, 1fr); }.live-footnote { flex-direction: column; gap: 12px; } }
@media (prefers-reduced-motion: reduce) { .tool-trace > li { animation: none; }.prompt { transition: none; }.prompt:active { transform: none; } }

.ppo-sheet { margin: 0 0 32px; padding: clamp(18px, 3vw, 28px); border: 1px solid var(--line); border-top: 3px solid var(--accent); border-radius: 12px; background: var(--surface); }
.ppo-sheet h2 { font: 600 clamp(24px, 3vw, 32px)/1.2 var(--display); letter-spacing: -.02em; margin: 0; }
.ppo-grid { display: grid; grid-template-columns: minmax(0,.75fr) minmax(0,1.25fr); gap: 28px; margin-top: 24px; }
.ppo-grid > * { min-width: 0; }.ppo-grid input[type=number] { min-height: 44px; width: 150px; padding: 10px; color: var(--ink); background: var(--paper); border: 1px solid var(--line); border-radius: 8px; font: 15px var(--mono); }
.ppo-result { border-left: 1px solid var(--line); padding-left: 24px; }progress { width: 100%; height: 12px; accent-color: var(--accent); }
#ppoMeta { white-space: pre-line; }#ppoStatus { margin-top: 0; }#ppoLinks { display: flex; flex-wrap: wrap; gap: 10px; }#ppoDetails summary { cursor: pointer; min-height: 44px; padding: 12px 0; }#ppoReceipt { overflow: auto; max-height: 340px; font-size: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
@media(max-width:800px) { .ppo-grid { grid-template-columns: minmax(0,1fr); gap: 20px; }.ppo-result { padding: 20px 0 0; border-left: 0; border-top: 1px solid var(--line); } }
.run-workspace { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(240px,.8fr); gap:28px; margin:24px 0; }
.run-workspace > * { min-width:0; } .run-workspace select { width:100%; min-height:44px; padding:10px; background:var(--paper); color:var(--ink); border:1px solid var(--line); border-radius:6px; font:14px var(--text); }
.run-workspace input[type=number] { width:140px; min-height:44px; padding:10px; border:1px solid var(--line); border-radius:6px; background:var(--paper); color:var(--ink); font:15px var(--mono); }
.run-workspace .ppo-result { border-left:0; } .ppo-sheet > .ppo-result { border-left:0; border-top:1px solid var(--line); padding:20px 0 0; }
.arena-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-bottom:10px; }
.arena-toolbar [role=group] { display:flex; gap:4px; } .run-arena button { border:1px solid var(--line); background:var(--paper); color:var(--ink); font:500 14px var(--text); padding:8px 12px; min-height:40px; border-radius:6px; cursor:pointer; }
.run-arena button[aria-pressed=true] { color:var(--surface); background:var(--ink); } .run-arena button:disabled { opacity:.45; cursor:default; }
.arena-stage { position:relative; width:100%; aspect-ratio:1.35; background:var(--paper); border:1px solid var(--line); overflow:hidden; border-radius:8px; }
#arena2d { display:block; width:100%; height:100%; object-fit:contain; } #arena3d { position:absolute; inset:0; } #arena3d canvas { display:block; width:100%; height:100%; }
.arena-step { position:absolute; right:10px; top:10px; background:var(--surface); padding:4px 8px; border:1px solid var(--line); border-radius:4px; font:12px var(--mono); pointer-events:none; }
.arena-controls { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:10px; } #arenaSeek { flex:1; min-width:80px; min-height:40px; accent-color:var(--accent); } #arenaEpisode { width:100%; margin-top:8px; min-height:40px; font:13px var(--mono); }
.robot-key { color:#b93d0b; }.ped-key { color:#2b4c7e; }.goal-key { color:#367341; }.arena-key { margin-bottom:0; } .run-explainer { margin-top:20px; font-size:14px; }.run-explainer summary { min-height:40px; padding:10px 0; cursor:pointer; }
#ppoGate h3 { font:600 22px var(--display); margin-bottom:8px; }#ppoGate > p { font-size:14px; margin-top:0; }
@media(max-width:800px) { .run-workspace { grid-template-columns:minmax(0,1fr); gap:24px; }.arena-stage { aspect-ratio:1.15; } }

#ppoStart, #ppoCancel { display:block; width:100%; margin-top:14px; }

.evidence-intro { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(270px,.8fr); gap:48px; align-items:center; }
.evidence-intro h1 { font-size:clamp(36px,4.6vw,62px); }
.evidence-flow { list-style:none; padding:0 0 0 20px; margin:0; border-left:1px solid var(--line); }
.evidence-flow li { position:relative; padding:16px 16px 22px 22px; }
.evidence-flow li::before { content:""; position:absolute; width:11px; height:11px; border:2px solid var(--bad); background:var(--paper); border-radius:50%; left:-27px; top:22px; }
.evidence-flow li.promoted::before { border-color:var(--ok); background:var(--ok); }
.evidence-flow b { display:block; font:600 18px var(--display); }.evidence-flow span { display:block; font:12px/1.7 var(--mono); margin-top:6px; }
#attempts article { padding:20px 0 28px; border-bottom:1px solid var(--line); } #attempts article h3 { font:600 25px var(--display); } #attempts article p { max-width:760px; line-height:1.7; } #attempts pre, #queryReceipt { max-height:360px; overflow:auto; overflow-wrap:anywhere; white-space:pre-wrap; font-size:12px; }
@media(max-width:800px) { .evidence-intro { grid-template-columns:minmax(0,1fr); gap:28px; }.evidence-flow { margin-left:8px; } }

#attempts { scroll-margin-top:100px; }