/* "สรุปยอดรายวัน", the all-accounts page's second view (lean-rollout ticket 242). Every colour,
   size, radius, weight and duration below is a token from finance_app/static/tokens.css; this
   sheet defines none of its own and holds no literal but the 1px hairline the rest of the app uses.

   Everything is scoped to the two tabs (`.ad-view-tab`), `#accounts-view-days` or an `ad-` class
   this view owns. The dialogs borrow the shell's `.app-modal` family (page-accounts-settings.css)
   and override only what this view needs.

   One thing leads: the company's total difference at the display step. The accounts table changes
   shape by the width of its own region, not of the window, because the sidebar still takes width
   at 1024; below it each account is one block with its six terms in two columns. */

/* --- the page's two views ------------------------------------------------------------------- */
.ad-views{margin:calc(var(--space-8) * -1) 0 var(--space-24)}   /* TICKET UX-PR (F06): the look is app.css's `.app-tabs` / `.app-tab` */
#accounts-view-days{container:ad-view / inline-size}

/* --- the heading, the day, the freshness and the notice ---------------------------------------- */
.ad-head{margin:0 0 var(--space-16)}
.ad-title{margin:0 0 var(--space-4);font-size:var(--text-xl)}
.ad-title:focus{outline:none}
.ad-lede{margin:0;font-size:var(--text-sm)}
.ad-toolbar{display:flex;align-items:flex-end;flex-wrap:wrap;gap:var(--space-12);margin:0 0 var(--space-8)}
.ad-step{display:inline-flex;align-items:center;gap:var(--space-6)}
.ad-step-next{flex-direction:row-reverse}
.ad-day-field{flex:0 0 auto;display:flex;flex-direction:column;gap:var(--space-6);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--color-text-secondary)}
.ad-day-field input{inline-size:calc(var(--size-150) + var(--size-64));min-inline-size:0;font-size:var(--text-md);color:var(--color-text-primary)}
.ad-basis{margin:0 0 var(--space-16);max-width:none;font-size:var(--text-sm)}
.ad-freshness{margin:0 0 var(--space-12);font-size:var(--text-sm);color:var(--color-text-secondary)}
.ad-freshness[data-state=error],.ad-freshness[data-state=stale]{color:var(--color-feedback-error-text)}
#account-days-retry{margin:0 0 var(--space-16)}
.ad-notice{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-8) var(--space-16);margin:0 0 var(--space-20);
  padding:var(--space-12) var(--space-16);border:1px solid var(--color-border-default);border-radius:var(--radius-card);
  background:var(--color-surface-sunken);color:var(--color-text-primary)}
.ad-notice p{flex:1 1 var(--size-280);margin:0;max-width:none;color:inherit;font-size:var(--text-sm)}
.ad-notice[data-tone=success]{background:var(--color-feedback-success-bg);border-color:var(--color-feedback-success-bg);color:var(--color-feedback-success-text)}
.ad-notice[data-tone=error]{background:var(--color-feedback-error-bg);border-color:var(--color-border-danger);color:var(--color-feedback-error-text)}
.ad-notice button{min-height:var(--size-36);font-size:var(--text-sm)}
.ad-notice-close{color:var(--color-text-primary);background:var(--color-surface-card)}

/* --- the company: the difference leads, then the equation, the states and the types -------------- */
.ad-hero{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-20);margin:0 0 var(--space-20);padding:var(--space-24);background:var(--color-surface-card);
  border:1px solid var(--color-border-default);border-radius:var(--radius-card-lg);box-shadow:var(--shadow-sm)}
.ad-lead-label{margin:0;font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--color-text-secondary)}
.ad-lead-figure{display:flex;align-items:baseline;flex-wrap:wrap;gap:var(--space-4) var(--space-10);margin:var(--space-4) 0 0;max-width:none;color:var(--color-text-primary)}
.ad-lead-amount{font-size:var(--text-display);font-weight:var(--weight-semibold);line-height:var(--leading-snug);letter-spacing:-0.02em;
  font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.ad-lead-none{font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-unit{font-size:var(--text-md);color:var(--color-text-secondary)}
.ad-lead-note{margin:var(--space-4) 0 0;font-size:var(--text-sm)}
.ad-equation{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--space-16);margin:0;padding-block-start:var(--space-16);
  border-block-start:1px solid var(--color-border-subtle)}
.ad-term{display:grid;align-content:start;gap:var(--space-4);min-inline-size:0}
.ad-term dt{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-term dd{display:flex;align-items:baseline;flex-wrap:wrap;gap:var(--space-2) var(--space-6);margin:0}
.ad-sign{font-size:var(--text-md);color:var(--color-text-secondary)}
.ad-term-amount{font-size:var(--text-lg);font-weight:var(--weight-semibold);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;color:var(--color-text-primary)}
.ad-term-count{flex:1 1 100%;font-size:var(--text-xs);color:var(--color-text-secondary)}
.ad-states{display:flex;flex-wrap:wrap;gap:var(--space-8) var(--space-16);margin:0;padding:0;list-style:none}
.ad-states li{display:inline-flex;align-items:center;gap:var(--space-6)}
.ad-state-count{font-weight:var(--weight-semibold);font-variant-numeric:tabular-nums;color:var(--color-text-primary)}
/* app.css gives every table a 680 minimum so a `.table-scroll` scrolls; these two shape themselves instead. */
.ad-types{inline-size:100%;min-inline-size:0;border-collapse:collapse;font-size:var(--text-sm)}
.ad-types caption{margin:0 0 var(--space-6);padding:0;text-align:start;font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--color-text-secondary)}
.ad-types :is(th,td){padding:var(--space-8) var(--space-10);text-align:start;border-block-end:1px solid var(--color-border-subtle)}
.ad-types thead th{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--color-text-secondary);background:var(--color-surface-sunken)}
/* A row's own header names it; it does not wear the column headers' sunken fill (app.css `th`). */
.ad-types tbody th{font-weight:var(--weight-medium);background:transparent}
.ad-types .number{text-align:end;font-variant-numeric:tabular-nums;white-space:nowrap}
.ad-uncounted{display:flex;align-items:flex-start;gap:var(--space-8);margin:0 0 var(--space-20);max-width:none;padding:var(--space-12) var(--space-14);
  border:1px solid var(--color-border-lead);border-radius:var(--radius-control);background:var(--color-feedback-hold-bg);
  color:var(--color-feedback-hold-text);font-size:var(--text-sm)}
.ad-uncounted .icon{flex:0 0 auto;margin-block-start:var(--space-2)}

/* --- the accounts: a table, one block per account in a narrow region ------------------------------ */
.ad-list-title{margin:0 0 var(--space-12);font-size:var(--text-md)}
.ad-empty{padding:var(--space-32) var(--space-16);text-align:center;max-width:none;background:var(--color-surface-card);
  border:1px solid var(--color-border-default);border-radius:var(--radius-card)}
.ad-table-wrap{container:ad-table / inline-size;max-inline-size:100%;overflow-x:auto;background:var(--color-surface-card);
  border:1px solid var(--color-border-default);border-radius:var(--radius-card)}
.ad-table{inline-size:100%;min-inline-size:0;border-collapse:collapse}
.ad-table :is(th,td){padding:var(--space-12) var(--space-10);text-align:start;vertical-align:top;border-block-end:1px solid var(--color-border-subtle);font-size:var(--text-sm)}
.ad-table thead th{padding-block:var(--space-10);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--color-text-secondary);
  background:var(--color-surface-sunken);white-space:nowrap}
.ad-table .number{text-align:end;font-variant-numeric:tabular-nums}
.ad-table tbody:last-child tr:last-child>*{border-block-end:0}
.ad-who{background:transparent;font-weight:var(--weight-regular);min-inline-size:calc(var(--size-150) + var(--size-64))}
.ad-identity{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-6);min-inline-size:0}
.ad-identity .bank-account{min-inline-size:0}
.ad-identity .bank-icon{min-inline-size:var(--size-36);block-size:var(--size-36);font-size:var(--text-sm)}
.ad-marks{display:flex;flex-wrap:wrap;gap:var(--space-4) var(--space-6)}
.ad-cell-label{display:none}
.ad-figure{display:block;font-weight:var(--weight-semibold);color:var(--color-text-primary);white-space:nowrap}
.ad-none{display:block;color:var(--color-text-secondary)}
.ad-cell-note{display:block;margin-block-start:var(--space-2);font-size:var(--text-xs);line-height:var(--leading-normal);color:var(--color-text-secondary);white-space:normal}
.ad-cell[data-term=out][data-uncounted]:not([data-uncounted="0"]) .ad-cell-note{color:var(--color-feedback-hold-text);font-weight:var(--weight-semibold);white-space:nowrap}
.ad-cell[data-term=difference] .ad-figure{font-size:var(--text-md)}
tbody[data-state=differs] .ad-cell[data-term=difference] .ad-figure{color:var(--color-feedback-error-text)}
.ad-state .badge{white-space:nowrap}
.ad-toggle-cell{text-align:end}
.ad-toggle{display:inline-flex;align-items:center;gap:var(--space-6);min-height:var(--size-36);padding-inline:var(--space-10);font-size:var(--text-sm);font-weight:var(--weight-medium)}
.ad-toggle .icon{transition:transform var(--duration-fast) var(--ease-standard)}
.ad-toggle[aria-expanded=true] .icon{transform:rotate(180deg)}
.ad-actions-head{inline-size:var(--size-48)}
.ad-detail-cell{background:var(--color-surface-sunken)}
.ad-detail{display:grid;gap:var(--space-16)}
.ad-actions{display:flex;flex-wrap:wrap;gap:var(--space-8)}
.ad-actions button{display:inline-flex;align-items:center;gap:var(--space-6);min-height:var(--size-40);font-size:var(--text-sm)}
.ad-sources{display:grid;grid-template-columns:repeat(auto-fit,minmax(calc(var(--size-150) + var(--size-72)),1fr));gap:var(--space-16)}
.ad-source{display:grid;align-content:start;gap:var(--space-8);min-inline-size:0;padding:var(--space-12) var(--space-14);
  background:var(--color-surface-card);border:1px solid var(--color-border-default);border-radius:var(--radius-control)}
.ad-source h4{margin:0;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-help{margin:0;max-width:none;font-size:var(--text-sm);color:var(--color-text-secondary)}
.ad-warning{color:var(--color-feedback-hold-text)}
.ad-entries{display:grid;gap:var(--space-8);margin:0;padding:0;list-style:none}
.ad-entry{display:grid;gap:var(--space-4);padding-block-start:var(--space-8);border-block-start:1px solid var(--color-border-subtle);font-size:var(--text-sm)}
.ad-entry-text{color:var(--color-text-primary);overflow-wrap:anywhere}
.ad-note{white-space:pre-wrap}
.ad-entry-by,.ad-entry-void{font-size:var(--text-xs);color:var(--color-text-secondary);overflow-wrap:anywhere}
.ad-entry[data-in-force=false] .ad-entry-text{text-decoration:line-through;color:var(--color-text-secondary)}
.ad-entry-void{color:var(--color-badge-failed-text)}
.ad-entry-actions{display:flex;flex-wrap:wrap;gap:var(--space-8)}
.ad-small-button{display:inline-flex;align-items:center;gap:var(--space-6);min-height:var(--size-36);padding-inline:var(--space-10);font-size:var(--text-sm)}
@container ad-table (max-width: 879px){
  .ad-table,.ad-table tbody{display:block}
  .ad-table thead{display:none}
  .ad-table tbody{border-block-end:1px solid var(--color-border-default)}
  .ad-table tbody:last-child{border-block-end:0}
  .ad-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-12) var(--space-16);padding:var(--space-16)}
  .ad-table .ad-row>:is(th,td){display:block;padding:0;border:0;text-align:start}
  .ad-row>.ad-who{grid-column:1 / -1;min-inline-size:0}
  .ad-row>.ad-state{grid-column:1 / -1;grid-row:2}
  .ad-row>.ad-toggle-cell{grid-column:1 / -1;text-align:start}
  .ad-row>.ad-history-day{grid-column:1 / -1}
  .ad-cell-label{display:block;font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--color-text-caption)}
  .ad-figure{white-space:normal;overflow-wrap:anywhere}
  .ad-toggle{inline-size:100%;justify-content:center;min-height:var(--size-44)}
  .ad-detail-row{display:block}
  .ad-detail-row>td{display:block;padding:var(--space-16);border:0}
  .ad-actions button{flex:1 1 100%;justify-content:center;min-height:var(--size-44)}
  .ad-small-button{min-height:var(--size-44)}
}
@container ad-view (max-width: 719px){
  .ad-equation{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ad-term[data-term=opening]{grid-column:1 / -1}
  .ad-lead-amount{font-size:var(--text-display-sm)}
  .ad-hero{padding:var(--space-20)}
}
/* A phone: the type table keeps the type, its accounts and its difference; the company's own in and
   out are on the equation above it. */
@container ad-view (max-width: 479px){
  .ad-types [data-col=money]{display:none}
}

/* --- the dialogs ---------------------------------------------------------------------------------- */
.ad-dialog .app-modal-head h2:focus{outline:none}
.ad-dialog{inline-size:min(calc(var(--space-64)*9),calc(100vw - var(--space-32)))}
.ad-dialog-wide{inline-size:min(calc(var(--space-64)*14),calc(100vw - var(--space-32)))}
.ad-dialog .app-modal-body label{flex:0 0 auto}
.ad-dialog textarea{inline-size:100%;min-inline-size:0;font-size:var(--text-md);resize:vertical}
.ad-dialog .app-modal-body label :is(input,select,textarea)[aria-invalid=true]{border-color:var(--color-action-destructive)}
.ad-dialog input[type=file]{padding:var(--space-8);font-size:var(--text-sm)}
.ad-form-who{display:grid;gap:var(--space-6);padding:var(--space-12);background:var(--color-surface-page);border-radius:var(--radius-control)}
.ad-form-day{margin:0;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-form-fields{display:flex;flex-direction:column;gap:var(--space-16)}
.ad-field-name{display:flex;align-items:baseline;flex-wrap:wrap;gap:var(--space-8);color:var(--color-text-primary);font-weight:var(--weight-semibold)}
.ad-optional,.ad-hint{font-size:var(--text-xs);font-weight:var(--weight-regular);color:var(--color-text-secondary)}
.ad-direction{display:grid;gap:var(--space-8);margin:0;padding:0;border:0}
.ad-direction legend{margin:0 0 var(--space-6);padding:0;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-dialog .app-modal-body label.ad-radio{display:flex;flex-direction:row;align-items:center;gap:var(--space-10);min-height:var(--size-44);
  padding:var(--space-4) var(--space-12);border:1px solid var(--color-border-default);border-radius:var(--radius-control);
  font-size:var(--text-md);color:var(--color-text-primary);cursor:pointer}
.ad-dialog .app-modal-body label.ad-radio:hover{background:var(--color-action-ghost-hover)}
.ad-dialog .app-modal-body label.ad-radio:has(input:checked){border-color:var(--color-action-primary);background:var(--color-surface-selected)}
.ad-dialog .app-modal-body label.ad-radio input{flex:0 0 auto;inline-size:var(--size-24);min-height:var(--size-24);margin:0;accent-color:var(--color-action-primary)}
.ad-preview{display:flex;align-items:center;gap:var(--space-12);padding:var(--space-12);background:var(--color-surface-page);border-radius:var(--radius-control)}
.ad-thumb{inline-size:var(--size-72);block-size:var(--size-72);object-fit:cover;border:1px solid var(--color-border-default);border-radius:var(--radius-sm);background:var(--color-surface-card)}
.ad-upload{margin:0;font-size:var(--text-sm);color:var(--color-text-secondary)}
.ad-upload[data-state=ready]{color:var(--color-feedback-success-text)}
.ad-upload[data-state=refused]{color:var(--color-feedback-error-text)}
.ad-form-error{margin:0;padding:var(--space-10) var(--space-14);border-radius:var(--radius-control);background:var(--color-feedback-error-bg);
  color:var(--color-feedback-error-text);font-size:var(--text-sm);max-width:none}
.ad-void-what{margin:0;font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-image-frame{display:flex;justify-content:center;padding:var(--space-12);background:var(--color-surface-sunken);border-radius:var(--radius-control)}
.ad-image{max-inline-size:100%;max-block-size:calc(100vh - var(--space-64) * 5);object-fit:contain}
.ad-history-wrap{container:ad-history / inline-size;max-inline-size:100%;overflow-x:auto;border:1px solid var(--color-border-default);border-radius:var(--radius-card)}
.ad-history-day{white-space:nowrap;font-weight:var(--weight-medium);background:transparent}
/* The history has no account column, so it keeps its table down to a narrower region than the day's
   accounts; below that each day is one block, as an account is above. */
@container ad-history (max-width: 599px){
  .ad-history,.ad-history tbody{display:block}
  .ad-history thead{display:none}
  .ad-history .ad-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-12) var(--space-16);padding:var(--space-16);
    border-block-end:1px solid var(--color-border-subtle)}
  .ad-history .ad-row>:is(th,td){display:block;padding:0;border:0;text-align:start}
  .ad-history .ad-row>:is(.ad-history-day,.ad-state){grid-column:1 / -1}
  .ad-history .ad-cell-label{display:block;font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--color-text-caption)}
  .ad-history .ad-figure{white-space:normal;overflow-wrap:anywhere}
}

/* --- TICKET 243: the close panel and the report picker ------------------------------------------------
   The panel sits between the company's totals and the accounts. Its conditions are a numbered list,
   each with its mark in words and what it names; the closer's ticks use the app's `.check` row. */
.ad-close{display:grid;gap:var(--space-12);margin:0 0 var(--space-20);padding:var(--space-20);background:var(--color-surface-card);
  border:1px solid var(--color-border-default);border-radius:var(--radius-card-lg);box-shadow:var(--shadow-sm)}
.ad-close[data-state=closed]{border-color:var(--color-feedback-success-bg)}
.ad-close[data-state=changed_after_close]{border-color:var(--color-border-danger)}
.ad-close-head{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-8) var(--space-12)}
.ad-close-title{margin:0;font-size:var(--text-md)}
.ad-close-title:focus{outline:none}
.ad-close-who{margin:0;max-width:none;font-size:var(--text-sm);color:var(--color-text-primary);overflow-wrap:anywhere}
.ad-conditions{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:var(--space-10);margin:0;padding:0;list-style:none}
/* Each condition takes both columns of the list (subgrid), so every mark is as wide as the widest. */
.ad-condition{display:grid;grid-column:1 / -1;grid-template-columns:subgrid;align-items:start;gap:var(--space-8) var(--space-12);
  padding:var(--space-12) var(--space-14);background:var(--color-surface-page);border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-control)}
.ad-condition[data-pass=fail]{border-color:var(--color-border-danger)}
.ad-condition-mark{justify-self:start;white-space:nowrap}
.ad-condition-body{display:grid;gap:var(--space-6);min-inline-size:0}
.ad-condition-title{margin:0;max-width:none;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-condition-items{display:grid;gap:var(--space-4);margin:0;padding-inline-start:var(--space-20);font-size:var(--text-sm);
  color:var(--color-text-primary)}
.ad-condition-items li{overflow-wrap:anywhere}
.ad-condition-account{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-4) var(--space-10)}
.ad-condition-more{list-style:none;margin-inline-start:calc(var(--space-20) * -1);color:var(--color-text-secondary)}
.ad-condition-links{display:flex;flex-wrap:wrap;gap:var(--space-8)}
.ad-changes{display:grid;gap:var(--space-8)}
.ad-changes h4{margin:0;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-changes-table td,.ad-changes-table th{overflow-wrap:anywhere}
.ad-changes-scroll{max-inline-size:100%;overflow-x:auto}   /* TICKET UX-AF */
.ad-changes-scroll:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}
.ad-changes-table td:first-of-type{white-space:nowrap}
.ad-ticks{display:grid;gap:var(--space-10);margin:0;padding:var(--space-12) var(--space-14);border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-control)}
.ad-ticks legend{padding:0 var(--space-4);font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-ticks .check{flex-basis:auto;font-size:var(--text-sm);color:var(--color-text-primary)}
.ad-nofile-reason textarea{inline-size:100%;min-inline-size:0;font-size:var(--text-md);resize:vertical}
.ad-close-actions{display:flex;flex-wrap:wrap;gap:var(--space-10)}
.ad-close-actions button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-6)}
.ad-close .ad-form-error:focus{outline:none}
.ad-report-button{display:inline-flex;align-items:center;gap:var(--space-6);margin-inline-start:auto}
.ad-dialog select{inline-size:100%;min-inline-size:0;font-size:var(--text-md)}
.ad-dialog .app-modal-body label.ad-field{flex:0 0 auto}
#account-days-report-download{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-6)}
@container ad-view (max-width: 479px){
  .ad-conditions{grid-template-columns:minmax(0,1fr)}
  .ad-condition{grid-template-columns:minmax(0,1fr)}
  .ad-close-actions button{flex:1 1 100%;min-height:var(--size-44)}
  .ad-condition-links button{flex:1 1 100%;justify-content:center}
}

/* --- TICKET 248: "สมุดบัญชี", the ledger of one account and one day ----------------------------------------
   Opened from the account's own row (the quiet button under its name). The ledger is a table of its own
   region: time, entry, in, out, the balance after; each bank SMS a sunken row with the bank's balance and
   the comparison. Below 600 of its own width each line is one block, as the history's days are. */
.ad-ledger-open{margin-block-start:var(--space-8)}
.ad-ledger-marks{display:grid;gap:var(--space-8);margin:0;padding:var(--space-12) var(--space-14);list-style:none;
  border:1px solid var(--color-border-lead);border-radius:var(--radius-control);background:var(--color-feedback-hold-bg);
  color:var(--color-feedback-hold-text);font-size:var(--text-sm)}
.ad-ledger-marks li{display:flex;align-items:flex-start;gap:var(--space-8)}
.ad-ledger-marks .icon{flex:0 0 auto;margin-block-start:var(--space-2)}
.ad-ledger-mark-text{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-6)}
.ad-ledger-mark-text>span:first-child{font-weight:var(--weight-semibold)}
.ad-ledger-wrap{container:ad-ledger / inline-size;max-inline-size:100%;overflow-x:auto;border:1px solid var(--color-border-default);
  border-radius:var(--radius-card)}
.ad-ledger-time{white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--color-text-secondary)}
.ad-table .ad-ledger-entry{background:transparent;font-weight:var(--weight-regular);overflow-wrap:anywhere}
.ad-ledger-kind{display:block;font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-ledger-slip{font-weight:var(--weight-semibold)}
.ad-ledger-sms>*{background:var(--color-surface-sunken)}
.ad-table .ad-ledger-sms>.ad-ledger-entry{background:var(--color-surface-sunken)}
.ad-ledger-label{display:block;font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--color-text-secondary)}
.ad-ledger-bank .ad-cell-note{white-space:normal}
.ad-ledger-compare{margin-block-start:var(--space-6);height:auto;min-block-size:var(--space-20);white-space:normal;text-align:start}
.ad-ledger-lead{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:var(--space-8) var(--space-16)}
.ad-ledger-lead-text{display:grid;gap:var(--space-2)}
.ad-ledger-figure{display:flex;align-items:baseline;gap:var(--space-8);margin:0;font-size:var(--text-xxl);font-weight:var(--weight-semibold);
  line-height:var(--leading-snug);color:var(--color-text-primary);font-variant-numeric:tabular-nums}
.ad-ledger-nosms{flex:1 1 100%}
.ad-ledger-end{margin:0;max-width:none;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
@container ad-ledger (max-width: 599px){
  .ad-ledger,.ad-ledger tbody{display:block}
  .ad-ledger thead{display:none}
  .ad-ledger .ad-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-8) var(--space-16);padding:var(--space-12) var(--space-16);
    border-block-end:1px solid var(--color-border-subtle)}
  .ad-ledger .ad-row>:is(th,td){display:block;padding:0;border:0;text-align:start;background:transparent}
  .ad-ledger .ad-ledger-sms{background:var(--color-surface-sunken)}
  .ad-ledger .ad-row>.ad-ledger-entry{grid-column:2;grid-row:1}
  .ad-ledger .ad-row>.ad-ledger-time{grid-column:1;grid-row:1}
  .ad-ledger .ad-row>.ad-ledger-empty{display:none}
  .ad-ledger .ad-cell-label{display:block;font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--color-text-caption)}
  .ad-ledger .ad-figure{white-space:normal;overflow-wrap:anywhere}
  .ad-ledger .ad-ledger-bank{grid-column:1 / -1}
}

/* --- TICKET UX-AF: the daily summary as the owner's mockup draws it (workflow close-v2) ------------------------
   The day being closed leads (the largest type on the view), then the progress strip, the one next task in a
   card toned by what it needs (warning: to check; error: to fix; success: done), the two views, the close
   at the foot and the folds. Every tone is a semantic token, and every tone has words beside it. */
.ad-toolbar{align-items:center}
.ad-toolbar .ad-day-field{flex-direction:row;align-items:center;gap:var(--space-8)}
.ad-toolbar-badge{margin-inline-start:auto;align-self:center}
.ad-toolbar .ad-report-button{margin-inline-start:0}
.ad-tone .icon{width:var(--space-14);height:var(--space-14)}
.ad-focus{display:grid;gap:var(--space-8);margin:0 0 var(--space-16);padding:var(--space-24);background:var(--color-surface-card);
  border:1px solid var(--color-border-default);border-radius:var(--radius-card-lg);box-shadow:var(--shadow-sm)}
.ad-focus-label{margin:0;max-width:none;font-size:var(--text-sm);color:var(--color-text-secondary)}
.ad-focus-day{margin:0;font-size:var(--text-display-sm);font-weight:var(--weight-semibold);line-height:var(--leading-snug);
  font-variant-numeric:tabular-nums;color:var(--color-text-primary)}
.ad-focus .ad-basis{margin:0}
.ad-focus-context{margin:0;padding-block-start:var(--space-8);max-width:none;font-size:var(--text-sm);color:var(--color-text-primary)}
.ad-steps{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-8) var(--space-12);margin:0 0 var(--space-16);padding:var(--space-8) 0;list-style:none}
.ad-steps li{display:flex;align-items:center;gap:var(--space-12);font-size:var(--text-sm);color:var(--color-text-secondary)}
.ad-steps .icon{width:var(--space-16);height:var(--space-16)}
.ad-step-mark{display:inline-flex;align-items:center;gap:var(--space-8)}
.ad-steps li[data-done=true] .ad-step-mark{color:var(--color-feedback-success-text);font-weight:var(--weight-medium)}
.ad-todo{display:flex;align-items:center;gap:var(--space-20);margin:0 0 var(--space-16);padding:var(--space-28);background:var(--color-surface-card);
  border:1px solid var(--color-border-default);border-radius:var(--radius-card-lg);color:var(--color-text-primary)}
.ad-todo[data-tone=wait]{background:var(--color-feedback-warning-bg);border-color:var(--color-border-lead);color:var(--color-feedback-warning-text)}
.ad-todo[data-tone=danger]{background:var(--color-feedback-error-bg);border-color:var(--color-border-danger);color:var(--color-feedback-error-text)}
.ad-todo[data-tone=ok]{background:var(--color-feedback-success-bg);border-color:var(--color-feedback-success-bg);color:var(--color-feedback-success-text)}
.ad-todo-icon{display:grid;place-items:center;flex:0 0 var(--size-44);block-size:var(--size-44);border-radius:var(--radius-pill);background:var(--color-surface-card)}
.ad-todo-icon .icon{width:var(--space-24);height:var(--space-24)}
.ad-todo-body{flex:1 1 auto;min-inline-size:0;display:grid;gap:var(--space-6)}
.ad-todo-label,.ad-todo-sub{margin:0;max-width:none;font-size:var(--text-sm);color:inherit}
.ad-todo-label{font-weight:var(--weight-semibold)}
.ad-todo-title{margin:0;font-size:var(--text-xl);font-weight:var(--weight-semibold);line-height:var(--leading-snug);color:inherit}
.ad-todo-title:focus{outline:none}
.ad-todo-list{display:grid;gap:var(--space-4);margin:var(--space-4) 0 0;padding-inline-start:var(--space-20);font-size:var(--text-sm);color:var(--color-text-primary);overflow-wrap:anywhere}
.ad-todo-action{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-8);flex:0 0 auto}
.ad-switch{display:flex;flex-wrap:wrap;gap:var(--space-8);margin:0 0 var(--space-16)}
.ad-switch-button{display:inline-flex;align-items:center;gap:var(--space-8)}
.ad-switch-button[aria-pressed=true],.ad-switch-button[aria-pressed=true]:hover{background:var(--color-surface-selected);border-color:var(--color-action-primary);color:var(--color-action-primary)}
.ad-panel{margin:0 0 var(--space-16);background:var(--color-surface-card);border:1px solid var(--color-border-default);
  border-radius:var(--radius-card-lg);box-shadow:var(--shadow-sm)}
.ad-panel-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-12);padding:var(--space-20) var(--space-24);
  border-block-end:1px solid var(--color-border-default)}
.ad-panel-head h3{margin:0;font-size:var(--text-lg)}
.ad-panel-head button{display:inline-flex;align-items:center;gap:var(--space-8)}
.ad-count-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-16);padding:var(--space-16) var(--space-24)}
.ad-count{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:var(--space-12);row-gap:var(--space-6);min-inline-size:0}
.ad-count strong{font-size:var(--text-xxl);font-weight:var(--weight-semibold);line-height:var(--leading-snug);color:var(--color-text-primary);font-variant-numeric:tabular-nums}
.ad-count>span{grid-column:1 / -1;font-size:var(--text-sm);color:var(--color-text-secondary)}
.ad-count[data-tone=ok]>.icon{color:var(--color-feedback-success-text)}
.ad-count[data-tone=wait]>.icon{color:var(--color-feedback-warning-text)}
.ad-count[data-tone=danger]>.icon{color:var(--color-feedback-error-text)}
.ad-count[data-tone=neutral]>.icon{color:var(--color-text-secondary)}
.ad-panel-foot{padding:0 var(--space-24) var(--space-20)}
.ad-task{display:flex;align-items:center;gap:var(--space-16);padding:var(--space-20) var(--space-24);border-block-start:1px solid var(--color-border-default)}
.ad-panel-head+.ad-task{border-block-start:0}
.ad-task-icon{display:grid;place-items:center;flex:0 0 var(--size-40);block-size:var(--size-40);border-radius:var(--radius-control);
  background:var(--color-surface-sunken);color:var(--color-text-secondary)}
.ad-task[data-tone=wait] .ad-task-icon{background:var(--color-feedback-warning-bg);color:var(--color-feedback-warning-text)}
.ad-task[data-tone=danger] .ad-task-icon{background:var(--color-feedback-error-bg);color:var(--color-feedback-error-text)}
.ad-task-body{flex:1 1 auto;min-inline-size:0;display:grid;gap:var(--space-4)}
.ad-task-body strong{font-weight:var(--weight-semibold);color:var(--color-text-primary);overflow-wrap:anywhere}
.ad-task-body .ad-help{overflow-wrap:anywhere}
.ad-task-action{display:inline-flex;align-items:center;gap:var(--space-8);flex:0 0 auto;color:var(--color-text-link)}
.ad-fold>summary{display:flex;align-items:center;gap:var(--space-12);min-height:var(--size-44);padding:var(--space-16) var(--space-24);cursor:pointer;
  list-style:none;font-weight:var(--weight-medium);color:var(--color-text-primary)}
.ad-fold>summary::-webkit-details-marker{display:none}
.ad-fold>summary::before{content:'\203A';display:inline-block;font-size:var(--text-lg);line-height:var(--leading-none);color:var(--color-text-secondary);
  transition:transform var(--duration-fast) var(--ease-standard)}
.ad-fold[open]>summary::before{transform:rotate(90deg)}
.ad-fold-body{display:grid;gap:var(--space-12);padding:0 var(--space-24) var(--space-20)}
.ad-fold-body>button{justify-self:start}
.ad-fold-body h4{margin:var(--space-4) 0 0;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-fold-list{display:grid;gap:var(--space-6);margin:0;padding-inline-start:var(--space-20);font-size:var(--text-sm);color:var(--color-text-primary);overflow-wrap:anywhere}
.ad-fold-actions,.ad-status-line{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-8)}
.ad-fold-actions button{display:inline-flex;align-items:center;gap:var(--space-6)}
.ad-clocks{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-24)}
.ad-clock{display:grid;gap:var(--space-8);align-content:start;min-inline-size:0;color:var(--color-text-primary)}
.ad-asof{margin:0 0 var(--space-16);max-width:none;padding:var(--space-12) var(--space-16);background:var(--color-surface-sunken);
  border-radius:var(--radius-control);font-size:var(--text-sm);color:var(--color-text-primary)}
.ad-close{grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:var(--space-16)}
.ad-close>:not(.ad-close-lead,.ad-close-actions){grid-column:1 / -1}
.ad-close-lead{display:grid;gap:var(--space-8);min-inline-size:0}
.ad-close .ad-close-actions{grid-column:2;grid-row:1}
.ad-close .ad-ticks{grid-row:2;padding:var(--space-12) 0 0;border:0;border-block-start:1px solid var(--color-border-subtle);border-radius:0}
.ad-close .ad-ticks legend{padding:0}
.ad-close-reasons{margin:0;max-width:none;font-size:var(--text-sm);color:var(--color-text-secondary)}   /* TICKET UX-PR (F05): one short line */
.ad-confirm{display:grid;gap:var(--space-12);justify-items:start}
.ad-return{margin:0 0 var(--space-12)}
.ad-return button{display:inline-flex;align-items:center;gap:var(--space-8)}
@container ad-view (max-width: 719px){
  .ad-todo{flex-wrap:wrap;padding:var(--space-20);gap:var(--space-12)}
  .ad-todo-icon{display:none}
  .ad-todo-action{flex:1 1 100%}
  .ad-task{display:grid;grid-template-columns:var(--size-40) minmax(0,1fr);align-items:start;padding:var(--space-16)}
  .ad-task-action{grid-column:2;justify-self:start;max-inline-size:100%;white-space:normal}
  .ad-count-grid{gap:var(--space-8);padding:var(--space-8) var(--space-16)}
  .ad-count strong{font-size:var(--text-xl)}
  .ad-panel-head,.ad-fold>summary{padding-inline:var(--space-16)}
  .ad-fold-body,.ad-panel-foot{padding-inline:var(--space-16)}
  .ad-clocks{grid-template-columns:minmax(0,1fr)}
  .ad-close{grid-template-columns:minmax(0,1fr)}
  .ad-close .ad-close-actions,.ad-close .ad-ticks{grid-column:1;grid-row:auto}
  .ad-close-actions,.ad-close-actions button{flex:1 1 100%;inline-size:100%}
}
@container ad-view (max-width: 299px){
  .ad-task-action{grid-column:1 / -1;justify-self:stretch;justify-content:center}
  .ad-count{grid-template-columns:minmax(0,1fr)}
  .ad-count>.icon{display:none}
}

/* --- TICKET 261: the day's shift handovers, folded, and the line beside the close ----------------------------
   Each handover a row: its time and shift, who handed over, how many accounts came to each result, then its tag
   (in words, with its icon) and the link to the handover page. The line beside the close is for the record: a
   sunken note, never a tone that reads as a reason the close waits for. */
.ad-handovers{display:grid;gap:var(--space-8);margin:0;padding:0;list-style:none}
.ad-handover{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-8) var(--space-16);padding:var(--space-12) var(--space-14);
  background:var(--color-surface-page);border:1px solid var(--color-border-subtle);border-radius:var(--radius-control)}
.ad-handover-words{display:grid;gap:var(--space-4);flex:1 1 0;min-inline-size:0}
.ad-handover-lead{font-weight:var(--weight-semibold);color:var(--color-text-primary);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.ad-handover-words .ad-help{overflow-wrap:anywhere}
.ad-handover-side{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-8);flex:0 0 auto;max-inline-size:100%}
.ad-handover-side button{display:inline-flex;align-items:center;gap:var(--space-6);color:var(--color-text-link)}
.ad-handover[data-result=voided] .ad-handover-lead{color:var(--color-text-secondary)}
.ad-fold-body>button[data-link=handover]{display:inline-flex;align-items:center;gap:var(--space-6);color:var(--color-text-link)}
.ad-close-shifts{display:flex;align-items:flex-start;gap:var(--space-8);margin:0;max-width:none;padding:var(--space-10) var(--space-14);
  background:var(--color-surface-sunken);border-radius:var(--radius-control);font-size:var(--text-sm);color:var(--color-text-primary)}
.ad-close-shifts .icon{flex:0 0 auto;margin-block-start:var(--space-2);color:var(--color-text-secondary)}
@container ad-view (max-width: 479px){
  .ad-handover{display:grid;grid-template-columns:minmax(0,1fr)}
  .ad-handover-side{display:grid;grid-template-columns:minmax(0,1fr);justify-items:start}
  .ad-handover-side button{justify-self:stretch;justify-content:center;min-height:var(--size-44)}
}

/* --- a phone ---------------------------------------------------------------------------------------- */
@media (max-width: 700px){
  .ad-views{margin-block-start:0}
  .ad-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .ad-day-field{grid-column:1 / -1;grid-row:1}
  .ad-day-field input{inline-size:100%;min-inline-size:0}
  .ad-step{justify-content:center}
  .ad-report-button{margin-inline-start:0}   /* TICKET 243; TICKET UX-AF: in the heading now */
  .ad-toolbar-badge{grid-column:1 / -1;margin-inline-start:0}   /* TICKET UX-AF */
  .ad-toolbar .ad-day-field{flex-direction:column;align-items:stretch;gap:var(--space-6)}   /* TICKET UX-AF: the label above */
  .ad-dialog,.ad-dialog-wide{inline-size:100%;max-inline-size:100%;max-block-size:100vh;margin:0;border-radius:0;border:0}
  .ad-dialog .app-modal-body{padding:var(--space-20)}
  .ad-dialog .app-modal-actions{flex-direction:column-reverse;align-items:stretch;margin-inline:calc(var(--space-20) * -1);padding:var(--space-16) var(--space-20)}
  .ad-dialog .app-modal-actions button{inline-size:100%}
}
@media (prefers-reduced-motion: reduce){
  .ad-view-tab,.ad-toggle .icon,.ad-fold>summary::before{transition:none}
}

/* --- TICKET UX-PR (the production review's F04, F05): the close page, compact on a phone ------------------------
   The report is the heading's secondary action (beside the title from a tablet up, under the lede on a phone); the
   day row is the day alone: on a phone the previous and next days are icon buttons (their names stay for a screen
   reader) beside the date, and the close state under them, so the day being closed and the next task with its
   button come into the first screen. Nothing is made smaller to fit: the targets stay 44 high and the type its size. */
#accounts-panel>.page-heading.ad-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;column-gap:var(--space-16)}
#accounts-panel>.page-heading.ad-heading>:not(.ad-heading-actions){grid-column:1}
#accounts-panel>.page-heading.ad-heading>.ad-heading-actions{grid-column:2;grid-row:1 / span 3;align-self:start;display:flex;gap:var(--space-8)}
.ad-close-done{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-8);margin:0;max-width:none;font-size:var(--text-sm);color:var(--color-feedback-success-text)}
.ad-close-done .icon{width:var(--space-16);height:var(--space-16)}
.ad-close-done span{color:var(--color-text-primary)}
.ad-close-done .text-button{min-height:var(--size-44)}
@media (max-width: 700px){
  #accounts-panel>.page-heading.ad-heading{grid-template-columns:minmax(0,1fr);row-gap:0;margin-block-end:var(--space-16)}
  #accounts-panel>.page-heading.ad-heading>.ad-heading-actions{grid-column:1;grid-row:auto;margin-block-start:var(--space-12)}
  .ad-views{margin-block-end:var(--space-16)}
  .ad-toolbar{grid-template-columns:var(--size-44) minmax(0,1fr) var(--size-44);align-items:end;column-gap:var(--space-8);row-gap:var(--space-8)}
  .ad-toolbar .ad-day-field{grid-column:2;grid-row:1}
  .ad-toolbar .ad-step{grid-row:1;inline-size:var(--size-44);padding-inline:0}
  .ad-toolbar #account-days-prev{grid-column:1}
  .ad-toolbar #account-days-next{grid-column:3}
  .ad-toolbar .ad-step>span{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:-1px}
  .ad-toolbar-badge{grid-column:1 / -1;grid-row:2;justify-self:start}
  .ad-focus{gap:var(--space-4);padding:var(--space-16)}
  .ad-focus-day{font-size:var(--text-xxl)}
  .ad-focus-context{padding-block-start:var(--space-4)}
  .ad-steps{margin-block-end:var(--space-12);padding-block:var(--space-4)}
}

/* --- TICKET UX-PR (the owner's Group 1): the daily summary's message, previewed ---------------------------------- */
.ad-preview-open{display:inline-flex;align-items:center;gap:var(--space-8);justify-self:start}
.ad-preview-text{margin:0;padding:var(--space-16);max-block-size:60vh;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;
  background:var(--color-surface-sunken);border-radius:var(--radius-control);font-family:var(--font-sans);font-size:var(--text-sm);
  line-height:var(--leading-relaxed);color:var(--color-text-primary)}

/* --- TICKET UX-PR (the owner's Group 1): the waterfall of the day, the mockup's `v-waterfall` --------------------- */
.ad-waterfall{display:grid;gap:var(--space-12);margin:0;padding-block-start:var(--space-16);border-block-start:1px solid var(--color-border-subtle)}
.ad-waterfall-title{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-waterfall-chart{display:block;inline-size:100%;max-inline-size:calc(var(--size-280) * 2);block-size:auto;overflow:visible}
.ad-wf-text{font-family:var(--font-sans);font-size:var(--text-xs);fill:var(--color-text-secondary)}
.ad-wf-grid{stroke:var(--color-border-default);stroke-width:1;fill:none}
.ad-wf-connector{stroke:var(--color-border-strong);stroke-width:1;fill:none}
.ad-wf-bar[data-term=opening]{fill:var(--color-text-tertiary)}
.ad-wf-bar[data-term=in]{fill:var(--color-badge-processing-text)}
.ad-wf-bar[data-term=out]{fill:var(--color-feedback-warning-text)}
.ad-wf-bar[data-term=expected]{fill:var(--color-action-primary)}
.ad-wf-pair{display:grid;gap:var(--space-8);max-inline-size:calc(var(--size-280) * 2)}
.ad-wf-row{display:grid;grid-template-columns:minmax(0,var(--size-150)) minmax(0,1fr) auto;align-items:center;gap:var(--space-10);font-size:var(--text-xs);color:var(--color-text-secondary)}
.ad-wf-track{display:block;block-size:var(--space-10);background:var(--color-surface-sunken);border-radius:var(--radius-sm);overflow:hidden}
.ad-wf-fill{display:block;block-size:100%;background:var(--color-action-primary)}
.ad-wf-row[data-term=actual] .ad-wf-fill{background:var(--color-badge-processing-text)}
.ad-wf-row-figure{font-variant-numeric:tabular-nums;color:var(--color-text-primary)}

/* --- TICKET 265: the file covers the whole day (ADR 0016 section 11) ---------------------------------------------
   The close's reason and the fold's line say the file's coverage in words, with an icon beside them; the dialog lists
   the day's files, each a row with its import and the request times of its rows on the day, and the reminder about
   the back office's filter in the hold tone the ledger's marks use. Every value is a token. */
.ad-close-coverage,.ad-coverage-line{display:flex;align-items:flex-start;gap:var(--space-8);margin:0;max-width:none;font-size:var(--text-sm);
  color:var(--color-text-primary)}
.ad-close-coverage .icon,.ad-coverage-line .icon{flex:0 0 auto;margin-block-start:var(--space-2);width:var(--space-16);height:var(--space-16)}
.ad-close-coverage .icon,.ad-coverage-line[data-coverage=lapsed] .icon,.ad-coverage-line[data-coverage=unconfirmed] .icon{color:var(--color-feedback-warning-text)}
.ad-coverage-line[data-coverage=confirmed] .icon{color:var(--color-feedback-success-text)}
.ad-coverage{display:grid;gap:var(--space-12);min-inline-size:0}
.ad-coverage .ad-status-line{justify-content:flex-start}
.ad-coverage-batches{display:grid;gap:var(--space-8);margin:0;padding:0;list-style:none}
.ad-coverage-batch{display:grid;gap:var(--space-8);padding:var(--space-12) var(--space-14);background:var(--color-surface-page);
  border:1px solid var(--color-border-subtle);border-radius:var(--radius-control);min-inline-size:0}
.ad-coverage-batch[data-new=true]{border-color:var(--color-border-lead)}
.ad-coverage-head{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-4) var(--space-10)}
.ad-coverage-head strong{font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-coverage-name{font-size:var(--text-sm);color:var(--color-text-secondary);overflow-wrap:anywhere}
.ad-coverage-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--size-150)),1fr));gap:var(--space-8) var(--space-16);margin:0}
.ad-coverage-facts>div{display:grid;align-content:start;gap:var(--space-2);min-inline-size:0}
.ad-coverage-facts dt{font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--color-text-caption)}
.ad-coverage-facts dd{margin:0;font-size:var(--text-sm);color:var(--color-text-primary);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.ad-coverage-reminder{display:flex;align-items:flex-start;gap:var(--space-8);padding:var(--space-12) var(--space-14);
  border:1px solid var(--color-border-lead);border-radius:var(--radius-control);background:var(--color-feedback-hold-bg);
  color:var(--color-feedback-hold-text);font-size:var(--text-sm)}
.ad-coverage-reminder .icon{flex:0 0 auto;margin-block-start:var(--space-2)}
.ad-coverage-reminder p{margin:0;max-width:none;color:inherit}

/* --- TICKET 268 (the owner's mockup, approved 19 ต.ค. 2026): "ตรวจรายบัญชี" -----------------------------------------
   "ภาพรวมของวัน" is a card of its own: its head names the day in baht; the waterfall and its four terms on the left;
   beside them, behind a rule, the expected balance, the confirmed actual balance with its share of the accounts as a
   bar, and the total difference, each at the large figure step. The counts by state and the table by account type
   fold at the card's foot. On a narrow region the figures go under the waterfall. Then the card "ตรวจยอดรายบัญชี":
   the table with its title in the card's head, the state under each difference, and "ตรวจยอด" as an outlined button. */
#account-days-hero.ad-hero{display:block;padding:0;overflow:hidden}
.ad-hero-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:var(--space-4) var(--space-16);
  padding:var(--space-20) var(--space-24) 0}
.ad-hero-title{margin:0;font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-hero-day{font-size:var(--text-xs)}
.ad-hero-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--space-24);padding:var(--space-16) var(--space-24) var(--space-24)}
.ad-hero-flow{display:grid;align-content:start;gap:var(--space-20);min-inline-size:0}
.ad-hero-flow .ad-waterfall{padding-block-start:0;border:0}
.ad-hero-flow .ad-waterfall-title{font-size:var(--text-xs);font-weight:var(--weight-regular);color:var(--color-text-secondary)}
.ad-hero-flow .ad-equation{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-16) var(--space-24);padding-block-start:0;border:0}
.ad-hero-flow .ad-term dt{display:flex;align-items:baseline;gap:var(--space-2);font-size:var(--text-xs);font-weight:var(--weight-regular);color:var(--color-text-secondary)}
.ad-hero-flow .ad-sign{font-size:var(--text-xs);color:var(--color-text-secondary)}
.ad-hero-flow .ad-term-amount{font-size:var(--text-md)}
.ad-hero-figures{display:grid;align-content:start;gap:var(--space-24);min-inline-size:0;padding-inline-start:var(--space-24);
  border-inline-start:1px solid var(--color-border-default)}
.ad-hero-figure{display:grid;gap:var(--space-4);min-inline-size:0}
.ad-hero-figure-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-8)}
.ad-hero-label{margin:0;max-width:none;font-size:var(--text-xs);color:var(--color-text-secondary)}
.ad-hero-share{font-size:var(--text-xs);color:var(--color-text-primary);white-space:nowrap}
.ad-hero-number{margin:0;max-width:none;font-size:var(--text-xxl);font-weight:var(--weight-semibold);line-height:var(--leading-snug);
  letter-spacing:-0.01em;font-variant-numeric:tabular-nums;color:var(--color-text-primary);overflow-wrap:anywhere}
.ad-hero-words{letter-spacing:normal}
.ad-hero-figure .ad-help{font-size:var(--text-xs)}
.ad-hero-track{display:block;block-size:var(--space-6);margin-block-start:var(--space-6);background:var(--color-surface-sunken);
  border-radius:var(--radius-pill);overflow:hidden}
.ad-hero-fill{display:block;block-size:100%;background:var(--color-action-primary);border-radius:var(--radius-pill)}
.ad-hero .ad-lead-figure{margin:0}
.ad-hero .ad-lead-amount{font-size:var(--text-xxl)}
.ad-hero .ad-lead-none{font-size:var(--text-lg)}
.ad-hero .ad-lead-none[data-figure=partial]{font-size:var(--text-xxl);line-height:var(--leading-snug)}
.ad-hero .ad-lead-note{margin:0;font-size:var(--text-xs);color:var(--color-text-secondary)}
.ad-hero-more{border-block-start:1px solid var(--color-border-subtle)}
.ad-hero-more>summary{display:flex;align-items:center;gap:var(--space-12);min-height:var(--size-44);padding:var(--space-12) var(--space-24);
  cursor:pointer;list-style:none;font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--color-text-primary)}
.ad-hero-more>summary::-webkit-details-marker{display:none}
.ad-hero-more>summary::before{content:'\203A';display:inline-block;font-size:var(--text-lg);line-height:var(--leading-none);color:var(--color-text-secondary);
  transition:transform var(--duration-fast) var(--ease-standard)}
.ad-hero-more[open]>summary::before{transform:rotate(90deg)}
.ad-hero-more-body{display:grid;gap:var(--space-16);padding:0 var(--space-24) var(--space-20)}
.ad-list.ad-list{margin:0 0 var(--space-16);background:var(--color-surface-card);border:1px solid var(--color-border-default);
  border-radius:var(--radius-card-lg);box-shadow:var(--shadow-sm);overflow:hidden}
.ad-list .ad-list-head{border-block-end:0}
.ad-list .ad-list-title{margin:0;font-size:var(--text-lg)}
.ad-list .ad-table-wrap{border:0;border-radius:0;border-block-start:1px solid var(--color-border-default)}
.ad-list>.ad-empty{margin:0 var(--space-24) var(--space-24)}
.ad-cell[data-term=difference] .ad-state{display:block;margin-block-start:var(--space-4)}
.ad-toggle.secondary{min-height:var(--size-40);padding-inline:var(--space-14)}
.ad-task-action>.icon{display:none}
/* The work left's own buttons are the mockup's quiet links: green words, no frame, a ghost fill under the pointer. */
.ad-task .ad-task-action.quiet{min-height:var(--size-44);padding-inline:var(--space-8);background:transparent;border-color:transparent;
  color:var(--color-text-link);font-weight:var(--weight-semibold)}
.ad-task .ad-task-action.quiet:hover{background:var(--color-action-ghost-hover);border-color:transparent;text-decoration:underline}
.ad-task .ad-task-action.quiet:disabled{background:transparent;border-color:transparent}
@container ad-view (max-width: 719px){
  .ad-hero-head{padding:var(--space-16) var(--space-16) 0}
  .ad-hero-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-20);padding:var(--space-12) var(--space-16) var(--space-20)}
  .ad-hero-figures{gap:var(--space-20);padding-inline-start:0;padding-block-start:var(--space-20);border-inline-start:0;
    border-block-start:1px solid var(--color-border-default)}
  .ad-hero-flow .ad-term[data-term=opening]{grid-column:auto}
  .ad-hero-more>summary{padding-inline:var(--space-16)}
  .ad-hero-more-body{padding-inline:var(--space-16)}
}
@container ad-table (max-width: 879px){
  .ad-row>.ad-toggle-cell{text-align:start}
  .ad-toggle.secondary{inline-size:auto;min-height:var(--size-44)}
}
@media (prefers-reduced-motion: reduce){
  .ad-hero-more>summary::before{transition:none}
}
/* ===== TICKET 279 begin: the staff transfer errors that hold the close, each a link to the withdrawal review ===== */
.ad-task-links{display:grid;gap:var(--space-2);margin:0;padding:0;list-style:none}
.ad-task-links li{min-inline-size:0}
.ad-task-link.text-button{min-height:var(--size-36);padding-inline:0;overflow-wrap:anywhere}
.ad-task-link.text-button:hover{background:transparent;text-decoration:underline}
.ad-task-note{color:var(--color-feedback-hold-text)}
/* ===== TICKET 279 end ===== */

/* ===== TICKET 282 begin: the day's main file, and the rows only older files list (ADR 0016 section 16) ===== */
.ad-task-lead{color:var(--color-text-primary)}
.ad-older{display:grid;gap:var(--space-4);min-inline-size:0;margin-block:var(--space-8)}
.ad-older p{margin:0;max-width:none}
.ad-older-words{font-size:var(--text-sm);color:var(--color-text-primary);overflow-wrap:anywhere}
.ad-coverage-older{display:grid;gap:var(--space-6);padding:var(--space-12) var(--space-14);background:var(--color-surface-page);
  border:1px solid var(--color-border-default);border-radius:var(--radius-control);min-inline-size:0}
.ad-coverage-older h4{margin:0;font-size:var(--text-sm)}
.ad-coverage-older p{margin:0;max-width:none}
.ad-coverage-older-batches{display:grid;gap:var(--space-2);margin:0;padding-inline-start:var(--space-16);font-size:var(--text-sm);
  overflow-wrap:anywhere}
/* ===== TICKET 282 end ===== */

/* ===== TICKET 283 begin: a company starts counting from a cut-off day (ADR 0015 section 13, ADR 0016 section 17) =====
   The strip under the day row (the cut-off day and its checklist's state, quiet beside the day being closed), the
   checklist "เช็กยอดตั้งต้น" (one card per account in use, its facts as the coverage dialog lays them out), and the
   read-only words of a day before the cut-off. Tokens only. */
.ad-cutoff{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-8) var(--space-12);margin:0 0 var(--space-12);
  padding:var(--space-10) var(--space-14);background:var(--color-surface-page);border:1px solid var(--color-border-subtle);
  border-radius:var(--radius-control);min-inline-size:0}
.ad-cutoff[data-state=missing]{border-color:var(--color-border-danger)}
.ad-cutoff[data-state=lapsed],.ad-cutoff[data-state=unconfirmed]{border-color:var(--color-border-lead)}
.ad-cutoff-text{display:grid;gap:var(--space-2);flex:1 1 var(--size-280);min-inline-size:0}
.ad-cutoff-text strong{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-cutoff-note{font-size:var(--text-xs);color:var(--color-text-secondary);overflow-wrap:anywhere}
.ad-cutoff-open{display:inline-flex;align-items:center;gap:var(--space-6)}
.ad-checklist{display:grid;gap:var(--space-12);min-inline-size:0}
.ad-checklist .ad-status-line{justify-content:flex-start}
.ad-checklist p{margin:0;max-width:none}
.ad-checklist-items{display:grid;gap:var(--space-8);margin:0;padding:0;list-style:none}
.ad-checklist-item{display:grid;gap:var(--space-8);padding:var(--space-12) var(--space-14);background:var(--color-surface-page);
  border:1px solid var(--color-border-subtle);border-radius:var(--radius-control);min-inline-size:0}
.ad-checklist-item[data-state=missing]{border-color:var(--color-border-danger)}
.ad-checklist-item[data-state=no_picture]{border-color:var(--color-border-lead)}
.ad-checklist-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-6) var(--space-10);min-inline-size:0}
.ad-checklist-actions{display:flex;flex-wrap:wrap;gap:var(--space-8)}
.ad-checklist-confirmation{display:grid;gap:var(--space-6)}
.ad-cutoff-set{margin:0}
.ad-cutoff-set .ad-fold-body{display:grid;gap:var(--space-10)}
.ad-cutoff-set .ad-fold-body>button{justify-self:start}
.ad-cutoff-history{display:grid;gap:var(--space-4);margin-block-start:var(--space-8)}
.ad-cutoff-history p{margin:0;max-width:none}
@media (max-width: 700px){
  .ad-cutoff{padding:var(--space-10) var(--space-12)}
  .ad-cutoff-open{inline-size:100%;justify-content:center}
  .ad-cutoff-set .ad-fold-body>button{justify-self:stretch}
}
/* ===== TICKET 283 end ===== */

/* ===== TICKET 298 begin: every close problem opens where it is fixed (ADR 0016 section 18) =====================
   The day's banner and the account's notice each carry the button to "สลิปที่ยังนับไม่ได้"; the list groups the slips by
   what is not read, one card per slip (its id, its account, when it was received, the amount, its status, what is not
   read, and "แก้รายการนี้"): one row from 640 of the list's own width, stacked below it. The ledger's causes sit above
   its lines, each a fact with its button. Tokens only. */
.ad-uncounted{flex-wrap:wrap;align-items:center}
.ad-uncounted>span{flex:1 1 var(--size-280);min-inline-size:0}
.ad-uncounted-open{flex:0 0 auto}
.ad-source .ad-uncounted-open{justify-self:start}
.ad-uncounted-total{margin:0;max-width:none;font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-uncounted-groups{container:ad-uncounted / inline-size;display:grid;gap:var(--space-20);min-inline-size:0}
.ad-uncounted-group{display:grid;gap:var(--space-8);min-inline-size:0}
.ad-uncounted-group>.ad-help{max-width:none}
.ad-uncounted-head{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-6) var(--space-10);margin:0;font-size:var(--text-md)}
.ad-uncounted-slips{display:grid;gap:var(--space-8);margin:0;padding:0;list-style:none}
.ad-uncounted-slip{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:var(--space-8) var(--space-16);
  padding:var(--space-12) var(--space-14);background:var(--color-surface-card);border:1px solid var(--color-border-default);
  border-radius:var(--radius-control);min-inline-size:0}
.ad-uncounted-what{display:grid;gap:var(--space-2);min-inline-size:0}
.ad-uncounted-id{font-weight:var(--weight-semibold);color:var(--color-text-primary)}
.ad-uncounted-account{font-size:var(--text-xs);color:var(--color-text-secondary);overflow-wrap:anywhere}
.ad-uncounted-missing{font-size:var(--text-xs);color:var(--color-feedback-hold-text);overflow-wrap:anywhere}
.ad-uncounted-facts{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--space-4) var(--space-12);font-size:var(--text-sm)}
.ad-uncounted-received{color:var(--color-text-secondary)}
.ad-uncounted-amount{font-weight:var(--weight-semibold);font-variant-numeric:tabular-nums;color:var(--color-text-primary);white-space:nowrap}
.ad-uncounted-amount[data-read=false]{font-weight:var(--weight-regular);color:var(--color-feedback-hold-text)}
.ad-uncounted-status{white-space:nowrap}
@container ad-uncounted (max-width: 639px){
  .ad-uncounted-slip{grid-template-columns:minmax(0,1fr)}
  .ad-uncounted-facts{justify-content:flex-start}
  .ad-uncounted-fix{justify-self:stretch;justify-content:center;min-height:var(--size-44)}
}
.ad-causes{display:grid;gap:var(--space-10);padding:var(--space-14) var(--space-16);background:var(--color-surface-page);
  border:1px solid var(--color-border-default);border-radius:var(--radius-card);min-inline-size:0}
.ad-causes[data-found=true]{border-color:var(--color-border-lead)}
.ad-causes-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-6) var(--space-12)}
.ad-causes-head h3{margin:0;font-size:var(--text-md)}
.ad-causes p{margin:0;max-width:none}
.ad-causes>button{justify-self:start}
.ad-causes-list{display:grid;gap:var(--space-8);margin:0;padding:0;list-style:none}
.ad-cause{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-8) var(--space-12);padding:var(--space-10) var(--space-12);
  background:var(--color-surface-card);border:1px solid var(--color-border-subtle);border-radius:var(--radius-control);min-inline-size:0}
.ad-cause-icon{display:grid;place-items:center;flex:0 0 var(--size-36);block-size:var(--size-36);border-radius:var(--radius-control);
  background:var(--color-feedback-warning-bg);color:var(--color-feedback-warning-text)}
.ad-cause-text{display:grid;gap:var(--space-2);flex:1 1 var(--size-280);min-inline-size:0}
.ad-cause-text strong{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-primary);overflow-wrap:anywhere}
.ad-cause-text .ad-help{overflow-wrap:anywhere}
.ad-cause>button{flex:0 0 auto}
@media (max-width: 700px){
  .ad-uncounted-open{flex:1 1 100%;justify-content:center;min-height:var(--size-44)}
  .ad-source .ad-uncounted-open,.ad-causes>button{justify-self:stretch;justify-content:center;min-height:var(--size-44)}
  .ad-cause{display:grid;grid-template-columns:var(--size-36) minmax(0,1fr);align-items:start}
  .ad-cause>button{grid-column:1 / -1;justify-content:center;min-height:var(--size-44)}
}
/* ===== TICKET 298 end ===== */
