/* WB28 spacing scale. Loaded after theme-c.css. Only gaps, margins, paddings and tap sizes.
   Scale: 4 / 8 / 12 / 16 / 24 / 32. Buttons in a row 12 apart (chips and tags 8), cards 16 apart,
   a heading 8–12 above its content and 24–32 above a new section, 16px page gutter on phones,
   44px minimum tap height on touch screens. ---------- */
:root{--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--gutter:16px}

/* Rows of controls */
.actions,.row,.task-actions,.outcome-switch,.review-outcomes,.release-filters,.library-filters,.timer-presets,.calendar-quick,.global-timer-custom,.student-row,.test-student-row,.confirm-dialog .actions,.review-ai .actions{gap:var(--space-3)}
.tag-row,.class-metrics,.ai-criteria,.finding-chips,.test-dots+.tag-row{gap:var(--space-2)}
.review-switch,.task-tools{gap:var(--space-2)}
.nav{gap:var(--space-2)}

/* Stacks of cards */
.list,.grid,.work-steps,.test-questions,.class-grid,.wizard{gap:var(--space-4)}
.review-list,.choice-options,.metric-row,.task-classes-body,.type-options,.type-step .type-options{gap:var(--space-3)}
.surface+.surface,.surface+.split,.split+.surface,.stack>*+*,.divider{margin-top:var(--space-4)}
.divider{padding-top:var(--space-4)}
.class-block{margin-bottom:var(--space-3)}
.question+.question,.issue+.issue,.choice+.choice{margin-top:var(--space-2)}

/* Headings and page head */
.page-head{margin-bottom:var(--space-5)}
.page-title{margin-bottom:var(--space-2)}
:where(.surface,.pad,.audio-card,.question-gate,.feedback-dialog)>h2:first-child{margin-bottom:var(--space-3)}
.panel-title{margin-bottom:var(--space-3)}
.status{margin-bottom:var(--space-4)}

/* Fields: label 8 above its control, a button row 16 below the last field */
.field{gap:var(--space-2)}
.form-row{gap:var(--space-4)}
:where(.surface,.pad,.audio-card,form,.work-final)>.actions:not(:first-child),.field+.actions,.field+.btn,.review-outcomes+.field,.grade-suggestion+.field{margin-top:var(--space-4)}
.actions+p,.actions+.field-help,.field-help+p.muted{margin-top:var(--space-2)}
.test-voice>.actions{margin-top:0}
.check+.list,.check+.field,.check+.form-row,.check+.table-wrap{margin-top:var(--space-3)}
.comment-toggle textarea{display:block;margin-top:var(--space-2)}
.review-outcomes{margin-bottom:var(--space-4)}
.test-override{margin-top:var(--space-4)}

/* Teacher: task list and assignment card */
.task-card{gap:var(--space-4)}
.task-head{gap:var(--space-4)}
.task-title h2{margin-bottom:var(--space-2)}
.task-dates{gap:var(--space-1)}
.task-classes-body{padding:var(--space-3) var(--space-4) var(--space-4)}
.grade-row{gap:var(--space-3);padding:var(--space-3) var(--space-4)}
.class-assignments,.work-review-section{margin-top:var(--space-5)}
.metric-row{margin-bottom:var(--space-4)}
.library-trash summary{min-height:44px;display:flex;align-items:center}

/* Teacher: work review */
.work-toolbar{align-items:start;gap:var(--space-4);margin-bottom:var(--space-4)}
.review-state{margin-top:var(--space-2)}
.work-step-head{margin-bottom:var(--space-3)}
.work-question{margin-bottom:var(--space-3)}
.review-transcript{padding:var(--space-3) var(--space-4);margin-bottom:var(--space-3)}
.work-step audio,.review-card audio{margin:var(--space-3) 0}
.review-ai{margin:var(--space-4) 0;padding:var(--space-4) 0}
.review-ai:empty{display:none}
.work-step-grade,.work-final{gap:var(--space-3)}
.work-final{margin-top:var(--space-4)}
.work-final>*,.work-step-grade>*{margin:0}
.work-final>.actions{margin-top:var(--space-1)}
.ai-line{margin-bottom:var(--space-2)}
.ai-criteria,.finding-chips{margin-bottom:var(--space-3)}
.finding-chip{gap:var(--space-2)}
.ai-proposal{margin-bottom:var(--space-4)}

/* Test (teacher review and pupil) */
.test-instruction{margin:var(--space-3) 0 var(--space-4)}
.test-progress,.test-score,.test-send-summary{margin-bottom:var(--space-4)}
.test-question-head{margin-bottom:var(--space-2)}
.test-question-text{margin-bottom:var(--space-2)}
.test-mode{margin-bottom:var(--space-3)}
.test-voice{gap:var(--space-3);margin-top:var(--space-3)}
.test-comment{margin-top:var(--space-3)}

/* Wizard */
.wizard-top{margin-bottom:var(--space-5)}
.wizard-steps{gap:var(--space-2)}
.global-timer{gap:var(--space-3);padding:var(--space-4);margin-bottom:var(--space-4)}
.wizard.is-content>.step:not([hidden])+.step:not([hidden]){margin-top:var(--space-4)}

/* Student cabinet: one 16px rhythm between the blocks of a task screen */
.student-nav{margin:var(--space-4) 0;gap:var(--space-2)}
.student-card>.page-title{margin:var(--space-5) 0 var(--space-2)}
.student-card>:is(.reading-text,.status,.audio-card,.question-gate,.review-list,.test-progress,.test-questions){margin-top:var(--space-4);margin-bottom:var(--space-4)}
.student-card>.actions,.student-card>.btn{margin-top:var(--space-4)}
.student-card>.btn+.actions{margin-top:var(--space-3)}
.student-card .actions{gap:var(--space-3)}
.student-card .audio-card{padding:var(--space-4)}
.audio-card>h2{margin-bottom:var(--space-3)}
.audio-card audio{margin:var(--space-3) 0}
.audio-card>.actions{margin-top:var(--space-4)}
.recording-attempts{margin-top:var(--space-3)}
.question-gate>p{margin-bottom:var(--space-4)}
.student-card>h2,.student-card .student-hero~h2{margin:var(--space-6) 0 var(--space-3)}
.student-card .release-filters{margin:0 0 var(--space-4)}
.student-assignment{gap:var(--space-4)}
.student-assignment h2{margin-bottom:var(--space-1)}
.student-assignment p.muted{margin-bottom:var(--space-2)}
.review-row{gap:var(--space-2) var(--space-4)}
.sent-actions{margin:var(--space-4) 0}

/* Phones: 16px gutters, roomier cards, 44px tap targets */
@media(max-width:760px){
  .content{padding:var(--space-5) var(--gutter) 48px}
  .sidebar{padding:var(--space-3) var(--gutter) var(--space-4)}
  .sidebar .nav{gap:var(--space-2)}
  .page-head{margin-bottom:var(--space-4)}
  .student-wrap{padding:0 var(--gutter) max(var(--space-5),env(safe-area-inset-bottom))}
  .wizard-steps{gap:var(--space-2)}
  .release-filters{gap:var(--space-2)}
  .release-filters .btn{flex:1 1 auto}
  .chip-btn{width:44px;height:44px}
  .chip-text,.criterion-chip{min-height:44px}
  .criterion-chip{padding:var(--space-2) var(--space-3)}
  .finding-chip{flex-wrap:wrap;gap:0 var(--space-2);border-radius:16px;padding:var(--space-1) var(--space-2) var(--space-1) var(--space-3)}
  .chip-text{flex:1 1 auto}
}
@media(max-width:600px){
  .student-card .list-item,.student-card .audio-card,.pad,.wizard .step{padding:var(--space-4)}
  .student-card .status{padding:var(--space-3) var(--space-4)}
  .reading-text{padding:var(--space-4)}
  .metric-row{gap:var(--space-2)}
}
@media(max-width:480px){
  .student-nav{margin:var(--space-4) 0}
  .student-card .release-filters{margin:0 0 var(--space-4);gap:var(--space-2)}
  .locked-level{margin:var(--space-3) 0}
}
@media(max-width:340px){
  :root{--gutter:12px}
  .content .pad,.wizard .step,.content .list-item{padding:var(--space-3)}
  .student-card .list-item,.student-card .audio-card{padding:var(--space-3)}
  .student-assignment{gap:var(--space-3)}
}