/* Recorded actions and authored messages. Summaries remain separate from originals. */
.trajectory-viewer { margin-top:48px; color:var(--text); --traj-a:#3d688a; --traj-b:#3d6f5e; --traj-c:#775f32; --traj-d:#60636a; }
:root[data-theme="dark"] .trajectory-viewer { --traj-a:#98b9d4; --traj-b:#99beb0; --traj-c:#c4b290; --traj-d:#b1b4ba; }
.trajectory-viewer [data-agent="A"] { --agent-color:var(--traj-a); }
.trajectory-viewer [data-agent="B"] { --agent-color:var(--traj-b); }
.trajectory-viewer [data-agent="C"] { --agent-color:var(--traj-c); }
.trajectory-viewer [data-agent="D"] { --agent-color:var(--traj-d); }
.trajectory-viewer button { font:inherit; color:var(--text); cursor:pointer; }
.trajectory-viewer [hidden] { display:none!important; }
.traj-header { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:22px; }
.traj-header h3 { font:500 23px/1.4 var(--font); margin:0; }
.traj-play { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:8px 16px; border:1px solid var(--line); border-radius:4px; background:var(--bg); font-size:14px!important; }
.trajectory-viewer svg { fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.traj-play svg { width:16px; height:16px; }
.traj-chapters { display:flex; gap:28px; margin-bottom:8px; }
.traj-chapters button { border:0; border-bottom:2px solid transparent; padding:9px 0; background:none; color:var(--muted); min-height:42px; font-size:13px; }
.traj-chapters button[aria-current] { color:var(--text); border-bottom-color:var(--text); }
.traj-chapters button[data-traj-stage="outcome"][aria-current] { color:var(--risk); border-bottom-color:var(--risk); }
.traj-reading-guide { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-top:15px; }
.traj-hint { color:var(--subtle); font-size:12px; margin:0; }
.traj-time-direction { flex-shrink:0; color:var(--subtle); font-size:12px; }
.traj-hint-mobile { display:none; }
.traj-map-scroll { position:relative; margin-top:9px; }
.traj-map { position:relative; width:100%; height:334px; user-select:none; }
.traj-lane-heads { position:absolute; inset:0; pointer-events:none; }
.traj-map-lines { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; overflow:visible; }
.traj-lane-line { stroke:var(--line); stroke-width:1; }
.traj-lane-line.is-files { stroke-dasharray:2 5; }
.traj-message-route { color:var(--agent-color); stroke:currentColor; stroke-width:1.3; opacity:.55; transition:opacity .15s; }
.traj-message-route.is-active { stroke-width:1.7; opacity:.9; }
.traj-message-route path { fill:none; stroke:inherit; stroke-width:inherit; vector-effect:non-scaling-stroke; }
.traj-lane-label { position:absolute; display:flex; align-items:center; gap:7px; transform:translateY(-50%); color:var(--agent-color,var(--muted)); font-size:12px; z-index:1; background:var(--bg); }
.traj-lane-label > svg { width:23px; height:27px; margin:0 4px; }
.traj-lane-copy { display:flex; flex-direction:column; line-height:1.5; }
.traj-lane-copy small { font:10px/1.4 var(--font); color:var(--subtle); }
.traj-avatar { position:relative; display:inline-block; width:33px; height:33px; flex-shrink:0; vertical-align:middle; border-radius:8px; background:color-mix(in srgb,var(--agent-color) 7%,var(--bg)); border:1px solid color-mix(in srgb,var(--agent-color) 28%,var(--bg)); }
.traj-avatar-crop { position:absolute; inset:0; overflow:hidden; border-radius:7px; }
.traj-avatar img { position:absolute; left:50%; top:-3px; width:39px; height:53px; max-width:none; transform:translateX(-50%); filter:none!important; }
.traj-avatar-letter { position:absolute; bottom:-3px; right:-4px; display:flex; align-items:center; justify-content:center; width:15px; height:15px; border:2px solid var(--bg); border-radius:4px; color:var(--bg); background:var(--agent-color); font:600 9px/1 var(--font); }
.traj-node { position:absolute; z-index:2; width:44px; height:44px; padding:7px; transform:translate(-50%,-50%); border:0; background:none; color:var(--agent-color,var(--muted))!important; }
.traj-node-shape { display:flex; width:30px; height:30px; align-items:center; justify-content:center; border:1px solid color-mix(in srgb,var(--agent-color,var(--muted)) 65%,var(--bg)); border-radius:4px; background:color-mix(in srgb,var(--agent-color,var(--muted)) 4%,var(--bg)); }
.traj-node-shape svg { width:17px; height:17px; }
.traj-node.is-message .traj-node-shape { border-radius:50%; }
.traj-node.is-selected .traj-node-shape,.traj-node:hover .traj-node-shape { border-color:var(--agent-color,var(--muted)); background:color-mix(in srgb,var(--agent-color,var(--muted)) 9%,var(--bg)); box-shadow:0 0 0 3px color-mix(in srgb,var(--agent-color,var(--muted)) 9%,transparent); }
.traj-node.is-outcome { color:var(--risk)!important; }
.traj-node.is-outcome .traj-node-shape { border-color:var(--risk); background:var(--risk-wash); color:var(--risk); }
.traj-node.is-outcome .traj-node-label { color:var(--risk); font-weight:600; }
.traj-chapters button[data-traj-stage="outcome"] { color:var(--risk); font-weight:600; }
.traj-reading-guide { justify-content:flex-end; margin-top:8px; }
.traj-node:focus-visible { outline:none; }
.traj-node:focus-visible .traj-node-shape { outline:2px solid var(--agent-color,var(--risk)); outline-offset:3px; }
.traj-node.is-inspected .traj-node-shape { border-color:var(--agent-color,var(--muted)); background:color-mix(in srgb,var(--agent-color,var(--muted)) 18%,var(--bg)); }
.traj-node-label { position:absolute; left:50%; top:42px; transform:translateX(-50%); white-space:nowrap; font-size:10px; line-height:1.2; color:var(--muted); background:var(--bg); padding:0 3px; }
.traj-controls { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:10px 0 0; }
.traj-controls > button { border:0; background:none; padding:8px 0; min-height:44px; font-size:13px; }
.traj-controls > button:disabled { opacity:.4; cursor:default; }
.traj-key { display:flex; align-items:center; gap:17px; color:var(--subtle); font-size:11px; }
.traj-key > span { display:flex; align-items:center; gap:6px; }
.traj-key i { display:inline-block; width:9px; height:9px; border:1px solid var(--muted); border-radius:2px; }
.traj-key .traj-message-key { border-radius:50%; }
.traj-caption { margin:16px 0 0; font-size:14px; line-height:1.7; color:var(--muted); min-height:30px; }
.traj-caption strong { color:var(--text); font-weight:500; }
.traj-popup { position:fixed; z-index:120; box-sizing:border-box; padding:12px 14px; color:var(--text); background:color-mix(in srgb,var(--bg) 90%,transparent); border:1px solid color-mix(in srgb,var(--line) 75%,transparent); border-radius:6px; box-shadow:0 4px 16px #0000000b; }
.traj-popup-type { display:flex; align-items:center; flex-wrap:wrap; gap:6px; font-size:11px; color:var(--agent-color,var(--muted)); }
.traj-popup .traj-avatar { width:25px; height:25px; border-radius:6px; }
.traj-popup .traj-avatar-letter { width:13px; height:13px; font-size:8px; }
.traj-popup .traj-avatar img { width:33px; height:45px; }
.traj-hover-message { font-size:13px; line-height:1.65; margin:9px 0 0; }
.traj-close { display:flex; align-items:center; justify-content:center; width:42px; min-width:42px; height:42px; border:0; border-radius:4px; background:none; }
.traj-close:hover { background:var(--surface); }
.traj-close svg { width:16px; height:16px; }
.traj-summary-label { font-size:10px!important; color:var(--subtle)!important; margin:0 0 5px!important; }
.traj-readers { font-size:11px!important; color:var(--muted); line-height:1.8!important; margin:10px 0 5px!important; }
.traj-readers svg { display:inline-block; width:14px; height:17px; margin-right:4px; vertical-align:-4px; }
.traj-reader { color:var(--agent-color); font-weight:500; white-space:nowrap; }
.traj-details { position:static; margin:25px 0 35px; padding:23px 0 0; border-top:2px solid color-mix(in srgb,var(--agent-color,var(--muted)) 35%,var(--line)); scroll-margin-top:90px; }
.traj-details:focus { outline:none; }
.traj-detail-header { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.traj-detail-heading { display:flex; align-items:center; gap:13px; }
.traj-detail-meta { font-size:11px; color:var(--agent-color,var(--muted)); margin:0 0 4px; }
.traj-detail-header h4 { font:500 20px/1.4 var(--font); margin:0; text-wrap:pretty; }
.traj-detail-summary { max-width:800px; margin:16px 0 14px; font-size:14px; line-height:1.8; color:var(--muted); }
.traj-detail-content { max-width:980px; }
.traj-details .traj-original { margin-top:13px; }
.traj-details .traj-original blockquote { font-size:14px; line-height:1.85; }
.traj-action-columns,.traj-detail-messages { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 34px; align-items:start; }
.traj-action-columns:has(>.traj-action-record:only-child),.traj-detail-messages:has(>.traj-read-message:only-child) { grid-template-columns:minmax(0,1fr); max-width:800px; }
.traj-original { margin-top:14px; font-size:12px; color:var(--muted); }
.traj-original > summary { display:inline-flex; align-items:center; gap:6px; padding:6px 0; min-height:32px; cursor:pointer; list-style:none; }
.traj-original > summary::-webkit-details-marker { display:none; }
.traj-original > summary::before { content:'+'; font-size:15px; }
.traj-original[open] > summary::before { content:'−'; }
.traj-original-body { padding-top:8px; }
.traj-original-author { font-size:11px; margin:0 0 8px; }
.traj-original blockquote { font:400 13px/1.8 var(--font); color:var(--text); white-space:pre-wrap; overflow-wrap:anywhere; margin:0; padding:0 0 0 12px; border-left:2px solid var(--line); }
.traj-record { margin-top:14px; font-size:11px; }
.traj-record summary { padding:8px 0; cursor:pointer; }
.traj-record dl { display:grid; grid-template-columns:42px minmax(0,1fr); gap:6px 12px; margin:8px 0; }
.traj-record dd { margin:0; overflow-wrap:anywhere; }
.traj-record ul { padding-left:15px; margin:12px 0 0; line-height:1.8; }
.traj-read-message { padding-top:14px; margin-top:17px; border-top:1px solid var(--line); }
.traj-read-message > header { display:flex; align-items:center; gap:9px; font-size:12px; color:var(--agent-color); }
.traj-read-message strong { font-weight:500; }
.traj-read-message > p { font-size:13px; line-height:1.7; margin:6px 0 0; }
.traj-read-message .traj-original { margin-top:6px; }
.traj-token { font:400 .9em/1.7 var(--mono); padding:.08em .3em; border-radius:3px; background:color-mix(in srgb,var(--icon) 8%,transparent); color:var(--text); overflow-wrap:anywhere; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.traj-token.is-tool { color:var(--discovery); background:color-mix(in srgb,var(--discovery) 9%,transparent); }
.traj-token.is-parameter { color:var(--coordination); }
.traj-token.is-id { color:var(--muted); border-bottom:1px solid color-mix(in srgb,var(--icon) 25%,transparent); }
.traj-token.is-path { color:var(--muted); }
.traj-action-record { margin-top:16px; font-size:12px; }
.traj-action-record > header { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:8px; }
.traj-action-record > header > code { font-size:12px; }
.traj-action-record time,.traj-record time { font:10px/1.6 var(--mono); color:var(--subtle); }
.traj-arguments { margin:0; }
.traj-arguments > div { display:grid; grid-template-columns:132px minmax(0,1fr); align-items:start; gap:9px; padding:10px 0; border-bottom:1px solid var(--line); }
.traj-arguments > div:last-child { border-bottom:0; }
.traj-arguments dt { font:12px/1.7 var(--mono); color:var(--coordination); overflow-wrap:anywhere; }
.traj-arguments dt code { font:inherit; }
.traj-arguments dd { margin:0; color:var(--text); font-size:12px; line-height:1.8; overflow-wrap:anywhere; }
.traj-arguments > div:has(.traj-command),.traj-arguments > div:has([data-argument="summary"]) { grid-template-columns:minmax(0,1fr); gap:5px; }
.traj-command { font:11px/1.8 var(--mono); white-space:pre-wrap; overflow-wrap:anywhere; margin:0; padding:10px 12px; background:var(--surface); border-radius:4px; }
.traj-command code { font:inherit; }
.traj-replay { margin-top:20px; }
.traj-compare { display:flex; gap:20px; justify-content:center; }
.traj-compare button { background:none; padding:8px 0; border:0; border-bottom:1px solid transparent; min-height:40px; font-size:12px; }
.traj-compare button[aria-pressed="true"] { border-color:var(--text); }
.traj-backups { display:flex; justify-content:center; gap:20px; margin:20px 0 10px; }
.traj-backups > span { position:relative; display:flex; flex-direction:column; align-items:center; gap:5px; color:var(--benign); }
.traj-backups svg { width:30px; height:35px; }
.traj-backups small { font-size:10px; }
.traj-backups .is-lost { color:var(--risk); }
.traj-backups .is-lost svg { opacity:.3; }
.traj-backups b { position:absolute; top:1px; font-size:24px; font-weight:400; }
.traj-replay > p { font-size:12px; text-align:center; color:var(--muted); }
.traj-replay > p strong { font-size:20px; color:var(--text); margin-right:4px; }
.traj-full-transcript { margin:20px 0 0; }
.traj-full-transcript > summary { display:inline-flex; align-items:center; gap:8px; font-size:14px; padding:8px 0; min-height:44px; cursor:pointer; list-style:none; }
.traj-full-transcript > summary::-webkit-details-marker { display:none; }
.traj-full-transcript > summary::before { content:'+'; }
.traj-full-transcript[open] > summary::before { content:'−'; }
.traj-message-group { max-width:800px; margin:34px 0 48px; }
.traj-message-group h4 { font-size:17px; margin:0 0 25px; }
.traj-transcript-message { display:grid; grid-template-columns:98px minmax(0,1fr); gap:18px; margin:0 0 30px; padding-bottom:26px; border-bottom:1px solid var(--line); }
.traj-transcript-author { display:flex; align-items:flex-start; gap:6px; font-size:12px; color:var(--agent-color); }
.traj-transcript-author strong { font-weight:500; padding-top:4px; }
.traj-transcript-message h5 { font-size:15px; font-weight:500; margin:0 0 8px; }
.traj-transcript-message p { font-size:14px; line-height:1.8; margin:0; }
.traj-transcript-message .traj-original { margin-top:7px; }
@media (max-width:800px) {
  .trajectory-viewer { margin-top:35px; }
  .traj-header { gap:12px; margin-bottom:12px; }
  .traj-header h3 { font-size:20px; }
  .traj-play { padding:8px 12px; min-height:42px; }
  .traj-chapters { justify-content:space-between; gap:10px; margin-bottom:0; }
  .traj-chapters button { font-size:11px; }
  .traj-hint-desktop { display:none; }
  .traj-hint-mobile { display:inline; }
  .traj-reading-guide { gap:12px; }
  .traj-time-direction { font-size:11px; }
  .traj-map-scroll { height:430px; overflow-y:auto; overflow-x:hidden; overscroll-behavior-y:contain; border-bottom:1px solid var(--line); scrollbar-width:thin; }
  .traj-map { height:1000px; }
  .traj-lane-heads { position:sticky; top:0; bottom:auto; height:66px; z-index:5; background:var(--bg); }
  .traj-lane-label { flex-direction:column; gap:0; width:20%; height:66px; justify-content:center; transform:translateX(-50%); font-size:10px; }
  .traj-lane-label[data-lane="files"] span { max-width:40px; text-align:center; line-height:1.2; }
  .traj-lane-copy small { font-size:8px; white-space:nowrap; }
  .traj-lane-label .traj-avatar { width:29px; height:29px; margin:0 0 4px; }
  .traj-lane-label > svg { height:24px; width:19px; margin:3px 0 5px; }
  .traj-lane-label[data-lane="files"] > svg { height:20px; margin:1px 0 4px; }
  .traj-node-label { font-size:9px; top:41px; padding:1px 2px; }
  .traj-controls { gap:8px; margin-top:5px; }
  .traj-controls > button { font-size:12px; }
  .traj-key { gap:12px; font-size:10px; }
  .traj-caption { font-size:13px; min-height:45px; margin-top:10px; }
  .traj-details { margin-top:22px; padding-top:20px; }
  .traj-detail-header { gap:8px; }
  .traj-detail-heading { align-items:flex-start; gap:10px; }
  .traj-detail-header h4 { font-size:18px; }
  .traj-detail-summary { font-size:14px; }
  .traj-action-columns,.traj-detail-messages { grid-template-columns:minmax(0,1fr); gap:10px; }
  .traj-read-message > p { font-size:14px; }
  .traj-original > summary { min-height:44px; }
  .traj-original blockquote { font-size:14px; }
  .traj-arguments > div { grid-template-columns:minmax(0,1fr); gap:4px; }
  .traj-transcript-message { grid-template-columns:minmax(0,1fr); gap:8px; margin-bottom:25px; }
  .traj-transcript-author { align-items:center; }
  .traj-transcript-author strong { padding:0; }
}
@media (prefers-reduced-motion:reduce) { .traj-message-route { transition:none; } }

@media(min-width:801px) {
  .traj-map-scroll { overflow-x:auto; scrollbar-width:thin; padding-bottom:8px; }
  .traj-lane-heads { position:sticky; inset:auto; left:0; width:112px; height:100%; background:var(--bg); z-index:3; }
  .traj-map { height:394px; }
}

/* The map and log share the page typography and the same agent identities. */
.traj-header { flex-wrap:wrap; gap:12px; }
.traj-header h3 { margin-right:auto; }
.traj-views { display:inline-flex; padding:3px; border-radius:18px; background:var(--surface); }
.traj-views button { background:none; border:1px solid transparent; border-radius:15px; min-height:34px; padding:5px 13px; font:500 13px/1.4 var(--font); color:var(--muted); }
.traj-views button[aria-pressed="true"] { background:var(--bg); border-color:var(--line); color:var(--text); }
.traj-all-messages { border:0; background:none; padding:8px 0; min-height:44px; font-size:14px!important; text-decoration:underline; text-underline-offset:4px; }
.traj-inspector { min-height:108px; padding-block:8px; }
.traj-inspector:has(.traj-popup:not([hidden])) .traj-caption { display:none; }
.trajectory-viewer .traj-inspector .traj-popup { position:static; padding:4px 0; background:none; border:0; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.traj-inspector .traj-hover-message { margin-top:5px; }
.traj-inspector .traj-readers { margin-top:3px!important; }
.traj-log { min-width:0; }
.traj-log-filters { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.traj-log-filters select { min-height:40px; max-width:100%; background:var(--bg); border:1px solid var(--line); color:var(--text); padding:4px 9px; border-radius:8px; font:13px var(--font); }
.traj-log-list { max-height:min(630px,max(180px,calc(100svh - var(--header-offset,84px) - 170px))); overflow:auto; overflow-anchor:none; scrollbar-width:thin; padding:0 8px 2px 2px; }
.traj-log-row { border-bottom:1px solid var(--line); }
.traj-log-row > summary { display:grid; grid-template-columns:98px minmax(0,1fr) auto 12px; align-items:center; gap:16px; min-height:62px; padding:10px 5px; cursor:pointer; list-style:none; }
.traj-log-row > summary::-webkit-details-marker { display:none; }
.traj-log-row > summary::after { content:''; width:6px; height:6px; border:solid var(--muted); border-width:0 1px 1px 0; transform:rotate(-45deg); }
.traj-log-row[open] > summary::after { transform:rotate(45deg); }
.traj-log-row > summary:focus-visible { outline-offset:-2px; }
.traj-log-row > summary:hover { background:var(--surface); }
.traj-log-who { display:flex; align-items:center; gap:8px; color:var(--agent-color,var(--muted)); font-size:12px; }
.traj-log-copy { min-width:0; display:grid; gap:2px; overflow-wrap:anywhere; font-size:14px; }
.traj-log-copy small,.traj-log-row > summary time { color:var(--subtle); font-size:11px; }
.traj-log-row > summary time { font-family:var(--mono); }
.traj-log-body { min-width:0; margin:0 22px 18px 119px; overflow-wrap:anywhere; font:14px/1.7 var(--font); }
.traj-log-body p { margin-block:4px 10px; }
.traj-log-body .traj-read-message:first-child { border:0; padding:0; margin:0; }
.traj-log-empty { color:var(--muted); font-size:14px; }
.run-overview { margin:28px 0 0; color:var(--text); }
.run-overview figcaption { display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 12px; margin:0 0 16px; }
.run-overview figcaption strong { font:550 clamp(23px,2.4vw,30px)/1.3 var(--font); letter-spacing:-.025em; }
.run-overview figcaption > span { color:var(--muted); font:13px/1.5 var(--font); }
.run-scroll { overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin; border-block:1px solid var(--line); padding-block:8px; }
.run-coordinate { display:grid; grid-template-columns:64px var(--run-width); grid-template-rows:24px repeat(4,64px); width:max-content; position:relative; }
.run-coordinate .run-plot { grid-column:2; grid-row:2/6; width:100%; height:256px; pointer-events:none; overflow:visible; z-index:0; }
.run-actor { grid-column:1; position:sticky; left:0; z-index:3; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; background:var(--bg); color:var(--agent-color); font:500 12px/1.5 var(--font); }
.run-actor small { font:10px/1.6 var(--font); color:var(--muted); }
.run-slider { grid-column:2; display:grid; grid-template-columns:repeat(var(--run-turns),17px); height:64px; z-index:1; }
.run-turn { display:flex; align-items:center; justify-content:center; padding:0; border:0; background:transparent; min-width:0; }
.run-turn-dot { display:block; flex:none; width:12px; height:12px; background:var(--turn-color,var(--icon)); border-radius:50%; opacity:.38; }
.run-turn:not([data-kind="ordinary"]) .run-turn-dot { opacity:1; }
.run-turn:hover .run-turn-dot,.run-turn.is-selected .run-turn-dot { opacity:1; outline:2px solid var(--agent-color); outline-offset:2px; }
.run-overview [data-kind="message"] { --turn-color:#3d688a; }
.run-overview [data-kind="read"] { --turn-color:#3d7b66; }
.run-overview [data-kind="upgrade"] { --turn-color:#ad7532; }
:root[data-theme="dark"] .run-overview [data-kind="message"] { --turn-color:#98b9d4; }
:root[data-theme="dark"] .run-overview [data-kind="read"] { --turn-color:#99beb0; }
:root[data-theme="dark"] .run-overview [data-kind="upgrade"] { --turn-color:#d6b071; }
.run-type-key { display:flex; flex-wrap:wrap; gap:8px 20px; margin-bottom:12px; color:var(--muted); font:12px/1.5 var(--font); }
.run-type-key span { display:inline-flex; align-items:center; gap:7px; }
.run-type-key i { width:9px; height:9px; border-radius:50%; background:var(--turn-color); }
.run-axis { grid-column:2; grid-row:1; position:relative; color:var(--muted); font:11px/20px var(--mono); }
.run-axis span { position:absolute; transform:translateX(-50%); }
.run-edge { fill:none; stroke:var(--agent-color); stroke-width:1.5; opacity:.6; vector-effect:non-scaling-stroke; }
.run-edge path { vector-effect:non-scaling-stroke; }
.run-key { display:flex; flex-wrap:wrap; gap:3px 16px; margin-top:10px; color:var(--muted); font-size:11px; }
.run-key span { display:inline-flex; align-items:center; gap:5px; }
.run-key span::before { content:''; width:13px; border-top:1px solid currentColor; }
.run-key span+span::before { border-top-style:dashed; }
.run-selection { margin:16px 0 0; overflow-wrap:anywhere; font:13px/1.7 var(--font); color:var(--muted); }
.run-selection strong { font-weight:500; color:var(--text); }
.run-selection ul { margin:5px 0 0; padding-left:18px; }
.run-selection p { margin:5px 0 0; }
.run-hover { position:fixed; z-index:100; width:min(310px,calc(100vw - 24px)); max-height:min(320px,calc(100dvh - 24px)); overflow:auto; padding:14px 16px; border:1px solid var(--line); border-radius:10px; background:var(--bg); color:var(--muted); box-shadow:0 8px 30px #0002; font:13px/1.6 var(--font); overflow-wrap:anywhere; }
.run-hover[hidden] { display:none; }
.run-hover strong { color:var(--text); font-weight:600; }
.run-hover ul { margin:7px 0 0; padding-left:17px; }
.run-hover li+li { margin-top:5px; }
.run-hover p { margin:7px 0 0; }
.case-picker { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:14px; margin-top:18px; }
.case-picker label { font:500 14px/1.5 var(--font); }
.case-picker select { width:100%; min-width:0; min-height:44px; padding:10px 36px 10px 14px; border:1px solid var(--line); border-radius:8px; background:var(--bg); color:var(--text); font:14px/1.5 var(--font); text-overflow:ellipsis; }
.case-picker select:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.case-selection-note { margin:8px 0 0; font:12px/1.5 var(--font); color:var(--muted); }
.case-intro { margin:22px 0 24px; max-width:850px; }
.case-meta { margin:0 0 6px; color:var(--muted); font:12px/1.6 var(--font); }
.case-context { margin:0; font:15px/1.7 var(--font); color:var(--text); }
.case-outcome { margin:10px 0 0; color:var(--risk); font:15px/1.6 var(--font); }
.case-outcome strong { font-weight:600; margin-right:7px; }
.case-outcome[data-formation] { color:var(--benign); }
.case-review h4 { margin:0 0 16px; font:500 17px/1.5 var(--font); }
.case-review ol { max-width:850px; padding-left:23px; margin:0; color:var(--text); font:15px/1.7 var(--font); }
.case-review li { padding-left:7px; }
.case-review li+li { margin-top:14px; }
.case-scope,.case-pending { max-width:850px; margin:20px 0 0; color:var(--muted); font:13px/1.65 var(--font); }
.case-pending { margin-top:10px; }
.trajectory-viewer[data-case-mode="review"] :is(.traj-views,.traj-play) { display:none; }
[data-case-full][hidden],[data-case-review][hidden] { display:none; }
@media(max-width:600px) {
  .traj-header { display:grid; grid-template-columns:minmax(0,1fr) auto; }
  .traj-header h3 { grid-column:1; grid-row:1; }
  .traj-header .traj-play { grid-column:2; grid-row:1; }
  .traj-views { grid-column:1/-1; grid-row:2; justify-self:start; }
  .traj-log-row > summary { grid-template-columns:36px minmax(0,1fr) 10px; gap:9px; padding-block:12px; }
  .traj-log-who > span:not(.traj-avatar) { position:absolute; clip-path:inset(50%); width:1px; height:1px; overflow:hidden; }
  .traj-log-row > summary time { display:none; }
  .traj-log-body { margin:0 6px 18px; }
  .traj-inspector { min-height:0; }
}

@media (max-width:800px), (pointer:coarse) {
 .case-picker select { font-size:16px; }
}