.exam-history-controls { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:14px 0 12px; padding:12px 14px; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); }
.exam-history-controls label { display:flex; align-items:center; gap:10px; font-size:11px; color:var(--text); font-weight:700; }
.exam-history-controls select { max-width:100%; min-height:38px; padding:7px 30px 7px 10px; border:1px solid var(--border); border-radius:9px; background:var(--surface); color:var(--primary); font:inherit; }
.exam-history-controls>span { color:var(--muted); font-size:10px; line-height:1.6; }
.exam-history-note { padding:10px 13px; margin:10px 0 14px; border-left:3px solid color-mix(in srgb,var(--primary) 40%,var(--border)); border-radius:0 9px 9px 0; background:var(--surface-2); color:var(--muted); font-size:11px; line-height:1.8; }
.exam-history-legend { display:flex; align-items:center; flex-wrap:wrap; gap:10px 18px; margin:14px 0; color:var(--muted); font-size:10px; }
.exam-history-legend>span { display:inline-flex; align-items:center; gap:6px; }
.exam-history-legend>span::before { content:''; width:8px; height:8px; border-radius:50%; background:var(--primary); }
.exam-history-legend .reference::before { background:var(--surface); border:2px solid #6c829d; }
.exam-history-legend .range::before { width:18px; height:6px; border-radius:3px; background:#dce6f0; }
.exam-history-legend .exam-comparison-method { margin-left:auto; }
.exam-history-comparison .exam-history-plot { height:24px; background:linear-gradient(90deg,var(--surface-2),var(--surface-3)); }
.exam-history-plot::before { top:3px; bottom:3px; opacity:.65; }
.exam-history-range { position:absolute; top:5px; height:14px; min-width:2px; border-radius:5px; background:#dce6f0; }
.exam-history-link { position:absolute; top:11px; height:3px; background:#287b60; }
.exam-history-reference { position:absolute; top:8px; width:9px; height:9px; margin-left:-4px; border:2px solid #6c829d; border-radius:50%; background:var(--surface); z-index:1; }
.exam-history-current { position:absolute; top:7px; width:11px; height:11px; margin-left:-5px; border:2px solid var(--surface); border-radius:50%; background:#287b60; box-shadow:0 0 0 1px #287b6033; z-index:2; }
.exam-comparison-row.down .exam-history-link,.exam-comparison-row.down .exam-history-current { background:#b55058; }
.exam-comparison-row.flat .exam-history-current { background:#7b8792; }
.exam-history-comparison .exam-comparison-change small { display:block; font-size:9px; font-weight:500; margin-top:3px; color:var(--muted); }
.exam-history-comparison .exam-history-detail { display:block; }
.exam-history-detail p { color:var(--muted); font-size:10px; line-height:1.8; }
.exam-history-trend { width:100%; overflow-x:auto; margin:12px 0; border:1px solid var(--border); border-radius:10px; background:var(--surface); }
.exam-history-trend svg { display:block; width:100%; min-width:280px; height:150px; }
.exam-history-trend text { fill:var(--muted); font:10px system-ui,sans-serif; }
.exam-history-audit { max-width:100%; overflow-x:auto; }
.exam-history-audit table { display:table; width:100%; min-width:400px; border-collapse:collapse; text-align:left; }
.exam-history-audit th,.exam-history-audit td { padding:9px 10px; border-bottom:1px solid var(--border); font-size:11px; font-weight:500; white-space:nowrap; }
.exam-history-audit thead { color:var(--muted); }
.exam-history-audit tbody th { white-space:normal; min-width:150px; }
.exam-history-audit th small { display:block; color:var(--muted); font-size:9px; margin-top:4px; }
.exam-history-audit .is-current { background:var(--surface-3); color:var(--primary); font-weight:700; }
@media(max-width:800px) {
 .exam-history-controls { align-items:stretch; padding:10px; gap:7px; }
 .exam-history-controls label { flex:1 1 100%; flex-wrap:wrap; }
 .exam-history-controls select { min-width:0; width:100%; font-size:12px; }
 .exam-history-controls>span { font-size:9px; }
 .exam-history-legend { gap:9px 13px; font-size:9px; }
 .exam-history-legend .exam-comparison-method { margin-left:0; }
 .exam-history-comparison .exam-comparison-row-head { grid-template-columns:minmax(0,1fr) 86px; }
 .exam-history-comparison .exam-comparison-ranks { display:flex; align-items:center; gap:8px; font-size:10px; }
 .exam-history-comparison .exam-comparison-plot { margin:5px; }
}
.exam-simple-comparison .exam-simple-table-head,.exam-simple-comparison .exam-comparison-row-head { display:grid; grid-template-columns:minmax(100px,1fr) 130px minmax(160px,1fr) 130px; gap:14px; align-items:center; padding:13px 15px; }
.exam-simple-table-head { background:var(--surface-2); color:var(--muted); font-size:10px; }
.exam-simple-score { min-width:0; display:grid; gap:5px; }
.exam-simple-score>b { color:var(--text); font-size:16px; }
.exam-simple-score>b small { color:var(--muted); font-size:9px; font-weight:500; }
.exam-simple-score>span { color:var(--muted); font-size:9px; }
.exam-simple-compare { display:flex; align-items:center; gap:8px; min-width:0; }
.exam-simple-compare>span { flex:1; min-width:0; display:flex; align-items:center; justify-content:center; gap:7px; padding:8px; border-radius:9px; }
.exam-simple-compare small { color:var(--muted); font-size:9px; white-space:nowrap; }
.exam-simple-compare b { font-size:12px; white-space:nowrap; }
.exam-simple-compare>i { color:var(--muted); font-size:13px; font-style:normal; }
.exam-simple-usual { background:var(--surface-2); color:var(--text); }
.exam-simple-now { background:var(--surface-3); color:var(--primary); }
.exam-simple-comparison .down .exam-simple-now { background:#fbefef; color:#a9555e; }
.exam-simple-comparison .flat .exam-simple-now { background:var(--surface-2); color:var(--text); }
.exam-simple-result { display:grid; justify-items:end; gap:7px; }
.exam-simple-result>b { padding:6px 9px; border-radius:999px; color:#287b60; background:#edf6f1; font-size:10px; white-space:nowrap; }
.exam-simple-result>small { color:var(--muted); font-size:9px; }
.exam-simple-comparison .down .exam-simple-result>b { color:#a9555e; background:#fbefef; }
.exam-simple-comparison .flat .exam-simple-result>b,.exam-simple-comparison .unavailable .exam-simple-result>b { color:var(--muted); background:var(--surface-2); }
.exam-simple-help { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:10px 0 14px; color:var(--muted); font-size:10px; line-height:1.7; }
.exam-simple-help>details { flex:0 0 auto; }
@media(max-width:800px) {
 .exam-simple-comparison .exam-simple-table-head { display:none; }
 .exam-simple-comparison .exam-comparison-row-head { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:11px; padding:13px 12px; }
 .exam-simple-comparison .exam-comparison-student { grid-column:1; grid-row:1; }
 .exam-simple-score { grid-column:2; grid-row:1; text-align:right; }
 .exam-simple-compare { grid-column:1; grid-row:2; gap:4px; }
 .exam-simple-compare>span { display:grid; gap:3px; padding:6px 4px; }
 .exam-simple-compare b { font-size:11px; }
 .exam-simple-compare small { font-size:8px; }
 .exam-simple-result { grid-column:2; grid-row:2; gap:6px; }
 .exam-simple-result>b { font-size:9px; padding:6px 8px; }
 .exam-simple-help { display:grid; gap:7px; font-size:9px; }
}
/* Shared compact reading rhythm: student, concrete history, change, follow-up. */
.progress-track-comparison { --track-columns:minmax(120px,1.15fr) minmax(180px,1.65fr) minmax(90px,.8fr) minmax(100px,1fr); }
.progress-track-head,.progress-track-comparison .exam-comparison-row-head { display:grid; grid-template-columns:var(--track-columns); align-items:center; gap:20px; padding:9px 16px; }
.progress-track-head { color:var(--muted); background:var(--surface-2); font-size:10px; min-height:39px; }
.progress-track-comparison .exam-comparison-row-head { min-height:100px; padding-top:12px; padding-bottom:12px; }
.progress-student,.progress-movement,.progress-pattern { display:grid; gap:5px; min-width:0; }
.progress-track-comparison .progress-student small { display:block; margin:0; font-size:11px; color:var(--muted); }
.progress-student small b { color:var(--text); font-size:13px; }
.progress-student strong { font-size:12px; }
.progress-movement b { font-size:14px; font-variant-numeric:tabular-nums; }
.progress-pattern b { font-size:11px; font-weight:600; }
.progress-movement small,.progress-pattern small { font-size:10px; color:var(--muted); font-weight:400; }
.progress-pattern small { opacity:.8; }
.progress-rank-trace { display:block; min-width:0; width:100%; height:72px; }
.progress-rank-trace svg { display:block; width:100%; overflow:visible; }
.progress-no-trace { color:var(--muted); font-size:10px; line-height:1.6; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.progress-track-comparison .up .progress-movement b { color:#2e7e68; }
.progress-track-comparison .down .progress-movement b { color:#b25a64; }
.progress-track-comparison .flat .progress-movement b,.progress-track-comparison .unavailable .progress-movement b { color:var(--muted); }
.progress-track-comparison .rank-review .progress-movement b { color:#97752a; font-size:12px; }
.progress-method { margin-top:14px; }
.progress-method p { max-width:1050px; color:var(--muted); line-height:1.9; font-size:11px; }
.dictation-track { --track-columns:minmax(100px,1.1fr) minmax(180px,1.8fr) minmax(105px,1fr) minmax(100px,.9fr); }
.dictation-track .learning-section-head { margin-bottom:12px; }
.dictation-track .learning-section-head p { margin:5px 0 0; }
.dictation-track .dictation-change-tools { justify-content:space-between; }
.dictation-track .dictation-change-tools>div { display:flex; gap:6px; flex-wrap:wrap; }
.dictation-track-legend { display:flex; gap:8px 16px; flex-wrap:wrap; color:var(--muted); font-size:10px; margin:12px 0; }
.dictation-track-legend>span { display:flex; align-items:center; gap:5px; }
.dictation-track-legend>span::before { content:''; width:6px; height:6px; border-radius:50%; background:#2e7e68; }
.dictation-track-legend>span:nth-child(2)::before { background:#b48b2d; }
.dictation-track-legend>.correction-key::before { background:#9473c1; }
.dictation-track-heading,.dictation-track-row { display:grid; grid-template-columns:var(--track-columns); align-items:center; gap:18px; padding:12px 14px; }
.dictation-track-heading { color:var(--muted); background:var(--surface-2); border:1px solid var(--border); border-radius:12px 12px 0 0; font-size:10px; }
.dictation-track-list { border:1px solid var(--border); border-top:0; border-radius:0 0 12px 12px; overflow:hidden; }
.dictation-track-row { min-height:100px; border-bottom:1px solid var(--border); font-size:12px; }
.dictation-track-row:last-child { border-bottom:0; }
.dictation-track-row:hover { background:var(--surface-2); }
.dictation-track-student { min-width:0; }
.dictation-track .dictation-change-student { white-space:normal; overflow-wrap:anywhere; padding:0; line-height:1.5; color:var(--text); }
.dictation-track .dictation-change-student:hover { color:var(--primary); }
.dictation-track-student>small { display:block; color:var(--muted); font-size:11px; margin-top:4px; }
.dictation-track-sequence { display:flex; gap:6px; min-width:0; }
.dictation-track-cell { flex:1; position:relative; min-width:0; min-height:32px; padding:7px 4px; border:1px solid transparent; border-radius:7px; background:var(--surface-2); color:var(--muted); font:inherit; font-size:11px; font-variant-numeric:tabular-nums; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dictation-track-cell b { font-weight:550; }
.dictation-track-cell.first,.dictation-track-cell.retest { background:#edf6f1; color:#34715e; }
.dictation-track-cell.below { background:#fcf5e5; color:#987324; }
.dictation-track-cell.is-current { border-color:currentColor; font-weight:700; }
.dictation-track-cell:hover { filter:brightness(.96); }
.dictation-track-dot { position:absolute; width:6px; height:6px; top:3px; right:3px; border-radius:50%; background:#9473c1; box-shadow:0 0 0 2px var(--surface); }
.dictation-track-transition { display:grid; gap:5px; min-width:0; }
.dictation-track-transition b { font-size:11px; font-weight:600; }
.dictation-track-transition small { color:var(--muted); font-size:9px; }
.dictation-track-transition.up b { color:#34715e; }
.dictation-track-transition.down b { color:#987324; }
.dictation-track-follow { display:flex; flex-wrap:wrap; align-items:center; gap:5px; }
.dictation-follow-chip { padding:5px 7px; border-radius:6px; background:var(--surface-2); font-size:10px; color:var(--muted); white-space:nowrap; }
.dictation-follow-chip.passed { color:#34715e; background:#edf6f1; }
.dictation-follow-chip.pending { color:#987324; background:#fcf5e5; }
.dictation-follow-chip.uncorrected { color:#7e5fa7; background:#f2edf8; }
.dictation-track .dictation-change-method { margin-top:14px; }
@media(min-width:801px) { .dictation-track-follow { flex-wrap:nowrap; } }
@media(max-width:1000px) and (min-width:801px) {
 .progress-track-comparison { --track-columns:minmax(105px,1fr) minmax(150px,1.4fr) 85px 95px; }
 .progress-track-head,.progress-track-comparison .exam-comparison-row-head { gap:12px; padding-left:12px; padding-right:12px; }
 .dictation-track { --track-columns:100px minmax(180px,1.6fr) 110px minmax(100px,1fr); }
 .dictation-track-row,.dictation-track-heading { gap:10px; padding-left:10px; padding-right:10px; }
 .dictation-track-follow { flex-wrap:wrap; }
}
@media(max-width:800px) {
 .progress-track-head,.dictation-track-heading { display:none; }
 .progress-track-comparison .exam-comparison-row-head { grid-template-columns:minmax(0,1fr) 110px; gap:7px 14px; padding:11px 12px; }
 .progress-student { grid-column:1; grid-row:1; }
 .progress-movement { grid-column:2; grid-row:1; text-align:right; }
 .progress-rank-trace,.progress-no-trace { grid-column:1; grid-row:2; }
 .progress-pattern { grid-column:2; grid-row:2; text-align:right; }
 .progress-student strong { font-size:11px; }
 .progress-track-comparison .exam-comparison-cohort { margin:0; }
 .progress-track-comparison .exam-history-controls { gap:6px; }
 .dictation-track-row { grid-template-columns:minmax(0,1fr) auto; gap:9px 10px; padding:12px; }
 .dictation-track-list { border-top:1px solid var(--border); border-radius:12px; }
 .dictation-track-student { grid-column:1; grid-row:1; }
 .dictation-track-follow { grid-column:2; grid-row:1; justify-content:flex-end; max-width:135px; }
 .dictation-track-sequence { grid-column:1 / -1; grid-row:2; }
 .dictation-track-transition { grid-column:1 / -1; grid-row:3; display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; }
 .dictation-track .dictation-change-tools label { flex-wrap:wrap; }
 .dictation-track-cell { min-height:44px; }
}
/* A readable overview and optional large chart share the same scale. */
.progress-expanded-chart { border:1px solid var(--border); border-radius:12px; background:var(--surface-2); padding:14px 12px 4px; margin:4px 0 14px; }
.progress-expanded-title { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 14px; margin:0 4px 10px; }
.progress-expanded-title strong { font-size:12px; }
.progress-expanded-title span { color:var(--muted); font-size:10px; line-height:1.6; }
.progress-chart-scroll { max-width:100%; min-width:0; overflow-x:auto; overscroll-behavior-x:contain; }
.progress-large-trace,.dictation-large-trace { display:block; width:100%; min-width:0; height:180px; }
.progress-large-trace svg,.dictation-large-trace svg { display:block; width:100%; }
.dictation-trace-note { color:var(--muted); font-size:10px; line-height:1.7; margin:10px 0 14px; }
.dictation-track-entry { margin:0; border:0; border-bottom:1px solid var(--border); border-radius:0; box-shadow:none; padding:0; }
.dictation-track-entry:last-child { border-bottom:0; }
.dictation-track-entry>.dictation-track-row { list-style:none; cursor:pointer; border:0; }
.dictation-track-row::-webkit-details-marker { display:none; }
.dictation-track-entry[open]>.dictation-track-row { background:var(--surface-2); }
.dictation-track .dictation-track-sequence { min-height:72px; align-items:center; }
.dictation-track-cell { min-height:44px; font-size:12px; }
.dictation-mini-trace { display:block; width:100%; min-width:0; height:72px; }
.dictation-mini-trace svg { display:block; width:100%; overflow:visible; }
.dictation-track-follow { flex-wrap:wrap; align-content:center; }
.dictation-trace-toggle { flex-basis:100%; font-size:10px; color:var(--muted); margin-top:1px; }
.dictation-track-detail { padding:16px 14px 18px; border-top:1px solid var(--border); background:var(--surface-2); }
.dictation-history-table { width:100%; min-width:540px; margin-top:10px; border-collapse:collapse; font-size:11px; }
.dictation-history-table th,.dictation-history-table td { text-align:left; padding:11px 10px; border-bottom:1px solid var(--border); font-weight:400; white-space:nowrap; }
.dictation-history-table th small { display:block; color:var(--muted); margin-top:4px; font-size:10px; }
.dictation-history-table thead th { color:var(--muted); }
.dictation-history-table .is-current { background:var(--surface-3); }
.dictation-history-follow { display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
.dictation-edit-record { background:transparent; color:var(--primary); padding:5px 0; border:0; font:inherit; font-size:11px; cursor:pointer; }
.dictation-edit-record:hover { text-decoration:underline; }
.dictation-history-cards { display:grid; grid-template-columns:repeat(var(--history-count),minmax(125px,1fr)); gap:10px; min-width:calc(var(--history-count) * 135px - 10px); padding:2px 0; }
.dictation-history-card { display:flex; flex-direction:column; gap:8px; min-height:180px; border:1px solid var(--border); border-radius:10px; background:var(--surface); padding:12px; }
.dictation-history-card.is-current { border-color:var(--primary); }
.dictation-history-card>strong { font-size:11px; line-height:1.6; }
.dictation-history-card>small { font-size:10px; color:var(--muted); }
.dictation-history-card>b { font-size:18px; margin:5px 0 3px; }
.dictation-history-card>.dictation-edit-record { margin-top:auto; text-align:left; }
@media(max-width:800px) {
 .progress-track-comparison .exam-comparison-row-head { gap:9px 14px; padding-top:14px; padding-bottom:14px; }
 .dictation-track .dictation-track-sequence { min-height:72px; }
 .dictation-track-detail { padding:14px 10px; }
 .dictation-trace-toggle { text-align:right; }
}
