.pr-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:18px; }
.pr-head h2 { font-size:20px; color:#1a202c; }
.pr-head h3 { font-size:17px; }
.pr-description { white-space:pre-wrap; overflow-wrap:anywhere; color:#4a5568; margin:8px 0 16px; }
.pr-banks { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:14px; }
.pr-bank { border:1px solid #dce3e7; border-radius:6px; padding:18px; background:#fff; min-width:0; }
.pr-bank h3 { font-size:17px; overflow-wrap:anywhere; }
.pr-meter { height:6px; background:#e5eaed; margin:12px 0; overflow:hidden; border-radius:3px; }
.pr-meter span { display:block; height:100%; background:#219ac1; }
.pr-work { background:#fff; min-height:60vh; padding:24px; border-top:3px solid #269fc6; }
.pr-work .q-stem { font-size:17px; white-space:pre-wrap; overflow-wrap:anywhere; margin:22px 0; }
.pr-work .q-options label { min-height:48px; align-items:flex-start; }
.pr-work .q-options label span { min-width:0; overflow-wrap:anywhere; }
.pr-work .q-options input { width:18px; height:18px; min-width:18px; margin-top:3px; }
.pr-work .q-options label.pr-right { border-color:#338558; background:#f0faf3; }
.pr-work .q-options label.pr-wrong { border-color:#c44f3b; background:#fff3f0; }
.pr-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.pr-icon { width:40px; height:40px; padding:0; display:inline-flex; align-items:center; justify-content:center; border:1px solid #d5e0e6; border-radius:4px; background:#fff; color:#376176; cursor:pointer; }
.pr-icon svg { width:20px; height:20px; }
.pr-icon[aria-pressed="true"] { color:#bc7600; background:#fff8e8; border-color:#e1bd76; }
.pr-icon[aria-pressed="true"] svg { fill:currentColor; }
.pr-status { font-size:12px; color:#526570; }
.pr-status.error { color:#a73624; }
.pr-feedback { margin:22px 0; padding:0 0 0 14px; border-left:3px solid #2999be; white-space:pre-wrap; overflow-wrap:anywhere; }
.pr-feedback p { margin:10px 0; }
.pr-correct { color:#227245; }
.pr-incorrect { color:#ac3d2c; }
.pr-footer { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding:18px 0 0; margin-top:24px; border-top:1px solid #e1e6e9; }
.pr-tabs { display:flex; gap:4px; flex-wrap:wrap; padding:4px; background:#eaf0f3; margin:12px 0; }
.pr-tabs button { flex:1; padding:9px 12px; border:0; background:transparent; color:#46535e; font:inherit; cursor:pointer; }
.pr-tabs button[aria-selected="true"] { background:#1682ab; color:#fff; }
.pr-legend { display:flex; gap:14px; flex-wrap:wrap; font-size:13px; margin:12px 0; }
.pr-legend i { display:inline-block; height:12px; width:12px; margin-right:5px; }
.pr-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(42px,1fr)); gap:5px; }
.pr-grid button { aspect-ratio:1; border:0; border-radius:2px; min-width:0; padding:0; font:inherit; cursor:pointer; }
.pr-grid button[aria-current="true"] { outline:3px solid #184b68; outline-offset:-3px; }
.modal:has(.pr-grid) { display:flex; flex-direction:column; overflow:hidden; }
.modal:has(.pr-grid) .modal-body { overflow-y:auto; min-height:0; }
.modal:has(.pr-grid) .modal-header,.modal:has(.pr-grid) .modal-footer { flex-shrink:0; }
.pr-unanswered { background:#e2e7eb; color:#314454; }
.pr-done { background:#397e58; color:#fff; }
.pr-error { background:#b94e39; color:#fff; }
.pr-review { background:#996714; color:#fff; }
.pr-empty { text-align:center; color:#687782; padding:40px 14px; }
.pr-question-row { display:flex; justify-content:space-between; gap:14px; border-bottom:1px solid #e0e6e9; padding:16px 0; }
.pr-question-row > div:first-child { flex:1; min-width:0; overflow-wrap:anywhere; }
.pr-question-row p { margin:5px 0; }
.pr-form { display:grid; gap:12px; }
.pr-form label { display:block; font-size:13px; }
.pr-form label input,.pr-form label textarea,.pr-form label select { margin-top:4px; }
.choice-item > span { min-width:0; overflow-wrap:anywhere; }
@media (min-width:769px) and (max-width:1300px) { .topbar { height:auto; min-height:60px; flex-wrap:wrap; padding:10px 20px; gap:8px; } .topbar .nav { order:3; width:100%; } }
@media (max-width:768px) {
  .pr-work { padding:16px 12px; }
  .pr-head h2 { font-size:18px; }
  .pr-work .q-stem { font-size:16px; }
  .pr-head { align-items:flex-start; }
  .pr-banks { grid-template-columns:minmax(0,1fr); }
  .pr-question-row { flex-direction:column; }
  .pr-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
  .pr-grid button { min-height:40px; }
}
