/* ============================================================
   ProRecovery desk sheet: the rules only /prorecovery draws, split out of prorecovery.css (owner, 2026-11-02).
   Loaded after prorecovery.css, so a rule here must not tie a rule there on an element they share.
   Tokens and color-mix only.
   ============================================================ */

/* The empty ledger: a tabular figure in the house display italic. */
.prv-empty-figure {
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
}
/* The desk roster: the shops we represent, read-only. Layout only; colour comes from tokens. */
.prv-roster { margin-top: 28px; }
.prv-roster-link {
  color: var(--pa-ink);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid var(--pa-hair-strong);
}
.prv-roster-link:hover { border-bottom-color: var(--pa-orange-deep); }
.prv-roster-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.prv-roster-figures { color: var(--pa-muted); font-size: .8rem; margin: 6px 0 0; }
.prv-authority { display: flex; gap: 12px; }
.prv-authority-slot { display: flex; align-items: center; gap: 5px; font-size: .72rem; text-transform: uppercase; color: var(--pa-muted); }
.prv-authority-box { display: inline-grid; place-items: center; width: 14px; height: 14px; line-height: 1; border: 1px dashed var(--pa-hair-strong); border-radius: 2px; }
.prv-authority-box.is-filed { background: var(--pa-ok-bg); border: 1px solid var(--pa-ok-border); color: var(--pa-ok-fg); }
.prv-roster .pa-data-grid > tbody > tr > td { padding-block: 10px; }
/* ============================================================
   Case core (1b): the desk worklist, the intake and case dialogs, and the case file.
   Spec: docs/superpowers/specs/2026-09-09-prorecovery-1b-case-core-design.md section 7.
   Layout only. Colour from tokens and color-mix; type from pa-num and pa-serif.
   ============================================================ */
/* ---- Desk summary: the stage rail and the open-money line ---- */
.prv-summary { margin: 0 0 18px; display: grid; gap: 12px; }
.prv-rail-wrap { overflow-x: auto; }
.prv-rail {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(8, minmax(6.5rem, 1fr));
  border: 1px solid var(--pa-hair); border-radius: var(--pa-radius); background: var(--pa-card);
}
.prv-rail > li + li { border-left: 1px solid var(--pa-hair); }
.prv-rail-stage {
  font: inherit; color: var(--pa-ink); background: transparent; border: 0; cursor: pointer;
  display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 2px;
  width: 100%; padding: 10px 12px 9px; text-align: left;
  border-bottom: 2px solid transparent;
  transition: background var(--pa-dur-fast) ease, border-color var(--pa-dur-fast) ease;
}
.prv-rail-stage:hover { background: var(--pa-row-hover); }
.prv-rail-stage:focus-visible { outline: none; box-shadow: var(--pa-focus-ring); }
.prv-rail-stage[aria-pressed="true"] { border-bottom-color: var(--pa-orange); background: var(--pa-card-tint); }
.prv-rail-count { font-size: 1.25rem; font-weight: 700; line-height: 1.1; }
.prv-rail-label { font-size: .72rem; color: var(--pa-muted); white-space: nowrap; }
.prv-ledger-line { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; align-items: baseline; }
.prv-ledger-side { display: flex; gap: 8px; flex-wrap: wrap; margin-left: auto; }
/* The due strip: one line, its action on the right. */
.prv-due-strip { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 0 0 14px; }
/* ---- Worklist ---- */
.prv-worklist { margin-top: 4px; }
.prv-worklist .pa-data-grid > tbody > tr > td { vertical-align: top; }
.prv-case-link {
  color: var(--pa-ink); font-weight: 700; text-decoration: none;
  border-bottom: 1px solid var(--pa-hair-strong);
}
.prv-case-link:hover { border-bottom-color: var(--pa-orange-deep); }
.prv-worklist-empty { padding: 22px; border: 1px dashed var(--pa-hair-strong); border-radius: var(--pa-radius); text-align: left; }
.prv-worklist-empty .pa-empty-title { margin: 0 0 6px; font-size: 1rem; }
.prv-worklist-empty .pa-empty-text { margin: 0 0 12px; max-width: none; }
.prv-warnings { margin: 6px 0 0; padding-left: 18px; font-size: .8rem; }
@media (max-width: 768px) {
  .prv-ledger-side { margin-left: 0; }
}
/* ============================================================
   Slice 3: case email. The case page's Correspondence section and composer, the desk's Inbox tab and the worklist's
   "needs reply" pill. The signature is the case address as a franked token, and the thread as a register: every email
   sits on a rail that says which way it went, the case's own voice on the orange rail, mail arriving on the teal one.
   Layout only. Colour from tokens and color-mix; type from pa-num and pa-mono.
   ============================================================ */
/* The desk's two views. */
.prv-desk-tabs { margin: 0 0 18px; flex-wrap: wrap; }
/* The Inbox tab: two registers. */
.prv-inbox { display: grid; gap: 26px; }
.prv-inbox-block { min-width: 0; }
.prv-inbox-block .prv-section-head .pa-section-label { margin: 0; }
.prv-inbox-lead { margin: 0 0 10px; max-width: 80ch; }
.prv-inbox .pa-data-grid > tbody > tr > td { vertical-align: top; }
.prv-inbox-from { overflow-wrap: anywhere; font-size: .78rem; }
.prv-inbox-subject { font-weight: 600; color: var(--pa-ink); overflow-wrap: anywhere; }
.prv-inbox-flags { display: flex; flex-wrap: wrap; gap: 4px; }
.prv-inbox-actions { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
/* ============================================================
   Visual pass (round trip, task 8): one card head across the case page, designed empty and loading states, money
   that reads at a glance, the correspondence register's hierarchy, and the case dialogs as one surface under the
   house popup hero. Layout only. Colour from tokens and color-mix; type from pa-num, pa-mono and pa-serif.
   ============================================================ */
/* ---- Desk worklist: wider than the desk below 1600px, so the case column stays put while the row scrolls ---- */
.prv-worklist .pa-data-grid > tbody > tr > td:first-child { min-width: 9rem; }
@media (max-width: 1599px) {
  /* The pa-grid table clips (overflow hidden), which would make IT the sticky container; inside pa-grid-scroll the
     wrapper already owns the border, the radius and the scroll, so the table lets the cell stick to the wrapper. */
  .prv-worklist .pa-grid-scroll > .pa-grid.pa-data-grid { overflow: visible; }
  .prv-worklist .pa-data-grid > :is(thead, tbody) > tr > :first-child { position: sticky; left: 0; z-index: 1; }
  .prv-worklist .pa-data-grid > tbody > tr > td:first-child { background: var(--pa-card); box-shadow: inset -1px 0 0 var(--pa-hair); }
  .prv-worklist .pa-data-grid > thead > tr > th:first-child { box-shadow: inset -1px 0 0 var(--pa-hair-strong); }
}
/* ============================================================
   Workflow, task 7 (spec 4.3, 4.5): the desk's queues, and the clocks and marks on each worklist row. The signature is
   the queue rail: the work grouped as it is done (yours, to chase, money, then browse), each count in the tone of the
   mark its rows carry (due warn, needs reply info, the short-pay orange, the flag teal), and the queue you are in held
   in the house dark selected fill. Overdue rows carry a danger edge down the case column and due-today rows a warn
   edge, so lateness reads down the list without opening a case.
   Layout only. Colour from tokens and color-mix; type from pa-num and pa-serif.
   ============================================================ */
/* ---- The queue rail ---- */
.prv-queues {
  display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px 20px;
  margin: 0 0 12px; padding: 10px 12px 12px;
  border: 1px solid var(--pa-hair); border-radius: var(--pa-radius); background: var(--pa-card);
}
.prv-queue-bay { display: grid; gap: 6px; min-width: 0; }
.prv-queue-bay.prv-queue-bay--browse { margin-left: auto; }
.prv-queue-bay-label { padding-left: 2px; font-size: .62rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--pa-muted); }
.prv-queue-tabs { display: flex; flex-wrap: wrap; gap: 4px; }
.prv-queue {
  font: inherit; display: inline-flex; align-items: center; justify-content: flex-start; gap: 9px;
  min-height: 34px; padding: 5px 6px 5px 12px;
  font-size: .82rem; font-weight: 600; line-height: 1.2; color: var(--pa-ink); text-align: left;
  background: var(--pa-card-tint); border: 1px solid var(--pa-hair); border-radius: var(--pa-radius-sm);
  cursor: pointer;
  transition: background var(--pa-dur-fast) ease, border-color var(--pa-dur-fast) ease, color var(--pa-dur-fast) ease;
}
.prv-queue:hover { background: var(--pa-row-hover); border-color: var(--pa-orange-deep); }
.prv-queue:focus-visible { outline: none; box-shadow: var(--pa-focus-ring); }
.prv-queue-count {
  display: inline-grid; place-items: center; min-width: 1.6rem; height: 1.4rem; padding: 0 7px;
  font-size: .74rem; font-weight: 700; line-height: 1; color: var(--pa-ink);
  background: var(--pa-card); border: 1px solid var(--pa-hair-strong); border-radius: 999px;
}
/* The tones and the quiet zero read only on a queue not chosen; the chosen one has its own inks below. */
.prv-queue[aria-pressed="false"].is-due .prv-queue-count { color: var(--pa-warn-fg); background: var(--pa-warn-bg); border-color: var(--pa-warn-border); }
.prv-queue[aria-pressed="false"].is-mail .prv-queue-count { color: var(--pa-info-fg); background: var(--pa-info-bg); border-color: var(--pa-info-border); }
.prv-queue[aria-pressed="false"].is-shortpay .prv-queue-count { color: color-mix(in srgb, var(--pa-orange-deep) 70%, var(--pa-ink)); background: var(--pa-orange-tint); border-color: var(--pa-orange); }
.prv-queue[aria-pressed="false"].is-flag .prv-queue-count { color: var(--pa-teal-deep); background: color-mix(in srgb, var(--pa-teal) 12%, var(--pa-card)); border-color: var(--pa-teal); }
.prv-queue.prv-queue[aria-pressed="false"].is-empty { color: var(--pa-muted); }
.prv-queue.prv-queue[aria-pressed="false"].is-empty .prv-queue-count { color: var(--pa-faint); background: transparent; border-color: var(--pa-hair); }
/* The queue you are in: the invariant dark fill, the selected ring (the cue in dark, where the fill sits near the
   card) and an orange foot, the house active-tab mark. */
.prv-queue[aria-pressed="true"] {
  color: var(--pa-sidebar-text-bright); background: var(--pa-sidebar); border-color: var(--pa-sidebar);
  box-shadow: inset 0 -2px 0 var(--pa-orange), inset 0 0 0 1px var(--pa-selected-ring);
}
.prv-queue[aria-pressed="true"]:focus-visible { box-shadow: inset 0 -2px 0 var(--pa-orange), var(--pa-focus-ring); }
.prv-queue[aria-pressed="true"] .prv-queue-count {
  color: var(--pa-sidebar-text-bright);
  background: color-mix(in srgb, var(--pa-sidebar-text-bright) 14%, transparent);
  border-color: color-mix(in srgb, var(--pa-sidebar-text-bright) 30%, transparent);
}
.prv-queue-count.prv-queue-count.is-pending { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
  .prv-queue { transition: none; }
}
/* ---- Where you are: the queue name in the display face, what it holds, and how much of it a narrowing shows ---- */
.prv-queue-caption { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px; margin: 0 0 12px; padding: 0 2px; }
.prv-queue-caption-text { flex: 1 1 24rem; min-width: 0; margin: 0; font-size: .8rem; line-height: 1.45; color: var(--pa-muted); }
.prv-queue-shown { font-size: .76rem; color: var(--pa-muted); white-space: nowrap; }
.prv-queue-shown .pa-num { font-weight: 700; color: var(--pa-ink); }
/* An empty queue is good news: the all-clear teal on the slot edge. */
.prv-worklist-empty.prv-queue-empty { border-style: solid; border-left: 3px solid var(--pa-teal); }
/* ---- Worklist rows: the flags under the case, the due mark on the next action, each clock under what it measures ---- */
.prv-worklist .pa-data-grid td.prv-row-next { min-width: 9rem; }
.prv-worklist .pa-data-grid td.prv-row-carrier { min-width: 10rem; max-width: 15rem; }
.prv-row-flags { display: flex; flex-wrap: wrap; gap: 3px 9px; margin-top: 6px; max-width: 15rem; }
.prv-row-flag {
  display: inline-flex; align-items: center; gap: 5px; white-space: nowrap;
  font-size: .65rem; font-weight: 700; letter-spacing: .05em; line-height: 1.4; text-transform: uppercase; color: var(--pa-teal-deep);
}
.prv-row-flag::before {
  content: ""; flex: 0 0 auto; width: 7px; height: 9px; background: currentColor;
  clip-path: polygon(0 0, 100% 0, 62% 50%, 100% 100%, 0 100%);
}
.prv-row-flag.prv-row-flag.is-shortpay { color: var(--pa-orange-text); }
.prv-row-flag.prv-row-flag--more { color: var(--pa-muted); letter-spacing: 0; }
.prv-row-flag.prv-row-flag--more::before { content: none; }
.prv-row-flag-count { padding: 0 5px; border-radius: 999px; letter-spacing: 0; background: color-mix(in srgb, currentColor 14%, transparent); }
.prv-row-due-line { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.prv-row-due-date { font-weight: 600; color: var(--pa-ink); white-space: nowrap; }
.prv-worklist tr.is-overdue .prv-row-due-date { font-weight: 700; color: var(--pa-bad-fg); }
.prv-worklist tr.is-due .prv-row-due-date { font-weight: 700; color: var(--pa-warn-fg); }
.prv-row-clock { display: block; margin-top: 4px; font-size: .7rem; line-height: 1.35; color: var(--pa-muted); white-space: nowrap; }
.prv-row-clock.is-none { font-style: italic; }
/* The lateness edge on the case column (sticky below 1600px, where it keeps its divider on the right). */
.prv-worklist .pa-data-grid > tbody > tr.is-overdue > td:first-child { box-shadow: inset 3px 0 0 var(--pa-bad-border); }
.prv-worklist .pa-data-grid > tbody > tr.is-due > td:first-child { box-shadow: inset 3px 0 0 var(--pa-warn-border); }
@media (max-width: 1599px) {
  .prv-worklist .pa-data-grid > tbody > tr.is-overdue > td:first-child { box-shadow: inset 3px 0 0 var(--pa-bad-border), inset -1px 0 0 var(--pa-hair); }
  .prv-worklist .pa-data-grid > tbody > tr.is-due > td:first-child { box-shadow: inset 3px 0 0 var(--pa-warn-border), inset -1px 0 0 var(--pa-hair); }
}
/* ---- Phone: a two-up grid. Yours and Browse (one queue each) share the first row; the chasing and the money take
   the full width, their queues two-up with the count on the right ---- */
@media (max-width: 600px) {
  .prv-queues { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 4px; padding: 10px; }
  .prv-queue-bay { grid-column: 1 / -1; gap: 5px; }
  .prv-queue-bay:first-child { grid-column: 1; grid-row: 1; }
  .prv-queue-bay.prv-queue-bay--browse { grid-column: 2; grid-row: 1; margin-left: 0; }
  .prv-queue-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .prv-queue-bay:first-child .prv-queue-tabs, .prv-queue-bay--browse .prv-queue-tabs { grid-template-columns: minmax(0, 1fr); }
  .prv-queue { justify-content: space-between; min-width: 0; min-height: 36px; padding: 4px 5px 4px 10px; font-size: .78rem; line-height: 1.15; }
  .prv-queue-label { min-width: 0; overflow-wrap: anywhere; }
}
/* ============================================================
   M365 mail, task 6a (lifecycle spec 8 and 3.3; the workflow plan's missing alert settings). Three pieces:
   1. My alerts (/prorecovery/alerts). The signature is the switchboard: one row per alert, one column per channel,
      and in every cell an example of what arrives there, so a switch turned off visibly holds that notice back (the
      example goes dashed and struck through, marked "Not sent to you"). Each alert wears the tone of the desk queue it
      feeds (case email the needs-reply info, flags the flag teal, the morning digest the due warn) as an edge down its
      row, and each column head counts, in pips of those tones, the alerts that reach you in that channel.
   2. The composer's envelope on the hero: From (the shared mailbox and its name) and Replies to (the case address).
   3. The Inbox's case-number hint on unknown-address mail: information for the triager, never a filing.
   Layout only. Colour from tokens and color-mix (the tone aliases name house tokens); type from pa-num and pa-serif.
   ============================================================ */
/* ---- The Inbox: a case number in an unknown-address subject, shown to the triager only ---- */
.prv-cell-sub.prv-inbox-hint { display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; font-weight: 600; color: var(--pa-info-fg); }
.prv-cell-sub.prv-inbox-hint::before { content: ""; flex: 0 0 auto; width: 6px; height: 6px; border-radius: 50%; background: var(--pa-info-border); }
/* ============================================================
   M365 mail, task 6b (lifecycle spec 3.3). Two pieces:
   1. The desk's mail health card, at the head of the Inbox tab for Mail.Triage holders. The signature is the airmail
      edge along its top: the postal stripe that belongs with the case address's franked token, struck in the mailbox's
      state (flowing the all-clear teal, starting info, behind warn, failing bad) and replaced by a dashed rule where the
      server does not read the mailbox at all. Below the headline sit the two synced folders as pigeonholes, each led by
      the age of its last catch-up in the display face, then a foot for Graph's live updates and the read's own time.
   2. The "Sent from Outlook" badge on a captured sent email: a neutral pill with a drawn envelope.
   Layout only. Colour from tokens and color-mix (the tone aliases name house tokens); type from pa-serif and pa-num.
   ============================================================ */
/* ---- Tones: one alias per state, doubled so a state never loses to the base on source order ---- */
.prv-mailhealth { --prv-mh-tone: var(--pa-hair-strong); }
.prv-mailhealth.prv-mailhealth.is-flowing { --prv-mh-tone: var(--pa-teal); }
.prv-mailhealth.prv-mailhealth.is-starting { --prv-mh-tone: var(--pa-info-border); }
.prv-mailhealth.prv-mailhealth.is-behind { --prv-mh-tone: var(--pa-warn-border); }
.prv-mailhealth.prv-mailhealth.is-failing { --prv-mh-tone: var(--pa-bad-border); }
/* ---- The card and its airmail edge ---- */
.pa-card.prv-mailhealth { margin: 0 0 24px; padding: 0 0 2px; overflow: hidden; min-width: 0; }
.prv-mailhealth::before {
  content: ""; display: block; height: 5px;
  background: repeating-linear-gradient(-45deg,
    var(--prv-mh-tone) 0 9px, transparent 9px 14px,
    color-mix(in srgb, var(--prv-mh-tone) 42%, var(--pa-card)) 14px 23px, transparent 23px 28px);
}
/* Not set up here: no stripe, a dashed edge and a dashed frame, the page's mark for something not on file. */
.pa-card.prv-mailhealth.is-off { border-style: dashed; padding-bottom: 16px; background: color-mix(in srgb, var(--pa-card-tint) 55%, var(--pa-card)); }
.prv-mailhealth.prv-mailhealth.is-off::before { height: 0; background: none; }
.prv-mailhealth.prv-mailhealth.is-loading::before { opacity: .55; }
/* ---- Head: the eyebrow, the headline with its lamp, the lead; the two actions on the right ---- */
.prv-mailhealth-head {
  display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between;
  gap: 12px 20px; padding: 16px 20px 0;
}
.prv-mailhealth-heading { display: grid; gap: 4px; flex: 1 1 24rem; min-width: 0; }
.prv-mailhealth-heading .pa-kpi-label { margin: 0; }
.prv-mailhealth-title {
  display: flex; align-items: center; gap: 11px; margin: 0;
  font-size: 1.32rem; font-weight: 600; line-height: 1.2; color: var(--pa-ink);
}
.prv-mailhealth-lamp {
  flex: 0 0 auto; width: 11px; height: 11px; border-radius: 50%;
  background: var(--prv-mh-tone);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--prv-mh-tone) 20%, transparent);
}
.prv-mailhealth.prv-mailhealth.is-off .prv-mailhealth-lamp,
.prv-mailhealth.prv-mailhealth.is-loading .prv-mailhealth-lamp {
  background: transparent; border: 1.5px dashed var(--pa-faint); box-shadow: none;
}
.prv-mailhealth.is-syncing .prv-mailhealth-lamp { animation: prv-mh-pulse 1.4s ease-in-out infinite; }
@keyframes prv-mh-pulse {
  50% { box-shadow: 0 0 0 8px color-mix(in srgb, var(--prv-mh-tone) 6%, transparent); }
}
.prv-mailhealth-lead { margin: 0; max-width: 72ch; font-size: .86rem; line-height: 1.45; color: var(--pa-muted); }
.prv-mailhealth-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.prv-mailhealth-body { padding: 12px 20px 16px; }
.prv-mailhealth-body .prv-loading { padding: 4px 0; }
.prv-mailhealth-error { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; margin: 0; }
/* ---- What "Sync now" did, and a refusal ---- */
.prv-mailhealth-note {
  margin: 10px 20px 0; padding-left: 10px; border-left: 2px solid var(--prv-mh-tone);
  font-size: .8rem; font-weight: 600; line-height: 1.45; color: var(--pa-ink);
}
.prv-mailhealth-note:empty { display: none; }
.pa-error.prv-mailhealth-sync-error { margin: 10px 20px 0; }
/* ---- The two folders: pigeonholes on the card's tint, each with its state on the inside edge ---- */
.prv-mailhealth-folders {
  list-style: none; margin: 14px 20px 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;
}
.prv-mailhealth-folder {
  --prv-mh-folder: var(--pa-hair-strong);
  display: grid; align-content: start; gap: 2px; min-width: 0;
  padding: 12px 14px 13px 16px;
  border: 1px solid var(--pa-hair); border-radius: var(--pa-radius-sm);
  background: var(--pa-card-tint);
  box-shadow: inset 3px 0 0 var(--prv-mh-folder);
}
.prv-mailhealth-folder.prv-mailhealth-folder.is-uptodate { --prv-mh-folder: var(--pa-ok-border); }
.prv-mailhealth-folder.prv-mailhealth-folder.is-catchingup { --prv-mh-folder: var(--pa-info-border); }
.prv-mailhealth-folder.prv-mailhealth-folder.is-behind { --prv-mh-folder: var(--pa-warn-border); }
.prv-mailhealth-folder.prv-mailhealth-folder.is-failing { --prv-mh-folder: var(--pa-bad-border); }
.prv-mailhealth-folder-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; }
.prv-mailhealth-folder-head .pa-pill { white-space: nowrap; }
.prv-mailhealth-folder-name { font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--pa-ink); }
.prv-mailhealth-folder-purpose { font-size: .76rem; line-height: 1.4; color: var(--pa-muted); }
.prv-mailhealth-synced { margin-top: 8px; font-size: 1.14rem; font-weight: 600; line-height: 1.25; color: var(--pa-ink); }
.prv-mailhealth-synced time { color: inherit; text-decoration: none; }
.prv-mailhealth-detail { font-size: .8rem; line-height: 1.45; color: var(--pa-muted); overflow-wrap: anywhere; }
.prv-mailhealth-folder.prv-mailhealth-folder.is-failing .prv-mailhealth-detail { color: var(--pa-bad-fg); }
.prv-mailhealth-folder.prv-mailhealth-folder.is-behind .prv-mailhealth-detail { color: var(--pa-warn-fg); }
/* ---- Foot: Graph's live updates, the subscription worker's last failure, the read's own time ---- */
.prv-mailhealth-foot {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px;
  margin: 14px 0 0; padding: 10px 20px 10px;
  border-top: 1px solid var(--pa-hair);
  font-size: .78rem; color: var(--pa-muted);
}
.prv-mailhealth-live { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--pa-ink); }
.prv-mailhealth-live::before {
  content: ""; flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%;
  border: 1.5px solid var(--pa-faint); background: transparent;
}
.prv-mailhealth-live.prv-mailhealth-live.is-on::before { border-color: var(--pa-teal); background: var(--pa-teal); }
.prv-mailhealth-live-failure { color: var(--pa-bad-fg); overflow-wrap: anywhere; }
.prv-mailhealth-checked { margin-left: auto; white-space: nowrap; }
.prv-mailhealth-devlive {
  margin: 0 20px 10px; padding: 8px 12px;
  font-size: .78rem; line-height: 1.45; color: var(--pa-info-fg);
  background: var(--pa-info-bg); border: 1px solid var(--pa-info-border); border-radius: var(--pa-radius-sm);
}
@media (max-width: 720px) {
  .prv-mailhealth-head { padding: 14px 16px 0; }
  .prv-mailhealth-title { font-size: 1.16rem; }
  .prv-mailhealth-folders { grid-template-columns: minmax(0, 1fr); margin: 12px 16px 0; }
  .prv-mailhealth-note, .pa-error.prv-mailhealth-sync-error { margin-left: 16px; margin-right: 16px; }
  .prv-mailhealth-foot { padding: 10px 16px; }
  .prv-mailhealth-checked { margin-left: 0; }
  .prv-mailhealth-devlive { margin: 0 16px 10px; }
  .prv-mailhealth-body { padding: 12px 16px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .prv-mailhealth.is-syncing .prv-mailhealth-lamp { animation: none; }
}
/* ============================================================
   Payouts, task 4 (lifecycle spec 6): the desk's Payments tab and its three dialogs. Four pieces:
   1. Who we owe: one row per payee, "free to pay" the strongest figure on its row, each payee keyed in the case tape's
      split colours (the salesperson the house orange, the shop the hairline).
   2. The payout track, the signature: Draft, Approved and Paid as three stations on one rail in the order money leaves,
      each a filter carrying its count and its dollars in the display face, its state struck along the top edge (a
      draft the hairline, approved the orange of money waiting to go, paid the all-clear teal), the chosen station in
      the house dark selected fill, as the queue rail does. Voided payouts sit apart, quietly, on a dashed chip.
   3. Bank paper in the dialogs: the payout sheet and the deposit slip end on the accountant's double rule under the
      total; the mark-paid stub is the remittance as it will be filed, on a perforated edge.
   4. Deposit checks on the board: what waits for the bank, oldest first, a check that cannot go on a warn edge.
   Layout only. Colour from tokens and color-mix; type from pa-num, pa-mono and pa-serif.
   ============================================================ */
/* ---- The board ---- */
.prv-pay { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; }
.prv-pay > * { min-width: 0; }
.prv-pay-head-figure { margin: 0; font-size: .82rem; line-height: 1.4; color: var(--pa-muted); }
.prv-pay-head-figure strong { font-size: 1.06rem; font-weight: 700; color: var(--pa-ink); }
.prv-pay-head-of .pa-num { color: var(--pa-ink); }
.prv-pay-head-note { flex: 1 1 18rem; margin: 0; max-width: 60ch; font-size: .8rem; line-height: 1.45; color: var(--pa-muted); text-align: right; }
.pa-callout.prv-pay-error { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; margin: 0; }
.prv-pay .pa-grid > thead > tr > th.prv-num, .pa-grid.prv-pay-sheet > thead > tr > th.prv-num { text-align: right; }
.prv-pay .pa-grid-scroll { overflow-x: auto; }
/* ---- Who we owe ---- */
.prv-pay-name { display: block; font-weight: 700; color: var(--pa-ink); overflow-wrap: anywhere; }
.prv-pay-type {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 3px;
  font-size: .64rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--pa-muted);
}
.prv-pay-type::before { content: ""; flex: 0 0 auto; width: 12px; height: 4px; border-radius: 999px; background: var(--pa-hair-strong); }
.prv-pay-type.prv-pay-type.is-sales { color: var(--pa-orange-text); }
.prv-pay-type.prv-pay-type.is-sales::before { background: var(--pa-orange); }
.prv-pay-owed-grid > tbody > tr > td.prv-pay-free { font-size: 1rem; font-weight: 700; color: var(--pa-ink); white-space: nowrap; }
.prv-pay-owed-grid > tbody > tr.is-covered > td.prv-pay-free { font-weight: 400; color: var(--pa-muted); }
.prv-pay-row-action { text-align: right; white-space: nowrap; }
.prv-pay-row-action .prv-cell-sub { max-width: 12rem; margin-left: auto; white-space: normal; }
/* ---- The payout track ---- */
.prv-pay-track-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 16px; margin: 0 0 16px; }
.prv-pay-track-row > .prv-pay-track { flex: 1 1 34rem; min-width: 0; }
.prv-pay-track { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.prv-pay-stop { position: relative; display: flex; min-width: 0; }
/* The rail between two stations: a chevron in the gap, pointing the way the money goes. */
.prv-pay-stop + .prv-pay-stop::before {
  content: ""; position: absolute; left: -12px; top: 50%; width: 8px; height: 12px; transform: translateY(-50%);
  background: var(--pa-hair-strong); clip-path: polygon(0 0, 100% 50%, 0 100%);
}
/* The explicit track and justify-content matter: MudBlazor's bare button rule centres content, and in a grid that
   centres the single auto track, so the station's words drifted to the middle. */
.prv-pay-station {
  --prv-pay-tone: var(--pa-hair-strong);
  font: inherit; display: grid; grid-template-columns: minmax(0, 1fr); justify-content: stretch; justify-items: start;
  align-content: start; gap: 3px; width: 100%; min-width: 0;
  padding: 13px 14px 12px; text-align: left; color: var(--pa-ink); cursor: pointer;
  background: var(--pa-card-tint); border: 1px solid var(--pa-hair); border-radius: var(--pa-radius-sm);
  box-shadow: inset 0 3px 0 var(--prv-pay-tone);
  transition: background var(--pa-dur-fast) ease, border-color var(--pa-dur-fast) ease;
}
.prv-pay-station.prv-pay-station.is-approved { --prv-pay-tone: var(--pa-orange); }
.prv-pay-station.prv-pay-station.is-paid { --prv-pay-tone: var(--pa-teal); }
.prv-pay-station:hover { background: var(--pa-row-hover); border-color: var(--pa-orange-deep); }
.prv-pay-station:focus-visible { outline: none; box-shadow: inset 0 3px 0 var(--prv-pay-tone), var(--pa-focus-ring); }
.prv-pay-station-name { font-size: .66rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--pa-muted); }
.prv-pay-station-figure { max-width: 100%; font-size: 1.6rem; font-weight: 600; line-height: 1.15; color: inherit; overflow-wrap: anywhere; }
.prv-pay-station-meta { font-size: .76rem; line-height: 1.35; color: var(--pa-muted); }
.prv-pay-station-meta strong { font-weight: 700; color: var(--pa-ink); }
/* The station you are on: the invariant dark fill with its state still on the top edge. */
.prv-pay-station[aria-pressed="true"] {
  color: var(--pa-sidebar-text-bright); background: var(--pa-sidebar); border-color: var(--pa-sidebar);
  box-shadow: inset 0 3px 0 var(--prv-pay-tone), inset 0 0 0 1px var(--pa-selected-ring);
}
.prv-pay-station[aria-pressed="true"]:focus-visible { box-shadow: inset 0 3px 0 var(--prv-pay-tone), var(--pa-focus-ring); }
.prv-pay-station[aria-pressed="true"] :is(.prv-pay-station-name, .prv-pay-station-meta) { color: var(--pa-sidebar-text); }
.prv-pay-station[aria-pressed="true"] .prv-pay-station-meta strong { color: var(--pa-sidebar-text-bright); }
.prv-pay-voided {
  font: inherit; display: inline-flex; align-items: center; justify-content: flex-start; gap: 6px; padding: 5px 12px;
  font-size: .78rem; font-weight: 600; color: var(--pa-muted); cursor: pointer;
  background: transparent; border: 1px dashed var(--pa-hair-strong); border-radius: 999px;
}
.prv-pay-voided:hover { color: var(--pa-ink); border-color: var(--pa-orange-deep); }
.prv-pay-voided:focus-visible { outline: none; box-shadow: var(--pa-focus-ring); }
.prv-pay-voided[aria-pressed="true"] { color: var(--pa-ink); border-style: solid; background: var(--pa-card-tint); }
/* ---- The payouts on the chosen station ---- */
.prv-pay-number { font-size: .8rem; font-weight: 700; color: var(--pa-ink); white-space: nowrap; }
.prv-pay-list > tbody > tr > td.prv-pay-amount { font-size: .94rem; font-weight: 700; color: var(--pa-ink); white-space: nowrap; }
.prv-pay-list > tbody > tr > td.prv-pay-progress { min-width: 12rem; color: var(--pa-muted); overflow-wrap: anywhere; }
.prv-pay-actions { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.pa-btn.prv-pay-statement { text-decoration: none; }
/* The payout a dialog just worked on: the orange edge down its first cell. */
.prv-pay-list > tbody > tr.is-recent > td { background: color-mix(in srgb, var(--pa-orange-tint) 55%, var(--pa-card)); }
.prv-pay-list > tbody > tr.is-recent > td:first-child { box-shadow: inset 3px 0 0 var(--pa-orange); }
.prv-pay-cap { margin: 8px 0 0; }
/* ---- Deposit checks on the board ---- */
.prv-pay-deposit-figure { margin: 0 0 10px; }
.prv-pay-blocked-note { margin: 0 0 10px; padding-left: 10px; border-left: 2px solid var(--pa-warn-border); font-size: .78rem; line-height: 1.45; color: var(--pa-warn-fg); }
.prv-pay-checks { list-style: none; margin: 0; padding: 0; display: grid; border: 1px solid var(--pa-hair); border-radius: var(--pa-radius-sm); overflow: hidden; }
.prv-pay-check { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 4px 14px; padding: 10px 14px; background: var(--pa-card); }
.prv-pay-check + .prv-pay-check { border-top: 1px solid var(--pa-hair); }
.prv-pay-check.is-blocked { background: color-mix(in srgb, var(--pa-warn-bg) 35%, var(--pa-card)); box-shadow: inset 3px 0 0 var(--pa-warn-border); }
.prv-pay-check .pa-pill { white-space: nowrap; }
.prv-pay-check-what { display: grid; gap: 2px; min-width: 0; }
.prv-pay-check-line { font-size: .86rem; overflow-wrap: anywhere; }
.prv-pay-check-amount { font-size: .94rem; font-weight: 700; color: var(--pa-ink); white-space: nowrap; }
.prv-pay-more { margin: 8px 0 0; }
/* ---- The payout sheet ---- */
.prv-pay-sheet-hero-side { display: flex; align-items: flex-start; gap: 10px; flex: 0 0 auto; }
.prv-pay-sheet-hero-side .pa-pill { margin-top: 4px; white-space: nowrap; }
.prv-pay-sheet-facts .is-wide { grid-column: 1 / -1; }
.prv-pay-sheet > tbody > tr > td.prv-pay-line-free { font-weight: 600; color: var(--pa-ink); }
.prv-pay-sheet > tbody > tr > td.prv-pay-line-amount { min-width: 9.5rem; }
.prv-pay-sheet > tbody > tr.has-error > td { background: color-mix(in srgb, var(--pa-bad-bg) 35%, var(--pa-card)); }
.prv-pay-line-input { display: block; width: 100%; max-width: 9rem; margin-left: auto; padding: 6px 8px; text-align: right; }
.prv-pay-line-amount .pa-error { max-width: 17rem; margin-left: auto; text-align: right; white-space: normal; }
.prv-pay-line-amount > .pa-num { font-size: .92rem; font-weight: 700; color: var(--pa-ink); white-space: nowrap; }
.prv-pay-line-flag { display: inline-block; margin-top: 4px; }
.prv-pay-line-tools { width: 1%; text-align: right; }
.prv-pay-sheet > tfoot > tr > :is(th, td) {
  padding: 11px var(--pa-grid-cell-x) 13px; font-size: .82rem; font-weight: 700; color: var(--pa-ink);
  background: var(--pa-card-tint); border-top: 1px dashed var(--pa-hair-strong);
}
.prv-pay-sheet > tfoot > tr > th { text-align: left; }
.prv-pay-sheet-count { margin-left: 6px; font-weight: 400; color: var(--pa-muted); }
/* The accountant's double rule under a total: the sum is struck and closed. */
.prv-pay-total { display: inline-block; padding-bottom: 2px; font-size: 1.1rem; font-weight: 700; line-height: 1.2; color: var(--pa-ink); border-bottom: 3px double var(--pa-ink); }
.prv-pay-candidates {
  display: grid; gap: 8px; padding: 12px 14px;
  border: 1px dashed var(--pa-hair-strong); border-radius: var(--pa-radius-sm);
  background: color-mix(in srgb, var(--pa-card-tint) 70%, transparent);
}
.prv-pay-candidates-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: .78rem; }
.prv-pay-candidates-head .pa-kpi-label { margin: 0; }
.prv-pay-candidates ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.prv-pay-candidates li {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; padding: 8px 10px;
  background: var(--pa-card); border: 1px solid var(--pa-hair); border-radius: var(--pa-radius-sm);
}
.prv-pay-candidate-what { display: grid; gap: 2px; min-width: 0; font-size: .86rem; color: var(--pa-ink); overflow-wrap: anywhere; }
.prv-pay-void {
  display: grid; gap: 8px; padding: 12px 14px;
  border: 1px solid var(--pa-bad-border); border-left: 3px solid var(--pa-bad-fg);
  border-radius: 0 var(--pa-radius-sm) var(--pa-radius-sm) 0; background: color-mix(in srgb, var(--pa-bad-bg) 45%, var(--pa-card));
}
.prv-pay-void .pa-field { margin: 0; }
.prv-pay-void .prv-discard-actions { margin-top: 0; }
.prv-pay-sheet-foot .prv-pay-void-open { margin-right: auto; color: var(--pa-bad-fg); }
/* ---- The remittance stub (mark paid): who, how much, how it went; the perforated edge along its top ---- */
.prv-pay-stub {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px 20px;
  padding: 16px 18px 14px; background: var(--pa-card-tint);
  border: 1px solid var(--pa-hair); border-top: 2px dashed var(--pa-hair-strong); border-radius: 0 0 var(--pa-radius-sm) var(--pa-radius-sm);
}
.prv-pay-stub-to, .prv-pay-stub-amount { display: grid; gap: 2px; min-width: 0; }
.prv-pay-stub-payee { font-size: 1.06rem; color: var(--pa-ink); overflow-wrap: anywhere; }
.prv-pay-stub-amount { justify-items: end; text-align: right; }
.prv-pay-stub-amount strong { font-size: 1.95rem; font-weight: 600; line-height: 1.05; color: var(--pa-ink); }
.prv-pay-stub-memo {
  grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; padding-top: 8px;
  border-top: 1px solid var(--pa-hair); font-size: .84rem; color: var(--pa-ink); overflow-wrap: anywhere;
}
.prv-pay-stub-memo .pa-kpi-label { margin: 0; }
/* ---- The deposit slip ---- */
.prv-pay-slip { display: grid; border: 1px solid var(--pa-hair); border-radius: var(--pa-radius-sm); background: var(--pa-card); overflow: hidden; }
.prv-pay-slip-head {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; padding: 8px 14px;
  background: var(--pa-card-tint); border-bottom: 1px dashed var(--pa-hair-strong);
}
.prv-pay-slip-all { font-size: .8rem; }
.prv-pay-slip-caption { font-size: .72rem; color: var(--pa-muted); }
.prv-pay-slip-lines { list-style: none; margin: 0; padding: 0; max-height: 22rem; overflow-y: auto; }
.prv-pay-slip-line { display: grid; padding: 0 14px; border-bottom: 1px solid var(--pa-hair); }
.prv-pay-slip-pick { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; padding: 10px 0; cursor: pointer; }
.prv-pay-slip-pick input { width: 16px; height: 16px; margin: 0; accent-color: var(--pa-teal); }
.prv-pay-slip-what { display: grid; gap: 2px; min-width: 0; font-size: .86rem; color: var(--pa-ink); overflow-wrap: anywhere; }
.prv-pay-slip-amount { font-size: .94rem; font-weight: 700; color: var(--pa-ink); white-space: nowrap; }
.prv-pay-slip-line.is-ticked { background: color-mix(in srgb, var(--pa-teal) 8%, var(--pa-card)); box-shadow: inset 3px 0 0 var(--pa-teal); }
.prv-pay-slip-line.is-blocked .prv-pay-slip-pick { cursor: not-allowed; }
.prv-pay-slip-line.is-blocked :is(.prv-pay-slip-what, .prv-pay-slip-amount) { color: var(--pa-muted); }
.prv-pay-slip-blocked { margin: -4px 0 10px 28px; font-size: .76rem; line-height: 1.4; color: var(--pa-warn-fg); }
.prv-pay-slip-total { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: baseline; gap: 4px 14px; padding: 12px 14px 14px; background: var(--pa-card-tint); }
.prv-pay-slip-count { font-size: .8rem; color: var(--pa-muted); }
.prv-pay-slip-total .pa-kpi-label { margin: 0; }
.prv-pay-slip-total .prv-pay-total { font-size: 1.5rem; font-weight: 600; }
/* ---- Phone: the track stands up (each station one row, its dollars on the right, the chevron pointing down), the
   stub and the slip's total stack, a blocked check's pill drops under it ---- */
@media (max-width: 600px) {
  .prv-pay { gap: 16px; }
  .prv-pay-head-note { text-align: left; }
  .prv-pay-track { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .prv-pay-stop + .prv-pay-stop::before { left: 50%; top: -11px; width: 8px; height: 10px; transform: translateX(-50%) rotate(90deg); }
  .prv-pay-station { grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 12px; padding: 11px 12px 10px; }
  .prv-pay-station-name { grid-column: 1; grid-row: 1; }
  .prv-pay-station-meta { grid-column: 1; grid-row: 2; }
  .prv-pay-station-figure { grid-column: 2; grid-row: 1 / 3; font-size: 1.3rem; text-align: right; }
  .prv-pay-check { grid-template-columns: minmax(0, 1fr) auto; }
  .prv-pay-check .pa-pill { grid-column: 1; grid-row: 2; justify-self: start; }
  .prv-pay-stub { grid-template-columns: minmax(0, 1fr); }
  .prv-pay-stub-amount { justify-items: start; text-align: left; }
  .prv-pay-slip-total { grid-template-columns: minmax(0, 1fr) auto; }
  .prv-pay-slip-count { grid-column: 1 / -1; }
  .prv-pay-slip-blocked { margin-left: 0; }
  /* Who we owe and the payout list stack on a phone, so the figure that matters and the action stay on screen: each row
     a small ruled card, the header row kept for screen readers, each figure labelled from its column. */
  .pa-grid.pa-data-grid.prv-pay-stack, .pa-grid.pa-data-grid.prv-pay-stack > tbody { display: block; width: 100%; }
  .pa-grid.pa-data-grid.prv-pay-stack > thead {
    position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
  }
  .pa-grid.pa-data-grid.prv-pay-stack > tbody > tr {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 10px; padding: 12px;
    border-bottom: 1px solid var(--pa-hair);
  }
  .pa-grid.pa-data-grid.prv-pay-stack > tbody > tr:last-child { border-bottom: 0; }
  .pa-grid.pa-data-grid.prv-pay-stack > tbody > tr > td { display: block; min-width: 0; padding: 0; border: 0; text-align: left; }
  .pa-grid.pa-data-grid.prv-pay-stack > tbody > tr > td[data-label]::before {
    content: attr(data-label); display: block; margin-bottom: 1px;
    font-size: .6rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--pa-muted);
  }
  .pa-grid.prv-pay-owed-grid > tbody > tr > td:nth-child(1) { grid-column: 1 / 3; grid-row: 1; }
  .pa-grid.prv-pay-owed-grid > tbody > tr > td:nth-child(5) { grid-column: 3; grid-row: 1; text-align: right; }
  .pa-grid.prv-pay-owed-grid > tbody > tr > td:nth-child(2) { grid-column: 1; grid-row: 2; }
  .pa-grid.prv-pay-owed-grid > tbody > tr > td:nth-child(3) { grid-column: 2; grid-row: 2; }
  .pa-grid.prv-pay-owed-grid > tbody > tr > td:nth-child(4) { grid-column: 3; grid-row: 2; text-align: right; }
  .pa-grid.prv-pay-owed-grid > tbody > tr > td:nth-child(6) {
    grid-column: 1 / -1; grid-row: 3; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; white-space: normal;
  }
  .pa-grid.prv-pay-owed-grid .prv-pay-row-action .prv-cell-sub { max-width: none; margin: 0; }
  .pa-grid.prv-pay-list > tbody > tr > td:nth-child(1) { grid-column: 1 / 3; grid-row: 1; }
  .pa-grid.prv-pay-list > tbody > tr > td:nth-child(4) { grid-column: 3; grid-row: 1; text-align: right; }
  .pa-grid.prv-pay-list > tbody > tr > td:nth-child(2) { grid-column: 1 / 3; grid-row: 2; }
  .pa-grid.prv-pay-list > tbody > tr > td:nth-child(3) { grid-column: 3; grid-row: 2; text-align: right; }
  .pa-grid.prv-pay-list > tbody > tr > td:nth-child(5) { grid-column: 1 / -1; grid-row: 3; min-width: 0; }
  .pa-grid.prv-pay-list > tbody > tr > td:nth-child(6) { grid-column: 1 / -1; grid-row: 4; }
  .pa-grid.prv-pay-list .prv-pay-actions { justify-content: flex-start; }
  /* The payout sheet: the case and its Remove on top, held and free under, the amount across; placed by cell class,
     since a salesperson's sheet adds a Shop column. The total closes the stack on one row. The hero's status pill moves
     under the title, where the side has no room for it. */
  .pa-grid.prv-pay-sheet > tfoot { display: block; width: 100%; }
  .pa-grid.pa-data-grid.prv-pay-sheet > tbody > tr { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
  .pa-grid.prv-pay-sheet > tbody > tr > td.prv-pay-line-case { grid-column: 1 / 3; grid-row: 1; }
  .pa-grid.prv-pay-sheet > tbody > tr > td.prv-pay-line-tools { grid-column: 3; grid-row: 1; width: auto; text-align: right; }
  .pa-grid.prv-pay-sheet > tbody > tr > td.prv-pay-line-shop { grid-column: 1 / -1; }
  .pa-grid.prv-pay-sheet > tbody > tr > td.prv-pay-line-held { grid-column: 1; }
  .pa-grid.prv-pay-sheet > tbody > tr > td.prv-pay-line-free { grid-column: 2 / -1; }
  .pa-grid.prv-pay-sheet > tbody > tr > td.prv-pay-line-amount { grid-column: 1 / -1; min-width: 0; }
  .pa-grid.prv-pay-sheet .prv-pay-line-input { max-width: none; margin-left: 0; text-align: left; }
  .pa-grid.prv-pay-sheet .prv-pay-line-amount .pa-error { max-width: none; margin-left: 0; text-align: left; }
  .pa-grid.prv-pay-sheet > tfoot > tr {
    display: flex; align-items: baseline; justify-content: space-between; gap: 8px 12px;
    background: var(--pa-card-tint); border-top: 1px dashed var(--pa-hair-strong);
  }
  .pa-grid.prv-pay-sheet > tfoot > tr > :is(th, td) { display: block; padding: 11px 12px 13px; border-top: 0; background: transparent; }
  .pa-grid.prv-pay-sheet > tfoot > tr > td:empty { display: none; }
  .prv-pay-sheet-hero-side .pa-pill { display: none; }
  .pa-pill.pa-pill.prv-pay-sheet-status-narrow { display: inline-flex; margin: 6px 0 2px; }
}
/* The narrow status pill shows only on a phone (above). */
.pa-pill.prv-pay-sheet-status-narrow { display: none; }
@media (prefers-reduced-motion: reduce) {
  .prv-pay-station { transition: none; }
}
/* ============================================================
   Mail, unfiled (review M-1 and M-2): the "Held for a person" slip on the desk's mail health card. Email ProRecovery
   gave up filing sits first under the head, on a warn-tinted slip whose dashed top edge is the tear line of a held-mail
   notice: the count in the display face, then one ledger line per email, where to look in Outlook (folder, received
   time) on the left with why in plain words under it, and "Mark reviewed" on the right. While any is held, the card's
   airmail edge and lamp take the warn tone, unless the sync is failing, which keeps its own. Layout only; colour from
   tokens and color-mix.
   ============================================================ */
.prv-mailhealth.prv-mailhealth.has-unfiled:not(.is-failing) { --prv-mh-tone: var(--pa-warn-border); }
.prv-mailhealth-held {
  margin: 14px 20px 0; padding: 12px 16px 2px;
  border: 1px solid var(--pa-warn-border); border-top-style: dashed; border-radius: var(--pa-radius-sm);
  background: color-mix(in srgb, var(--pa-warn-bg) 70%, var(--pa-card));
}
.prv-mailhealth-held-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; }
.prv-mailhealth-held-head .pa-kpi-label { flex: 1 0 100%; margin: 0; color: var(--pa-warn-fg); }
.prv-mailhealth-held-title { margin: 0; font-size: 1.08rem; font-weight: 600; line-height: 1.25; color: var(--pa-ink); }
.prv-mailhealth-held-shown { font-size: .78rem; color: var(--pa-muted); }
.prv-mailhealth-held-list { list-style: none; margin: 8px 0 0; padding: 0; }
.prv-mailhealth-held-item {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px 14px;
  padding: 10px 0 11px;
  border-top: 1px solid color-mix(in srgb, var(--pa-warn-border) 45%, transparent);
}
.prv-mailhealth-held-where { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; min-width: 0; }
.prv-mailhealth-held-folder {
  font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--pa-ink);
}
.prv-mailhealth-held-when { font-size: .9rem; font-weight: 600; color: var(--pa-ink); }
.prv-mailhealth-held-why {
  grid-column: 1; margin: 0; font-size: .8rem; line-height: 1.45; color: var(--pa-muted); overflow-wrap: anywhere;
}
.pa-btn.prv-mailhealth-held-review { grid-column: 2; grid-row: 1 / span 2; white-space: nowrap; }
.pa-error.prv-mailhealth-held-error { grid-column: 1 / -1; margin: 4px 0 0; }
@media (max-width: 720px) {
  .prv-mailhealth-held { margin: 12px 16px 0; padding: 12px 14px 2px; }
  .prv-mailhealth-held-item { grid-template-columns: minmax(0, 1fr); }
  .pa-btn.prv-mailhealth-held-review { grid-column: 1; grid-row: auto; justify-self: start; margin-top: 6px; }
}
/* ============================================================
   No next step (spec 2: nothing falls through), and overdue flags on the desk. An open claim with no next action date
   and no open flag is stranded: no queue brings it back. Its queue count, its row mark and the next-action rule on its
   case page take the danger tone, the colour of an overdue next action; on the case page the orange rule turns to the
   danger edge over a danger-washed ground. An open flag past its due date leads the row's flag tags in the same tone,
   with how many. A zero stays quiet (is-empty wins on specificity). Layout only; colour from tokens and color-mix.
   ============================================================ */
.prv-queue[aria-pressed="false"].is-nostep .prv-queue-count { color: var(--pa-bad-fg); background: var(--pa-bad-bg); border-color: var(--pa-bad-border); }
.prv-row-flag.prv-row-flag.is-overdue { color: var(--pa-bad-fg); }
/* ============================================================
   From ProEstimate (phase 9 task 12): the desk tab of ProEstimate files nominated for recovery, and the intake
   dialog's read-only strip of the nominated file's facts. ProEstimate's figures carry a teal edge, the mark of a value
   ProRecovery did not write. Layout only. Colour from tokens; type from pa-num and pa-mono.
   ============================================================ */
.prv-nominations { min-width: 0; }
.prv-nominations .pa-data-grid > tbody > tr > td { vertical-align: top; }
.pa-grid.prv-nominations-grid th.prv-num { text-align: right; }
.prv-nomination-shop { font-weight: 600; color: var(--pa-ink); overflow-wrap: anywhere; }
.prv-nominations-grid td.prv-nomination-written { white-space: nowrap; box-shadow: inset 2px 0 0 color-mix(in srgb, var(--pa-teal) 60%, transparent); }
.prv-nomination-note { max-width: 22rem; font-style: italic; }
.prv-nominations .prv-inbox-flags { margin-top: 4px; }
.prv-nominations .pa-pill { white-space: nowrap; }
/* The intake's "linked later" notice: the sentence, the server's reason, then the way to the case, stacked. */
.pa-callout.prv-intake-link-failed { flex-direction: column; gap: 6px; }
.pa-callout.prv-intake-link-failed .prv-discard-actions { margin-top: 2px; }
.prv-nomination-facts {
  display: grid; gap: 10px; min-width: 0; padding: 12px 14px 12px 16px;
  background: var(--pa-card-tint); border: 1px solid var(--pa-hair); border-radius: var(--pa-radius-sm);
  box-shadow: inset 3px 0 0 var(--pa-teal);
}
.prv-nomination-facts-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.prv-nomination-facts-head .pa-kpi-label { margin: 0; color: var(--pa-teal-deep); }
.prv-nomination-facts .prv-identity { grid-template-columns: repeat(auto-fill, minmax(min(100%, 9.5rem), 1fr)); }