/* Shared account shell, with a quieter commercial presentation for institutions. */
.institution-billing-history { display: grid; gap: 8px; padding: 6px 0 12px; }
#appShell .institution-history-item { display: grid; grid-template-columns: .8fr 1fr 1.4fr 1.4fr; align-items: center; gap: 12px; text-align: left; min-height: 60px; padding: 12px 16px; border: 1px solid #d2ddd4; border-radius: 8px; background: #f8faf5; color: #526b5b; font: inherit; cursor: pointer; min-width: 0; }
#appShell .institution-history-item span { font-size: 12px; }
#appShell .institution-history-item strong { font-size: 15px; font-weight: 500; color: #294837; }
#appShell .institution-history-item small { font-size: 11px; }
#appShell .institution-history-item.is-selected { border-color: #64866e; background: #e9f1e8; }
#appShell .institution-history-amount { display: grid; gap: 4px; min-width: 0; }
#appShell .institution-history-item strong { overflow-wrap: anywhere; }
#appShell .institution-statement-heading { display: flex; align-items: start; justify-content: space-between; gap: 20px; }
#appShell .institution-statement-heading p { font-size: 12px; overflow-wrap: anywhere; }
#appShell .institution-statement-lock { padding: 13px 16px; margin: 20px 0 !important; border-left: 3px solid #759781; background: #edf3e9; font-size: 13px; }
#appShell .institution-statement-totals { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px; margin: 24px 0; }
#appShell .institution-statement-totals dt { color: #667c6d; font-size: 12px; margin-bottom: 8px; }
#appShell .institution-statement-totals dd { margin: 0; font-size: 19px; color: #2c4e3c; font-weight: 500; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
#appShell .institution-statement-totals small { font-size: 11px; font-weight: 400; }
#appShell .institution-public-records { border-top: 1px solid #dde5dc; margin-top: 22px; padding-top: 14px; }
#appShell .institution-public-records h4 { font-size: 14px; font-weight: 600; color: #315340; }
#appShell .institution-public-records > div { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; font-size: 13px; color: #516d5a; }
#appShell .institution-public-records small { display: block; font-size: 11px; color: #748577; margin-top: 5px; }
#appShell .institution-public-records strong { font-weight: 500; overflow-wrap: anywhere; }
#appShell .institution-summary-heading { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin: 30px 0 18px; }
#appShell .institution-summary-heading h3 { margin: 0; font-size: 22px; }
#appShell .institution-currency-field { display: grid; flex: .8 1 160px; gap: 8px; min-width: 0; color: #607369; font-size: 12px; }
#appShell .institution-currency-switch { display: flex; min-height: 44px; border: 1px solid #c9d5ca; border-radius: 7px; overflow: hidden; background: #f3f6ef; }
#appShell .institution-currency-switch button { flex: 1 1 0; min-width: 0; border: 0; border-radius: 5px; background: transparent; padding: 10px 16px; color: #365548; font: inherit; font-size: 16px; cursor: pointer; }
#appShell .institution-currency-switch button.is-selected { background: #304f42; color: #fff; }
#appShell .institution-currency-switch > span { padding: 12px; }
#appShell .institution-payment-overview { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; margin: 26px 0 18px; }
#appShell .institution-payment-due { display: flex; flex-direction: column; gap: 12px; min-width: 0; color: #526f61; font-size: 14px; }
#appShell .institution-payment-due strong { font-size: clamp(32px, 3.5vw, 46px); line-height: 1.25; color: #234a37; font-weight: 500; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
#appShell .institution-payment-due small { font-size: 14px; font-weight: 400; }
#appShell .institution-payment-summary { margin: 0; border-left: 1px solid #dde5dc; padding-left: 30px; display: grid; align-content: start; gap: 16px; min-width: 0; }
#appShell .institution-payment-summary > div { display: flex; justify-content: space-between; gap: 20px; align-items: baseline; font-size: 14px; color: #526f61; }
#appShell .institution-payment-summary dd { margin: 0; text-align: right; color: #234a37; font-size: 20px; font-weight: 500; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; min-width: 0; }
#appShell .institution-payment-summary dt { flex-shrink: 0; }
#appShell .institution-payment-summary small { font-size: 12px; font-weight: 400; }
#appShell .institution-payment-summary .institution-payment-note { font-size: 12px; color: #6a7c73; }
#appShell p.institution-lock-note { margin-bottom: 24px; }
#appShell .institution-disclosure { border-top: 1px solid #dce4db; }
#appShell .institution-disclosure > summary { display: flex; align-items: center; gap: 14px; min-height: 60px; padding: 15px 0; color: #2f5141; cursor: pointer; list-style: none; font-size: 14px; font-weight: 500; box-sizing: border-box; }
#appShell .institution-disclosure > summary::-webkit-details-marker { display: none; }
#appShell .institution-disclosure > summary::after { content: ''; flex: 0 0 7px; width: 7px; height: 7px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); margin: 0 4px 0 auto; }
#appShell .institution-disclosure[open] > summary::after { transform: rotate(135deg); }
#appShell .institution-disclosure > summary > small { margin-left: auto; font-size: 12px; font-weight: 400; color: #6a7c73; }
#appShell .institution-disclosure > summary > small + * { margin-left: 0; }
#appShell .institution-disclosure > summary:has(small)::after { margin-left: 0; }
#appShell .institution-disclosure .institution-public-records { margin: 0; padding: 0 0 14px; border-top: 0; }
#appShell .institution-disclosure .institution-note { padding-bottom: 12px; }
#appShell .institution-card.institution-history { padding: 0 28px; }
#appShell .institution-view summary:focus-visible, #appShell .institution-view button:focus-visible { outline: 2px solid #557b66; outline-offset: 3px; }
#appShell p.institution-report-status.is-error { color: #a13e38; }
@media (max-width: 760px) {
  #appShell .institution-statement-heading { flex-wrap: wrap; gap: 14px; }
  #appShell .institution-statement-totals { grid-template-columns: 1fr; gap: 14px; }
  #appShell .institution-statement-totals > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
  #appShell .institution-statement-totals dd { font-size: 16px; text-align: right; }
  #appShell .institution-public-records > div { flex-wrap: wrap; }
  #appShell .institution-payment-overview { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  #appShell .institution-payment-summary { padding: 20px 0 0; border-left: 0; border-top: 1px solid #dde5dc; }
  #appShell .institution-summary-heading { margin-top: 24px; }
  #appShell .institution-summary-heading h3 { font-size: 20px; }
  #appShell .institution-history-item { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #appShell .institution-card.institution-history { padding: 0 18px; }
}
#appShell .institution-view[hidden], #appShell [data-service-nav][hidden] { display: none !important; }
#appShell .institution-view { display: grid; gap: 20px; }
#appShell .institution-view h3 { margin: 6px 0 12px; color: var(--workspace-ink, #172b23); font-size: clamp(20px, 2vw, 26px); font-weight: 600; line-height: 1.4; }
#appShell .institution-view p { margin: 0; line-height: 1.8; color: var(--workspace-muted, #61766d); }
#appShell .institution-hero { position: relative; overflow: hidden; padding: 38px; border: 1px solid #cbd9cf; border-radius: 14px; background: #e7eee5 url('/assets/brainoff-architecture-20260910.png') right center / auto 100% no-repeat; }
#appShell .institution-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #e7eee5 20%, #e7eee5ee 50%, #e7eee580); }
#appShell .institution-hero-copy { position: relative; max-width: 720px; }
#appShell .institution-hero h3 { font-size: clamp(24px, 3vw, 34px); }
#appShell .institution-pill { display: inline-flex; align-items: center; padding: 5px 12px; border: 1px solid #a9c0b1; background: #eff5ef; border-radius: 30px; color: #355d4b; font-size: 12px; font-weight: 500; white-space: nowrap; }
#appShell .institution-hero .institution-pill { margin-top: 22px; }
#appShell .institution-columns { display: grid; grid-template-columns: 1.1fr 1fr; gap: 20px; }
#appShell .institution-card { min-width: 0; padding: 28px; border: 1px solid var(--workspace-line, #d4ddd5); border-radius: 14px; background: var(--workspace-surface, #fafbf7); }
#appShell .institution-section-head { margin-bottom: 18px; }
#appShell .institution-detail { margin: 0 0 22px; }
#appShell .institution-detail > div { display: grid; grid-template-columns: minmax(95px, 1fr) minmax(0, 1.6fr); gap: 18px; padding: 15px 0; border-bottom: 1px solid #e0e6df; font-size: 14px; }
#appShell .institution-detail dt { color: #687c71; }
#appShell .institution-detail dd { margin: 0; text-align: right; color: #223b2f; overflow-wrap: anywhere; font-weight: 500; }
#appShell p.institution-note { font-size: 12px; color: #6a7c73; }
#appShell .institution-text-link { display: inline-flex; gap: 14px; align-items: center; margin-top: 22px; color: #355b47; text-decoration: none; font-size: 14px; font-weight: 500; }
#appShell .institution-contact { display: inline-flex; gap: 28px; align-items: center; margin-top: 22px; padding: 12px 18px; border: 1px solid #cad8cc; border-radius: 8px; color: #244634; background: #edf3ed; text-decoration: none; font-size: 14px; }
#appShell .institution-retained { padding: 22px 28px; border-left: 2px solid #8da994; background: #eaf0e8; border-radius: 0 10px 10px 0; }
#appShell .institution-retained h3 { font-size: 16px; margin: 0 0 5px; }
#appShell .institution-retained p { font-size: 13px; }
#appShell .institution-fees-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; background: #eaf0e8; }
#appShell .institution-filters { display: flex; flex-wrap: nowrap; gap: 12px; align-items: end; }
#appShell .institution-filters label { display: grid; flex: 1 1 180px; min-width: 0; gap: 8px; color: #607369; font-size: 12px; }
#appShell .institution-filter-actions { display: flex; flex: 1.4 1 300px; min-width: 0; gap: 12px; }
#appShell .institution-filters input, #appShell .institution-filters select, #appShell .institution-secondary { box-sizing: border-box; width: 100%; min-width: 0; min-height: 44px; padding: 8px 12px; border: 1px solid #c9d5ca; border-radius: 7px; background: #f3f6ef; color: #304c3c; font-family: inherit; font-size: 16px; line-height: 1.25; }
#appShell .institution-filters input[type="month"] { width: 100%; max-width: 100%; min-width: 0; min-height: 44px; }
#appShell .institution-filter-actions .institution-secondary { flex: 1 1 0; }
#appShell .institution-secondary { cursor: pointer; }
#appShell .institution-secondary:disabled { opacity: .5; cursor: default; }
#appShell .institution-filters :focus-visible, #appShell .institution-view a:focus-visible { outline: 2px solid #557b66; outline-offset: 3px; }
#appShell p.institution-report-status { margin: 22px 0; font-size: 13px; color: #526e5d; }
#appShell .institution-fee-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 20px; overflow: hidden; border: 1px solid #d7e0d6; border-radius: 12px; background: #eef3ec; }
#appShell .institution-fee-metrics article { display: flex; flex-direction: column; gap: 10px; padding: 24px; min-width: 0; }
#appShell .institution-fee-metrics article + article { border-left: 1px solid #d7e0d6; }
#appShell .institution-fee-metrics span { color: #60776a; font-size: 13px; }
#appShell .institution-fee-metrics strong { color: #234a37; font-size: clamp(23px, 2.6vw, 32px); font-weight: 500; line-height: 1.3; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
#appShell .institution-fee-metrics small { color: #708576; font-size: 12px; font-weight: 400; }
#appShell .institution-table-wrap { margin: 25px 0 15px; overflow-x: auto; border: 1px solid #dce3da; border-radius: 10px; }
#appShell .institution-table-wrap table { width: 100%; border-collapse: collapse; font-size: 13px; }
#appShell .institution-table-wrap th { background: #eff3eb; color: #5e7566; font-weight: 500; }
#appShell .institution-table-wrap td, #appShell .institution-table-wrap th { padding: 14px 18px; text-align: left; }
#appShell .institution-table-wrap td { border-top: 1px solid #e2e8df; color: #30523c; font-variant-numeric: tabular-nums; }
#appShell .institution-table-wrap td:last-child, #appShell .institution-table-wrap th:last-child { text-align: right; }
#appShell .institution-table-wrap .institution-empty { text-align: center; padding: 28px 16px; color: #708074; }
@media (max-width: 760px) {
  #appShell .institution-view, #appShell .institution-columns { gap: 14px; }
  #appShell .institution-columns { grid-template-columns: 1fr; }
  #appShell .institution-hero { padding: 26px 22px; }
  #appShell .institution-card { padding: 22px 18px; }
  #appShell .institution-fees-head { align-items: start; flex-direction: column; }
  #appShell .institution-fee-metrics { grid-template-columns: 1fr; }
  #appShell .institution-fee-metrics article { padding: 18px; display: grid; grid-template-columns: 1fr auto; gap: 7px 14px; align-items: center; }
  #appShell .institution-fee-metrics article > small { grid-column: 2; text-align: right; }
  #appShell .institution-fee-metrics article + article { border-left: 0; border-top: 1px solid #d7e0d6; }
  #appShell .institution-fee-metrics strong { font-size: 24px; text-align: right; }
  #appShell .institution-retained { padding: 18px; }
  #appShell .institution-filters { display: grid; grid-template-columns: minmax(0, 1fr); }
  #appShell .institution-filters label { width: 100%; }
  #appShell .institution-filter-actions { display: grid; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Combined monthly settlement */
#appShell #servicefees *, #appShell #servicefees *::before, #appShell #servicefees *::after { box-sizing: border-box; }
#appShell .settlement-toolbar { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.7fr); align-items: end; gap: 36px; padding: 16px 20px; }
#appShell .settlement-month-field { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; min-width: 0; color: #607369; font-size: 12px; }
#appShell .settlement-toolbar select, #appShell .settlement-toolbar button { width: 100%; max-width: 100%; min-width: 0; min-height: 44px; padding: 9px 13px; border: 1px solid #c9d5ca; border-radius: 7px; background: #f8faf6; color: #243f32; font: inherit; font-size: 16px; }
#appShell .settlement-month-selectors { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 8px; min-width: 0; }
#appShell .settlement-month-select { position: relative; min-width: 0; }
/* Standard selects avoid the intrinsic width of iOS's native month input. */
#appShell .settlement-month-select select { display: block; -webkit-appearance: none; appearance: none; padding-right: 30px; line-height: 1.5; cursor: pointer; }
#appShell .settlement-month-select::after { content: ""; position: absolute; right: 12px; top: 50%; width: 6px; height: 6px; border-right: 1.5px solid #496453; border-bottom: 1.5px solid #496453; transform: translateY(-70%) rotate(45deg); pointer-events: none; }
#appShell .settlement-month-select select:focus-visible { outline: 2px solid #496453; outline-offset: 2px; }
#appShell .settlement-toolbar-actions { display: grid; grid-template-columns: minmax(150px, .8fr) minmax(190px, 1fr); align-items: center; gap: 18px; min-width: 0; }
#appShell .settlement-toolbar-actions > span { display: flex; min-height: 44px; align-items: center; justify-content: center; padding: 8px 14px; border-radius: 8px; background: #eaf0e9; color: #315342; font-size: 14px; font-weight: 600; text-align: center; }
#appShell .settlement-state { min-height: 180px; display: grid; place-content: center; text-align: center; }
#appShell .settlement-state.is-error { border-color: #dec7c3; background: #fbf5f3; }
#appShell .settlement-payable-notice { display: grid; gap: 20px; padding: 26px; border-color: #244d3a; background: #173d2e; box-shadow: 0 16px 38px #173d2e17; }
#appShell .settlement-payable-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, .75fr); align-items: end; gap: 10px 28px; }
#appShell .settlement-payable-heading .eyebrow { color: #d9c88d; }
#appShell .settlement-payable-notice h3 { margin: 2px 0 0; color: #fffdf5; }
#appShell .settlement-payable-notice p { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: #d6e0d8; font-size: 14px; }
#appShell .settlement-payable-months { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 12px; min-width: 0; }
#appShell .settlement-payable-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px 18px; min-width: 0; min-height: 196px; width: 100%; padding: 18px; border: 1px solid #ddce9d; border-radius: 13px; background: #fffaf0; color: #244735; font: inherit; text-align: left; cursor: pointer; box-shadow: 0 7px 18px #0e2d2217; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
#appShell .settlement-payable-card:hover { border-color: #bda968; box-shadow: 0 10px 24px #0e2d2226; transform: translateY(-1px); }
#appShell .settlement-payable-card[aria-current="true"] { border-color: #d6bd68; box-shadow: 0 0 0 2px #d6bd6845, 0 10px 24px #0e2d2226; }
#appShell .settlement-payable-card-head { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-width: 0; }
#appShell .settlement-payable-calendar { display: flex; align-items: center; gap: 9px; min-width: 0; }
#appShell .settlement-payable-calendar svg { flex: 0 0 22px; width: 22px; height: 22px; color: #416652; }
#appShell .settlement-payable-calendar strong { min-width: 0; color: #1c4432; font-size: 16px; font-weight: 650; font-variant-numeric: tabular-nums; }
#appShell .settlement-payable-card .institution-pill { padding: 4px 10px; border-color: #d8c78e; background: #f8edc9; color: #745b1f; }
#appShell .settlement-payable-card.is-partial .institution-pill { border-color: #b9cdbd; background: #e7f0e7; color: #315c45; }
#appShell .settlement-payable-card-balance { grid-column: 1 / -1; display: grid; gap: 4px; min-width: 0; }
#appShell .settlement-payable-card-balance > small, #appShell .settlement-payable-card-paid > small { color: #6c786e; font-size: 13px; }
#appShell .settlement-payable-card-balance > .settlement-money { color: #173d2e; font-size: clamp(25px, 2.7vw, 34px); font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
#appShell .settlement-payable-card-balance .settlement-money small { color: #577060; font-size: 13px; font-weight: 600; }
#appShell .settlement-payable-card-paid { display: grid; align-content: end; gap: 3px; min-width: 0; }
#appShell .settlement-payable-card-paid > strong { color: #3f5e4d; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
#appShell .settlement-payable-card-paid .settlement-money small { font-size: 11px; }
#appShell .settlement-payable-card-action { align-self: end; color: #1c513a; font-size: 14px; font-weight: 700; white-space: nowrap; }
#appShell .settlement-payable-card-action > span { margin-left: 5px; }
#appShell .settlement-invoice-head { display: flex; justify-content: space-between; align-items: start; gap: 18px; }
#appShell .settlement-invoice-head h3 { margin: 0 0 2px; }
#appShell .settlement-invoice-head p { font-size: 13px; }
#appShell .settlement-due { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(250px, .75fr); gap: 34px; margin: 16px 0; padding: 22px 24px; border: 1px solid #d9e3da; border-radius: 10px; background: linear-gradient(115deg, #edf3ec, #f8faf7); }
#appShell .settlement-due > div { min-width: 0; }
#appShell .settlement-due span { color: #536d5f; font-size: 14px; }
#appShell .settlement-due strong { display: block; margin: 5px 0 2px; color: #0f4938; font-size: clamp(34px, 4vw, 48px); font-weight: 600; line-height: 1.15; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
#appShell .settlement-due strong small { font-size: 15px; font-weight: 500; color: #547064; }
#appShell .settlement-due p { font-size: 13px; }
#appShell .settlement-due dl { display: grid; align-content: center; gap: 14px; margin: 0; padding-left: 30px; border-left: 1px solid #d6e0d8; }
#appShell .settlement-due dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; }
#appShell .settlement-due dd { margin: 0; text-align: right; color: #193d2e; font-weight: 600; }
#appShell .settlement-money { font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
#appShell .settlement-money small { color: inherit; font-size: .68em; font-weight: 500; }
#appShell h4.settlement-subhead { margin: 14px 0 8px; color: #1c382c; font-size: 14px; }
#appShell .settlement-components { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
#appShell .settlement-component-summary { display: grid; gap: 4px; min-width: 0; padding: 13px 18px; border: 1px solid #d7e1d9; border-radius: 8px; }
#appShell .settlement-component-summary > span { color: #536d60; font-size: 13px; }
#appShell .settlement-component-summary > strong { color: #102c21; font-size: 25px; font-weight: 600; overflow-wrap: anywhere; }
#appShell .settlement-component-summary > small, #appShell .settlement-rule { color: #61786b; font-size: 12px; }
#appShell p.settlement-rule { margin: 10px 0 7px; text-align: center; }
#appShell .settlement-component-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 3px 0 16px; }
#appShell .settlement-component { min-width: 0; padding: 16px; border: 1px solid #dce4dd; border-radius: 9px; }
#appShell .settlement-component > span { color: #536e60; font-size: 13px; }
#appShell .settlement-component > strong { display: block; margin-top: 4px; color: #173c2d; font-size: 24px; }
#appShell .settlement-component > small { color: #657a6f; }
#appShell .settlement-component dl { display: grid; gap: 8px; margin: 14px 0 4px; }
#appShell .settlement-component dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 12px; }
#appShell .settlement-component dd { margin: 0; text-align: right; color: #244737; }
#appShell .settlement-payment h3 { margin-top: 0; }
#appShell .settlement-payment-methods { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(250px, .8fr); gap: 10px; }
#appShell .settlement-payment-methods > article { min-width: 0; padding: 18px; border: 1px solid #d8e1da; border-radius: 9px; }
#appShell .settlement-payment-methods h4 { margin: 0 0 14px; color: #173d2e; font-size: 17px; }
#appShell .settlement-payment-methods h4 span { display: inline-grid; place-items: center; width: 30px; height: 30px; margin-right: 6px; border-radius: 50%; background: #2b9a77; color: #fff; }
#appShell .settlement-crypto-layout { display: grid; grid-template-columns: 158px minmax(0, 1fr); gap: 20px; }
#appShell .settlement-qr { display: grid; align-content: start; justify-items: center; gap: 7px; min-width: 0; }
#appShell .settlement-qr img, #appShell .settlement-qr > span { display: grid; place-items: center; width: 148px; height: 148px; max-width: 100%; padding: 7px; border: 1px solid #d7dfd8; background: #fff; object-fit: contain; color: #687a70; font-size: 12px; text-align: center; }
#appShell .settlement-payment-guide { display: grid; align-content: start; gap: 14px; min-width: 0; }
#appShell .settlement-payment-amount { display: grid; gap: 4px; padding-bottom: 14px; border-bottom: 1px solid #dce4dd; }
#appShell .settlement-payment-amount > span { color: #576f62; font-size: 12px; }
#appShell .settlement-payment-amount > strong { color: #174c39; font-size: 28px; font-weight: 600; }
#appShell .settlement-screenshot-guide { padding-top: 4px; }
#appShell .settlement-screenshot-guide > strong { color: #294b3b; font-size: 15px; font-weight: 600; }
#appShell .settlement-screenshot-guide p { margin: 6px 0 0; color: #576f62; font-size: 13px; line-height: 1.8; }
#appShell .settlement-payment-actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
#appShell .settlement-payment-actions > button, #appShell .settlement-payment-actions > a { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-width: 0; min-height: 44px; padding: 11px 14px; border: 1px solid #a8beb0; border-radius: 7px; font: inherit; font-size: 14px; line-height: 1.6; text-align: center; text-decoration: none; overflow-wrap: anywhere; cursor: pointer; }
#appShell .settlement-copy-invoice { background: #f8faf6; color: #294b3b; }
#appShell a.settlement-contact-payment { border-color: #174c39; background: #174c39; color: #fff; }
#appShell .settlement-payment-actions > :focus-visible { outline: 2px solid #3f8468; outline-offset: 3px; }
#appShell .settlement-address { display: grid; grid-template-columns: 1fr auto; gap: 5px 10px; min-width: 0; }
#appShell .settlement-address > span { grid-column: 1 / -1; color: #576f62; font-size: 12px; }
#appShell .settlement-address code { min-width: 0; padding: 10px; border-radius: 6px; background: #edf2ec; color: #244636; overflow-wrap: anywhere; }
#appShell .settlement-address button { min-height: 40px; padding: 7px 12px; border: 1px solid #bfcfc3; border-radius: 6px; background: #f8faf6; color: #294b3b; cursor: pointer; }
#appShell p.settlement-local-warning { padding: 8px 10px; border-left: 3px solid #c18b42; background: #fbf4e8; color: #785b30; font-size: 12px; }
#appShell .settlement-payment-guide > small, #appShell .settlement-bank > small { color: #6b7e73; font-size: 11px; line-height: 1.5; }
#appShell .settlement-bank { display: flex; flex-direction: column; background: #eef3ec; }
#appShell .settlement-bank h4 { display: flex; align-items: center; gap: 6px; }
#appShell .settlement-bank h4 .settlement-bank-badge { flex: 0 0 30px; margin: 0; background: #dce8df; color: #355f4d; }
#appShell .settlement-bank-badge svg { width: 20px; height: 20px; }
#appShell .settlement-bank-visual { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px; padding: 32px 0; }
#appShell .settlement-bank-emblem { display: grid; place-items: center; width: 136px; height: 136px; border: 1px solid #d0ddd1; border-radius: 50%; color: #50705c; background: radial-gradient(circle, #e0e9df 0 52%, transparent 53%); }
#appShell .settlement-bank-emblem svg { width: 64px; height: 64px; }
#appShell .settlement-bank .settlement-bank-steps { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 8px; width: 100%; max-width: 340px; margin: 0; color: #5f7567; text-align: center; font-size: 12px; line-height: 1.6; }
#appShell .settlement-bank-steps > span { min-width: 0; }
#appShell .settlement-bank-steps > span[aria-hidden] { color: #99ab9b; }
#appShell .settlement-bank p { font-size: 13px; }
#appShell .settlement-bank-instructions { display: grid; gap: 8px; margin: 0 0 14px; color: #4f695a; line-height: 1.7; }
#appShell .settlement-bank-instructions span { min-width: 0; overflow-wrap: anywhere; }
#appShell .settlement-bank-instructions b { color: #315b47; font-weight: 650; }
#appShell .settlement-bank a { display: flex; justify-content: center; gap: 12px; margin-top: auto; padding: 11px 14px; border: 1px solid #7f9b89; border-radius: 7px; color: #1b4936; text-decoration: none; }
#appShell .settlement-bank > small { margin-top: 8px; text-align: center; }
#appShell .settlement-payment-blocked { padding: 18px; border-radius: 8px; background: #f1f3ef; }
#appShell .settlement-error { margin: 0; padding: 12px 16px; border: 1px solid #e0c3bf; border-radius: 8px; background: #fbf2f0; color: #963b32; font-size: 13px; overflow-wrap: anywhere; }
#appShell .settlement-history-list { display: grid; gap: 8px; padding-bottom: 16px; }
#appShell .settlement-history-list article { display: grid; grid-template-columns: 1fr auto; gap: 5px 16px; min-width: 0; padding: 13px 15px; border: 1px solid #dde5df; border-radius: 8px; }
#appShell .settlement-history-list article > div { display: grid; }
#appShell .settlement-history-list article > p { font-size: 14px; }
#appShell .settlement-history-list code { grid-column: 1 / -1; min-width: 0; color: #5a7165; font-size: 11px; overflow-wrap: anywhere; }
#appShell .settlement-month-list { display: grid; gap: 8px; padding-bottom: 16px; }
#appShell .settlement-month-list button { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; min-height: 48px; align-items: center; width: 100%; min-width: 0; padding: 10px 14px; border: 1px solid #d7e0d9; border-radius: 7px; background: #f8faf7; color: #29493a; font: inherit; text-align: left; cursor: pointer; }
#appShell .settlement-month-list button strong { text-align: center; font-size: 12px; }
#appShell .settlement-month-list button small { text-align: right; overflow-wrap: anywhere; }
#appShell .settlement-unpublished ul { margin: 14px 0 0; padding-left: 22px; color: #697c71; font-size: 13px; }

@media (max-width: 1100px) {
  #appShell .settlement-toolbar { grid-template-columns: minmax(0, 1fr); gap: 12px; }
}

@media (max-width: 760px) {
  #appShell .settlement-toolbar { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 16px; }
  #appShell .settlement-toolbar-actions { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  #appShell .settlement-due { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: 18px; }
  #appShell .settlement-due dl { padding: 16px 0 0; border-left: 0; border-top: 1px solid #d6e0d8; }
  #appShell .settlement-components, #appShell .settlement-component-details, #appShell .settlement-payment-methods { grid-template-columns: minmax(0, 1fr); }
  #appShell .settlement-crypto-layout { grid-template-columns: minmax(0, 1fr); }
  #appShell .settlement-qr { justify-items: start; }
  #appShell .settlement-qr img, #appShell .settlement-qr > span { width: 132px; height: 132px; }
  #appShell .settlement-bank-visual { gap: 18px; padding: 22px 0 26px; }
  #appShell .settlement-bank-emblem { width: 100px; height: 100px; }
  #appShell .settlement-bank-emblem svg { width: 48px; height: 48px; }
}

@media (max-width: 390px) {
  #appShell .institution-card { padding-left: 14px; padding-right: 14px; }
  #appShell .settlement-due { padding: 14px; }
  #appShell .settlement-due strong { font-size: 31px; }
  #appShell .settlement-payment-methods > article { padding: 14px; }
  #appShell .settlement-address { grid-template-columns: minmax(0, 1fr); }
  #appShell .settlement-address button { width: 100%; }
  #appShell .settlement-month-list button { grid-template-columns: 1fr auto; }
  #appShell .settlement-month-list button small { grid-column: 1 / -1; text-align: left; }
  #appShell .institution-table-wrap td, #appShell .institution-table-wrap th { padding: 11px 12px; }
}

/* Institutional client monthly billing */
#appShell .settlement-income { background: #fbfcf8; }
#appShell .settlement-income-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 20px; }
#appShell .settlement-income-card { min-width: 0; overflow: hidden; border: 1px solid #d5dfd6; border-radius: 11px; background: #f7f9f4; }
#appShell .settlement-income-card-head { display: flex; justify-content: space-between; align-items: start; gap: 16px; padding: 18px 18px 15px; border-bottom: 1px solid #dce4dc; background: #eef3eb; }
#appShell .settlement-income-card-head > div { display: grid; gap: 3px; }
#appShell .settlement-income-card-head > div > span { color: #567063; font-size: 13px; font-weight: 700; letter-spacing: .08em; }
#appShell .settlement-income-card-head > div > strong { color: #173c2d; font-size: 18px; }
#appShell .settlement-income-card-head > span { max-width: 55%; color: #1a4b37; font-size: 18px; font-weight: 650; text-align: right; }
#appShell .settlement-income-card dl { display: grid; gap: 0; margin: 0; padding: 4px 18px; }
#appShell .settlement-income-card dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 13px 0; border-bottom: 1px solid #e1e7e0; }
#appShell .settlement-income-card dt { color: #5a7064; font-size: 14px; }
#appShell .settlement-income-card dd { margin: 0; color: #183c2d; font-size: 15px; font-weight: 600; text-align: right; }
#appShell .settlement-daily-detail { margin: 0 18px; }
#appShell .settlement-daily-detail > summary { min-height: 52px; padding: 12px 0; }
#appShell .settlement-daily-detail .institution-table-wrap { margin-bottom: 18px; }
#appShell .settlement-payment { background: #fbfcf8; }
#appShell .settlement-payment-title { display: flex; align-items: center; gap: 13px; padding-bottom: 18px; border-bottom: 1px solid #dce4dc; }
#appShell .settlement-payment-title > span[aria-hidden="true"] { display: grid; flex: 0 0 38px; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #258467; color: #fff; font-size: 20px; }
#appShell .settlement-payment-title > .institution-pill { margin-left: auto; }
#appShell .settlement-payment-title h3 { margin: 0; font-size: 21px; }
#appShell .settlement-payment-title p { margin-top: 2px; font-size: 13px; }
#appShell .settlement-payment > .settlement-crypto-layout { grid-template-columns: 176px minmax(0, 1fr); gap: 26px; padding: 22px 0; }
#appShell .settlement-payment > .settlement-payment-blocked { margin: 22px 0; }
#appShell .settlement-payment .settlement-qr img, #appShell .settlement-payment .settlement-qr > span { width: 164px; height: 164px; }
#appShell .settlement-bank-support { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid #d7e1d7; border-radius: 9px; background: #eef3ec; }
#appShell .settlement-bank-support .settlement-bank-badge { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #dce8df; color: #355f4d; }
#appShell .settlement-bank-support p { display: grid; gap: 2px; min-width: 0; }
#appShell .settlement-bank-support strong { color: #254837; font-size: 14px; }
#appShell .settlement-bank-support small { color: #62766b; font-size: 12px; }
#appShell .settlement-bank-support a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 8px 13px; border: 1px solid #89a393; border-radius: 7px; color: #214735; font-size: 13px; text-decoration: none; white-space: nowrap; }
#appShell .settlement-record-head { display: grid; grid-template-columns: minmax(220px, .8fr) minmax(0, 1.2fr); align-items: end; gap: 28px; margin-bottom: 18px; }
#appShell .settlement-record-head h3 { margin: 3px 0 0; }
#appShell .settlement-record-head > p { font-size: 13px; text-align: right; }
#appShell .settlement-month-records { display: grid; gap: 10px; }
#appShell .settlement-month-record { overflow: hidden; border: 1px solid #d6e0d7; border-radius: 10px; background: #f9faf6; }
#appShell .settlement-month-record.is-selected { border-color: #769685; box-shadow: 0 0 0 1px #76968524; }
#appShell .settlement-month-record > button { display: grid; grid-template-columns: minmax(0, 1fr) auto 24px; align-items: center; gap: 14px; width: 100%; min-height: 54px; padding: 13px 16px; border: 0; background: #eef3ec; color: #234434; font: inherit; text-align: left; cursor: pointer; }
#appShell .settlement-month-record > button > span:first-child { font-size: 16px; font-weight: 650; font-variant-numeric: tabular-nums; }
#appShell .settlement-month-record > button > strong { color: #436353; font-size: 13px; }
#appShell .settlement-month-record > button > span:last-child { color: #5f796c; font-size: 20px; text-align: center; }
#appShell .settlement-month-record > dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; padding: 15px 16px; }
#appShell .settlement-month-record > dl > div { min-width: 0; padding: 0 16px; }
#appShell .settlement-month-record > dl > div:first-child { padding-left: 0; }
#appShell .settlement-month-record > dl > div + div { border-left: 1px solid #dfe6df; }
#appShell .settlement-month-record dt { color: #61766b; font-size: 13px; }
#appShell .settlement-month-record dd { margin: 5px 0 0; color: #193d2e; font-size: 16px; font-weight: 600; overflow-wrap: anywhere; }
#appShell .settlement-month-detail { padding: 2px 16px 16px; border-top: 1px solid #e0e6df; }
#appShell .settlement-record-entries { display: grid; gap: 8px; padding-top: 14px; }
#appShell .settlement-record-entry { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 7px 14px; min-width: 0; padding: 13px 14px; border: 1px solid #dfe6df; border-radius: 8px; background: #fff; }
#appShell .settlement-record-entry > div { display: grid; gap: 2px; }
#appShell .settlement-record-entry > div strong { color: #294a3a; font-size: 14px; }
#appShell .settlement-record-entry time { color: #687d71; font-size: 12px; }
#appShell .settlement-record-entry > p { grid-column: 1 / -1; color: #173d2e; font-size: 15px; font-weight: 600; }
#appShell .settlement-record-amounts { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
#appShell .settlement-record-amounts > div { min-width: 0; padding: 9px 11px; border-radius: 7px; background: #f1f5ef; }
#appShell .settlement-record-amounts dt { color: #65786e; font-size: 11px; }
#appShell .settlement-record-amounts dd { margin: 3px 0 0; color: #173d2e; font-size: 15px; font-weight: 650; overflow-wrap: anywhere; }
#appShell .settlement-record-entry.is-pending { padding-top: 10px; padding-bottom: 10px; background: #f7f9f5; }
#appShell .settlement-record-entry > details { grid-column: 1 / -1; color: #5c7366; font-size: 12px; }
#appShell .settlement-record-entry > details summary { width: fit-content; cursor: pointer; }
#appShell .settlement-record-entry > details p { margin-top: 7px; padding: 9px 11px; border-radius: 6px; background: #f1f4ef; font-size: 13px; overflow-wrap: anywhere; }
#appShell .settlement-record-empty { padding-top: 14px; }
#appShell .settlement-income-table { margin-top: 18px; overflow: hidden; border: 1px solid #d5dfd6; border-radius: 10px; }
#appShell .settlement-income-header, #appShell .settlement-income-row { display: grid; grid-template-columns: minmax(74px, .55fr) repeat(3, minmax(0, 1fr)); align-items: center; gap: 16px; min-width: 0; padding: 12px 16px; }
#appShell .settlement-income-header { background: #e9f0e8; color: #5b7064; font-size: 13px; font-weight: 600; }
#appShell .settlement-income-row { color: #244535; font-size: 14px; }
#appShell .settlement-income-row + .settlement-income-row { border-top: 1px solid #dce4dc; }
#appShell .settlement-income-row > strong { color: #1d4835; font-size: 15px; letter-spacing: .04em; }
#appShell .settlement-income-row > span { min-width: 0; font-weight: 600; overflow-wrap: anywhere; }
#appShell .settlement-income-row > span > small { display: none; color: #60766a; font-size: 12px; font-weight: 400; }
#appShell .settlement-daily-detail { margin: 8px 0 0; }
#appShell .settlement-daily-currencies { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding-bottom: 6px; }
#appShell .settlement-daily-currencies section { min-width: 0; }
#appShell .settlement-daily-currencies h4 { margin: 0 0 8px; color: #315443; font-size: 14px; }
#appShell .settlement-current-payment { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(240px, .85fr); align-items: center; gap: 30px; margin: 18px 0 10px; padding: 19px 22px; border: 1px solid #d8e2d9; border-radius: 10px; background: linear-gradient(115deg, #edf3ec, #f8faf7); }
#appShell .settlement-current-payment > div > span { color: #536d5f; font-size: 13px; }
#appShell .settlement-current-payment > div > strong { display: block; margin-top: 4px; color: #104936; font-size: clamp(30px, 3.4vw, 43px); line-height: 1.2; overflow-wrap: anywhere; }
#appShell .settlement-current-payment > p { margin: 0; color: #214838; font-size: 16px; font-weight: 650; text-align: center; }
#appShell .settlement-current-payment dl { display: grid; gap: 12px; margin: 0; padding-left: 26px; border-left: 1px solid #d5ded7; }
#appShell .settlement-current-payment dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; }
#appShell .settlement-current-payment dt { color: #5d7267; font-size: 13px; }
#appShell .settlement-current-payment dd { margin: 0; color: #214635; font-size: 15px; font-weight: 600; text-align: right; }
#appShell .settlement-collection-breakdown { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px 0; margin-bottom: 14px; padding: 11px 16px; border: 1px solid #d8e2d9; border-radius: 8px; background: #f2f6f1; color: #214635; }
#appShell .settlement-collection-breakdown > span { display: inline-flex; align-items: baseline; gap: 8px; min-width: 0; padding: 0 22px; font-size: 14px; }
#appShell .settlement-collection-breakdown > span + span { border-left: 1px solid #cfdacf; }
#appShell .settlement-collection-breakdown b { font-weight: 600; }
#appShell .settlement-collection-breakdown b::after { content: "："; }
#appShell .settlement-payment-methods { margin-top: 12px; }
#appShell .settlement-payment-methods > article { display: flex; flex-direction: column; }
#appShell .settlement-payment-methods .settlement-crypto-layout { grid-template-columns: 148px minmax(0, 1fr); gap: 18px; }
#appShell .settlement-payment-total code { font-family: inherit; font-size: 16px; font-weight: 650; }
#appShell .settlement-collection-hint { color: #5d7267; font-size: 13px; }
#appShell .settlement-collection-notes { margin: 14px 0 0; border-top: 1px solid #dce4dc; }
#appShell .settlement-collection-notes > div { display: grid; gap: 9px; padding-bottom: 12px; }
#appShell .settlement-collection-notes section { padding: 11px 13px; border-radius: 7px; background: #f2f6f1; }
#appShell .settlement-collection-notes section strong { color: #214635; font-size: 13px; }
#appShell .settlement-collection-notes section p { margin: 4px 0 0; color: #516b5d; font-size: 13px; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
#appShell .settlement-payment > .settlement-payment-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 14px; }
#appShell .settlement-payment-footnote { display: block; margin-top: 10px; color: #6b7e73; font-size: 12px; line-height: 1.6; }
#appShell .settlement-payment-note { margin: 18px 0; padding: 16px 18px; border: 1px solid #d8e2d9; border-left: 3px solid #487762; border-radius: 10px; background: #f3f7f2; color: #244b3a; }
#appShell .settlement-payment-note strong { font-size: 14px; }
#appShell .settlement-payment-note p { margin: 6px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.7; }
#appShell .settlement-paid-summary { background: #f7faf5; }
#appShell .settlement-paid-summary .settlement-payment-title > span[aria-hidden="true"] { background: #49785f; }
#appShell .settlement-corrections { margin-top: 12px; border-top: 1px solid #dce4dc; }
#appShell .settlement-corrections > summary { min-height: 48px; padding: 10px 0; }
#appShell .settlement-record-entry.is-correction { background: #f4f5f1; opacity: .88; }

@media (max-width: 760px) {
  #appShell .settlement-payable-notice { gap: 16px; padding: 20px 18px; }
  #appShell .settlement-payable-heading { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  #appShell .settlement-payable-notice p { grid-column: auto; grid-row: auto; margin-top: 4px; }
  #appShell .settlement-payable-months { grid-template-columns: minmax(0, 1fr); }
  #appShell .settlement-payable-card { min-height: 0; }
  #appShell .settlement-income-grid { grid-template-columns: minmax(0, 1fr); }
  #appShell .settlement-payment > .settlement-crypto-layout { grid-template-columns: minmax(0, 1fr); }
  #appShell .settlement-bank-support { grid-template-columns: auto minmax(0, 1fr); }
  #appShell .settlement-bank-support a { grid-column: 1 / -1; width: 100%; }
  #appShell .settlement-record-head { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  #appShell .settlement-record-head > p { text-align: left; }
  #appShell .settlement-daily-currencies { grid-template-columns: minmax(0, 1fr); }
  #appShell .settlement-current-payment { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  #appShell .settlement-current-payment > p { padding-top: 15px; border-top: 1px solid #d5ded7; text-align: left; }
  #appShell .settlement-current-payment dl { padding: 15px 0 0; border-top: 1px solid #d5ded7; border-left: 0; }
  #appShell .settlement-payment-methods .settlement-crypto-layout { grid-template-columns: minmax(0, 1fr); }
  #appShell .settlement-qr { justify-items: start; }
}

@media (max-width: 390px) {
  #appShell .settlement-payable-card { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 16px; }
  #appShell .settlement-payable-card-head, #appShell .settlement-payable-card-balance { grid-column: auto; }
  #appShell .settlement-payable-card-action { white-space: normal; }
  #appShell .settlement-record-amounts { grid-template-columns: minmax(0, 1fr); }
  #appShell .settlement-income-card-head { display: grid; }
  #appShell .settlement-income-card-head > span { max-width: none; text-align: left; }
  #appShell .settlement-income-card dl > div { align-items: start; }
  #appShell .settlement-payment-title { align-items: start; }
  #appShell .settlement-payment .settlement-qr img, #appShell .settlement-payment .settlement-qr > span { width: 142px; height: 142px; }
  #appShell .settlement-month-record > button { grid-template-columns: minmax(0, 1fr) auto 20px; padding: 12px; }
  #appShell .settlement-month-record > dl { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 12px; }
  #appShell .settlement-month-record > dl > div { display: flex; justify-content: space-between; gap: 12px; padding: 0; }
  #appShell .settlement-month-record > dl > div + div { padding-top: 10px; border-top: 1px solid #e1e7e0; border-left: 0; }
  #appShell .settlement-month-record dd { margin: 0; text-align: right; }
  #appShell .settlement-month-detail { padding: 2px 12px 12px; }
  #appShell .settlement-income-header { display: none; }
  #appShell .settlement-income-row { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 14px; }
  #appShell .settlement-income-row > strong { padding-bottom: 7px; border-bottom: 1px solid #dfe6df; }
  #appShell .settlement-income-row > span { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
  #appShell .settlement-income-row > span > small { display: inline; }
  #appShell .settlement-payment-title { flex-wrap: wrap; }
  #appShell .settlement-payment-title > .institution-pill { margin-left: 51px; }
  #appShell .settlement-current-payment { padding: 15px; }
  #appShell .settlement-collection-breakdown { align-items: stretch; flex-direction: column; }
  #appShell .settlement-collection-breakdown > span { justify-content: space-between; padding: 0; }
  #appShell .settlement-collection-breakdown > span + span { padding-top: 9px; border-top: 1px solid #d8e2d9; border-left: 0; }
  #appShell .settlement-payment > .settlement-payment-actions { grid-template-columns: minmax(0, 1fr); }
}