/* Tests (owner, 2026-10-08), the /student/tests tab (tests-view.js): moved from the lab's lab-test.css. */
.test-screen{display:grid;gap:var(--vq-space-3)}
.test-label{margin:var(--vq-space-2) 0 0;color:var(--vq-ink-muted);font:var(--vq-weight-bold) var(--vq-text-sm)/1.2 var(--vq-font)}
.test-chips{display:flex;flex-wrap:wrap;gap:var(--vq-space-2)}
.test-chips button{min-height:40px;padding:0 var(--vq-space-4);border:var(--vq-border);border-radius:var(--vq-radius-sm);background:var(--vq-surface);color:var(--vq-ink);font:var(--vq-weight-bold) var(--vq-text-sm)/1 var(--vq-font)}
.test-chips button.is-on{background:var(--vq-ink);color:var(--vq-on-ink)}
.test-checks{display:grid;gap:var(--vq-space-2);margin:0;padding:0;list-style:none}
.test-checks label{display:flex;align-items:center;gap:var(--vq-space-3);min-height:44px;padding:0 var(--vq-space-3);border:var(--vq-border);border-radius:var(--vq-radius-sm);color:var(--vq-ink);font:var(--vq-weight-medium) var(--vq-text-md)/1.3 var(--vq-font)}
.test-summary,.test-note{margin:0;color:var(--vq-ink-muted);font:var(--vq-weight-medium) var(--vq-text-sm)/1.4 var(--vq-font)}
.test-card{display:grid;gap:var(--vq-space-2);padding:var(--vq-space-4);border:var(--vq-border);border-radius:var(--vq-radius-sm);background:var(--vq-surface)}
.test-card h2{margin:0;color:var(--vq-ink);font:var(--vq-weight-bold) var(--vq-text-xl, 1.35rem)/1.2 var(--vq-font)}
.test-card p{margin:0;color:var(--vq-ink);font:var(--vq-weight-medium) var(--vq-text-md)/1.4 var(--vq-font)}
.test-eyebrow{margin:0;color:var(--vq-accent);font:var(--vq-weight-bold) var(--vq-text-sm)/1.2 var(--vq-font);letter-spacing:.08em;text-transform:uppercase}
.test-paper{padding:var(--vq-space-4);border:1px solid var(--vq-sheet-rule);border-radius:2px;background:var(--vq-sheet);color:var(--vq-sheet-ink)}
.test-paper .test-bar,.test-paper .test-clock,.test-paper .test-on-paper{border-color:var(--vq-sheet-ink)}
.test-paper .primary-action{margin-top:var(--vq-space-3)}
.test-bar{display:flex;justify-content:space-between;align-items:center;padding-bottom:var(--vq-space-3);border-bottom:var(--vq-border);font:var(--vq-weight-bold) var(--vq-text-sm)/1 var(--vq-font)}
.test-clock{padding:var(--vq-space-1) var(--vq-space-3);border:var(--vq-border);border-radius:var(--vq-radius-sm)}
.test-section{display:flex;justify-content:space-between;align-items:baseline;margin:var(--vq-space-3) 0 0;font:var(--vq-weight-bold) var(--vq-text-md)/1.2 var(--vq-font)}
.test-section small{font-weight:var(--vq-weight-medium);opacity:.75}
.test-q{display:grid;grid-template-columns:28px 1fr 24px;gap:var(--vq-space-2);font:var(--vq-weight-medium) var(--vq-text-md)/1.45 var(--vq-font)}
.test-q p{margin:0 0 var(--vq-space-2);white-space:pre-line}
.test-num{font-weight:var(--vq-weight-bold)}
.test-marks{text-align:right;font-weight:var(--vq-weight-bold)}
.test-q p.test-or{font:var(--vq-weight-bold) var(--vq-text-sm)/1.2 var(--vq-font);letter-spacing:.08em;text-align:center}
.test-note{margin:var(--vq-space-3) 0 0;font:var(--vq-weight-medium) var(--vq-text-sm)/1.4 var(--vq-font);opacity:.85}
.test-options{display:grid;grid-template-columns:1fr;gap:var(--vq-space-1);margin:0;padding:0;list-style:none}
.test-options li{justify-self:start;padding:2px var(--vq-space-2);border:2px solid transparent;border-radius:999px;cursor:pointer}
.test-options li.is-picked{border-color:var(--vq-sheet-pen);color:var(--vq-sheet-pen)}
.test-on-paper{display:inline-block;padding:var(--vq-space-1) var(--vq-space-3);border:var(--vq-border);border-style:dashed;border-radius:var(--vq-radius-sm);font:var(--vq-weight-bold) var(--vq-text-sm)/1.2 var(--vq-font)}
.test-pages{display:grid;gap:var(--vq-space-2);margin:0;padding:0;list-style:none}
.test-pages li{display:flex;justify-content:space-between;align-items:center;min-height:52px;padding:0 var(--vq-space-3);border:var(--vq-border);border-radius:var(--vq-radius-sm);color:var(--vq-ink);font:var(--vq-weight-medium) var(--vq-text-md)/1 var(--vq-font)}
.test-pages li.is-done strong{color:var(--vq-accent)}
.test-snap{min-height:40px;padding:0 var(--vq-space-4);border:var(--vq-border);border-radius:var(--vq-radius-sm);background:var(--vq-ink);color:var(--vq-on-ink);font:var(--vq-weight-bold) var(--vq-text-sm)/1 var(--vq-font)}
.test-score{font-size:3rem}
.test-sections{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--vq-space-2);margin:0}
.test-sections div{padding:var(--vq-space-3);border:var(--vq-border);border-radius:var(--vq-radius-sm);text-align:center}
.test-sections dt{color:var(--vq-ink-muted);font:var(--vq-weight-bold) var(--vq-text-sm)/1 var(--vq-font)}
.test-sections dd{margin:var(--vq-space-1) 0 0;color:var(--vq-ink);font:var(--vq-weight-bold) var(--vq-text-lg, 1.15rem)/1 var(--vq-font)}
.test-leaks{display:grid;gap:var(--vq-space-2);margin:0;padding:0;list-style:none}
.test-leaks li{display:grid;gap:var(--vq-space-1);padding:var(--vq-space-3);border:var(--vq-border);border-radius:var(--vq-radius-sm);color:var(--vq-ink);font:var(--vq-weight-medium) var(--vq-text-sm)/1.35 var(--vq-font)}
.test-earned{margin:0;color:var(--vq-accent);font:var(--vq-weight-bold) var(--vq-text-xl, 1.35rem)/1 var(--vq-font)}
.test-all{margin-left:var(--vq-space-2);padding:0;border:0;background:none;color:var(--vq-accent);font:var(--vq-weight-bold) var(--vq-text-sm)/1.3 var(--vq-font);text-decoration:underline;cursor:pointer}
.test-reading{margin:var(--vq-space-2) 0 0;padding:var(--vq-space-2) var(--vq-space-3);border:1px dashed var(--vq-sheet-ink);border-radius:2px;font:var(--vq-weight-bold) var(--vq-text-sm)/1.4 var(--vq-font)}
#order-start:disabled{opacity:.5;cursor:not-allowed}
/* Mobile first (owner, 2026-10-08: 90% of children use a phone). Compact < 480px, wide >= 651px (tokens.css). */
#test-steps{overflow-x:auto;scrollbar-width:none}
#test-steps button{flex:0 0 auto}
.test-q{margin-top:var(--vq-space-3)}
.test-q + .test-section{margin-top:var(--vq-space-5, 24px)}
@media (max-width:479px){
  .test-lab{padding:var(--vq-space-3) var(--vq-space-2)}
  .test-paper{padding:var(--vq-space-3)}
  .test-q{grid-template-columns:22px 1fr 14px;gap:var(--vq-space-1)}
  .test-bar{gap:var(--vq-space-2)}
}
@media (min-width:651px){
  .test-options{grid-template-columns:1fr 1fr;column-gap:var(--vq-space-3)}
}
.test-shots{display:grid;gap:var(--vq-space-2);margin:0;padding:0;list-style:none}
.test-shot{display:grid;grid-template-columns:64px 1fr auto auto;align-items:center;gap:var(--vq-space-2);padding:var(--vq-space-2);border:var(--vq-border);border-radius:var(--vq-radius-sm);color:var(--vq-ink);font:var(--vq-weight-bold) var(--vq-text-md)/1 var(--vq-font)}
.test-shot img{width:64px;height:84px;object-fit:cover;border-radius:2px;background:var(--vq-sheet)}
.test-shot button{min-height:40px;padding:0 var(--vq-space-3);border:var(--vq-border);border-radius:var(--vq-radius-sm);background:none;color:var(--vq-ink);font:var(--vq-weight-bold) var(--vq-text-sm)/1 var(--vq-font)}
.test-camera{display:flex;align-items:center;justify-content:center;min-height:var(--vq-button-height);border:2px dashed var(--vq-ink);border-radius:var(--vq-radius-sm);color:var(--vq-ink);font:var(--vq-weight-bold) 1rem/1 var(--vq-font);cursor:pointer}
#handin-submit:disabled{opacity:.5;cursor:not-allowed}
@media (max-width:479px){.test-shot{grid-template-columns:52px 1fr auto auto}.test-shot img{width:52px;height:68px}.test-shot button{padding:0 var(--vq-space-2)}}
.test-history{display:grid;gap:var(--vq-space-2);margin:0;padding:0;list-style:none}
.test-row{display:flex;justify-content:space-between;align-items:center;gap:var(--vq-space-3);padding:var(--vq-space-3);border:var(--vq-border);border-radius:var(--vq-radius-sm);color:var(--vq-ink)}
.test-row > span:first-child{display:grid;gap:2px;min-width:0}
.test-row strong{font:var(--vq-weight-bold) var(--vq-text-md)/1.3 var(--vq-font)}
.test-row small{color:var(--vq-ink-muted);font:var(--vq-weight-medium) var(--vq-text-sm)/1.35 var(--vq-font)}
.test-row-end{display:grid;justify-items:end;gap:var(--vq-space-2);flex:0 0 auto}
.test-row-end em{font:var(--vq-weight-bold) var(--vq-text-md)/1 var(--vq-font);font-style:normal}
.test-row.is-marking .test-row-end em{color:var(--vq-accent)}
.test-row-end button{min-height:36px;padding:0 var(--vq-space-3);border:var(--vq-border);border-radius:var(--vq-radius-sm);background:var(--vq-ink);color:var(--vq-on-ink);font:var(--vq-weight-bold) var(--vq-text-sm)/1 var(--vq-font)}
.test-row-end button:disabled{opacity:.4}
.test-latest .test-row{border-width:2px}
.test-result-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--vq-space-3)}
.test-sections{grid-template-columns:repeat(auto-fit,minmax(88px,1fr))}
.test-marksheet{display:grid;gap:0;margin:0;padding:0;list-style:none;border:var(--vq-border);border-radius:var(--vq-radius-sm)}
.test-marksheet li{display:grid;grid-template-columns:24px 1fr auto;gap:var(--vq-space-2);padding:var(--vq-space-3);border-bottom:var(--vq-border);color:var(--vq-ink);font:var(--vq-weight-medium) var(--vq-text-sm)/1.4 var(--vq-font)}
.test-marksheet li:last-child{border-bottom:0}
.test-marksheet small{display:block;margin-top:var(--vq-space-1);color:var(--vq-accent);font-weight:var(--vq-weight-bold)}
.test-marksheet strong{font:var(--vq-weight-bold) var(--vq-text-md)/1.2 var(--vq-font)}
.test-marksheet li.is-lost strong{color:var(--vq-accent)}
/* Right and wrong at a glance (owner, 2026-10-08): green tick for full marks, red cross where marks were lost. */
.test-marksheet li{grid-template-columns:44px 1fr auto}
.test-tick{display:inline-grid;place-items:center;width:1.75em;height:1.75em;margin-right:4px;border-radius:50%;font-size:var(--vq-text-xs);font-weight:var(--vq-weight-bold)}
.test-marksheet li.is-right .test-tick{background:var(--vq-success-soft);color:var(--vq-success)}
.test-marksheet li.is-lost .test-tick{background:var(--vq-danger-soft);color:var(--vq-danger)}
.test-marksheet li.is-right strong{color:var(--vq-success)}
.test-marksheet li.is-lost strong,.test-marksheet li.is-lost small{color:var(--vq-danger)}
.test-leaks li strong{color:var(--vq-danger)}
/* Steps: a white filled circle with the number (owner, 2026-10-08) */
#test-steps button{display:inline-flex;align-items:center;gap:6px}
.test-dot{display:inline-grid;place-items:center;width:1.75em;height:1.75em;border-radius:50%;background:var(--vq-ink);color:var(--vq-on-ink);font:var(--vq-weight-bold) var(--vq-text-xs)/1 var(--vq-font)}
#test-steps button[aria-selected="true"] .test-dot{background:var(--vq-on-ink);color:var(--vq-ink)}
/* Steps in two rows: the number circle, then the label under it (owner, 2026-10-08) */
#test-steps button{flex-direction:column;justify-content:center;gap:4px;padding-top:var(--vq-space-2);padding-bottom:var(--vq-space-2);line-height:1.1}
/* Full circles (owner, 2026-10-08): solid green / red with a white mark */
.test-tick{width:1.8em;height:1.8em}
.test-marksheet li.is-right .test-tick{background:var(--vq-success);color:var(--vq-paper)}
.test-marksheet li.is-lost .test-tick{background:var(--vq-danger);color:var(--vq-paper)}
/* True red / green solid circles, the same in light and dark (tokens.css --vq-mark-*) */
.test-marksheet li.is-right .test-tick{background:var(--vq-mark-right);color:var(--vq-mark-on)}
.test-marksheet li.is-lost .test-tick{background:var(--vq-mark-wrong);color:var(--vq-mark-on)}
.test-marksheet li.is-right strong{color:var(--vq-mark-right)}
.test-marksheet li.is-lost strong,.test-marksheet li.is-lost small,.test-leaks li strong{color:var(--vq-mark-wrong)}
/* The test's instructions, like the board paper's General Instructions (owner, 2026-10-08) */
.test-rules-title{margin:var(--vq-space-3) 0 0;color:var(--vq-ink);font:var(--vq-weight-bold) var(--vq-text-md)/1.2 var(--vq-font)}
.test-rules{display:grid;gap:var(--vq-space-1);margin:0;padding-left:var(--vq-space-5, 22px);color:var(--vq-ink);font:var(--vq-weight-medium) var(--vq-text-sm)/1.45 var(--vq-font)}
.test-pledge{display:flex;align-items:center;gap:var(--vq-space-3);min-height:48px;margin-top:var(--vq-space-3);padding:0 var(--vq-space-3);border:var(--vq-border);border-radius:var(--vq-radius-sm);color:var(--vq-ink);font:var(--vq-weight-bold) var(--vq-text-md)/1.3 var(--vq-font)}
.test-pledge input{width:20px;height:20px}
#intro-start:disabled{opacity:.5;cursor:not-allowed}
/* The gap to 100% (owner, 2026-10-08): marks lost by kind, then what she wrote against the full-marks answer */
.test-kinds{display:flex;flex-wrap:wrap;gap:var(--vq-space-2);margin:0;padding:0;list-style:none}
.test-kinds li{display:inline-flex;align-items:center;gap:var(--vq-space-2);min-height:36px;padding:0 var(--vq-space-3);border:var(--vq-border);border-radius:999px;color:var(--vq-ink);font:var(--vq-weight-bold) var(--vq-text-sm)/1 var(--vq-font)}
.test-kinds strong{color:var(--vq-mark-wrong)}
.test-gap-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--vq-space-2)}
.test-gap-kind{color:var(--vq-ink-muted);font:var(--vq-weight-bold) var(--vq-text-sm)/1.2 var(--vq-font)}
.test-gap{display:grid;grid-template-columns:auto 1fr;gap:var(--vq-space-1) var(--vq-space-3);margin:var(--vq-space-2) 0 0}
.test-gap dt{color:var(--vq-ink-muted);font:var(--vq-weight-bold) var(--vq-text-xs)/1.4 var(--vq-font);text-transform:uppercase;letter-spacing:.04em}
.test-gap dd{margin:0;color:var(--vq-ink);font:var(--vq-weight-medium) var(--vq-text-sm)/1.4 var(--vq-font)}
.test-gap dd.is-full{color:var(--vq-mark-right);font-weight:var(--vq-weight-bold)}
.test-gap-note{margin:var(--vq-space-2) 0 0;color:var(--vq-mark-wrong);font:var(--vq-weight-bold) var(--vq-text-sm)/1.35 var(--vq-font)}
/* Bite-size cards before the exam */
.test-intro-card{display:grid;gap:var(--vq-space-3)}
.test-cards-dots{display:flex;gap:6px;margin-top:var(--vq-space-2)}
.test-cards-dots span{width:8px;height:8px;border-radius:50%;background:var(--vq-line, var(--vq-ink-muted));opacity:.4}
.test-cards-dots span.is-on{width:22px;border-radius:4px;background:var(--vq-ink);opacity:1}
.test-intro-card .test-rules{font-size:var(--vq-text-md)}
/* Pager under the cards: full-circle back and next, the dots in the middle (owner, 2026-10-08) */
.test-pager{display:flex;justify-content:space-between;align-items:center;margin-top:var(--vq-space-3)}
.test-pager .test-cards-dots{margin:0}
.test-round{display:grid;place-items:center;width:1.75em;height:1.75em;border:0;border-radius:50%;background:var(--vq-ink);color:var(--vq-on-ink);font:var(--vq-weight-bold) var(--vq-text-xl)/1 var(--vq-font);cursor:pointer}
.test-cards-dots span{background:var(--vq-ink-muted);opacity:.7}
.test-cards-dots span.is-on{background:var(--vq-ink);opacity:1}
/* Test scheduling (owner, 2026-10-09): the time on Create, "Scheduled for" on the card, Reschedule and Cancel */
.test-when{width:100%;min-height:44px;padding:0 var(--vq-space-3);border:var(--vq-border);border-radius:var(--vq-radius-sm);background:var(--vq-surface);color:var(--vq-ink);font:var(--vq-weight-medium) var(--vq-text-md)/1.3 var(--vq-font)}
.test-row small.test-scheduled{color:var(--vq-ink);font-weight:var(--vq-weight-bold)}
.test-row-end .test-quiet{background:none;color:var(--vq-ink)}
.test-reschedule{display:grid;gap:var(--vq-space-2);width:100%}
.test-reschedule-actions{display:flex;gap:var(--vq-space-2);justify-content:flex-end}
.test-row.is-editing{flex-wrap:wrap}
/* At a large phone font size the card's buttons go under the text, and the time picker never widens the screen */
.test-row{flex-wrap:wrap}
.test-row > span:first-child{flex:1 1 10em}
.test-when{box-sizing:border-box;min-width:0;max-width:100%}
/* Submit (owner, 2026-10-10): the step bar, the one ask (its text blinks), the page chips, the answer sheet as read on
   the app's paper, Check with one tick, and Handed in. */
.handin-action{display:grid;gap:var(--vq-space-2)}
.handin-action[hidden]{display:none}
.handin-action .test-camera{width:100%;gap:var(--vq-space-2);padding:var(--vq-space-2) var(--vq-space-3);background:none;font-family:var(--vq-font);line-height:1.3;text-align:center}
.handin-action .test-camera svg{width:20px;height:20px}
.handin-action .test-camera.is-retake{border-color:var(--vq-warning);color:var(--vq-warning)}
.handin-action .test-camera.is-reading{border-style:solid;border-color:var(--vq-line);color:var(--vq-ink-muted);cursor:progress}
.handin-blink{display:inline-flex;align-items:center;gap:var(--vq-space-2);animation:handin-blink 1.2s ease-in-out infinite alternate}
@keyframes handin-blink{from{opacity:1}to{opacity:.35}}
@media (prefers-reduced-motion:reduce){.handin-blink{animation:none}}
.handin-link{justify-self:center;min-height:var(--vq-tap);padding:0 var(--vq-space-2);border:0;background:none;color:var(--vq-ink-muted);font:var(--vq-weight-medium) var(--vq-text-sm)/1 var(--vq-font);text-decoration:underline;cursor:pointer}
.handin-status{min-height:1.3em;margin:0;color:var(--vq-ink-muted);font:var(--vq-weight-medium) var(--vq-text-sm)/1.4 var(--vq-font)}
.handin-status:empty{display:none}
.handin-status.is-warn{color:var(--vq-warning)}
.handin-pages{display:flex;flex-wrap:wrap;gap:var(--vq-space-2);margin:0;padding:0;list-style:none}
.handin-pages:empty{display:none}
.handin-pages li{padding:var(--vq-space-1) var(--vq-space-2);border:var(--vq-border);border-radius:var(--vq-radius-pill);color:var(--vq-ink-muted);font:var(--vq-weight-bold) var(--vq-text-xs)/1.2 var(--vq-font)}
.handin-pages li.is-read{border-color:var(--vq-success);color:var(--vq-success)}
.handin-pages li.is-reading{border-color:var(--vq-accent);color:var(--vq-accent)}
.handin-pages li.is-failed{border-color:var(--vq-warning);color:var(--vq-warning)}
.handin-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--vq-space-2)}
.handin-paper{padding:0 var(--vq-space-3)}
.handin-sheet{display:grid;margin:0;padding:0;list-style:none}
.handin-sheet li{display:grid;grid-template-columns:40px minmax(0,1fr) 24px;gap:var(--vq-space-2);padding:var(--vq-space-3) 0;border-bottom:1px solid var(--vq-sheet-rule)}
.handin-sheet li:last-child{border-bottom:0}
.handin-q{color:var(--vq-sheet-ink);font:var(--vq-weight-bold) var(--vq-text-sm)/1.4 var(--vq-font)}
.handin-q small{display:block;color:var(--vq-sheet-ink);opacity:.6;font-size:var(--vq-text-xs)}
.handin-sheet p{margin:0;overflow-wrap:anywhere;font:var(--vq-weight-medium) var(--vq-text-sm)/1.45 var(--vq-font)}
.handin-pen{color:var(--vq-sheet-pen)}
.handin-empty{color:var(--vq-sheet-ink);opacity:.45}
.handin-unclear{color:var(--vq-danger);font-weight:var(--vq-weight-bold)}
.handin-mark{color:var(--vq-success);font:var(--vq-weight-bold) var(--vq-text-md)/1.4 var(--vq-font);text-align:right}
.handin-sheet li.is-unclear .handin-mark{color:var(--vq-danger)}
.handin-confirm{display:grid;gap:var(--vq-space-3)}
.handin-confirm[hidden]{display:none}
.handin-check{display:flex;align-items:center;gap:var(--vq-space-2);min-height:var(--vq-tap);color:var(--vq-ink);font:var(--vq-weight-bold) var(--vq-text-md)/1.3 var(--vq-font)}
.handin-check input{width:24px;height:24px;accent-color:var(--vq-success)}
.handin-confirm .primary-action:disabled{opacity:.4;cursor:not-allowed}
.handin-done{display:grid;justify-items:center;gap:var(--vq-space-2);padding:var(--vq-space-5) 0 var(--vq-space-3);text-align:center}
.handin-done .tab-title{margin:0}
.handin-done-tick{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--vq-success);color:var(--vq-on-ink);font:var(--vq-weight-bold) var(--vq-text-2xl)/1 var(--vq-font)}
.handin-blink{flex-wrap:wrap;justify-content:center}
/* Ready-made tests (owner, 2026-10-11): the subject tabs and kind chips are global.css .vq-tabs / .vq-filter; the
   cards, the own-test link */
.ready{display:grid;gap:var(--vq-space-3)}
.ready[hidden]{display:none}
.ready-list-title{margin-top:var(--vq-space-2)}
/* Up next's Schedule is the screen's one main button, at the card's right */
.test-row-end button.primary-action{width:auto;min-height:var(--vq-button-height);padding:var(--vq-space-3) var(--vq-space-4);background:var(--vq-ink);color:var(--vq-on-ink);font:var(--vq-weight-bold) var(--vq-text-md)/1.2 var(--vq-font)}
.test-row-end em.vq-chip{font:var(--vq-weight-bold) var(--vq-text-sm)/1 var(--vq-font);font-style:normal}
.ready-own{justify-self:center;min-height:var(--vq-tap);padding:var(--vq-space-2);border:0;background:none;color:var(--vq-ink-muted);font:var(--vq-weight-medium) var(--vq-text-sm)/1.3 var(--vq-font);text-decoration:underline;cursor:pointer}
/* Fair exam (owner, 2026-10-11): How the exam went, on the result for the child and the parent */
.test-fair{grid-template-columns:auto 1fr;gap:var(--vq-space-2) var(--vq-space-4);margin:0}
.test-fair dt{color:var(--vq-ink-muted);font:var(--vq-weight-bold) var(--vq-text-sm)/1.4 var(--vq-font)}
.test-fair dd{margin:0;color:var(--vq-ink);font:var(--vq-weight-bold) var(--vq-text-sm)/1.4 var(--vq-font);white-space:pre-line}
.test-fair dd.is-flag{color:var(--vq-warning)}
/* Watching (owner, 2026-10-11; live.js): on her own phone, who of her family is watching Charita or Tests now, a quiet
   line on the paper during a test, "Seen by" under a result, and who watched the whole test after hand-in */
/* Sticky: Charita opens at today, scrolled past its title, and the row must still be seen (over Charita's runner
   track, z-index 4, in its empty top padding) */
.watching{position:sticky;top:var(--vq-space-2);z-index:6;display:flex;align-items:center;gap:var(--vq-space-2);width:fit-content;max-width:100%;margin:0 0 var(--vq-space-3);padding:var(--vq-space-1) var(--vq-space-3) var(--vq-space-1) var(--vq-space-1);border:var(--vq-border-width) solid var(--vq-line);border-radius:var(--vq-radius-pill);background:var(--vq-surface);box-shadow:var(--vq-shadow-float);color:var(--vq-ink);font:var(--vq-weight-medium) var(--vq-text-sm)/1.3 var(--vq-font)}
.watching[hidden],.test-cheering[hidden],.test-watched[hidden]{display:none}
.watching-faces{display:flex;flex:none}
.watching-faces i{display:grid;place-items:center;width:28px;height:28px;margin-left:calc(var(--vq-space-2) * -1);border:var(--vq-border-width) solid var(--vq-surface);border-radius:var(--vq-radius-pill);background:var(--vq-accent);color:var(--vq-surface);font:var(--vq-weight-bold) var(--vq-text-xs)/1 var(--vq-font);font-style:normal}
.watching-faces i:first-child{margin-left:0}
.test-cheering{margin:0 0 var(--vq-space-2);color:var(--vq-ink-muted);font:var(--vq-weight-medium) var(--vq-text-xs)/1.3 var(--vq-font)}
.test-row small.test-seen{color:var(--vq-ink-muted)}
.test-watched{margin:0;color:var(--vq-success);font:var(--vq-weight-bold) var(--vq-text-sm)/1.4 var(--vq-font)}
