.correction-form { display: grid; gap: 1rem; margin-top: 1.5rem; }
.correction-form label { display: grid; gap: .4rem; font-weight: 650; }
.correction-form label .quiet { font-weight: 400; }
.correction-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.correction-form input, .correction-form select { width: 100%; }
.correction-form textarea { font: inherit; width: 100%; min-height: 9rem; resize: vertical; border: 1px solid var(--input-line); border-radius: 7px; background: var(--panel); color: var(--fg); padding: .6rem .7rem; }
.correction-form textarea:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.correction-form .note { margin: -.4rem 0 .3rem; }
.correction-form button { justify-self: start; }
.report-field { display: grid; gap: .4rem; min-width: 0; }
/* A message makes its cell taller; keep the cell beside it from stretching. */
.correction-grid.has-field-error .report-field { align-content: start; }
.report-field-error { color: var(--bad); font-weight: 600; margin: 0; }
.correction-form > .report-field-error { margin: -.4rem 0 0; }
.correction-form [aria-invalid="true"] { border: 2px solid var(--bad); }
.correction-page .badbox:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
@media (max-width: 600px) { .correction-grid { grid-template-columns: 1fr; } }