body { background: var(--bg); color: var(--t1); font-family: Inter, system-ui, sans-serif; font-size: 16px; line-height: 1.55; }
main { inline-size: min(100% - 2 * clamp(18px, 4vw, 48px), 1120px); margin-inline: auto; padding-block: 28px 64px; }
header, .heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
header { margin-block-end: 40px; } .site-brand { font-size: 24px; font-weight: 750; letter-spacing: -.05em; color: var(--t1); }
h1 { font-size: clamp(30px, 4vw, 44px); letter-spacing: -.035em; line-height: 1.15; margin-block: 6px 14px; } h2 { font-size: 23px; letter-spacing: -.025em; margin-block: 0 10px; } h3 { font-size: 18px; margin-block: 0 8px; }
p { margin-block: 8px 14px; text-wrap: pretty; } .intro { max-inline-size: 690px; font-size: 18px; color: var(--t2); }.eyebrow { font-size: 13px; font-weight: 650; letter-spacing: .04em; color: var(--t2); } .muted, footer { color: var(--t2); font-size: 14px; }
section { padding-block: 28px; border-block-start: 1px solid var(--bd); scroll-margin-block-start: 20px; } #workspace-tools { padding-block: 12px 28px; } #workspace-tools > select { max-inline-size: 420px; margin-block-end: 28px; }
button, input, select, textarea { font: inherit; } button { min-block-size: 44px; padding: 10px 17px; border: 1px solid var(--ac); border-radius: var(--r); background: var(--ac); color: var(--bg); cursor: pointer; font-weight: 600; } button.secondary { background: var(--bg); color: var(--t1); border-color: var(--bdh); } .text-button { border-color: transparent; background: transparent; color: var(--ac); padding-inline: 4px; } .danger { color: oklch(45% .17 26); }
button:active { opacity: .75; } button:disabled { opacity: .55; cursor: wait; } :where(button, a, input, select, textarea, summary):focus-visible { outline: 2px solid var(--ac); outline-offset: 3px; }
label { display: block; font-weight: 600; margin-block: 12px 6px; } input:not([type=checkbox]), select, textarea { display: block; inline-size: 100%; min-inline-size: 0; min-block-size: 44px; margin-block-start: 6px; padding: 10px 12px; border: 1px solid var(--bdh); border-radius: var(--r); background: var(--bg2); color: var(--t1); font-size: 16px; } textarea { resize: vertical; text-wrap: stable; } input[type=checkbox] { inline-size: 20px; block-size: 20px; }
.field-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 0 20px; } .field-grid > * { min-inline-size: 0; } .wide { grid-column: 1 / -1; } .check { display: flex; gap: 12px; align-items: start; min-block-size: 44px; font-weight: 400; } .actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-block: 16px; }
.summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); border-block: 1px solid var(--bd); padding-block: 20px; gap: 20px; } .summary strong { display: block; font-size: 25px; font-variant-numeric: tabular-nums; } .summary span { font-size: 14px; color: var(--t2); }.section-nav { display: flex; flex-wrap: wrap; gap: 12px 24px; padding-block: 16px; } .section-nav a { padding-block: 10px; min-block-size: 44px; }
.record { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; padding-block: 18px; border-block-end: 1px solid var(--bd); }.record > div:first-child { flex: 1 1 280px; min-inline-size: 0; overflow-wrap: anywhere; }.record p { margin-block: 4px; } .record strong { font-variant-numeric: tabular-nums; } .record .actions { margin-block: 0; }.empty { padding-block: 24px; color: var(--t2); } .original { font-size: 14px; color: var(--t2); } details { margin-block: 8px; } summary { cursor: pointer; padding-block: 10px; min-block-size: 44px; } pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; }
#status { color: var(--t2); min-block-size: 24px; } #error, #dialog-error { padding: 14px; border: 1px solid oklch(45% .17 26); color: oklch(45% .17 26); border-radius: var(--r); margin-block: 16px; overflow-wrap: anywhere; } #unsaved { color: var(--ac); } #recovery, .export-panel { padding: 20px; background: var(--bg2); border: 1px solid var(--bd); border-radius: var(--r); margin-block: 20px; }.filter { inline-size: min(100%, 270px); margin-block: 0; }
dialog { margin: auto; inline-size: min(680px, calc(100% - 32px)); max-block-size: calc(100dvh - 32px); overflow-y: auto; padding: clamp(18px, 4vw, 28px); border: 1px solid var(--bdh); border-radius: var(--r); background: var(--bg); color: var(--t1); } dialog::backdrop { background: oklch(20% 0 none / .45); } footer { border-block-start: 1px solid var(--bd); padding-block-start: 20px; margin-block-start: 28px; }.skip { position: absolute; inset-block-start: -100px; background: var(--bg); padding: 12px; }.skip:focus { inset-block-start: 8px; } [hidden] { display: none !important; }
@media (hover: hover) and (pointer: fine) { a:hover, .text-button:hover { text-decoration: underline; } button:hover { filter: brightness(.96); } }
@media print { header, button, nav, #workspace-tools, #status, #error, #recovery { display: none; } main { inline-size: 100%; padding: 0; } }
#accountant-access { padding-block: 0 28px; margin-block-end: 28px; border-block-end: 1px solid var(--bd); }
.button-link { display: inline-flex; align-items: center; min-block-size: 44px; padding: 10px 17px; border: 1px solid var(--bdh); border-radius: var(--r); color: var(--t1); text-decoration: none; }
.button-link:active { opacity: .75; } .preserve-lines { white-space: pre-wrap; overflow-wrap: anywhere; }
#recovered-modal-fields dd { margin-block-end: 12px; overflow-wrap: anywhere; }
.batch-file { padding-block: 22px; border-block-top: 1px solid var(--bd); }
.batch-record { min-inline-size: 0; margin-block: 18px; padding: 12px 16px; border: 1px solid var(--bd); border-radius: var(--r); }
.batch-record legend { padding-inline: 6px; font-weight: 650; }
.batch-file [role=alert] { color: oklch(45% .17 26); overflow-wrap: anywhere; }

/* The selected month's statement is its primary view; intake stays under Records. */
#workspace-tools > summary { color: var(--ac); font-weight: 600; }
#workspace-tools[open] > summary { margin-block-end: 16px; }
.pack-tabs { display: flex; gap: 4px; border-block-end: 1px solid var(--bd); margin-block-start: 8px; overflow-x: auto; scroll-margin-block-start: 16px; }
.pack-tabs [role=tab] { flex: 0 1 auto; min-inline-size: 0; min-block-size: 48px; font-size: clamp(12px, 3.4vw, 16px); white-space: normal; text-wrap: balance; border: 0; border-block-end: 2px solid transparent; border-radius: 0; background: transparent; color: var(--t2); padding: 12px clamp(8px, 2vw, 24px); }
.pack-tabs [aria-selected=true] { border-block-end-color: var(--ac); color: var(--ac); }
.pack-tabs [role=tab]:focus-visible { outline-offset: -5px; }
.pack-tabs [role=tab]:active { background: var(--bg2); }
[role=tabpanel] { min-inline-size: 0; }
/* Show panel keyboard position at its compact tab, not around the statement. */
[role=tabpanel]:focus { outline: none; }
body:has([role=tabpanel]:focus-visible) .pack-tabs [aria-selected=true] { outline: 2px solid var(--ac); outline-offset: -5px; }
:is(#error, #dialog-error)[tabindex="-1"]:focus { outline: none; }
#panel-balance > section { border-block-start: 0; padding-block-start: 8px; }
#pack-intake > section:first-child { border-block-start: 0; }
@media (hover: hover) and (pointer: fine) { .pack-tabs [role=tab]:hover { background: var(--bg2); filter: none; } }
.opening-controls { border-block-end: 1px solid var(--bd); margin-block: 0 12px; }
.opening-controls > h3 { font-size: 14px; font-weight: 600; margin-block: 18px 8px; }
.opening-controls > h3 span { color: var(--t2); font-weight: 400; margin-inline-start: 8px; }

.opening-controls p { max-inline-size: 76ch; }

@media screen { body:has(#pack-editor:not([hidden]), #review-pack:not([hidden])) main { inline-size: min(100% - 2 * clamp(18px, 3vw, 48px), 1600px); } }
body:has(#pack-editor:not([hidden])) header { margin-block-end: 12px; }
body:has(#pack-editor:not([hidden])) #status { margin-block: 4px 8px; font-size: 14px; }
#workspace-tools:not([open]) { padding-block: 0 8px; }
.pack-heading > div:first-child { flex: 1 1 340px; }
.pack-heading .eyebrow { margin-block: 0 4px; }
.pack-heading h2 { margin-block: 0 6px; font-size: clamp(23px,2.2vw,30px); overflow-wrap: anywhere; }
.pack-heading .actions { margin-block: 0; }
#pack-readiness { max-inline-size: 70ch; margin-block: 0; font-size: 14px; color: var(--t2); }


.statement-settings { margin-block: 0 8px; }
.statement-settings > summary { min-block-size: 44px; padding-block: 10px; font-size: 14px; color: var(--t2); }
.statement-settings[open] { padding-block-end: 12px; }
#pack-heading .actions { gap: 8px; }
#pack-heading #refresh { border-color: transparent; background: transparent; color: var(--t2); padding-inline: 10px; }
@media (max-width: 600px) { .pack-heading > div:first-child { flex-basis: 210px; } .pack-heading { gap: 8px; } }

/* One compact row per remembered cost; details stay in the existing editor. */
.cost-checklist{list-style:none;padding:0;margin:0}.cost-checklist li{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--border,#dedbd2)}.cost-checklist li>div{min-width:0;overflow-wrap:anywhere}.cost-checklist p{margin:.25rem 0 0;font-size:.875rem}.cost-checklist button{flex-shrink:0;min-height:44px}

/* Preparation keeps the next task beside the saved month, not below its records. */
.preparation { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px 24px; padding-block: 14px; border-block: 1px solid var(--bd); margin-block: 12px; }
.preparation > div { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; column-gap: 24px; min-inline-size: 0; }
.preparation > div > strong, .preparation > div > p { grid-column: 1; }
.preparation > div > p { max-inline-size: 80ch; }
.preparation details { grid-column: 2; grid-row: 1 / 3; margin-block: 0; font-size: 13px; }
.preparation details[open] { grid-column: 1 / -1; grid-row: 3; }
.preparation details[open] li { margin-block: 12px; }
.preparation p { margin-block: 4px 0; color: var(--t2); font-size: 14px; }
.preparation strong { font-size: 15px; font-weight: 600; }
#worklist-section { border-block-start: 0; padding-block: 24px 12px; container-type: inline-size; }
.record-destinations { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 130px), 1fr)); gap: 8px; padding-block: 20px 4px; }
.record-destinations button { min-inline-size: 0; text-align: start; white-space: normal; overflow-wrap: anywhere; }
.record-destinations [aria-current=location] { border-color: var(--ac); color: var(--ac); background: var(--bg2); }
.worklist-toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: 12px 24px; margin-block: 16px; }
.worklist-toolbar label:first-child { flex: 1 1 320px; }.worklist-toolbar label:last-child { flex: 1 1 180px; }
.worklist-toolbar label { margin: 0; font-size: 14px; }
.worklist-table { inline-size: 100%; border-collapse: collapse; font-size: 13px; line-height: 1.4; }
.worklist-table :is(th, td) { padding: 4px 8px; text-align: start; vertical-align: middle; border-block-end: 1px solid var(--bd); }
.worklist-table th { color: var(--t2); font-size: 12px; font-weight: 500; padding-block: 8px; }
.worklist-table :is(th, td):first-child { padding-inline-start: 0; }
.worklist-table :is(th, td):last-child { padding-inline-end: 0; }
.worklist-table :is(th:nth-child(5), .worklist-amount) { text-align: end; }
.worklist-date, .worklist-kind, .worklist-reference, .worklist-payment { color: var(--t2); }
.worklist-date { white-space: nowrap; font-variant-numeric: tabular-nums; }
.worklist-reference { font-size: 12px; overflow-wrap: anywhere; }
.worklist-name { inline-size: 27%; overflow-wrap: anywhere; }
.record-name { display: block; min-inline-size: 0; line-height: 1.35; color: var(--t1); font-size: 14px; overflow-wrap: anywhere; }
.worklist-table .worklist-actions { text-align: end; }
.record-edit { min-block-size: 28px; min-inline-size: 44px; padding: 4px 6px; font-size: 12px; color: var(--ac); }
.worklist-amount { font-size: 13px; font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.record-status { display: inline-block; font-size: 12px; line-height: 1.4; padding: 3px 6px; border-radius: var(--r); background: var(--bg2); overflow-wrap: anywhere; }
.record-field-label { display: none; }
@container (width < 56rem) {
  .worklist-table, .worklist-table tbody { display: block; }
  .worklist-table thead { position: absolute; inline-size: 1px; block-size: 1px; overflow: clip; clip-path: inset(50%); white-space: nowrap; }
  .worklist-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 2px 12px; padding-block: 8px; border-block-start: 1px solid var(--bd); }
  .worklist-table td { padding: 0; border: 0; }
  .worklist-name { grid-column: 1; grid-row: 1; inline-size: auto; }
  .worklist-amount { grid-column: 2; grid-row: 1; }
  .worklist-date { grid-column: 1; grid-row: 2; }
  .worklist-kind { grid-column: 2; grid-row: 2; text-align: end; }
  .worklist-reference { grid-column: 1 / -1; grid-row: 3; }
  .record-field-label { display: inline; }
  .worklist-payment { grid-column: 1 / -1; grid-row: 4; }
  .worklist-review { grid-column: 1; grid-row: 5; align-self: center; }
  .worklist-table .worklist-actions { grid-column: 2; grid-row: 5; }
}
@media (pointer: coarse) { .record-edit { min-block-size: 44px; } }
.status-needs_review { color: oklch(39% .07 70); background: oklch(96% .025 80); }.status-excluded { color: var(--t2); }
.worklist-pagination { justify-content: space-between; }.worklist-empty { text-align: center; padding-block: 48px; }.worklist-empty p { color: var(--t2); }
.record-tools { display: flex; flex-wrap: wrap; align-items: end; gap: 16px; border-block-start: 1px solid var(--bd); padding-block: 20px; }.record-tools label { max-inline-size: 420px; flex: 1 1 260px; font-size: 14px; margin: 0; }
.pending-note { padding: 14px; border: 1px solid var(--bd); border-radius: var(--r); }
/* Native modal retains focus trapping; only its middle scrolls. */
#edit-dialog { padding: 0; overflow: clip; inline-size: min(760px, calc(100% - 24px)); max-block-size: calc(100dvh - 24px); }
#edit-form { display: flex; flex-direction: column; max-block-size: calc(100dvh - 26px); }
.dialog-heading { flex: none; padding: 18px clamp(18px, 4vw, 28px); border-block-end: 1px solid var(--bd); }
.dialog-heading h2 { margin: 0; font-size: 21px; }
.dialog-body { min-block-size: 0; overflow-y: auto; scrollbar-gutter: stable; padding: 12px clamp(18px, 4vw, 28px) 24px; }
.dialog-actions { flex: none; margin: 0; padding: 14px clamp(18px, 4vw, 28px); padding-block-end: max(14px, env(safe-area-inset-bottom, 0px)); border-block-start: 1px solid var(--bd); background: var(--bg); }
.dialog-actions button:first-child { margin-inline-end: auto; }
.editor-group { padding-block: 12px; border-block-start: 1px solid var(--bd); margin-block: 12px 0; }
.editor-group summary { font-weight: 600; }.editor-group summary span { display: block; font-size: 13px; color: var(--t2); font-weight: 400; }
.editor-group .field-grid { padding-block-end: 12px; }
.editor-evidence { border: 0; padding: 0; margin-block: 18px 0; min-inline-size: 0; }.editor-evidence legend { font-size: 14px; font-weight: 600; }
.editor-evidence .editor-group { margin-block: 0; }.evidence-options { max-block-size: 300px; overflow-y: auto; padding-inline-end: 8px; }
.evidence-options { user-select: none; }
.evidence-options .check { padding-block: 10px; margin: 0; border-block-end: 1px solid var(--bd); font-size: 14px; }.evidence-options .check span { overflow-wrap: anywhere; min-inline-size: 0; }.evidence-options input { flex: none; }
.selected-original { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; font-size: 14px; margin-block: 8px; }.selected-original span { min-inline-size: 0; overflow-wrap: anywhere; }
.record-context { padding-block: 8px 16px; margin-block-end: 8px; border-block-end: 1px solid var(--bd); }.record-context p { font-size: 14px; margin-block: 6px; }.record-context .actions { gap: 8px 20px; margin: 0; }
.intake-options { display: grid; gap: 12px; padding-block: 8px; }.intake-options button { text-align: start; padding: 16px; }.intake-options strong, .intake-options span { display: block; }.intake-options span { font-size: 14px; font-weight: 400; color: var(--t2); margin-block-start: 4px; }
.review-history-panel, .review-administration { border-block-start: 1px solid var(--bd); padding-block: 16px; }.review-history-panel summary, .review-administration summary { font-weight: 600; }
#review-section > .export-panel { margin-block-start: 16px; background: var(--bg2); }[aria-invalid=true] { border-color: oklch(45% .17 26); }
@media (hover: hover) and (pointer: fine) { .worklist-row:hover { background: var(--bg2); } }
@container (width < 36rem) {
  .worklist-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(144px, .65fr); gap: 12px; }
}
@container (width < 20rem) { .worklist-toolbar { grid-template-columns: 1fr; } }
@media (width < 40rem) {
  main { padding-block-start: 18px; }header { margin-block-end: 20px; }
  #workspace-tools { padding-block: 8px 14px; }
  .preparation { display: grid; grid-template-columns: minmax(0, 1fr) auto; padding-block: 12px; gap: 12px; margin-block: 12px; }
  .preparation > div { display: block; }
  .pack-tabs [role=tab] { flex: 1 1 0; }
  .preparation p { font-size: 13px; }.preparation button { padding-inline: 12px; font-size: 14px; }
  #worklist-section > .heading { flex-wrap: nowrap; align-items: start; gap: 12px; }
  #worklist-section > .heading > div { flex: 1; min-inline-size: 0; }
  #worklist-section > .heading h2 { font-size: 21px; }
  #worklist-section > .heading > button { flex: none; padding-inline: 12px; font-size: 14px; }
  #worklist-section > .heading p { font-size: 14px; }
}

/* A navigation destination is content, not a boxed input. Keep its position
   apparent without framing the full heading; interactive focus stays above. */
:is(h2,h3)[data-pack-anchor]:focus { outline: none; text-decoration: underline; text-decoration-color: var(--ac); text-decoration-thickness: 1px; text-underline-offset: .2em; }

/* Workspace preferences stay compact; the email preview is isolated from the app. */
.monthly-email-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; min-block-size: 44px; margin-block: 0 8px; font-size: 14px; color: var(--t2); }
.monthly-email-row strong { font-weight: 500; color: var(--t1); margin-inline-start: 8px; }
#monthly-email-dialog .heading { margin-block: 0 12px; gap: 8px; }
#monthly-email-dialog h2 { margin: 0; }
#monthly-email-dialog p { overflow-wrap: anywhere; }
#monthly-email-day { max-inline-size: 160px; }
#monthly-email-error { color: oklch(45% .17 26); }
#monthly-email-preview-panel { border-block-start: 1px solid var(--bd); margin-block-start: 20px; }
#monthly-email-preview-frame { display: block; inline-size: 100%; block-size: min(65dvh, 650px); border: 1px solid var(--bd); border-radius: var(--r); background: white; }
#monthly-month-start { margin-block: 16px; scroll-margin-block-start: 20px; }
@media print { #monthly-email-settings, #monthly-month-start, #monthly-email-dialog { display: none; } }

/* Keep working rows scannable; full notes remain selectable in native details. */
.director-entry { padding-block: 10px; border-block-end: 1px solid var(--bd); min-inline-size: 0; }
.director-entry-row { display: grid; grid-template-columns: minmax(0, 1fr) 110px 145px auto; align-items: center; gap: 8px 20px; font-size: 14px; }
.director-entry-identity { min-inline-size: 0; }
.director-entry-identity strong { display: block; overflow-wrap: anywhere; line-height: 1.4; }
.director-entry-identity > span, .director-entry-status > span { display: block; color: var(--t2); font-size: 13px; }
.director-entry-status > span:first-child { color: var(--t1); font-weight: 600; }
.director-entry-amount { text-align: end; font-weight: 600; font-variant-numeric: tabular-nums; }
.director-entry-actions:empty { display: none; }
.director-entry-actions button { min-block-size: 32px; padding: 4px 10px; font-size: 13px; }
.director-entry-checks { margin-block: 4px 0; font-size: 13px; line-height: 1.5; color: var(--t2); }
.record-notes { margin-block: 2px 0; font-size: 14px; }
.record-notes > summary { display: inline-flex; align-items: center; min-block-size: 32px; padding-block: 4px; list-style: none; color: var(--ac); font-size: 13px; font-weight: 600; }
.record-notes > summary::-webkit-details-marker { display: none; }
.record-notes[open] > summary { text-decoration: underline; }
.record-notes > p, .record-notes dl { max-inline-size: 80ch; }
.record-notes dl { margin-block: 4px 12px; display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 6px 16px; }
.record-notes dt { color: var(--t2); }
.record-notes dd { margin: 0; overflow-wrap: anywhere; }
.record-notes ul { margin: 0; padding-inline-start: 18px; }
@media (max-width: 620px) {
  .director-entry-row { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; }
  .director-entry-status { grid-column: 1; }
  .director-entry-actions { grid-column: 2; grid-row: 2; justify-self: end; }
  .director-entry-status > span { display: inline; }
  .director-entry-status > span + span::before { content: ' · '; }
  .record-notes dl { grid-template-columns: 1fr; gap: 2px; }
  .record-notes dd { margin-block-end: 8px; }
}
@media (pointer: coarse) { .director-entry-actions button, .record-notes > summary { min-block-size: 44px; } }
.director-review-overview { margin-block: 10px; padding-block: 8px; border-block: 1px solid var(--bd); font-size: 14px; }
.director-review-overview p { margin-block: 2px; }
.director-review-links { display: flex; flex-wrap: wrap; gap: 4px 20px; }
.director-review-links a { display: inline-flex; align-items: center; min-block-size: 32px; font-size: 13px; }

/* Compact upload recovery: filename and progress share one scan-friendly row. */
.upload-summary { margin-block: 12px 4px; font-size: 14px; font-weight: 600; }
.upload-files { list-style: none; margin: 0; padding: 0; }
.upload-files li { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; padding-block: 8px; border-block-end: 1px solid var(--bd); font-size: 14px; }
.upload-files li > :first-child { overflow-wrap: anywhere; }
.upload-files li > :last-child { color: var(--t2); text-align: end; }
@media (max-width: 480px) { .upload-files li { grid-template-columns: minmax(0,1fr); gap: 2px; } .upload-files li > :last-child { text-align: start; } }

/* A saved-month review, sharing the existing record and evidence actions. */
.finish-heading { padding-block: 12px; }
.finish-heading h2 { margin-block-end: 4px; }
.finish-table { overflow-x: auto; }
.finish-table table { inline-size: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.finish-table th, .finish-table td { padding: 12px; text-align: end; vertical-align: top; border-block-end: 1px solid var(--bd); }
.finish-table th:first-child, .finish-table td:last-child { text-align: start; }
.finish-table td .text-button { display: block; padding-inline: 0; }
.finish-transactions, .finish-checks, .finish-rules { list-style: none; margin: 0; padding: 0; }
.finish-transactions li, .finish-checks li, .finish-rules li { padding-block: 18px; border-block-end: 1px solid var(--bd); overflow-wrap: anywhere; }
.finish-transaction { display: flex; justify-content: space-between; gap: 24px; }
.finish-transaction > div { min-inline-size: 0; }
.finish-transaction .actions { align-self: start; flex-shrink: 0; max-inline-size: 230px; }
.finish-suggestion { border-inline-start: 3px solid var(--ac); padding-inline-start: 12px; }
@media (max-width: 640px) { .finish-transaction { display: block; } .finish-transaction .actions { max-inline-size: none; margin-block-start: 12px; } .finish-table th, .finish-table td { padding-inline: 8px; } }
@media (max-width: 640px) {
  .finish-table { overflow: visible; }
  .finish-table table, .finish-table tbody { display: block; }
  .finish-table thead { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
  .finish-table tbody tr { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-block-end: 1px solid var(--bd); }
  .finish-table th:first-child, .finish-table td:last-child { grid-column: 1 / -1; }
  .finish-table th, .finish-table td { text-align: start; border: 0; padding: 10px 8px; overflow-wrap: anywhere; }
  .finish-table td::before { content: attr(data-label); display: block; font-size: 13px; color: var(--t2); margin-block-end: 4px; }
}
