/* Conta financeira. Load after hub-theme.css.
   Accounting already uses ac-*; every new rule stays within .ac-page.
   Dialog contents must also have an .ac-page wrapper. */
.ac-page {
  --ac-ink: #20262c;
  --ac-muted: #596673;
  --ac-line: #e3e5e7;
  --ac-surface: #fff;
  --ac-soft: #f5f6f7;
  --ac-accent: #313a43;
  --ac-green: #02542d;
  --ac-green-soft: #edf7ef;
  --ac-amber: #642a02;
  --ac-amber-soft: #fff6de;
  --ac-red: #900b09;
  --ac-red-soft: #fdf0ee;
  min-width: 0;
  max-width: 100%;
  color: var(--ac-ink);
  font: 16px/1.6 var(--font-ui, 'Inter', sans-serif);
}
.ac-page .ac-mobile-nav { display: none; }
@media (max-width: 600px) {
  .ac-page > nav.ac-nav { display: none; }
  .ac-page .ac-mobile-nav { display: grid; gap: 6px; margin: 0 0 24px; font-size: 14px; font-weight: 500; }
  .ac-page .ac-mobile-nav select { width: 100%; min-height: 46px; font: inherit; font-size: 16px; border: 1px solid #ced2d6; border-radius: 8px; color: #20262c; background: #fff; padding: 10px 12px; }
}

.ac-page *, .ac-page *::before, .ac-page *::after { box-sizing: border-box; }
.ac-page [hidden] { display: none !important; }
.ac-page :is(h1, h2, h3, h4, p, dl, dd) { margin: 0; }
.ac-page :is(h1, h2, h3, h4, strong, b) { color: inherit; font-weight: 600; }
.ac-page h1 { font-size: 28px; line-height: 1.25; letter-spacing: -.56px; }
.ac-page h2 { font-size: 18px; line-height: 1.45; letter-spacing: -.3px; }
.ac-page h3 { font-size: 16px; line-height: 1.5; letter-spacing: -.2px; }
.ac-page p { color: #404c58; font-size: 16px; line-height: 1.6; }
.ac-page small, .ac-page .ac-muted { color: var(--ac-muted); font-size: 14px; line-height: 1.5; }
.ac-page :is(p, small, dt, dd, h1, h2, h3) { overflow-wrap: anywhere; }
.ac-page :is(button, a, input, select, textarea, summary):focus-visible {
  outline: 2px solid #1466ae;
  outline-offset: 3px;
}
.ac-page .button { min-height: 44px; font-size: 15px; line-height: 1.45; }
.ac-page .badge { max-width: 100%; font-size: 13px; line-height: 1.4; white-space: normal; }
.ac-page .ac-amount { color: var(--ac-ink); font-variant-numeric: tabular-nums; font-weight: 600; letter-spacing: -.2px; }
.ac-page .ac-amount.positive { color: var(--ac-green); }
.ac-page .ac-amount.negative { color: var(--ac-red); }
.ac-page .ac-section + .ac-section { margin-top: 24px; }
.ac-page .ac-section > :is(h2, h3) { margin-bottom: 16px; }

/* The current account, its state, and the next action share one heading. */
.ac-page .ac-heading {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px 24px;
  margin: 0 0 16px;
}
.ac-page .ac-heading > div { min-width: 0; }
.ac-page .ac-heading h1 { margin: 0; font-size: 28px; line-height: 1.25; letter-spacing: -.56px; font-weight: 600; }
.ac-page .ac-heading p:not(.ac-kicker) { max-width: 72ch; margin: 6px 0 0; color: #404c58; font-size: 15px; line-height: 1.6; }
.ac-page .ac-account-id { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; color: var(--ac-muted); font-size: 14px; }
.ac-page .ac-account-id strong { color: var(--ac-accent); }
.ac-page .ac-heading .ac-account-id { margin-top: 6px; }
.ac-page .ac-nav {
  display: flex;
  align-items: stretch;
  gap: 6px;
  max-width: 100%;
  margin: 0 0 18px;
  padding: 0 0 6px;
  overflow-x: auto;
  border-bottom: 1px solid var(--ac-line);
  white-space: nowrap;
  scrollbar-width: thin;
  scrollbar-color: #aab2ba transparent;
  overscroll-behavior-x: contain;
}
.ac-page .ac-nav :is(a, button) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  gap: 8px;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--ac-accent);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: none;
}
.ac-page .ac-nav :is(a, button):hover { color: #000; background: var(--ac-soft); }
.ac-page .ac-nav :is(.active, .is-active, [aria-current="page"], [aria-selected="true"], [aria-pressed="true"]) {
  border-color: #000;
  background: #000;
  color: #fff;
  font-weight: 600;
  box-shadow: none;
}
.ac-page .ac-nav :is(button:disabled, [aria-disabled="true"]) { color: #748290; background: transparent; border-color: transparent; cursor: default; }

/* Numerals stay aligned; support metrics are quieter than available money. */
.ac-page .ac-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); gap: 16px; margin-bottom: 20px; }
.ac-page .ac-kpi { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; padding: 16px 18px; border: 1px solid var(--ac-line); border-radius: 12px; background: var(--ac-surface); text-align: left; }
.ac-page .ac-kpi > :is(span, dt) { color: #404c58; font-size: 14px; font-weight: 500; }
.ac-page .ac-kpi > :is(strong, dd), .ac-page .ac-kpi > .ac-amount { display: block; max-width: 100%; color: var(--ac-ink); font-size: clamp(24px, 2.2vw, 30px); line-height: 1.3; letter-spacing: -.7px; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ac-page .ac-kpi > small { margin-top: auto; }
.ac-page .ac-kpi.primary, .ac-page .ac-kpi.featured { border-color: #aab2ba; background: #fafafa; }
.ac-page .ac-kpi.primary > :is(strong, dd, .ac-amount), .ac-page .ac-kpi.featured > :is(strong, dd, .ac-amount) { color: #000; }
.ac-page button.ac-kpi:hover { background: var(--ac-soft); border-color: #748290; }
.ac-page .ac-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(270px, 320px); align-items: start; gap: 24px; }
.ac-page .ac-layout:has(> aside:first-child) { grid-template-columns: 260px minmax(0, 1fr); }
.ac-page .ac-layout > *, .ac-page .ac-grid-2 > * { min-width: 0; }
.ac-page .ac-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.ac-page .ac-panel { min-width: 0; border: 1px solid var(--ac-line); border-radius: 12px; background: var(--ac-surface); box-shadow: 0 2px 8px #00000003; }
.ac-page .ac-panel > :is(h2, h3) { padding: 20px 24px 12px; }
.ac-page .ac-panel > p { margin: 16px 24px; }
.ac-page .ac-panel > .button { margin: 0 0 20px 24px; }
.ac-page .ac-panel > .ac-review { margin: 24px; }
.ac-page .ac-panel > .ac-alert { margin: 20px 24px; }
.ac-page .ac-panel > .ac-permissions { padding: 4px 24px 24px; }
.ac-page .ac-panel + .ac-panel { margin-top: 20px; }
.ac-page :is(.ac-layout, .ac-grid-2) > .ac-panel + .ac-panel { margin-top: 0; }
.ac-page .ac-panel-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px 20px; padding: 22px 24px; border-bottom: 1px solid var(--ac-line); }
.ac-page .ac-panel-head > div { min-width: 0; }
.ac-page .ac-panel-head p { margin-top: 5px; max-width: 66ch; font-size: 14px; }
.ac-page .ac-panel-body { padding: 24px; }
.ac-page .ac-panel-body > * + * { margin-top: 12px; }
.ac-page .ac-panel-body > :is(h2, h3) + p { margin-top: 8px; }
.ac-page .ac-panel-body > .ac-muted + :is(h2, h3) { margin-top: 6px; }
.ac-page .ac-panel-body > :is(.ac-row-actions, .ac-timeline) { margin-top: 18px; }
.ac-page .ac-panel-body > .ac-row-actions { justify-content: flex-start; }
.ac-page .ac-panel-body > .button { margin-top: 16px; margin-right: 8px; }
.ac-page .ac-panel-body > .ac-amount { font-size: 24px; line-height: 1.35; }
.ac-page .ac-entry { margin-block: 24px; }
.ac-page .ac-panel > .ac-form { padding: 24px; }
.ac-page .ac-layout > aside.ac-panel { padding: 20px; }
.ac-page .ac-layout > aside.ac-panel > p { margin: 16px 0 0; }
.ac-page .ac-form > .ac-list > .ac-row { padding-inline: 0; }
.ac-page .ac-form > .ac-inset { padding: 0; }
.ac-page .ac-form > .ac-inset > strong + p { margin-top: 8px; }
.ac-page .ac-form > .ac-inset > .button { margin-top: 12px; margin-right: 8px; }
.ac-page .ac-inset { padding: 20px 24px; }
.ac-page .ac-inset > p + p { margin-top: 12px; }
.ac-page .ac-inset > :is(h2, h3) + p { margin-top: 8px; }
.ac-page .ac-inset > :is(.ac-list, .ac-form, .ac-review, .ac-timeline) { margin-top: 16px; }
.ac-page .ac-list { display: flex; flex-direction: column; gap: 0; margin: 0; padding: 0; list-style: none; }
.ac-page .ac-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; min-width: 0; padding: 18px 24px; border-bottom: 1px solid var(--ac-line); }
.ac-page .ac-row:last-child { border-bottom: 0; }
.ac-page .ac-row > div:first-child, .ac-page .ac-row-main { flex: 1 1 180px; min-width: 0; }
.ac-page .ac-row > div > :is(strong, small) { display: block; }
.ac-page .ac-row > div > small { margin-top: 4px; }
.ac-page .ac-row :is(strong, h3) { font-size: 16px; }
.ac-page .ac-row > .ac-amount { flex: 0 0 auto; font-size: 16px; text-align: right; }
.ac-page .ac-row-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.ac-page .ac-inset > .ac-list > .ac-row { padding-inline: 0; }
.ac-page :is(button.ac-row, a.ac-row) { width: 100%; color: inherit; text-align: left; text-decoration: none; }
.ac-page :is(button.ac-row, a.ac-row):hover { background: var(--ac-soft); }

/* Reset the accounting table's fixed first column, right alignment and tiny type. */
.ac-page .ac-table-wrap { max-width: 100%; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: #aab2ba var(--ac-soft); }
.ac-page .ac-panel > .ac-table-wrap:last-child { border-radius: 0 0 12px 12px; }
.ac-page .ac-table { display: table; width: 100%; min-width: 680px; margin: 0; border-collapse: separate; border-spacing: 0; table-layout: auto; background: var(--ac-surface); color: var(--ac-ink); font-size: 14px; font-variant-numeric: tabular-nums; }
.ac-page .ac-table :is(th, td), .ac-page .ac-table tr > :first-child {
  position: relative;
  min-width: 0;
  max-width: none;
  width: auto;
  padding: 15px 20px;
  border: 0;
  border-bottom: 1px solid var(--ac-line);
  background: var(--ac-surface);
  color: var(--ac-ink);
  font-size: 16px;
  line-height: 1.5;
  vertical-align: middle;
  text-align: left;
  white-space: normal;
  box-shadow: none;
}
.ac-page .ac-table thead th, .ac-page .ac-table thead tr > :first-child { background: var(--ac-soft); color: #404c58; font-size: 15px; font-weight: 600; padding-block: 12px; }
.ac-page .ac-table thead th.ac-numeric { text-align: right; }
.ac-page .ac-table tr > :first-child { padding-left: 24px; }
.ac-page .ac-table tr > :last-child { padding-right: 24px; }
.ac-page .ac-table tbody tr { height: auto; }
.ac-page .ac-table tbody tr:hover > :is(th, td) { background: #fafafa; }
.ac-page .ac-table tbody tr:last-child > :is(th, td) { border-bottom: 0; }
.ac-page .ac-table td > strong { display: block; font-size: 16px; }
.ac-page .ac-table :is(small, .ac-muted) { display: block; margin-top: 4px; color: var(--ac-muted); font-size: 14px; line-height: 1.45; font-weight: 400; }
.ac-page .ac-table :is(.ac-amount, .money, .ac-numeric) { text-align: right; white-space: nowrap; }
.ac-page .ac-table .ac-action-cell { min-width: 100px; text-align: right; }
.ac-page .ac-table .ac-action-cell .button { min-height: 42px; padding: 8px 12px; border: 1px solid #ced2d6; border-radius: 8px; color: var(--ac-accent); background: var(--ac-surface); font-size: 14px; }
.ac-page .ac-table .ac-action-cell .button:hover { border-color: #748290; background: var(--ac-soft); color: #000; }
.ac-page .ac-table caption { padding: 14px 20px; color: var(--ac-muted); font-size: 14px; text-align: left; }
.ac-page .ac-toolbar { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 12px 16px; margin-bottom: 20px; }
.ac-page .ac-toolbar > .ac-field { flex: 1 1 180px; }
.ac-page .ac-toolbar > .ac-field:first-child { flex-basis: 180px; max-width: 240px; }
.ac-page .ac-toolbar > form.ac-form { display: flex; flex-wrap: wrap; align-items: flex-end; flex: 2 1 300px; gap: 8px; }
.ac-page .ac-toolbar > form.ac-form > .ac-field { flex: 1 1 180px; }
.ac-page .ac-toolbar > form.ac-form > .button { flex: 0 0 auto; }
.ac-page .ac-panel > .ac-toolbar { margin: 0; padding: 20px 24px; border-bottom: 1px solid var(--ac-line); }

/* State is communicated through words and actions, with color as reinforcement. */
.ac-page .ac-alert { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 12px 20px; margin: 0 0 20px; padding: 18px 20px; border: 1px solid #ced2d6; border-radius: 10px; background: var(--ac-soft); color: var(--ac-accent); }
.ac-page .ac-alert > div { min-width: 0; flex: 1 1 220px; }
.ac-page .ac-alert :is(p, small, strong) { color: inherit; }
.ac-page .ac-alert p { margin-top: 5px; }
.ac-page .ac-alert > p { flex: 1 1 100%; margin-top: 0; }
.ac-page .ac-alert.warning { background: var(--ac-amber-soft); color: var(--ac-amber); border-color: #e8d9a2; }
.ac-page .ac-alert.success { background: var(--ac-green-soft); color: var(--ac-green); border-color: #bdd8c3; }
.ac-page .ac-alert.danger { background: var(--ac-red-soft); color: var(--ac-red); border-color: #e8bcb7; }
.ac-page .ac-inset > .ac-alert:last-child { margin-bottom: 0; }
.ac-page .ac-empty { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 32px 24px; color: var(--ac-muted); }
.ac-page .ac-empty > .icon { width: 28px; height: 28px; color: #748290; }
.ac-page .ac-empty :is(strong, h2, h3) { color: var(--ac-ink); }
.ac-page .ac-empty p { max-width: 62ch; }

.ac-page .ac-form { display: grid; gap: 20px; min-width: 0; }
.ac-page .ac-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; margin: 0; color: #404c58; font-size: 16px; line-height: 1.5; }
.ac-page .ac-field > :is(label, span) { font-weight: 500; }
.ac-page .ac-field :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
.ac-page .ac-toolbar > :is(input, select) { width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px; border: 1px solid #aab2ba; border-radius: 8px; background: var(--ac-surface); color: var(--ac-ink); font-size: 16px; line-height: 1.5; box-shadow: none; }
.ac-page .ac-field select { padding-right: 32px; }
.ac-page .ac-field textarea { min-height: 110px; resize: vertical; }
.ac-page .ac-field input::placeholder, .ac-page .ac-field textarea::placeholder { color: #748290; }
.ac-page .ac-field :is(input, select, textarea):disabled { color: #596673; background: var(--ac-soft); border-color: #ced2d6; cursor: not-allowed; }
.ac-page .ac-field [aria-invalid="true"] { border-color: var(--ac-red); }
.ac-page .ac-field .ac-error { color: var(--ac-red); font-size: 14px; }
.ac-page .ac-field :is(input[type="checkbox"], input[type="radio"]) { flex: 0 0 auto; width: 18px; height: 18px; margin: 2px 0; accent-color: var(--ac-accent); }
.ac-page .ac-field.ac-check, .ac-page .ac-permissions label { flex-direction: row; align-items: flex-start; gap: 10px; }
.ac-page .confirm-line { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; margin: 12px 0; color: #404c58; font-size: 14px; line-height: 1.6; }
.ac-page .confirm-line input { width: 18px; height: 18px; margin-top: 3px; flex-shrink: 0; accent-color: var(--ac-accent); }
.ac-page .ac-permissions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ac-page .ac-permissions label { display: flex; min-height: 48px; padding: 12px 14px; border: 1px solid var(--ac-line); border-radius: 8px; color: var(--ac-accent); font-size: 14px; }
.ac-page .ac-permissions input { width: 18px; height: 18px; margin: 3px 0 0; flex-shrink: 0; accent-color: var(--ac-accent); }
.ac-page .ac-permissions label:has(input:checked) { background: var(--ac-soft); border-color: #aab2ba; }
.ac-page .ac-permissions label:has(input:disabled) { color: var(--ac-muted); }

.ac-page .ac-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 0 0 24px; padding: 0; list-style: none; counter-reset: account-step; }
.ac-page .ac-step { position: relative; min-width: 0; padding: 14px; border: 1px solid var(--ac-line); border-radius: 8px; background: var(--ac-surface); color: var(--ac-muted); text-align: left; }
.ac-page .ac-step :is(strong, small) { display: block; }
.ac-page .ac-step strong { font-size: 14px; color: var(--ac-accent); }
.ac-page .ac-step small { margin-top: 5px; font-size: 14px; }
.ac-page aside > .ac-steps { grid-template-columns: minmax(0, 1fr); }
.ac-page .ac-step > .button { width: 100%; min-height: 44px; padding: 6px 0; justify-content: flex-start; color: var(--ac-accent); text-align: left; }
.ac-page .ac-step > span { display: block; color: var(--ac-muted); font-size: 14px; }
.ac-page .ac-step.current, .ac-page .ac-step.active, .ac-page .ac-step[aria-current="step"] { border-color: var(--ac-accent); background: var(--ac-soft); box-shadow: inset 0 3px 0 var(--ac-accent); }
.ac-page .ac-step.done, .ac-page .ac-step.complete { border-color: #bdd8c3; background: var(--ac-green-soft); }
.ac-page .ac-step.done strong, .ac-page .ac-step.complete strong { color: var(--ac-green); }
.ac-page .ac-step.blocked { border-color: #e8d9a2; background: var(--ac-amber-soft); }
.ac-page .ac-review { display: grid; gap: 0; margin: 0; padding: 0; border: 1px solid var(--ac-line); border-radius: 10px; background: #fafafa; }
.ac-page .ac-review > div { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px 24px; padding: 14px 18px; border-bottom: 1px solid var(--ac-line); }
.ac-page .ac-review > div:last-child { border-bottom: 0; }
.ac-page .ac-review :is(dt, span) { color: var(--ac-muted); font-size: 14px; }
.ac-page .ac-review :is(dd, strong) { max-width: 65%; color: var(--ac-ink); font-size: 16px; text-align: right; overflow-wrap: anywhere; }
.ac-page .ac-review .ac-amount { font-size: 16px; }
.ac-page .ac-timeline { margin: 0; padding: 0; list-style: none; }
.ac-page .ac-panel > .ac-timeline { margin: 4px 24px 24px 30px; }
.ac-page .ac-timeline > li { position: relative; margin: 0; padding: 0 0 24px 27px; border-left: 1px solid #ced2d6; }
.ac-page .ac-timeline > li:last-child { padding-bottom: 0; border-left-color: transparent; }
.ac-page .ac-timeline > li::before { position: absolute; top: 6px; left: -5px; width: 9px; height: 9px; border: 2px solid #fff; border-radius: 50%; background: #748290; box-shadow: 0 0 0 1px #aab2ba; content: ''; }
.ac-page .ac-timeline > li.success::before, .ac-page .ac-timeline > li.done::before { background: var(--ac-green); box-shadow: 0 0 0 1px #bdd8c3; }
.ac-page .ac-timeline :is(strong, time, small) { display: block; font-size: 14px; }
.ac-page .ac-timeline :is(time, small) { margin-top: 4px; color: var(--ac-muted); }
.ac-page .ac-timeline p { margin-top: 5px; }
.ac-page .ac-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--ac-line); color: var(--ac-muted); font-size: 14px; }
.ac-page .ac-footer > div { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ac-page .ac-panel > .ac-footer { margin: 0; padding: 18px 24px; }
.ac-page .ac-form > .ac-footer { margin-top: 4px; }
.ac-page .ac-pills { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ac-page .ac-pill { display: inline-flex; align-items: center; gap: 7px; padding: 6px 10px; border: 1px solid #ced2d6; border-radius: 7px; background: var(--ac-surface); color: #404c58; font-size: 14px; line-height: 1.4; }
.ac-page button.ac-pill { min-height: 42px; }
.ac-page .ac-pill.active, .ac-page .ac-pill[aria-pressed="true"] { border-color: var(--ac-accent); background: var(--ac-soft); color: var(--ac-ink); font-weight: 600; }
.ac-page .ac-pill.success { color: var(--ac-green); background: var(--ac-green-soft); border-color: #bdd8c3; }
.ac-page .ac-pill.warning { color: var(--ac-amber); background: var(--ac-amber-soft); border-color: #e8d9a2; }
.ac-page .ac-pill.danger { color: var(--ac-red); background: var(--ac-red-soft); border-color: #e8bcb7; }

/* The demonstration controls remain visually separate from customer work. */
.ac-page .ac-scenario-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 16px; min-height: 40px; margin: 0 0 8px; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--ac-muted); }
.ac-page .ac-scenario-bar > div { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; min-width: 0; }
.ac-page .ac-scenario-bar .button { min-height: 36px; padding: 6px 10px; font-size: 14px; }
.ac-page .ac-scenario-bar > .ac-demo-tag { padding: 0; border: 0; background: transparent; color: var(--ac-muted); }
.ac-page .ac-scenario-bar label { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 14px; }
.ac-page .ac-scenario-bar select { max-width: 100%; min-height: 42px; font-size: 14px; }
.ac-page details.ac-scenario-bar { display: block; margin-top: 20px; padding-top: 12px; border-top: 1px solid var(--ac-line); }
.ac-page .ac-panel > details.ac-scenario-bar { margin: 20px 24px 24px; padding-top: 16px; }
.ac-page .ac-panel-head + .ac-timeline { margin-top: 20px; }
.ac-page .ac-scenario-bar > summary { display: list-item; min-height: 28px; color: var(--ac-accent); font-size: 14px; font-weight: 500; cursor: pointer; }
.ac-page .ac-scenario-bar[open] > p { margin-top: 12px; }
.ac-page .ac-scenario-bar[open] > .button { margin-top: 12px; }
.ac-page .ac-scenario-bar[open] > .ac-toolbar { margin: 16px 0 0; justify-content: flex-start; }
.ac-page .ac-demo-tag { display: inline-flex; align-items: center; flex: 0 0 auto; width: fit-content; gap: 6px; padding: 4px 8px; border: 1px solid #ced2d6; border-radius: 5px; background: var(--ac-soft); color: #404c58; font-size: 13px; line-height: 1.4; font-weight: 500; letter-spacing: 0; }
.ac-page .ac-document, .ac-page .ac-receipt { min-width: 0; margin: 0; padding: 24px; border: 1px solid var(--ac-line); border-radius: 10px; background: var(--ac-surface); color: var(--ac-ink); font-size: 14px; line-height: 1.6; box-shadow: none; }
.ac-page .ac-document :is(h2, h3), .ac-page .ac-receipt :is(h2, h3) { margin: 16px 0 8px; color: var(--ac-ink); font-size: 18px; }
.ac-page .ac-document > .button { margin-top: 12px; }
.ac-page .ac-document > p, .ac-page .ac-receipt > p { color: #404c58; font-size: 14px; line-height: 1.6; }
.ac-page :is(.ac-document, .ac-receipt) > .ac-amount { display: block; margin: 20px 0; color: var(--ac-ink); font-size: 30px; line-height: 1.3; letter-spacing: -.6px; }
.ac-page :is(.ac-document, .ac-receipt) dl { margin: 20px 0 0; color: var(--ac-ink); font-size: 14px; }
.ac-page :is(.ac-document, .ac-receipt) dl > div { display: grid; grid-template-columns: minmax(110px, .7fr) minmax(0, 1.3fr); gap: 12px 24px; margin: 0; padding: 13px 0; border-bottom: 1px solid var(--ac-line); }
.ac-page :is(.ac-document, .ac-receipt) dl > div:last-child { border-bottom: 0; }
.ac-page :is(.ac-document, .ac-receipt) dt { color: var(--ac-muted); }
.ac-page :is(.ac-document, .ac-receipt) dd { max-width: none; margin: 0; color: var(--ac-ink); text-align: right; overflow-wrap: anywhere; }
.ac-page :is(.ac-document, .ac-receipt) .ac-footer { font-size: 14px; }

/* Dashboard geometry makes available money and the next task the first reading. */
.ac-page .ac-balance-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 28px; margin-bottom: 24px; padding: 24px; border: 1px solid #d9dfe5; border-radius: 14px; background: #fff; box-shadow: 0 4px 18px #20262c04; }
.ac-page .ac-balance-main { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.ac-page .ac-balance-button { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; width: fit-content; max-width: 100%; padding: 0; color: var(--ac-ink); text-align: left; }
.ac-page .ac-balance-button > span { display: flex; align-items: center; gap: 8px; color: #404c58; font-size: 16px; }
.ac-page .ac-balance-button .icon { width: 16px; height: 16px; color: #748290; }
.ac-page .ac-balance-button > strong { font-size: clamp(32px, 3.1vw, 44px); line-height: 1.2; letter-spacing: -1.2px; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ac-page .ac-balance-button:hover > strong { color: #344e66; }
.ac-page .ac-balance-main > p { margin-top: 8px; color: var(--ac-muted); font-size: 14px; }
.ac-page .ac-balance-breakdown { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--ac-line); }
.ac-page .ac-balance-breakdown dt { color: var(--ac-muted); font-size: 14px; }
.ac-page .ac-balance-breakdown dd { margin-top: 5px; color: var(--ac-ink); font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; }
.ac-page .ac-next-step { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 10px; min-width: 0; padding: 20px 22px; border-radius: 10px; background: #f5f7f9; }
.ac-page .ac-overline { display: inline-flex; align-items: center; gap: 8px; color: #465766; font-size: 14px; font-weight: 600; }
.ac-page .ac-overline::before { width: 6px; height: 6px; border-radius: 50%; background: #344e66; content: ''; }
.ac-page .ac-next-step.warning .ac-overline::before { background: #a2682a; }
.ac-page .ac-next-step.success .ac-overline::before { background: #347653; }
.ac-page .ac-next-step h2 { font-size: 22px; line-height: 1.35; letter-spacing: -.45px; }
.ac-page .ac-next-step p { color: #465766; font-size: 15px; line-height: 1.6; }
.ac-page .ac-next-step > div { margin-top: 4px; }
.ac-page .ac-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.ac-page .ac-dashboard-column { display: grid; min-width: 0; gap: 24px; }
.ac-page .ac-dashboard-column > .ac-panel + .ac-panel { margin-top: 0; }
.ac-page .ac-dashboard-grid .ac-panel-head { padding: 20px 22px; }
.ac-page .ac-agenda-list { display: grid; }
.ac-page .ac-agenda-row { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: start; gap: 14px; padding: 20px 22px; border-bottom: 1px solid var(--ac-line); }
.ac-page .ac-agenda-row:last-child { border-bottom: 0; }
.ac-page .ac-agenda-row > time { display: flex; flex-direction: column; align-items: center; gap: 0; padding: 7px 4px; border: 1px solid var(--ac-line); border-radius: 8px; background: #fafbfc; }
.ac-page .ac-agenda-row > time strong { color: #313a43; font-size: 20px; line-height: 1.15; }
.ac-page .ac-agenda-row > time span { color: var(--ac-muted); font-size: 14px; line-height: 1.4; }
.ac-page .ac-agenda-info { min-width: 0; }
.ac-page .ac-agenda-info > strong { display: block; font-size: 16px; line-height: 1.5; overflow-wrap: anywhere; }
.ac-page .ac-agenda-info > p { margin-top: 3px; color: var(--ac-muted); font-size: 14px; line-height: 1.55; }
.ac-page .ac-agenda-info > .badge { margin-top: 9px; }
.ac-page .ac-agenda-value { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.ac-page .ac-agenda-value > strong { white-space: nowrap; font-size: 16px; font-variant-numeric: tabular-nums; }
.ac-page .ac-agenda-value > .button { padding: 7px 0 7px 8px; font-size: 14px; }
.ac-page .ac-coverage { padding: 18px 22px 16px; border-top: 1px solid var(--ac-line); background: #fafbfc; border-radius: 0 0 12px 12px; }
.ac-page .ac-coverage-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; font-size: 14px; }
.ac-page .ac-coverage-heading strong { color: #344e66; }
.ac-page .ac-coverage-track { height: 6px; overflow: hidden; margin-top: 12px; border-radius: 3px; background: #e6ebef; }
.ac-page .ac-coverage-track > span { display: block; height: 100%; border-radius: inherit; background: #344e66; }
.ac-page .ac-coverage > p { margin-top: 10px; color: var(--ac-muted); font-size: 14px; line-height: 1.6; }
.ac-page .ac-coverage > .button { margin-top: 8px; padding-inline: 0; }
.ac-page .ac-balance-chart { margin: 0; padding: 20px 22px; }
.ac-page .ac-balance-chart > figcaption { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px 12px; }
.ac-page .ac-balance-chart > figcaption p { margin-top: 5px; font-size: 14px; color: var(--ac-muted); }
.ac-page .ac-balance-chart > figcaption > .button { padding: 6px 0; }
.ac-page .ac-waterfall { display: block; width: 100%; height: auto; margin-top: 20px; overflow: visible; }
.ac-page .ac-waterfall-bar.opening { fill: #bcc6cf; }
.ac-page .ac-waterfall-bar.incoming { fill: #344e66; }
.ac-page .ac-waterfall-bar.outgoing { fill: #c87564; }
.ac-page .ac-waterfall-bar.balance { fill: #202b36; }
.ac-page .ac-waterfall-baseline { stroke: #dfe5e9; stroke-width: 1; }
.ac-page .ac-waterfall-connector { stroke: #aab7c1; stroke-width: 1; stroke-dasharray: 4 4; }
.ac-page .ac-waterfall-zero { stroke: #82909d; stroke-width: 2; }
.ac-page .ac-chart-values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 18px; margin-top: 20px; }
.ac-page .ac-chart-values dt { display: flex; align-items: center; gap: 7px; color: var(--ac-muted); font-size: 14px; }
.ac-page .ac-chart-values dt i { flex-shrink: 0; width: 9px; height: 9px; border-radius: 2px; background: #bcc6cf; }
.ac-page .ac-chart-values .incoming dt i { background: #344e66; }
.ac-page .ac-chart-values .outgoing dt i { background: #c87564; }
.ac-page .ac-chart-values .balance dt i { background: #202b36; }
.ac-page .ac-chart-values dd { margin-top: 5px; color: var(--ac-ink); font-size: 18px; line-height: 1.4; font-weight: 600; font-variant-numeric: tabular-nums; }
.ac-page .ac-chart-caption { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--ac-line); color: var(--ac-muted); font-size: 14px; line-height: 1.6; }
.ac-page .ac-chart-masked { display: grid; place-items: center; min-height: 130px; margin-top: 20px; border-radius: 8px; background: #f5f7f9; color: var(--ac-muted); font-size: 16px; }
.ac-page .ac-reading-heading { display: flex; align-items: center; gap: 12px; }
.ac-page .ac-reading-mark { display: inline-grid; flex: 0 0 auto; place-items: center; width: 38px; height: 38px; border: 1px solid #dbe2e8; border-radius: 10px; background: #f0f4f7; color: #344e66; }
.ac-page .ac-reading-mark .icon { width: 20px; height: 20px; }
.ac-page .ac-reading-list { display: grid; }
.ac-page .ac-reading-row { display: flex; align-items: flex-start; gap: 12px; padding: 18px 22px; border-bottom: 1px solid var(--ac-line); text-decoration: none; }
.ac-page .ac-reading-row:last-child { border-bottom: 0; }
.ac-page .ac-reading-row:hover { background: #fafbfc; }
.ac-page .ac-reading-row > div { flex: 1; min-width: 0; }
.ac-page .ac-reading-row strong { display: block; font-size: 16px; line-height: 1.5; }
.ac-page .ac-reading-row p { margin-top: 4px; color: var(--ac-muted); font-size: 14px; line-height: 1.6; }
.ac-page .ac-reading-icon { display: inline-flex; flex: 0 0 auto; margin-top: 3px; color: #586b7c; }
.ac-page .ac-reading-row > .icon { flex: 0 0 auto; margin-top: 4px; color: #748290; }
.ac-page .ac-reading-footer { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 14px 22px; border-top: 1px solid var(--ac-line); color: var(--ac-muted); font-size: 14px; }
.ac-page .ac-reading-evidence { margin-top: 20px; }
.ac-page .ac-summary-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.ac-page .ac-receivables-summary { background: #fafbfc; }
.ac-page .ac-receivables-summary .ac-amount { font-size: 28px; }
.ac-page .ac-start { max-width: 780px; }
.ac-page .ac-start .ac-panel-body { padding: 32px; }
.ac-page .ac-start .ac-panel-body > h2 { font-size: 24px; }
.ac-page .ac-start .ac-timeline { margin-left: 5px; }
dialog:has(.ac-scenario-grid) { width: min(1040px, calc(100vw - 64px)); max-width: calc(100vw - 64px); }
.ac-page .ac-scenario-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 20px; }
.ac-page .ac-scenario-card { display: flex; flex-direction: column; justify-content: space-between; gap: 16px; min-width: 0; padding: 20px; border: 1px solid var(--ac-line); border-radius: 10px; background: #fff; }
.ac-page .ac-scenario-card strong { display: block; font-size: 16px; }
.ac-page .ac-scenario-card p { margin-top: 7px; font-size: 14px; line-height: 1.6; }
.ac-page .ac-scenario-card > .button { align-self: flex-start; padding-inline: 0; }
.ac-page .ac-scenario-card:hover { border-color: #aab7c1; background: #fafbfc; }

@media (max-width: 1200px) {
  .ac-page .ac-layout, .ac-page .ac-layout:has(> aside:first-child) { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .ac-page aside > .ac-steps { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
  .ac-page .ac-layout > .ac-panel + .ac-panel { margin-top: 0; }
  .ac-page .ac-kpis { gap: 12px; }
  .ac-page .ac-kpi { padding: 16px 18px; }
}

@media (max-width: 1100px) {
  .ac-page .ac-dashboard-grid { grid-template-columns: minmax(0, 1fr); }
  .ac-page .ac-balance-hero { gap: 20px; }
  .ac-page .ac-next-step { padding: 18px; }
}

@media (max-width: 1000px) {
  .ac-page .ac-scenario-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .ac-page .ac-balance-hero { grid-template-columns: minmax(0, 1fr); padding: 20px; gap: 20px; }
  .ac-page .ac-balance-button > strong { font-size: 38px; }
  .ac-page .ac-balance-breakdown { margin-top: 18px; }
  .ac-page .ac-next-step { padding: 18px; }
  .ac-page .ac-dashboard-grid, .ac-page .ac-dashboard-column { gap: 20px; }
  .ac-page .ac-scenario-grid { grid-template-columns: minmax(0, 1fr); }
  .ac-page .ac-grid-2 { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .ac-page .ac-heading { flex-direction: column; gap: 16px; }
  .ac-page .ac-heading > .ac-pills { width: 100%; }
  .ac-page .ac-heading h1 { font-size: 26px; }
  .ac-page .ac-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; overflow: visible; white-space: normal; }
  .ac-page .ac-nav :is(a, button) { min-width: 0; min-height: 44px; height: 100%; padding: 10px 8px; border: 1px solid var(--ac-line); white-space: normal; overflow-wrap: anywhere; }
  .ac-page .ac-nav :is(.active, .is-active, [aria-current="page"], [aria-selected="true"], [aria-pressed="true"]) { border-color: #000; background: #000; color: #fff; }
  .ac-page .ac-panel-head, .ac-page .ac-panel-body, .ac-page .ac-panel > .ac-form, .ac-page .ac-inset { padding: 20px; }
  .ac-page .ac-panel > .ac-review { margin: 20px; }
  .ac-page .ac-panel > .ac-alert, .ac-page .ac-panel > details.ac-scenario-bar { margin-inline: 20px; }
  .ac-page .ac-row { padding: 16px 20px; gap: 12px; }
  .ac-page .ac-panel > .ac-toolbar, .ac-page .ac-panel > .ac-footer { padding: 16px 20px; }
  .ac-page .ac-table { min-width: 620px; }
  .ac-page .ac-table :is(th, td), .ac-page .ac-table tr > :first-child { padding: 14px 16px; }
  .ac-page .ac-table tr > :first-child { padding-left: 20px; }
  .ac-page .ac-table tr > :last-child { padding-right: 20px; }
  .ac-page .ac-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ac-page .ac-document, .ac-page .ac-receipt { padding: 20px; }
}

@media (max-width: 480px) {
  .ac-page .ac-balance-breakdown { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .ac-page .ac-balance-breakdown > div { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; }
  .ac-page .ac-balance-breakdown dd { margin: 0; }
  .ac-page .ac-next-step h2 { font-size: 21px; }
  .ac-page .ac-next-step > div, .ac-page .ac-next-step .button { width: 100%; }
  .ac-page .ac-agenda-row { grid-template-columns: 40px minmax(0, 1fr); gap: 12px; padding: 18px; }
  .ac-page .ac-agenda-value { grid-column: 2; flex-direction: row; justify-content: space-between; align-items: center; }
  .ac-page .ac-agenda-value > .button { padding-right: 0; }
  .ac-page .ac-balance-chart, .ac-page .ac-coverage, .ac-page .ac-reading-row { padding-inline: 18px; }
  .ac-page .ac-chart-values { gap: 16px 12px; }
  .ac-page .ac-chart-values dd { font-size: 17px; }
  .ac-page .ac-start .ac-panel-body { padding: 24px; }
  .ac-page .ac-heading h1 { font-size: 24px; line-height: 1.3; }
  .ac-page .ac-heading p:not(.ac-kicker) { font-size: 14px; }
  .ac-page .ac-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 20px; }
  .ac-page .ac-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 20px; }
  .ac-page .ac-kpi { padding: 16px 14px; }
  .ac-page .ac-kpi > :is(strong, dd, .ac-amount) { font-size: 22px; letter-spacing: -.5px; }
  .ac-page .ac-kpi.primary, .ac-page .ac-kpi.featured { grid-column: 1 / -1; }
  .ac-page .ac-kpi.primary > :is(strong, dd, .ac-amount), .ac-page .ac-kpi.featured > :is(strong, dd, .ac-amount) { font-size: 30px; }
  .ac-page .ac-button, .ac-page .button, .ac-page .button.small, .ac-page button.ac-pill, .ac-page .ac-table .ac-action-cell .button { min-height: 44px; }
  .ac-page .ac-permissions { grid-template-columns: minmax(0, 1fr); }
  .ac-page .ac-field :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea), .ac-page .ac-toolbar > :is(input, select), .ac-page .ac-scenario-bar select { font-size: 16px; }
  .ac-page .ac-toolbar > .ac-field, .ac-page .ac-toolbar > .ac-field:first-child { flex-basis: 100%; max-width: none; }
  .ac-page .ac-toolbar > form.ac-form { flex-basis: 100%; }
  .ac-page .ac-toolbar > form.ac-form > .ac-field { flex-basis: 160px; }
  .ac-page .ac-review > div { flex-direction: column; gap: 4px; }
  .ac-page .ac-review :is(dd, strong) { max-width: 100%; text-align: left; }
  .ac-page .ac-footer > div { width: 100%; }
  .ac-page .ac-footer .button { flex: 1 1 auto; }
  .ac-page .ac-row-actions { justify-content: flex-start; }
  .ac-page .ac-alert { padding: 16px; }
  .ac-page .ac-empty { padding: 24px 20px; }
  .ac-page .ac-scenario-bar { align-items: flex-start; }
  .ac-page .ac-scenario-bar .button { min-height: 44px; }
  .ac-page .ac-scenario-bar > .ac-demo-tag { flex: 1 1 100%; }
  .ac-page .ac-scenario-bar label, .ac-page .ac-scenario-bar select { width: 100%; }
  .ac-page .ac-scenario-bar > summary { min-height: 44px; }
  .ac-page :is(.ac-document, .ac-receipt) dl > div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .ac-page :is(.ac-document, .ac-receipt) dd { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  .ac-page *, .ac-page *::before, .ac-page *::after { scroll-behavior: auto; transition: none; animation: none; }
}

@media print {
  .ac-page { color: #20262c; background: #fff; }
  .ac-page :is(.ac-nav, .ac-scenario-bar, .ac-toolbar, .ac-footer .button) { display: none; }
  .ac-page .ac-layout, .ac-page .ac-grid-2 { display: block; }
  .ac-page .ac-dashboard-grid, .ac-page .ac-dashboard-column, .ac-page .ac-balance-hero { display: block; }
  .ac-page .ac-balance-chart, .ac-page .ac-balance-hero { break-inside: avoid; }
  .ac-page .ac-dashboard-column > .ac-panel { margin-top: 20px; }
  .ac-page .ac-panel, .ac-page .ac-document, .ac-page .ac-receipt { margin-bottom: 20px; background: #fff; color: #20262c; box-shadow: none; break-inside: avoid; }
  .ac-page .ac-table-wrap { overflow: visible; }
  .ac-page .ac-table { width: 100%; min-width: 0; table-layout: auto; }
  .ac-page .ac-table :is(th, td), .ac-page .ac-table tr > :first-child { min-width: 0; padding: 8px; font-size: 12px; background: #fff; color: #20262c; }
  .ac-page .ac-table :is(.ac-amount, .money, .ac-numeric) { white-space: normal; }
}

@media (max-width: 600px) {
  dialog:has(.ac-page), dialog.drawer:has(.ac-page) { width: 100%; max-width: 100%; left: 0; right: 0; box-sizing: border-box; }
}