/* "Check what we read" (static/read_review.js). Self-contained: mounts in any container
   (a modal today, a docked / accordion pane later). Side by side when the CONTAINER is at
   least 720px wide, stacked (document above the fields) below that. v2-flat: status words are
   a dot + coloured text, never pills; no accent edges; text wraps, never truncates. */
.rr{container-type:inline-size;display:flex;flex-direction:column;min-height:0;height:100%;color:var(--ink);font-size:14px}
.rr [hidden]{display:none !important}
.rr .v2st{white-space:normal;align-items:flex-start}
.rr .v2st-dot{margin-top:6px}
.rr-head{display:flex;flex-direction:column;gap:4px;padding:14px 18px 12px;border-bottom:1px solid var(--line)}
.rr-head h2{margin:0;font-size:16px;font-weight:600;overflow-wrap:anywhere}
.rr-head .sub{font-size:12px;color:var(--muted);overflow-wrap:anywhere}
.rr-body{flex:1 1 auto;min-height:0;display:block;overflow:auto;-webkit-overflow-scrolling:touch}
.rr-doc{display:flex;flex-direction:column;min-width:0;background:var(--chip,#F1F4F8);border-bottom:1px solid var(--line)}
.rr-tools{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 12px;border-bottom:1px solid var(--line);background:var(--surface,#fff)}
.rr-tools .grow{flex:1 1 auto;min-width:0;font-size:12px;color:var(--muted);overflow-wrap:anywhere}
.rr-tools .btn{min-height:36px;min-width:36px}
.rr-tools .z{font-family:var(--mono);font-size:12px;color:var(--muted);min-width:44px;text-align:center}
.rr-stage{flex:1 1 auto;min-height:260px;max-height:46vh;overflow:auto;padding:12px;display:flex;flex-direction:column;align-items:center;gap:12px}
.rr-stage img{display:block;width:calc(var(--rr-z,100) * 1%);max-width:none;height:auto;background:#fff;box-shadow:0 1px 6px rgba(15,23,42,.14);border-radius:4px}
.rr-stage .pg{font-size:12px;color:var(--muted);align-self:flex-start}
.rr-msg{margin:auto;padding:24px;max-width:380px;text-align:center;display:flex;flex-direction:column;gap:10px;align-items:center;color:var(--muted)}
.rr-msg b{color:var(--ink)}
.rr-fields{display:flex;flex-direction:column;gap:14px;padding:16px 18px 18px;min-width:0}
.rr-sum{font-size:13px;font-weight:600}
.rr-f{display:flex;flex-direction:column;gap:5px;min-width:0}
.rr-f label,.rr-f .lab{font-size:13px;font-weight:600;color:var(--ink)}
.rr-f input,.rr-f select{min-height:44px;width:100%;max-width:420px;box-sizing:border-box;border:1px solid var(--field,#C9D0DA);border-radius:10px;padding:0 12px;font:inherit;background:var(--surface,#fff);color:var(--ink)}
.rr-f select{max-width:none;height:auto;padding:10px 12px;white-space:normal}
.rr-f input[type=date],.rr-f input.mono{font-family:var(--mono);font-size:13px}
.rr-f input:disabled,.rr-f select:disabled{background:var(--chip,#F1F4F8);color:var(--text)}
.rr-f .hint,.rr-f .flag,.rr-f .note{font-size:12px;overflow-wrap:anywhere}
.rr-f .note{color:var(--muted)}
.rr-f .flag .v2st{font-size:13px}
.rr-f.is-flag input,.rr-f.is-flag select{border-color:var(--warn-dot,#D97706)}
.rr-f .read{font-size:12px;color:var(--muted)}
.rr-x{margin:0;display:grid;grid-template-columns:minmax(110px,auto) 1fr;gap:6px 14px;font-size:13px}
.rr-x dt{color:var(--muted)}
.rr-x dd{margin:0;overflow-wrap:anywhere}
.rr-h3{margin:0;font-size:13px;font-weight:600;color:var(--muted)}
.rr-notes{font-size:13px;color:var(--text);margin:0;overflow-wrap:anywhere}
.rr-foot{display:flex;flex-direction:column;gap:8px;padding:12px 18px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--surface,#fff)}
.rr-foot .btns{display:flex;flex-wrap:wrap;gap:8px}
.rr-foot .btn{min-height:44px;flex:0 1 auto}
.rr-foot .btn-primary{flex:1 1 180px}
.rr-foot .say{font-size:12px;color:var(--muted);overflow-wrap:anywhere}
.rr-foot .err{font-size:13px;color:var(--crit-fg,#B42318);font-weight:600}
.rr-wait{margin:auto;padding:40px 24px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.rr-wait b{font-size:15px}
.rr-wait span{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.rr-spin{width:28px;height:28px;border-radius:999px;border:3px solid var(--line,#E3E8EF);border-top-color:var(--brand,#2563EB);animation:rr-spin .9s linear infinite}
@keyframes rr-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.rr-spin{animation:none}}
@container (min-width: 720px){
  .rr-body{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}
  .rr-doc{min-height:0}
  .rr-doc{border-bottom:0;border-right:1px solid var(--line)}
  .rr-stage{max-height:none}
  .rr-fields{overflow:auto}
}
/* the modal host (V2Review.open) */
.rr-dlg{border:0;padding:0;margin:auto;width:min(1180px,calc(100vw - 32px));height:min(880px,calc(100vh - 32px));max-width:none;max-height:none;border-radius:16px;background:var(--card,#fff);box-shadow:0 24px 64px rgba(15,23,42,.35);overflow:hidden}
.rr-dlg[open]{display:flex;flex-direction:column}
.rr-dlg::backdrop{background:rgba(15,23,42,.6)}
.rr-dlg .rr-x-btn{position:absolute;top:10px;right:10px;min-width:40px;min-height:40px;z-index:2}
.rr-dlg .rr-head{padding-right:60px}
.rr-dlg > .rr-host{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
@media (max-width:600px){
  .rr-dlg{width:100vw;height:100dvh;max-height:100dvh;border-radius:0;margin:0}
}
.rr-type{border:0;margin:0;padding:0;min-width:0}
.rr-type legend{padding:0;margin-bottom:5px}
.rr-opt{display:flex;align-items:flex-start;gap:10px;min-height:40px;padding:8px 0;font-size:14px;font-weight:500;cursor:pointer}
.rr-opt input{flex:none;width:18px;height:18px;min-height:0;max-width:none;margin:1px 0 0;padding:0;border:0;accent-color:var(--brand)}
.rr-opt span{overflow-wrap:anywhere}
/* the unit version: a PDF is framed (no page images for unit documents) */
.rr-frame{display:block;width:100%;flex:1 1 auto;min-height:420px;border:0;background:#fff;border-radius:4px}
/* inline in a page column (the unit page's opened Documents row): no header, no document
   pane (the row shows the file), the footer sits in the flow */
.rr-inline{height:auto}
.rr-inline .rr-body{display:block;overflow:visible}
.rr-inline .rr-fields{padding:0;overflow:visible}
.rr-inline .rr-foot{padding:14px 0 0;border-top:0;background:transparent}
.rr-inline .rr-f input,.rr-inline .rr-f select{max-width:none}
@container (min-width: 520px){
  .rr-inline .rr-body{display:block}
  .rr-inline .rr-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;align-items:start}
  .rr-inline .rr-fields > :not(.rr-f),.rr-inline .rr-type{grid-column:1 / -1}
}