/* Inventory sheets (step 7): the desk page #/desk/inventory (and its phone layout below 1024px) and the printed sheet.
   The markup is js/desk/inventory.js (the page) and js/desk/inventory-print.js (the sheet). It borrows Receive's
   pieces from css/receive.css: the steps (.rsteps), the big photo button (label.go.rbig, .rfile), the page thumbnails
   (.rpages), the reading dots (.rdots), the button column (.rbtns) and the qty stepper (.qstep). Loaded before look.css. */

/* ---------------------------------------------------------------- the frame */
.dinv { height: 100%; display: flex; flex-direction: column; padding: 0 !important; }
.inv-scroll { position: relative; flex: 1; min-height: 0; overflow: auto; }
.invhead { max-width: 1180px; margin: 0 auto; padding: 20px 28px 0; }
.inv.desk { max-width: 1180px; margin: 0 auto; padding: 0 28px 56px; }
.inv.phone { padding: 0 16px 28px; }
.inv .note { margin-top: 12px; }
.inv .perr { margin-top: 0; }
.inote > span { flex: 1 1 auto; min-width: 0; }
.inote .linkbtn { margin-left: auto; height: 48px; flex: none; }
.ioff b { margin-right: 4px; }
.isteps { margin-top: 14px; }
.isec { margin-top: 20px; min-width: 0; }
.ih { margin: 0; font-size: 24px; font-weight: 800; line-height: 1.15; display: flex; align-items: center; gap: 10px; }
.ih svg { flex: none; }
.inum { width: 28px; height: 28px; flex: none; display: inline-flex; align-items: center; justify-content: center; background: var(--ink); color: #FFFFFF; font-size: 16px; font-weight: 800; border-radius: var(--rc); }
.isub { margin: 6px 0 0; font-size: 15px; line-height: 1.4; color: var(--ink-2); }
.imuted { margin: 0; font-size: 14px; line-height: 1.4; color: var(--ink-3); }

/* ---------------------------------------------------------------- 1. print a sheet, 2. read one */
.istart { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
.inv.desk .istart .isec { margin-top: 24px; padding: 20px 22px 22px; border: 1px solid var(--line); border-radius: var(--r); background: var(--paper); }
.inv.phone .istart .isec { margin-top: 18px; padding-top: 16px; border-top: 2px solid var(--ink); }
.inv.phone .istart .isec:first-child { border-top: 0; padding-top: 0; }
@media (min-width: 1200px) {
  .inv.desk .istart { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 0 24px; align-items: start; }
}
.iseg { display: flex; margin-top: 14px; }
.seg.iseg > button { flex: 1 1 0; min-height: 48px; font-size: 15px; }
.iseg > button:disabled { color: var(--disabled); }
.ipick { margin-top: 12px; }
.ipick .pin, .iwhich .pin { height: 48px; }
[data-pinfo] { margin-top: 10px; }
.iprintbtn { margin-top: 14px; min-height: 52px; gap: 10px; font-size: 15px; padding: 0 22px; }
.inv.phone .iprintbtn { width: 100%; }
.idrop { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.inv.desk .idrop { padding: 16px; border: 2px dashed var(--line); }
.inv.desk .idrop.over { border-color: var(--green); background: #E3F3EC; }
.iwhich { margin-top: 14px; }
.iread .rread { margin-top: 14px; width: 100%; }
.iread .perr { margin-top: 12px; }
.ierr { flex-wrap: wrap; }
.ierr > span { flex: 1 1 0; min-width: 0; }
.ierr > .linkbtn { flex-basis: 100%; height: 44px; padding: 0 0 0 21px; text-align: left; font-size: 14px; color: var(--ink); }
.inv.phone .ierr > .linkbtn { height: 48px; }
.itype { margin: 6px 0 0; }
.ireading .rbtns { max-width: 520px; }
.ireading .go { height: auto; min-height: 60px; padding-top: 8px; padding-bottom: 8px; }
.ireading .go .t { white-space: normal; text-align: left; line-height: 1.1; }
@media (max-width: 419.98px) { .ireading .go .t { font-size: 22px; } }

/* ---------------------------------------------------------------- 3. check */
.ihead { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr); gap: 10px; margin-top: 14px; max-width: 860px; }
.ihead .pf { gap: 4px; }
.ihead .pin { height: 48px; }
.ihint { margin: 12px 0 0; font-size: 14px; line-height: 1.4; color: var(--ink-2); }
.ihl { background: var(--warn-bg); box-shadow: inset 0 -2px 0 var(--warn-dot); padding: 0 3px; color: var(--ink); }
.iwarnnote { background: var(--warn-bg); color: var(--ink); }
.irows .sechead { margin-top: 22px; }
.itot { margin: 4px 0 8px; font-size: 15px; font-weight: 700; line-height: 1.4; color: var(--ink-2); }
.ifix { color: var(--red); white-space: nowrap; }
.iadd { margin-top: 10px; }
.inv.desk .iadd { padding-left: 0; }
.inext { margin-top: 22px; display: flex; flex-direction: column; gap: 10px; }
.inv.desk .inext { max-width: 560px; }
.inext > .linkbtn { align-self: center; }
.inv.desk .inext > .linkbtn { align-self: flex-start; }
.inext .rwhy { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0 10px; font-size: 15px; font-weight: 700; color: var(--red); }
.inext .rwhy .linkbtn { color: var(--ink); }
.inext .go .s { overflow: hidden; text-overflow: ellipsis; }

/* what Claude was not sure of (yellow), what blocks saving (red) */
.inv .pin.unc, .msheet-inv .pin.unc { background: var(--warn-bg); border-color: var(--warn-dot); box-shadow: inset 4px 0 0 var(--warn-dot); }
.inv .pin.bad, .msheet-inv .pin.bad { background: var(--paper); border-color: var(--red); box-shadow: inset 0 0 0 1px var(--red); }
.inv .pin.unc.bad, .msheet-inv .pin.unc.bad { background: var(--warn-bg); box-shadow: inset 0 0 0 1px var(--red), inset 5px 0 0 var(--warn-dot); }
.irn { width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; background: var(--band); font-size: 13px; font-weight: 800; border-radius: var(--rc); flex: none; }
.k-new .irn { background: #E3F3EC; color: var(--green-d); }
.x-unc .irn { background: var(--warn-bg); color: var(--warn); }
.x-bad .irn { background: var(--st-out-bg); color: var(--st-out); }
.iskip { font-weight: 800; color: var(--ink); margin-right: 4px; }
.k-skip s { color: var(--ink-3); }

/* the desk: one table, two lines a row (what is on the paper, then what saving does) */
.itwrap { position: relative; }
.itable { table-layout: fixed; width: 100%; }
.itable col.c-n { width: 36px; }
.itable col.c-bin { width: 96px; }
.itable col.c-pn { width: 162px; }
.itable col.c-br { width: 140px; }
.itable col.c-qty { width: 66px; }
@media (min-width: 1280px) {
  .itable col.c-n { width: 40px; }
  .itable col.c-bin { width: 112px; }
  .itable col.c-pn { width: 200px; }
  .itable col.c-br { width: 170px; }
  .itable col.c-qty { width: 76px; }
}
.itable th { position: sticky; top: 0; z-index: 2; padding: 0 5px; }
.itable th.num { text-align: right; }
.itable td { padding: 3px 5px; border-bottom: 0; vertical-align: top; }
.itable .ir1 td { padding-top: 10px; }
.itable .ir2 td { padding: 4px 5px 12px; border-bottom: 1px solid var(--line2); }
.itable .c-n { padding-left: 2px; padding-right: 0; }
.itable .c-n .irn { margin-top: 9px; }
.itable .pin { height: 44px; padding: 0 8px; }
.itable .c-qty .pin { text-align: right; font-weight: 800; }
.itable .iloc { display: block; margin-top: 3px; font-family: var(--mono); font-size: 13px; font-weight: 600; color: var(--ink-3); }
.itable .iloc:empty { display: none; }
.itable .k-skip td { padding: 6px 5px; border-bottom: 1px solid var(--line2); vertical-align: middle; color: var(--ink-2); font-size: 14px; }
.iskiprow { display: flex; align-items: center; flex-wrap: wrap; gap: 0 10px; }
.iskiprow .tbtn { min-height: 44px; }
.itable .k-skip .c-n .irn { margin-top: 0; }
.irec td:first-child { box-shadow: none; }
.irec.x-bad td:first-child { box-shadow: inset 4px 0 0 var(--red); }
.irec.x-unc td:first-child { box-shadow: inset 4px 0 0 var(--warn-dot); }
.irec.x-bad .c-n .irn, .irec.x-unc .c-n .irn { margin-left: 8px; }
.itable .ir2 td:first-child { padding: 0; }

/* what saving does (the desk's second line, a phone's card, the edit sheet) */
.ires { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.iwho { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; }
.iwho img { border: 1px solid var(--line2); }
.iwt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.iname { font-size: 16px; line-height: 1.25; }
.ibn { font-size: 13px; color: var(--ink-2); overflow-wrap: anywhere; }
.ich { font-size: 15px; line-height: 1.35; color: var(--ink); }
.ich.same { color: var(--ink-3); }
.ipills { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.ipill { height: 26px; font-size: 13px; }
.pill.pnew { background: #E3F3EC; color: var(--green-d); }
.pill.pnew::before { background: var(--green); }
.iopt { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 4px 12px; background: var(--band); border-radius: var(--rc); font-size: 15px; line-height: 1.3; cursor: pointer; align-self: flex-start; max-width: 100%; }
.iopt input { width: 22px; height: 22px; accent-color: var(--green); margin: 0; flex: none; }
.iprob { margin: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; color: var(--red); font-size: 15px; font-weight: 700; line-height: 1.35; }
.iprob > svg { flex: none; }
.iprob > span { flex: 1 1 200px; min-width: 0; }
.iprob b { font-weight: 800; }
.iprob .dbtn { color: var(--ink); border-color: var(--ink); }
.iline { margin: 0; display: flex; align-items: flex-start; gap: 6px; font-size: 14px; line-height: 1.4; color: var(--ink-2); overflow-wrap: anywhere; }
.iline svg { flex: none; margin-top: 2px; }
.iline.imuted { color: var(--ink-3); }
.iwarn { color: var(--st-low); font-weight: 700; }
.isug { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 8px 12px; border-left: 4px solid var(--st-order); background: var(--st-order-bg); color: var(--st-order); font-size: 15px; line-height: 1.35; }
.isug > span { flex: 1 1 220px; min-width: 0; }
.isug .dbtn { background: var(--paper); color: var(--ink); border-color: var(--ink); }
.inew { display: grid; grid-template-columns: minmax(0, 240px) minmax(0, 1fr); gap: 10px; max-width: 700px; }
.inew:has(> :only-child) { grid-template-columns: minmax(0, 240px); }
.inew .pf { gap: 4px; }
.inew .pin { height: 44px; }
.iacts { display: flex; flex-wrap: wrap; gap: 0 18px; }
.iacts .tbtn { padding: 0 8px; min-height: 44px; min-width: 44px; font-size: 14px; }
.iacts .tbtn:first-child { padding-left: 0; }
.itable .iacts .tbtn:last-child { padding-right: 0; }

/* the desk: what saving does on one line where it fits (the part, its tick boxes, then the actions at the right);
   problems, suggestions and notes below, across */
.itable .ires { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.itable .iwho { flex: 0 1 auto; grid-template-columns: 40px minmax(0, max-content) auto; justify-content: start; gap: 2px 12px; min-width: 260px; }
.itable .iwho img { width: 40px; height: 40px; }
.itable .il1 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; }
.itable .ipills { justify-content: flex-start; align-self: start; padding-top: 1px; }
.itable .iopt { order: 1; min-height: 44px; }
.itable .inew { order: 1; flex: 1 1 560px; grid-template-columns: minmax(0, 200px) minmax(0, 150px) minmax(0, 1fr); }
.itable .iacts { order: 2; margin-left: auto; }
.itable .iprob, .itable .isug, .itable .iline { order: 3; flex: 1 1 100%; }
.itable .ires > .imuted { order: 3; }

/* a phone: cards; the row as written on the paper, then what saving does, then Edit and Skip */
.icards { margin: 0; padding: 0; list-style: none; }
.icard { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 10px; padding: 14px 0; border-bottom: 1px solid var(--line2); }
.icard.x-bad, .icard.x-unc { margin-left: -12px; padding-left: 8px; border-left: 4px solid var(--red); }
.icard.x-unc { border-left-color: var(--warn-dot); }
.ic-b { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ic-b > p { margin: 0; }
.ic-sheet { font-size: 14px; line-height: 1.55; color: var(--ink-2); overflow-wrap: anywhere; }
.isl { white-space: normal; }
.isl i { font-style: normal; color: var(--ink-3); }
.isk { font-size: 13px; color: var(--ink-3); }
.isl.unc { background: var(--warn-bg); box-shadow: inset 0 -2px 0 var(--warn-dot); padding: 1px 3px; color: var(--ink); }
.isl.bad, .isl.bad i { color: var(--red); font-weight: 700; }
.icard.k-skip .ic-b { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0 10px; font-size: 14px; color: var(--ink-2); }
.icard.k-skip .linkbtn { height: 48px; }
.ic-btns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-width: 440px; }
.ic-btns .dbtn { min-height: 48px; font-size: 15px; }
.inv.phone .iwho, .msheet-inv .iwho { grid-template-columns: 44px minmax(0, 1fr); grid-template-areas: "p p" "i t"; }
.inv.phone .iwho > img, .msheet-inv .iwho > img { grid-area: i; }
.inv.phone .iwt, .msheet-inv .iwt { grid-area: t; }
.inv.phone .ipills, .msheet-inv .ipills { grid-area: p; justify-content: flex-start; margin-bottom: 2px; }
.inv.phone .iopt, .msheet-inv .iopt { min-height: 48px; align-self: stretch; }
.inv.phone .iacts .tbtn, .msheet-inv .iacts .tbtn { min-height: 48px; }
.inv.phone .isug .dbtn, .inv.phone .iprob .dbtn, .msheet-inv .isug .dbtn, .msheet-inv .iprob .dbtn { min-height: 48px; }
.inv.phone .ihead { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.inv.phone .ihead .pf:first-child { grid-column: 1 / -1; }

/* the edit sheet (a phone) */
.msheet-inv .msheet-body { padding-top: 14px; }
.iedit .note { margin: 0 0 12px; }
.ie-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 10px; }
.ie-grid .pf { gap: 4px; }
.ie-grid .ie-wide { grid-column: 1 / -1; }
.ie-grid .pin { height: 48px; }
.ie-grid .iloc { font-family: var(--mono); font-size: 14px; font-weight: 600; color: var(--ink-3); }
.ie-grid .iloc:empty { display: none; }
.ie-grid .iloc .ibad { font-family: var(--sans); color: var(--red); }
.ie-h { margin: 20px 0 10px; padding-top: 12px; border-top: 2px solid var(--ink); font-size: 17px; font-weight: 800; }
.ie-skip { margin-top: 18px; }
.msheet-inv .inew { grid-template-columns: minmax(0, 1fr); }

/* ---------------------------------------------------------------- 4. done */
.iput { margin: 14px 0 0; padding: 0; list-style: none; border-top: 2px solid var(--ink); }
.iput li { border-bottom: 1px solid var(--line2); }
.irow { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 12px; align-items: center; min-height: 64px; padding: 10px 0; color: var(--ink); text-decoration: none; }
a.irow:hover .ipn b { text-decoration: underline; }
.ipn { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ipn b { font-size: 16px; line-height: 1.25; }
.ipn .mono { font-size: 13px; color: var(--ink-2); overflow-wrap: anywhere; }
.itags { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 3px; }
.imoved { font-size: 13px; font-weight: 700; color: var(--st-order); }
.iq { display: flex; flex-direction: column; align-items: flex-end; font-size: 17px; white-space: nowrap; }
.iq .muted { font-size: 13px; }
.idone .rbtns { margin-top: 20px; }
.inv.desk .idone .rbtns { max-width: 560px; }

/* ---------------------------------------------------------------- compact: phone layout */
@media (max-width: 1023.98px) {
  .ih { font-size: 22px; }
  .inv .note { font-size: 15px; }
}
@media (max-width: 379.98px) {
  .inv.phone .ihead { grid-template-columns: minmax(0, 1fr); }
  .ie-grid { gap: 12px 8px; }
}

/* ---------------------------------------------------------------- the printed sheets (US letter LANDSCAPE, actual size)
   The landscape @page rule is added while an inventory print view is open (js/desk/inventory-print.js), so the QR
   labels and order lists keep their portrait page. */
.isheet { position: relative; width: 11in; height: 8.5in; padding: 0.32in 0.4in 0; display: flex; flex-direction: column; flex-shrink: 0; overflow: hidden;
  background: #FFFFFF; color: #000000; border: 1px solid var(--sheet-line); font-family: var(--sans); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.is-h { flex: none; }
.is-top { display: grid; grid-template-columns: 3.45in 2.3in 2in 1.3in minmax(0, 1fr); border: 1.25pt solid #000000; }
.is-tt { display: flex; flex-direction: column; justify-content: center; gap: 0.02in; padding: 0.04in 0.1in; min-width: 0; }
.is-k1 { font-size: 9pt; font-weight: 700; line-height: 1; }
.is-t { font-size: 12.5pt; font-weight: 800; letter-spacing: 0.02em; line-height: 1.1; white-space: nowrap; }
.is-code { font-size: 8pt; font-weight: 600; line-height: 1; }
.is-code b { font-family: var(--mono); font-size: 9.5pt; font-weight: 700; letter-spacing: 0.04em; }
.is-box { height: 0.56in; padding: 0.04in 0.08in 0.05in; border-left: 1pt solid #000000; display: flex; flex-direction: column; justify-content: space-between; min-width: 0; }
.is-k { font-size: 7pt; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; line-height: 1; }
.is-v { display: flex; align-items: baseline; gap: 0.06in; min-height: 0.26in; font-size: 14pt; font-weight: 800; line-height: 1.1; white-space: nowrap; overflow: hidden; }
.is-lab { font-size: 10.5pt; font-weight: 700; overflow: hidden; text-overflow: ellipsis; }
.is-pg .is-v { gap: 0.08in; align-items: flex-end; }
.is-pn1 { display: inline-block; min-width: 0.34in; border-bottom: 1pt solid #000000; text-align: center; font-size: 13pt; }
.is-of { font-size: 8.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.is-ins { margin: 0.07in 0 0.07in; font-size: 9.5pt; font-weight: 600; line-height: 1.25; }
.is-tab { width: 100%; border-collapse: collapse; table-layout: fixed; }
.is-tab col.c-n { width: 0.38in; }
.is-new col.c-bin { width: 0.95in; }
.is-new col.c-pn { width: 2in; }
.is-new col.c-br { width: 1.05in; }
.is-new col.c-q { width: 0.6in; }
.is-new col.c-fits { width: 1.5in; }
.is-new col.c-nt { width: 2.05in; }
.is-count col.c-bin { width: 0.85in; }
.is-count col.c-pn { width: 1.3in; }
.is-count col.c-br { width: 0.85in; }
.is-count col.c-fits { width: 1.3in; }
.is-count col.c-exp { width: 0.62in; }
.is-count col.c-cnt { width: 0.75in; }
.is-count col.c-nh { width: 0.55in; }
.is-count col.c-nt { width: 2.17in; }
.is-tab thead th { height: 0.3in; padding: 0 0.05in; text-align: left; vertical-align: middle; font-size: 7.5pt; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; line-height: 1.05; border: 1pt solid #000000; border-bottom-width: 1.75pt; color: #000000; background: #FFFFFF; }
.is-tab thead th.is-c { text-align: center; }
.is-tab td { height: 0.41in; padding: 0 0.05in; vertical-align: middle; border-top: 0.75pt solid #5A5A5A; border-bottom: 0.75pt solid #5A5A5A; border-left: 0.6pt solid #8C8C8C; border-right: 0.6pt solid #8C8C8C; overflow: hidden; }
.is-tab td:first-child { border-left: 1pt solid #000000; }
.is-tab td:last-child { border-right: 1pt solid #000000; }
.is-tab tbody tr:last-child td { border-bottom: 1pt solid #000000; }
.is-tab tr.is-lv td { border-top: 1.75pt solid #000000; }
.is-tab tr.is-sh th { height: 0.3in; padding: 0 0.05in; text-align: left; vertical-align: middle; font-size: 8pt; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; border: 1pt solid #000000; border-top-width: 1.75pt; background: #FFFFFF; }
.is-tab td.is-n { padding: 0 0.02in; text-align: center; font-size: 8.5pt; font-weight: 700; color: #333333; white-space: nowrap; }
.is-bin b { display: block; font-size: 11pt; font-weight: 800; line-height: 1.05; letter-spacing: 0.01em; white-space: nowrap; }
.is-bin span { display: block; font-size: 6.5pt; font-weight: 600; line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.is-bin .is-nob { font-size: 8pt; font-weight: 700; }
.is-wb { display: block; height: 0.26in; border: 1pt solid #000000; }
.is-pn { position: relative; }
.is-tk { position: absolute; left: 0.05in; right: 0.05in; bottom: 0; height: 0.055in; display: flex; }
.is-tk i { flex: 1 1 0; border-left: 0.6pt solid #A3A3A3; }
.is-tk i:first-child { border-left: 0; }
/* the count sheet's printed rows: the part (printed), the units it fits (small, room to add), In the app (grey), then
   the boxes to fill in: Counted (a clear box) and Not here (a tick box) */
.is-ppn { font-size: 10.5pt; font-weight: 800; white-space: nowrap; letter-spacing: 0.01em; }
.is-pb { font-size: 9pt; font-weight: 600; white-space: nowrap; }
.is-pd { font-size: 9pt; line-height: 1.1; }
.is-pf { vertical-align: top !important; padding-top: 0.03in !important; }
.is-fits { display: block; font-size: 7pt; line-height: 1.15; color: #333333; max-height: 0.2in; overflow: hidden; }
.is-exp { text-align: center; font-size: 12pt; font-weight: 700; color: #555555; }
.is-exp.is-none { background: repeating-linear-gradient(135deg, #FFFFFF 0 0.05in, #E2E2E2 0.05in 0.065in); }
.is-cnt, .is-nh { text-align: center; }
.is-cb { display: inline-block; width: 0.58in; height: 0.3in; border: 1.25pt solid #000000; vertical-align: middle; }
.is-tb { display: inline-block; width: 0.2in; height: 0.2in; border: 1.25pt solid #000000; vertical-align: middle; }
.is-f { position: absolute; left: 0.4in; right: 0.4in; bottom: 0.22in; display: flex; justify-content: space-between; gap: 0.2in; font-size: 7.5pt; font-weight: 600; color: #333333; }
@media screen {
  .pv-sheets > .isheet { zoom: var(--ivz, 1); }
}
@media print {
  /* a little shorter than the page, so a printer's own margins can't push a page onto two */
  body.printing .is-sheets .isheet { height: 8.2in; border: 0; margin: 0; break-after: page; page-break-after: always; }
  body.printing .is-sheets .isheet:last-child { break-after: auto; page-break-after: auto; }
  body.printing .is-sheets .is-f { bottom: 0.14in; }
}

/* ---------------------------------------------------------------- step 7, round 2: the count sheet on the page */
.ptype { margin-top: 10px; }
.ifilt { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 12px; }
.ifb { min-height: 44px; padding: 0 12px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--field); border-radius: var(--rc); background: var(--paper); color: var(--ink-2); font-size: 14px; font-weight: 600; white-space: nowrap; }
.ifb .cnt { font-size: 13px; font-weight: 700; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.ifb[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: #FFFFFF; font-weight: 700; }
.ifb[aria-pressed="true"] .cnt { color: #FFFFFF; }
.ifb:hover { border-color: var(--ink-3); }
.isn { color: var(--ink-3); font-weight: 700; margin-left: 4px; }
.iempty { margin: 8px 0 0; }
.ctable { table-layout: fixed; width: 100%; }
.ctable col.c-n { width: 36px; }
.ctable col.c-bin { width: 104px; }
.ctable col.c-app { width: 70px; }
.ctable col.c-cnt { width: 178px; }
.ctable col.c-res { width: 156px; }
@media (min-width: 1280px) {
  .ctable col.c-n { width: 40px; }
  .ctable col.c-bin { width: 130px; }
  .ctable col.c-app { width: 96px; }
  .ctable col.c-cnt { width: 200px; }
  .ctable col.c-res { width: 220px; }
}
.ctable th { position: sticky; top: 0; z-index: 2; padding: 0 5px; white-space: normal; line-height: 1.2; }
.ctable td.c-res, .ctable th.c-res { padding-left: 16px; }
.ctable th.num, .ctable td.num { text-align: center; }
.ctable .c-cnt { padding-left: 14px; }
.ctable .ipills { justify-content: flex-start; }
.ctable td { padding: 8px 5px; vertical-align: middle; border-bottom: 1px solid var(--line2); }
.ctable .crec:has(> tr.c2:not([hidden])) .c1 td { border-bottom: 0; }
.ctable .c2 td { padding: 0 5px 12px; }
.ctable .c2 td:first-child { padding: 0; }
.ctable .c-n { padding-left: 2px; padding-right: 0; }
.crec.x-bad td:first-child { box-shadow: inset 4px 0 0 var(--red); }
.crec.x-unc td:first-child { box-shadow: inset 4px 0 0 var(--warn-dot); }
.crec.x-bad .c-n .irn, .crec.x-unc .c-n .irn { margin-left: 8px; }
.c-bin .lchip { font-size: 14px; }
.cbn { display: block; margin-top: 3px; font-size: 13px; line-height: 1.2; color: var(--ink-3); overflow-wrap: anywhere; }
.cpart { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; align-items: center; }
.cpart img { width: 36px; height: 36px; }
.cpt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.cpt b { font-size: 15px; line-height: 1.25; }
.cpt .mono { font-size: 13px; color: var(--ink-2); overflow-wrap: anywhere; }
.cpn { gap: 3px; }
.cpn .flbl { color: var(--red); }
.c-app { font-size: 18px; font-weight: 800; color: var(--ink-2); }
.ccnt { display: flex; align-items: center; gap: 10px; }
.ccnt .cq { width: 72px; height: 44px; text-align: right; font-size: 18px; font-weight: 800; padding: 0 10px; flex: none; }
.inh { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; font-size: 14px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.inh input { width: 20px; height: 20px; accent-color: var(--ink); margin: 0; flex: none; }
.cres { display: block; font-size: 15px; line-height: 1.3; }
.cres b { font-weight: 800; }
.cnot { color: var(--ink-3); }
.csame { color: var(--ink-2); }
.cdiff { display: block; font-size: 15px; font-weight: 800; line-height: 1.3; font-variant-numeric: tabular-nums; }
.cdiff.neg { color: var(--st-out); }
.cdiff.pos { color: var(--good); }
.crec.s-uncounted .c-app, .crec.s-uncounted .cpt b { color: var(--ink-3); }
.cnote { color: var(--ink); }
.cnote::first-letter { font-weight: 700; }
/* a phone: a printed row as a card */
.msheet-inv .cwho { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 12px; align-items: start; }
.ccard .cwho { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 4px 12px; align-items: start; }
.ccard .cwho0 { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.ccard .cedit { min-height: 48px; padding: 0 16px; font-size: 15px; }
.cbn2 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 2px 0 4px; }
.cbn2 .mono { font-size: 13px; color: var(--ink-2); }
.cbn2 .cbn { display: none; }
.ccard .cline { font-size: 15px; }
.msheet-inv .cwho { grid-template-columns: 56px minmax(0, 1fr); margin-bottom: 10px; }
.ccard .cwho img { border: 1px solid var(--line2); }
.cbin { display: block; margin-top: 4px; }
.cline { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 14px; font-size: 16px; color: var(--ink-2); }
.cline b { color: var(--ink); }
.cres-w { display: inline-flex; flex-wrap: wrap; gap: 0 10px; align-items: baseline; }
.cres-w .cres, .cres-w .cdiff { display: inline; font-size: 16px; }
.ccard.s-uncounted .cwho b, .ccard.s-uncounted .cline { color: var(--ink-3); }
.msheet-inv .inh2 { min-height: 48px; align-self: stretch; }
.msheet-inv .ie-app { margin: 12px 0 8px; }
.msheet-inv .ires .cres, .msheet-inv .ires .cdiff { font-size: 17px; }
@media (max-width: 1023.98px) {
  .ifb { min-height: 48px; font-size: 15px; }
}