.mode-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; background:#e3e8eb; border:1px solid #d5dde3; border-radius:5px; padding:5px; }
.mode-tabs button { border:0; border-radius:3px; padding:15px 18px; background:transparent; display:flex; align-items:center; gap:15px; text-align:left; color:#70818e; }
.mode-tabs button.active { background:#304c61; color:#f4f7f8; box-shadow:0 2px 6px #2a445214; }
.mode-tabs button:hover:not(.active) { background:#f1f4f6; }
.mode-number { font:12px 'DM Sans',sans-serif; opacity:.55; }
.mode-tabs b { display:block; font-size:14px; font-weight:600; }
.mode-tabs small { display:block; font-size:10px; margin-top:5px; letter-spacing:.6px; opacity:.72; }
.mode-description { margin:13px 3px 24px; font-size:12px; color:#657b8b; line-height:1.8; }
.difficulty-control { display:flex; align-items:center; gap:12px; font-size:11px; color:var(--muted); }
.difficulty-control select { margin:0; width:140px; background:#f0f3f5; padding:8px 10px; border-color:#d5dfe5; }
.mode-loading { padding:80px 20px; text-align:center; border:1px solid var(--line); background:var(--card); font-size:13px; color:var(--muted); }
.investigation-title { margin:16px 0 11px; font-size:25px; letter-spacing:-.8px; color:#304e64; }
.evidence-card-heading img { border-radius:50%; flex-shrink:0; }
#inv-case-label { padding:9px 0; }
#inv-practice { font-size:10px; }
.difficulty-note { margin:0 22px; padding:10px 12px; border-left:2px solid #9aafbd; background:#f0f4f6; color:#738592; font-size:10px; line-height:1.8; }
.investigation-board { padding:20px 22px 24px; }
.image-evidence-grid, .statement-grid, .record-candidates { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.evidence-card { text-align:left; border:1px solid #d8e0e5; border-radius:4px; background:#fafbfb; padding:13px; overflow:hidden; }
.evidence-card:hover { border-color:#8aa2b3; background:#f4f7f9; }
.evidence-card.selected { border-color:#4c738f; box-shadow:inset 0 0 0 1px #4c738f; background:#f0f5f8; }
.evidence-card.answer { border-color:#b28042; }
.evidence-card-heading { display:flex; align-items:center; gap:9px; position:relative; }
.evidence-card-heading b { display:block; font-size:12px; }
.evidence-card-heading small { display:block; margin-top:4px; font-size:10px; color:#72828d; }
.evidence-flag { position:absolute; right:-3px; top:-5px; font-size:8px; background:#efe1cd; color:#835c2e; padding:3px 5px; border-radius:2px; }
.evidence-flag.muted { background:#dce7ee; color:#47657c; }
.image-thumbnails { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:12px; }
.image-thumbnails img { width:100%; display:block; aspect-ratio:1; background:#12181b; image-rendering:pixelated; border-radius:2px; }
.image-thumbnails small { display:block; text-align:center; font-size:9px; margin-top:6px; color:#758490; }
.evidence-detail { margin-top:22px; padding-top:20px; border-top:1px solid var(--line); scroll-margin-top:20px; }
.detail-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }
.detail-heading h3 { font-size:13px; font-weight:600; margin:0; }
.detail-heading .small-button { font-size:10px; margin:0; }
.small-button.is-active { background:#304f65; border-color:#304f65; color:white; }
.image-comparison { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.image-pane-label { font-size:10px; color:#657c8d; margin:0 0 8px; }
.zoom-window { aspect-ratio:1; width:100%; overflow:auto; background:#0e1419; border:1px solid #354c5e; border-radius:3px; }
.zoom-surface { width:calc(100% * var(--zoom,1)); aspect-ratio:1; }
.zoom-surface canvas { width:100%; display:block; aspect-ratio:1; }
.zoom-control { display:flex; align-items:center; gap:12px; font-size:10px; color:var(--muted); margin:15px 0; }
.zoom-control input { flex:1; width:auto; }
.zoom-control output { min-width:24px; }
.evidence-caption { font-size:10px; color:#7a8b96; line-height:1.8; margin:12px 0 0; }
.empty-evidence { padding:30px 10px 15px; text-align:center; color:#7a8d9c; font-size:12px; line-height:1.8; }
.card-detail { display:block; font-size:10px; color:#7e8f9a; padding-top:12px; }
.statement-preview { display:block; margin-top:12px; border-top:1px solid #dfe6ea; padding-top:10px; }
.statement-preview small { display:block; color:#8799a6; font-size:9px; margin-bottom:6px; }
.statement-preview > span { font-size:12px; line-height:1.8; color:#4f6779; display:block; }
.text-comparison { display:grid; gap:14px; }
.text-comparison article { border:1px solid #dbe3e8; background:#f6f8f9; border-radius:3px; padding:18px; }
.text-comparison article + article { background:#f5f2ed; border-color:#e4ded3; }
.document-heading { display:flex; align-items:center; gap:9px; }
.document-heading > span { font-size:10px; color:#91a2ad; }
.document-heading b { font-size:11px; font-weight:500; }
.document-heading small { margin-left:auto; font-size:9px; color:#8797a1; }
.text-comparison p { font-size:17px; line-height:1.9; margin:18px 0 3px; color:#364f62; }
.text-comparison mark { color:#815521; background:#f1d6ae; padding:2px 3px; border-radius:2px; }
.compare-checklist { display:flex; gap:8px; margin:14px 0 0; }
.compare-checklist span { font-size:10px; color:#6b8190; background:#eaf0f4; padding:6px 10px; border-radius:3px; }
.investigation-hint { padding:13px; background:#eff3f6; border-left:2px solid #7a95a7; font-size:11px; line-height:1.9; color:#647c8e; }
.model-info-link { margin-top:20px; padding-top:15px; border-top:1px solid var(--line); width:100%; color:#718998; font-size:11px; }
.mode-result-heading { border-top:1px solid var(--line); padding-top:18px; margin-top:18px; }
.mode-result-heading > span { font-size:9px; color:#7c8f9d; letter-spacing:1px; }
.mode-result-heading h3 { font-size:18px; line-height:1.6; font-weight:600; color:#7e6451; }
.mode-result-heading.correct h3 { color:#37666d; }
.investigation-aside .answer-pair strong { font-size:20px; }
.investigation-aside .answer-pair small { display:block; font-size:10px; font-weight:400; margin-top:6px; color:var(--muted); }
.investigation-aside #inv-show-answer { margin-top:20px; }
.investigation-aside .rank-name { width:43px; }
.jump-to-record { display:none; }
.investigation-brief { display:block; padding:22px 28px; }
.investigation-brief .story-sheet { padding:0; border:0; }
.investigation-brief .investigation-title { margin:9px 0; font-size:23px; }
.investigation-brief .case-facts { margin:12px 0 9px; }
.investigation-brief .fact-explanation { color:#536e80; margin-bottom:0; }
#investigation-mode .mission-strip { padding:14px 3px; }
#investigation-mode .board-panel, .investigation-aside { min-width:0; }
.investigation-aside { min-height:0; }
.image-thumbnails img { max-height:110px; object-fit:contain; }
.evidence-card:focus-visible, .small-button:focus-visible { outline:2px solid #395e7c; outline-offset:3px; }
.record-candidates { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.record-candidates .evidence-card { padding:10px 12px; }
.record-candidates .card-detail { padding-top:7px; }
.timeline-detail { margin-top:18px; }
.detail-kicker { display:block; font-size:9px; letter-spacing:1.2px; color:#718795; margin-bottom:7px; }
.chart-duration { color:#6b8291; font:11px 'DM Sans',sans-serif; white-space:nowrap; }
.chart-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin:16px 0 12px; }
.file-filters { display:flex; flex-wrap:wrap; gap:5px; }
.file-filters .small-button { margin:0; font-size:10px; padding:6px 10px; }
.chart-legend { display:flex; flex-wrap:wrap; gap:12px; color:#5e7585; font-size:10px; }
.chart-legend span { display:flex; align-items:center; gap:5px; }
.chart-legend i { width:8px; height:8px; display:inline-block; }
.chart-legend .approve { border-radius:50%; background:#398379; }
.chart-legend .revoke { background:#576b7b; }
.chart-legend .export { background:#b77b34; transform:rotate(45deg); }
.chart-legend .other { border-radius:50%; width:6px; height:6px; background:#92a2ad; }
.chart-scroll { overflow-x:auto; max-width:100%; border:1px solid #dae3e8; border-radius:4px; background:#f9fbfc; }
.chart-scroll:focus-visible { outline:2px solid #567e98; outline-offset:2px; }
.approval-chart { display:block; width:100%; min-width:620px; height:auto; font-family:inherit; }
.chart-axis-title { font-size:10px; fill:#718695; }
.chart-grid { stroke:#e1e8ed; stroke-dasharray:3 4; }
.chart-tick { font-size:11px; fill:#637c8e; font-variant-numeric:tabular-nums; }
.chart-file { font-size:12px; font-weight:600; fill:#38596f; }
.chart-state-label { font-size:10px; fill:#657e8e; }
.chart-baseline { stroke:#d5e0e6; }
.chart-approved-band { fill:#e3f0eb; }
.chart-state-line { fill:none; stroke:#527f7b; stroke-width:2.5; stroke-linejoin:round; }
.chart-event { cursor:pointer; outline:none; }
.chart-hit { fill:transparent; }
.chart-event-ring { fill:none; stroke:transparent; stroke-width:2; }
.chart-event.selected .chart-event-ring, .chart-event:focus .chart-event-ring, .chart-event:hover .chart-event-ring { stroke:#365e7b; }
.chart-event.offending .chart-event-ring { stroke:#ab6534; }
.chart-approve { fill:#398379; stroke:#fff; stroke-width:1.5; }
.chart-revoke { fill:#576b7b; stroke:#fff; stroke-width:1.5; }
.chart-export { fill:#ba803c; stroke:#fff; stroke-width:1.5; }
.chart-other { fill:#92a2ad; stroke:#fff; stroke-width:1; }
.chart-answer-label { fill:#96602b; font-size:10px; font-weight:600; }
.chart-cursor { stroke:#6c8fa7; stroke-width:1; stroke-dasharray:3 4; pointer-events:none; }
.chart-help { font-size:11px; line-height:1.8; color:#617c8e; margin:10px 0; }
.chart-help span { display:none; }
.chart-event-detail { display:flex; flex-wrap:wrap; gap:6px 16px; padding:12px 14px; border-left:2px solid #7895a8; background:#edf3f6; font-size:11px; line-height:1.8; color:#49687d; min-height:44px; }
.chart-event-detail b { font-weight:500; }
.chart-event-detail span { color:#6a8190; }
.raw-log { margin-top:16px; border-top:1px solid #e0e7eb; }
.raw-log summary { padding:13px 0; cursor:pointer; font-size:11px; color:#597487; }
.raw-log summary span { color:#8b9ba7; margin-left:5px; }
.raw-log ol { padding:0; margin:0; list-style:none; }
.raw-event { display:flex; width:100%; align-items:center; gap:14px; text-align:left; padding:10px; background:transparent; border:0; border-bottom:1px solid #e5ebef; font-size:11px; }
.raw-event time { color:#657e8f; font-variant-numeric:tabular-nums; }
.raw-event b { font-weight:500; }
.raw-event span { margin-left:auto; color:#7a8e9c; }
.raw-event.selected { background:#eaf2f7; }
.raw-event.offending { background:#f6e8d6; }
.investigation-error { padding:20px; margin-top:16px; border:1px solid #d9b9a2; border-radius:4px; background:#fcf6f0; }
.investigation-error .error { margin:0 0 10px; }
@media(min-width:1250px) {
  .record-candidates:has(> :nth-child(5)) { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:1050px) {
  .mode-tabs button { padding:13px 12px; gap:10px; }
  .mode-tabs b { font-size:13px; }
  .investigation-board { padding:16px; }
  .evidence-card { padding:10px; }
  .evidence-card-heading { gap:7px; }
  .evidence-card-heading img { width:33px; height:33px; }
  .evidence-card-heading small { font-size:8px; }
}
@media(max-width:800px) {
  .investigation-brief { padding:20px; }
  .chart-help span { display:inline; }
  .mode-description { font-size:11px; margin-bottom:20px; }
  .mode-tabs button { padding:12px 8px; gap:6px; }
  .mode-number { display:none; }
  .mode-tabs b { font-size:12px; }
  .mode-tabs small { font-size:9px; }
  .mode-tabs button > span:last-child { margin:auto; text-align:center; }
  .investigation-title { font-size:23px; }
  .jump-to-record { display:inline-flex; color:#50748e; margin-top:14px; }
  .evidence-card-heading small { font-size:10px; }
}
@media(max-width:440px) {
  .investigation-brief { padding:17px; }
  .investigation-brief .investigation-title { font-size:21px; }
  .record-candidates .evidence-card { padding:9px; }
  .record-candidates .card-detail { font-size:9px; }
  .chart-duration { font-size:10px; }
  .chart-legend { gap:10px; font-size:9px; }
  .mode-tabs { gap:3px; padding:4px; }
  .mode-tabs button { padding:10px 4px; }
  .mode-tabs b { font-size:11px; }
  .mode-tabs small { font-size:8px; letter-spacing:0; }
  .mode-description { font-size:10px; }
  .investigation-board { padding:14px 12px; }
  .image-evidence-grid, .statement-grid, .record-candidates { gap:8px; }
  .evidence-card-heading img { width:28px; height:28px; }
  .evidence-card-heading b { font-size:11px; }
  .evidence-card-heading small { font-size:8px; }
  .image-thumbnails { gap:5px; }
  .evidence-card { padding:9px; }
  .text-comparison p { font-size:15px; }
  .document-heading { flex-wrap:wrap; }
  .document-heading small { margin-left:0; }
  .difficulty-control { gap:8px; }
  .difficulty-control select { width:125px; }
}