/* Scope-invariant Practice Cashflow read model. */
.module-grid > .practice-cashflow-controls,
.module-grid > .practice-cashflow-hero,
.module-grid > .practice-cashflow-section,
.module-grid > .practice-cashflow-refreshing,
.module-grid > .practice-cashflow-error {
    grid-column: 1 / -1;
}

.practice-cashflow-hero,
.practice-cashflow-section {
    min-width: 0;
}

.practice-cashflow-controls {
    display: flex;
    gap: 16px;
    align-items: end;
    justify-content: space-between;
}

.practice-cashflow-controls > div,
.practice-cashflow-controls label,
.practice-cashflow-filters label {
    display: grid;
    gap: 5px;
    color: var(--book-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.practice-cashflow-controls select,
.practice-cashflow-filters select {
    min-height: 38px;
    padding: 8px 10px;
    border: 1px solid var(--book-line);
    border-radius: 8px;
    background: var(--surface-elevated, #fff);
    color: inherit;
    font: inherit;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: normal;
    text-transform: none;
}

.practice-cashflow-hero-facts {
    grid-template-columns: 1fr;
}

.practice-cashflow-obligation-grid,
.practice-cashflow-attention-summary,
.practice-cashflow-confidence {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.practice-cashflow-obligation-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.practice-cashflow-obligation-grid article,
.practice-cashflow-attention-summary span,
.practice-cashflow-confidence article {
    display: grid;
    gap: 5px;
    min-width: 0;
    padding: 13px;
    border: 1px solid var(--book-line);
    background: var(--surface-elevated, #fff);
}

.practice-cashflow-obligation-grid article.is-warning {
    border-color: #dfb766;
    background: #fff8e9;
}

.practice-cashflow-obligation-grid span,
.practice-cashflow-attention-summary em,
.practice-cashflow-confidence span {
    color: var(--book-muted);
    font-size: 10px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.practice-cashflow-obligation-grid strong,
.practice-cashflow-attention-summary strong,
.practice-cashflow-confidence strong {
    font-size: 18px;
}

.practice-cashflow-obligation-grid em,
.practice-cashflow-confidence em {
    color: var(--book-muted);
    font-size: 11px;
    font-style: normal;
    line-height: 1.45;
}

.practice-cashflow-attention-summary {
    margin-bottom: 14px;
}

.practice-cashflow-attention-list {
    display: grid;
    border-top: 1px solid var(--book-line);
}

.practice-cashflow-attention-list article {
    border-bottom: 1px solid var(--book-line);
}

.practice-cashflow-attention-list article.is-priority-1 {
    border-left: 3px solid #b94c43;
}

.practice-cashflow-attention-list button {
    display: grid;
    grid-template-columns: minmax(180px, 1.5fr) minmax(150px, 1fr) minmax(150px, 1fr) auto;
    gap: 18px;
    align-items: center;
    width: 100%;
    padding: 12px;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.practice-cashflow-attention-list button > span {
    display: grid;
    gap: 3px;
}

.practice-cashflow-attention-list em {
    color: var(--book-muted);
    font-size: 11px;
    font-style: normal;
}

.practice-cashflow-trend {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 12px;
    padding: 12px 0 0;
    overflow-x: auto;
}

.practice-cashflow-trend article {
    display: grid;
    gap: 7px;
    min-width: 130px;
    padding: 11px;
    border: 1px solid var(--book-line);
}

.practice-cashflow-trend-bars {
    display: grid;
    gap: 5px;
    min-height: auto;
}

.practice-cashflow-trend-bars i {
    display: block;
    height: 7px;
    min-width: 2px;
    background: #6e9c80;
}

.practice-cashflow-trend-bars i.is-outflow {
    background: #b97970;
}

.practice-cashflow-trend article > span,
.practice-cashflow-trend article small {
    color: var(--book-muted);
    font-size: 10px;
    font-style: normal;
}

.practice-cashflow-trend footer {
    display: flex;
    grid-column: 1 / -1;
    gap: 16px;
    color: var(--book-muted);
    font-size: 10px;
}

.practice-cashflow-trend footer span {
    display: inline-flex;
    gap: 6px;
    align-items: center;
}

.practice-cashflow-trend footer i {
    width: 14px;
    height: 6px;
    background: #6e9c80;
}

.practice-cashflow-trend footer i.is-outflow {
    background: #b97970;
}

.practice-cashflow-category-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.practice-cashflow-category-grid h3 {
    margin: 0 0 10px;
    font-size: 13px;
}

.practice-cashflow-category-list {
    display: grid;
    border-top: 1px solid var(--book-line);
}

.practice-cashflow-category-list article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid var(--book-line);
}

.practice-cashflow-category-list span,
.practice-cashflow-category-list em {
    color: var(--book-muted);
    font-size: 11px;
    font-style: normal;
}

.practice-cashflow-category-list em {
    grid-column: 1 / -1;
    margin-top: -9px;
}

.practice-cashflow-filters {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px));
    gap: 10px;
    margin-bottom: 14px;
}

.practice-cashflow-table-wrap {
    max-width: 100%;
    overflow-x: auto;
    border: 1px solid var(--book-line);
}

.practice-cashflow-table {
    width: 100%;
    min-width: 1180px;
    border-collapse: collapse;
    background: var(--surface-elevated, #fff);
}

.practice-cashflow-table th,
.practice-cashflow-table td {
    padding: 11px 12px;
    border-bottom: 1px solid var(--book-line);
    text-align: left;
    vertical-align: top;
    white-space: nowrap;
}

.practice-cashflow-table th {
    color: var(--book-muted);
    font-size: 10px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.practice-cashflow-table th button,
.practice-cashflow-table td button {
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.practice-cashflow-table td {
    font-size: 12px;
}

.practice-cashflow-table td small {
    display: block;
    margin-top: 3px;
    color: var(--book-muted);
}

.practice-cashflow-table .is-negative {
    color: #9d4038;
}

.practice-cashflow-status {
    display: inline-flex;
    padding: 4px 7px;
    border-radius: 999px;
    background: #eef2ef;
    color: #52605a;
    font-size: 10px;
    font-weight: 700;
    text-transform: capitalize;
}

.practice-cashflow-status.is-unknown,
.practice-cashflow-status.is-limited,
.practice-cashflow-status.is-partial {
    background: #fff4dc;
    color: #8a6015;
}

.practice-cashflow-pagination {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 12px;
    color: var(--book-muted);
    font-size: 11px;
}

.practice-cashflow-refreshing,
.practice-cashflow-error {
    margin: 10px 0 0;
    color: var(--book-muted);
    font-size: 11px;
}

.practice-cashflow-error {
    color: #9d4038;
}

@media (max-width: 980px) {
    .practice-cashflow-obligation-grid,
.practice-cashflow-attention-summary,
.practice-cashflow-confidence {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .practice-cashflow-attention-list button {
        grid-template-columns: minmax(160px, 1.5fr) repeat(2, minmax(130px, 1fr)) auto;
        min-width: 720px;
    }

    .practice-cashflow-attention-list {
        overflow-x: auto;
    }
}

@media (max-width: 680px) {
    .practice-cashflow-controls {
        display: grid;
        align-items: stretch;
    }

    .practice-cashflow-category-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 520px) {
    .practice-cashflow-obligation-grid,
.practice-cashflow-attention-summary,
.practice-cashflow-confidence,
.practice-cashflow-filters {
        grid-template-columns: 1fr;
    }

    .practice-cashflow-pagination {
        justify-content: space-between;
    }
}

/* Practice Cashflow HQ v2. Kept alongside the legacy rules for flag rollback. */
.module-grid > .practice-cashflow-hq {
    grid-column: 1 / -1;
    min-width: 0;
}

.practice-cashflow-hq {
    /* Every lane colour resolves to a theme token. Green is capacity, red is
       cost or risk, gold is attention; transfers and portfolio movement are
       neutral plumbing and read as muted ink, not as a fourth and fifth
       semantic colour. The purple and slate that used to live here belonged
       to no vocabulary and made the page look like a different product. */
    --cashflow-inflow: var(--advisor-color-positive);
    --cashflow-inflow-soft: var(--advisor-color-surface-positive);
    --cashflow-outflow: var(--advisor-color-negative);
    --cashflow-outflow-soft: var(--advisor-color-surface-negative);
    --cashflow-transfer: var(--advisor-color-accent);
    --cashflow-transfer-soft: var(--advisor-color-surface-accent);
    --cashflow-portfolio: var(--advisor-color-muted);
    --cashflow-portfolio-soft: var(--advisor-color-surface-muted);
    display: grid;
    gap: 22px;
    width: 100%;
    min-width: 0;
}

.practice-cashflow-hq button,
.practice-cashflow-drawer button,
.practice-cashflow-hq input,
.practice-cashflow-hq select,
.practice-cashflow-drawer input,
.practice-cashflow-drawer select,
.practice-cashflow-drawer textarea {
    font: inherit;
}

.practice-cashflow-hq-topline,
.practice-cashflow-hq-topline > p,
.practice-cashflow-filter-dock,
.practice-cashflow-open-section > header,
.practice-cashflow-composition > header,
.practice-cashflow-worklist > header,
.practice-cashflow-activity > header,
.practice-cashflow-upcoming > header,
.practice-cashflow-data-quality > header,
.practice-cashflow-role-table > header,
.practice-cashflow-review-list > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.practice-cashflow-hq-topline > p {
    justify-content: flex-end;
    margin: 0;
    color: var(--book-muted);
    font-size: 11px;
}

.practice-cashflow-hq-topline > p span,
.practice-cashflow-hq-topline > p strong {
    white-space: nowrap;
}

.practice-cashflow-hq-topline > p i {
    width: 1px;
    height: 18px;
    background: var(--book-line);
}

.practice-cashflow-filter-dock {
    position: sticky;
    z-index: 12;
    top: 8px;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding: 10px 12px;
    border: 1px solid var(--book-line);
    border-radius: 10px;
    background: color-mix(in srgb, var(--surface-elevated, #fff) 94%, transparent);
    box-shadow: 0 10px 24px rgb(33 42 36 / 6%);
    backdrop-filter: blur(12px);
}

.practice-cashflow-periods {
    display: flex;
    gap: 2px;
    padding: 3px;
    border-radius: 8px;
    background: #eef1ef;
}

.practice-cashflow-periods button {
    padding: 7px 10px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--book-muted);
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.practice-cashflow-periods button.is-active {
    background: var(--surface-elevated, #fff);
    color: var(--book-ink);
    box-shadow: 0 1px 4px rgb(33 42 36 / 10%);
}

.practice-cashflow-filter-dock > label,
.practice-cashflow-custom-dates label,
.practice-cashflow-worklist-filters label {
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--book-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.practice-cashflow-filter-dock select,
.practice-cashflow-filter-dock input[type="date"],
.practice-cashflow-worklist-filters select {
    min-height: 34px;
    padding: 6px 9px;
    border: 1px solid var(--book-line);
    border-radius: 7px;
    background: var(--surface-elevated, #fff);
    color: var(--book-ink);
    font-size: 11px;
    letter-spacing: normal;
    text-transform: none;
}

.practice-cashflow-custom-dates {
    display: flex;
    gap: 8px;
}

.practice-cashflow-compare {
    text-transform: none !important;
}

.practice-cashflow-trust-note {
    display: grid;
    gap: 4px;
    padding: 11px 14px;
    border-left: 3px solid var(--cashflow-portfolio);
    background: var(--cashflow-portfolio-soft);
    color: #46535c;
    font-size: 11px;
    line-height: 1.5;
}

.practice-cashflow-trust-note strong {
    color: #334049;
}

.practice-cashflow-open-section,
.practice-cashflow-composition {
    min-width: 0;
    padding: 2px 0 18px;
    border-bottom: 1px solid var(--advisor-color-border);
}

/* Nested inside a card that already has an edge, so these close with a rule
   above rather than a rule below — a trailing rule immediately inside a card
   border reads as a doubled edge. */
.practice-cashflow-role-table,
.practice-cashflow-review-list {
    min-width: 0;
    padding: 22px 0 0;
    margin-top: 22px;
    border-top: 1px solid var(--advisor-color-border);
}

/* Worklist, upcoming, and data-quality are card wrappers now; their surface
   and padding come from the card class, not a hand-rolled bottom rule. */
.practice-cashflow-worklist,
.practice-cashflow-upcoming,
.practice-cashflow-data-quality,
.practice-cashflow-activity {
    min-width: 0;
    padding: clamp(20px, 2.4vw, 30px);
}

.practice-cashflow-worklist > header,
.practice-cashflow-upcoming > header,
.practice-cashflow-data-quality > header,
.practice-cashflow-activity > header {
    padding-bottom: 18px;
    margin-bottom: 4px;
    border-bottom: 1px solid var(--advisor-color-border);
}

.practice-cashflow-open-section header span,
.practice-cashflow-composition header span,
.practice-cashflow-worklist header span,
.practice-cashflow-activity header span,
.practice-cashflow-upcoming header span,
.practice-cashflow-data-quality header span,
.practice-cashflow-role-table header span,
.practice-cashflow-review-list header span,
.practice-cashflow-drawer-section header > span {
    color: var(--book-muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.practice-cashflow-open-section h2,
.practice-cashflow-composition h2,
.practice-cashflow-worklist h2,
.practice-cashflow-activity h2,
.practice-cashflow-upcoming h2,
.practice-cashflow-data-quality h2,
.practice-cashflow-role-table h2,
.practice-cashflow-review-list h2 {
    margin: 5px 0 0;
    color: var(--advisor-color-ink);
    font-family: var(--advisor-font-display, Georgia, serif);
    font-size: clamp(19px, 2vw, 25px);
    font-weight: 500;
    line-height: 1.15;
}

.practice-cashflow-open-section header p,
.practice-cashflow-composition header p,
.practice-cashflow-activity header p,
.practice-cashflow-upcoming header p,
.practice-cashflow-data-quality header p {
    max-width: 46ch;
    margin: 0;
    color: var(--advisor-color-muted);
    font-size: 12px;
    line-height: 1.5;
    text-align: right;
}

/* Figures separated by thin rules, not filled tiles on a grey grid. A solid
   fill per figure made each row read as three or four competing surfaces
   inside a card that already supplies one, and the white fill fought the
   warm canvas the whole system is built on. */
.practice-cashflow-horizon-cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin-top: 18px;
    background: transparent;
}

.practice-cashflow-quality-headlines {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin-top: 18px;
    background: transparent;
}

.practice-cashflow-horizon-cards article,
.practice-cashflow-quality-headlines article {
    display: grid;
    gap: 5px;
    align-content: start;
    min-width: 0;
    padding: 4px 22px;
    border-left: 1px solid var(--advisor-color-border);
    background: transparent;
}

.practice-cashflow-horizon-cards article:first-child,
.practice-cashflow-quality-headlines article:first-child {
    padding-left: 0;
    border-left: 0;
}

.practice-cashflow-horizon-cards span,
.practice-cashflow-quality-headlines span {
    color: var(--book-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.practice-cashflow-horizon-cards strong,
.practice-cashflow-quality-headlines strong {
    font-family: var(--advisor-font-display, Georgia, serif);
    font-size: clamp(22px, 3vw, 32px);
    font-weight: 480;
    line-height: 1.05;
    font-variant-numeric: tabular-nums;
}

.practice-cashflow-horizon-cards em {
    color: var(--book-muted);
    font-size: 11px;
    font-style: normal;
}

.is-positive {
    color: var(--cashflow-inflow, #2f7655);
}

.is-negative {
    color: var(--cashflow-outflow, #c86355);
}

.practice-cashflow-trend-columns {
    display: flex;
    min-height: 250px;
    gap: 8px;
    align-items: flex-end;
    margin-top: 18px;
    padding: 12px 4px 0;
    border-bottom: 1px solid var(--book-line);
}

.practice-cashflow-trend-columns article {
    display: grid;
    flex: 1 1 0;
    min-width: 28px;
    gap: 4px;
    text-align: center;
}

.practice-cashflow-column-bars {
    display: flex;
    height: 165px;
    gap: 2px;
    align-items: flex-end;
    justify-content: center;
}

.practice-cashflow-column-bars i {
    width: min(16px, 42%);
    min-height: 3px;
    border-radius: 3px 3px 0 0;
}

.practice-cashflow-column-bars .is-inflow,
.practice-cashflow-open-section footer i.is-inflow {
    background: var(--cashflow-inflow);
}

.practice-cashflow-column-bars .is-outflow,
.practice-cashflow-open-section footer i.is-outflow {
    background: var(--cashflow-outflow);
}

.practice-cashflow-trend-columns strong {
    font-size: 10px;
}

.practice-cashflow-trend-columns span,
.practice-cashflow-trend-columns em {
    overflow: hidden;
    color: var(--book-muted);
    font-size: 9px;
    font-style: normal;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.practice-cashflow-open-section footer {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 12px;
    color: var(--book-muted);
    font-size: 10px;
}

.practice-cashflow-open-section footer span {
    display: inline-flex;
    gap: 5px;
    align-items: center;
}

.practice-cashflow-open-section footer i {
    width: 8px;
    height: 8px;
    border-radius: 2px;
}

.practice-cashflow-open-section footer i.is-transfer,
.practice-cashflow-quality-headlines .is-transfer strong {
    color: var(--cashflow-transfer);
}

.practice-cashflow-open-section footer i.is-transfer {
    background: var(--cashflow-transfer);
}

.practice-cashflow-open-section footer i.is-portfolio {
    background: var(--cashflow-portfolio);
}

.practice-cashflow-quality-headlines .is-portfolio strong {
    color: var(--cashflow-portfolio);
}

.practice-cashflow-worklist-filters button,
.practice-cashflow-worklist footer button,
.practice-cashflow-review-list > button {
    border: 0;
    background: transparent;
    color: var(--book-ink);
    cursor: pointer;
}

.practice-cashflow-review-list > button {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
    gap: 3px 12px;
    padding: 12px 0;
    border-bottom: 1px solid var(--book-line);
    text-align: left;
}

.practice-cashflow-review-list > button span {
    display: grid;
    gap: 3px;
}

.practice-cashflow-review-list > button em,
.practice-cashflow-review-list > button small {
    color: var(--book-muted);
    font-size: 10px;
    font-style: normal;
}

.practice-cashflow-review-list > button small {
    grid-column: 1 / -1;
}

.practice-cashflow-composition > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin-top: 16px;
}

.practice-cashflow-composition h3 {
    margin: 0 0 6px;
    font-size: 12px;
}

.practice-cashflow-composition section > button {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
    gap: 3px 12px;
    padding: 10px 2px;
    border: 0;
    border-bottom: 1px solid var(--book-line);
    background: transparent;
    color: var(--book-ink);
    text-align: left;
    cursor: pointer;
}

.practice-cashflow-composition section > button em {
    grid-column: 1 / -1;
    color: var(--book-muted);
    font-size: 10px;
    font-style: normal;
}

.practice-cashflow-composition section > button.is-inflow strong {
    color: var(--cashflow-inflow);
}

.practice-cashflow-composition section > button.is-outflow strong {
    color: var(--cashflow-outflow);
}

.practice-cashflow-table-wrap {
    width: 100%;
    max-width: 100%;
    margin-top: 14px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
}

.practice-cashflow-hq-table,
.practice-cashflow-role-table table {
    width: 100%;
    min-width: 1040px;
    border-collapse: collapse;
}

.practice-cashflow-hq-table th,
.practice-cashflow-hq-table td,
.practice-cashflow-role-table th,
.practice-cashflow-role-table td {
    padding: 13px 14px;
    border-bottom: 1px solid color-mix(in srgb, var(--advisor-color-border) 65%, transparent);
    font-size: 12px;
    text-align: left;
    vertical-align: top;
}

.practice-cashflow-hq-table th,
.practice-cashflow-role-table th {
    padding-top: 0;
    border-bottom: 1px solid var(--advisor-color-border-strong);
    color: var(--advisor-color-muted);
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
}

.practice-cashflow-hq-table tbody tr:last-child td,
.practice-cashflow-role-table tbody tr:last-child td {
    border-bottom: 0;
}

/* Money columns read down the page, so they share one tabular scale. */
.practice-cashflow-hq-table td strong,
.practice-cashflow-role-table td {
    font-variant-numeric: tabular-nums;
}

.practice-cashflow-hq-table th button,
.practice-cashflow-hq-table td button {
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.practice-cashflow-hq-table td > strong,
.practice-cashflow-hq-table td button strong,
.practice-cashflow-hq-table td small {
    display: block;
}

.practice-cashflow-hq-table td small {
    margin-top: 3px;
    color: var(--book-muted);
    font-size: 9px;
}

.practice-cashflow-worklist footer {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 12px;
    font-size: 11px;
}

.practice-cashflow-worklist footer button {
    padding: 7px 10px;
    border: 1px solid var(--book-line);
    border-radius: 6px;
}

.practice-cashflow-worklist footer button:disabled {
    cursor: default;
    opacity: .45;
}

.practice-cashflow-quality-headlines {
    margin-bottom: 24px;
}

.practice-cashflow-quality-headlines strong {
    font-size: 24px;
}

.practice-cashflow-horizon-cards,
.practice-cashflow-quality-grid {
    margin: 18px 0;
}

.practice-cashflow-commitment-list,
.practice-cashflow-drawer-accounts {
    display: grid;
}

.practice-cashflow-commitment-list > button,
.practice-cashflow-drawer-accounts article {
    display: grid;
    grid-template-columns: 100px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 12px 2px;
    border: 0;
    border-bottom: 1px solid var(--book-line);
    background: transparent;
    color: var(--book-ink);
    text-align: left;
}

.practice-cashflow-commitment-list > button {
    cursor: pointer;
}

.practice-cashflow-commitment-list span,
.practice-cashflow-drawer-accounts span {
    display: grid;
    gap: 3px;
}

.practice-cashflow-commitment-list em,
.practice-cashflow-drawer-accounts em,
.practice-cashflow-drawer-accounts small {
    color: var(--book-muted);
    font-size: 10px;
    font-style: normal;
}

.practice-cashflow-partial,
.practice-cashflow-hq-error {
    padding: 10px 12px;
    border-left: 3px solid #a8433d;
    background: #fff1ef;
    color: #81352f;
    font-size: 11px;
}

.practice-cashflow-hq-loading,
.practice-cashflow-drawer-loading,
.practice-cashflow-empty {
    padding: 30px 4px;
    color: var(--book-muted);
    font-size: 12px;
}

.practice-cashflow-quality-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    background: transparent;
}

.practice-cashflow-quality-grid article {
    display: grid;
    gap: 4px;
    align-content: start;
    min-width: 0;
    padding: 14px 18px;
    border-top: 1px solid var(--advisor-color-border);
    border-left: 1px solid var(--advisor-color-border);
    background: transparent;
}

.practice-cashflow-quality-grid article:nth-child(4n + 1) {
    padding-left: 0;
    border-left: 0;
}

.practice-cashflow-quality-grid article:nth-child(-n + 4) {
    border-top: 0;
}

.practice-cashflow-quality-grid span,
.practice-cashflow-quality-grid em {
    color: var(--book-muted);
    font-size: 9px;
    font-style: normal;
}

.practice-cashflow-quality-grid strong {
    font-size: 22px;
}

body.practice-cashflow-drawer-open {
    overflow: hidden;
}

.practice-cashflow-drawer-backdrop {
    position: fixed;
    z-index: 1000;
    inset: 0;
    display: flex;
    justify-content: flex-end;
    background: rgb(20 26 23 / 30%);
}

.practice-cashflow-drawer {
    width: min(720px, 94vw);
    height: 100%;
    overflow-y: auto;
    background: var(--surface-elevated, #fff);
    box-shadow: -18px 0 50px rgb(20 26 23 / 18%);
}

.practice-cashflow-drawer > header {
    position: sticky;
    z-index: 3;
    top: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 22px;
    border-bottom: 1px solid var(--book-line);
    background: color-mix(in srgb, var(--surface-elevated, #fff) 96%, transparent);
    backdrop-filter: blur(10px);
}

.practice-cashflow-drawer > header span {
    color: var(--book-muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.practice-cashflow-drawer > header h2 {
    margin: 4px 0;
    font-size: 22px;
}

.practice-cashflow-drawer > header p {
    margin: 0;
    color: var(--book-muted);
    font-size: 11px;
}

.practice-cashflow-drawer > header button {
    width: 34px;
    height: 34px;
    border: 1px solid var(--book-line);
    border-radius: 50%;
    background: transparent;
    color: var(--book-ink);
    font-size: 22px;
    cursor: pointer;
}

.practice-cashflow-drawer-body {
    display: grid;
    gap: 24px;
    padding: 20px 22px 50px;
}

.practice-cashflow-drawer-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    background: var(--book-line);
}

.practice-cashflow-drawer-summary article {
    display: grid;
    gap: 5px;
    padding: 13px;
    background: var(--surface-elevated, #fff);
}

.practice-cashflow-drawer-summary span,
.practice-cashflow-drawer-summary em {
    color: var(--book-muted);
    font-size: 9px;
    font-style: normal;
}

.practice-cashflow-drawer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.practice-cashflow-drawer-links button,
.practice-cashflow-pattern form button,
.practice-cashflow-evidence form button {
    padding: 8px 11px;
    border: 1px solid var(--book-line);
    border-radius: 7px;
    background: var(--surface-elevated, #fff);
    color: var(--book-ink);
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

.practice-cashflow-drawer-section {
    min-width: 0;
    padding-top: 4px;
    border-top: 1px solid var(--book-line);
}

.practice-cashflow-drawer-section header h3 {
    margin: 4px 0 12px;
    font-size: 16px;
}

.practice-cashflow-drawer-section header p {
    color: var(--book-muted);
    font-size: 10px;
}

.practice-cashflow-drawer-categories {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    background: var(--book-line);
}

.practice-cashflow-drawer-categories article {
    display: grid;
    gap: 4px;
    padding: 10px;
    background: var(--surface-elevated, #fff);
}

.practice-cashflow-drawer-categories em {
    color: var(--book-muted);
    font-size: 9px;
    font-style: normal;
}

.practice-cashflow-pattern,
.practice-cashflow-evidence {
    border-bottom: 1px solid var(--book-line);
}

.practice-cashflow-pattern > div,
.practice-cashflow-evidence summary {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr) auto;
    gap: 8px 12px;
    align-items: center;
    padding: 12px 0;
}

.practice-cashflow-pattern > div > span,
.practice-cashflow-evidence summary > span {
    display: grid;
    gap: 3px;
}

.practice-cashflow-pattern em,
.practice-cashflow-pattern small,
.practice-cashflow-evidence em,
.practice-cashflow-evidence small,
.practice-cashflow-evidence time {
    color: var(--book-muted);
    font-size: 9px;
    font-style: normal;
}

.practice-cashflow-evidence summary {
    cursor: pointer;
    list-style: none;
}

.practice-cashflow-evidence summary > small {
    grid-column: 2 / -1;
}

.practice-cashflow-pattern form,
.practice-cashflow-evidence form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 14px;
    background: #f6f8f6;
}

.practice-cashflow-pattern form label,
.practice-cashflow-evidence form label {
    display: grid;
    gap: 4px;
    color: var(--book-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.practice-cashflow-pattern form .is-wide,
.practice-cashflow-evidence form .is-wide {
    grid-column: 1 / -1;
}

.practice-cashflow-pattern input,
.practice-cashflow-pattern select,
.practice-cashflow-evidence input,
.practice-cashflow-evidence select,
.practice-cashflow-evidence textarea {
    width: 100%;
    min-width: 0;
    padding: 8px;
    border: 1px solid var(--book-line);
    border-radius: 6px;
    background: var(--surface-elevated, #fff);
    color: var(--book-ink);
    font-size: 11px;
    letter-spacing: normal;
    text-transform: none;
}

@media (max-width: 980px) {

    .practice-cashflow-quality-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .practice-cashflow-hq-topline {
        align-items: flex-start;
    }
}

@media (max-width: 720px) {
    .practice-cashflow-hq-topline,
.practice-cashflow-open-section > header,
.practice-cashflow-composition > header,
.practice-cashflow-worklist > header,
.practice-cashflow-activity > header,
.practice-cashflow-upcoming > header,
.practice-cashflow-data-quality > header {
        display: grid;
        align-items: start;
    }

    .practice-cashflow-open-section header p,
.practice-cashflow-composition header p,
.practice-cashflow-activity header p,
.practice-cashflow-upcoming header p,
.practice-cashflow-data-quality header p {
        text-align: left;
    }

.practice-cashflow-filter-dock {
        position: static;
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .practice-cashflow-periods,
.practice-cashflow-custom-dates {
        grid-column: 1 / -1;
    }

    .practice-cashflow-horizon-cards,
.practice-cashflow-quality-headlines {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .practice-cashflow-composition > div,
.practice-cashflow-quality-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 480px) {
    .practice-cashflow-hq {
        gap: 16px;
    }

    .practice-cashflow-hq-topline > p {
        display: grid;
        justify-content: start;
    }

    .practice-cashflow-hq-topline > p i {
        display: none;
    }

    .practice-cashflow-filter-dock,
.practice-cashflow-horizon-cards,
.practice-cashflow-quality-headlines,
.practice-cashflow-composition > div,
.practice-cashflow-quality-grid,
.practice-cashflow-drawer-summary,
.practice-cashflow-drawer-categories,
.practice-cashflow-pattern form,
.practice-cashflow-evidence form {
        grid-template-columns: 1fr;
    }

    .practice-cashflow-periods {
        max-width: 100%;
        overflow-x: auto;
    }

    .practice-cashflow-custom-dates {
        display: grid;
    }

    .practice-cashflow-trend-columns {
        min-height: 210px;
        overflow-x: auto;
    }

    .practice-cashflow-trend-columns article {
        flex: 0 0 50px;
    }

    .practice-cashflow-drawer {
        width: 100vw;
    }

    .practice-cashflow-drawer > header,
.practice-cashflow-drawer-body {
        padding-right: 15px;
        padding-left: 15px;
    }

    .practice-cashflow-pattern > div,
.practice-cashflow-evidence summary,
.practice-cashflow-commitment-list > button,
.practice-cashflow-drawer-accounts article {
        grid-template-columns: 1fr auto;
    }

    .practice-cashflow-pattern > div > span,
.practice-cashflow-evidence summary > span,
.practice-cashflow-commitment-list > button > span,
.practice-cashflow-drawer-accounts article > span {
        grid-column: 1 / -1;
        grid-row: 1;
    }

    .practice-cashflow-pattern form .is-wide,
.practice-cashflow-evidence form .is-wide {
        grid-column: auto;
    }
}

/* ------------------------------------------------------------------ *
 * Money map release: capture ratios, the flow map, stage conversion,
 * and the change queue. Practice Cashflow reports structure and change;
 * raw per-household sums stay on the Household page.
 * ------------------------------------------------------------------ */

.practice-cashflow-hq > .cashflow-capture,
.practice-cashflow-hq > .cashflow-map,
.practice-cashflow-hq > .cashflow-conversion,
.practice-cashflow-hq > .cashflow-signals {
    min-width: 0;
}

/* Capture masthead ------------------------------------------------- */

.cashflow-capture-lead {
    display: flex;
    align-items: center;
    gap: 22px;
    margin: 8px 0 24px;
}

.cashflow-capture-lead > strong {
    flex: none;
    font-family: var(--advisor-font-display, "Newsreader", Georgia, serif);
    font-size: clamp(48px, 6vw, 76px);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.03em;
    line-height: 0.92;
    color: var(--advisor-color-positive-strong, #28563f);
}

.cashflow-capture-lead p {
    max-width: 40ch;
    margin: 0;
    font-size: 15px;
    line-height: 1.45;
}

.cashflow-capture-lead em {
    display: block;
    margin-top: 6px;
    color: var(--book-muted);
    font-size: 12.5px;
    font-style: normal;
}

.cashflow-capture-median {
    max-width: 52ch;
    margin-top: 6px;
    color: var(--advisor-color-subtle, #66716b);
    font-size: 11.5px;
    line-height: 1.4;
}

.cashflow-capture-empty {
    max-width: 68ch;
    margin: 10px 0 0;
    color: var(--book-muted);
    font-size: 13px;
    line-height: 1.5;
}

.cashflow-capture-rail {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 0;
}

.cashflow-capture-rail > div {
    display: grid;
    align-content: start;
    gap: 3px;
    padding: 0 20px;
    border-left: 1px solid var(--book-line);
}

.cashflow-capture-rail > div:first-child {
    padding-left: 0;
    border-left: 0;
}

.cashflow-capture-rail dt {
    color: var(--book-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.cashflow-capture-rail dd {
    margin: 0;
    font-size: 22px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.cashflow-capture-rail small {
    color: var(--book-muted);
    font-size: 11.5px;
    line-height: 1.35;
}

.cashflow-capture-rail em {
    color: var(--advisor-color-subtle, #66716b);
    font-size: 11px;
    font-style: normal;
    font-variant-numeric: tabular-nums;
}

.cashflow-capture-rail .is-positive dd {
    color: var(--advisor-color-positive-strong, #28563f);
}

.cashflow-capture-rail .is-warning dd {
    color: var(--advisor-color-negative, #a95243);
}

/* The money map ---------------------------------------------------- */

.cashflow-map.is-unavailable p {
    max-width: 68ch;
    margin: 0 0 6px;
    color: var(--book-muted);
    font-size: 13px;
    line-height: 1.5;
}

.cashflow-map-thresholds {
    font-variant-numeric: tabular-nums;
}

.cashflow-map-canvas {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
}

.cashflow-map-canvas svg {
    display: block;
    width: 100%;
    min-width: 720px;
    height: auto;
}

.cashflow-map-empty {
    margin: 0;
    padding: 32px 0;
    color: var(--book-muted);
    font-size: 13px;
    text-align: center;
}

.cashflow-map-column {
    fill: var(--book-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.cashflow-map-label {
    fill: var(--advisor-color-ink, #151917);
    font-size: 12.5px;
    font-weight: 500;
    paint-order: stroke;
    stroke: var(--advisor-color-canvas, #f2eadc);
    stroke-width: 3px;
    stroke-linejoin: round;
}

.cashflow-map-amount {
    fill: var(--book-muted);
    font-size: 11px;
    font-variant-numeric: tabular-nums;
    paint-order: stroke;
    stroke: var(--advisor-color-canvas, #f2eadc);
    stroke-width: 3px;
    stroke-linejoin: round;
}

.cashflow-map-flow {
    opacity: 0.74;
    transition: opacity 160ms ease;
}

.cashflow-map-flow.is-unknown {
    opacity: 0.9;
}

.cashflow-map-canvas svg.is-focused .cashflow-map-flow {
    opacity: 0.13;
}

.cashflow-map-canvas svg.is-focused .cashflow-map-flow.is-focus {
    opacity: 0.95;
}

.cashflow-map-node rect {
    transition: opacity 160ms ease;
}

.cashflow-map-canvas svg.is-focused .cashflow-map-node {
    opacity: 0.32;
}

.cashflow-map-canvas svg.is-focused .cashflow-map-node.is-focus {
    opacity: 1;
}

.cashflow-map-node.is-interactive {
    cursor: pointer;
}

.cashflow-map-node.is-interactive:focus-visible {
    outline: 2px solid var(--advisor-color-accent, #80601d);
    outline-offset: 2px;
}

.cashflow-map > footer {
    display: grid;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--book-line);
}

.cashflow-map-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--book-muted);
    font-size: 11px;
}

.cashflow-map-legend li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.cashflow-map-legend i {
    width: 10px;
    height: 10px;
    border-radius: 2px;
    background: var(--advisor-color-subtle, #66716b);
}

.cashflow-map-legend .is-source i { background: var(--advisor-color-positive, #3c7056); }
.cashflow-map-legend .is-hub i { background: var(--advisor-color-accent, #80601d); }
.cashflow-map-legend .is-use i { background: var(--advisor-color-negative, #a95243); }
.cashflow-map-legend .is-savings i { background: var(--advisor-color-positive-strong, #28563f); }
.cashflow-map-legend .is-destination i { background: var(--advisor-color-accent-strong, #654812); }
.cashflow-map-legend .is-deployment i { background: #4a6070; }

.cashflow-map-legend .is-unknown i {
    background: repeating-linear-gradient(
        45deg,
        var(--advisor-color-subtle, #66716b) 0 2px,
        transparent 2px 5px
    );
    border: 1px solid var(--advisor-color-subtle, #66716b);
}

.cashflow-map-excluded {
    margin: 0;
    color: var(--book-muted);
    font-size: 11.5px;
    line-height: 1.45;
}

/* Stage conversion and idle cash ----------------------------------- */

.cashflow-conversion .advisor-card-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
}

.cashflow-conversion:has(.cashflow-idle) .advisor-card-body {
    grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr);
    align-items: start;
}

.cashflow-conversion-steps {
    display: grid;
    gap: 2px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cashflow-conversion-steps li {
    display: grid;
    grid-template-columns: minmax(140px, 0.9fr) minmax(0, 2fr) auto 62px;
    align-items: center;
    gap: 14px;
    padding: 11px 0;
    border-bottom: 1px solid var(--book-line);
}

.cashflow-conversion-steps li:last-child {
    border-bottom: 0;
}

.cashflow-conversion-label {
    font-size: 13px;
    font-weight: 600;
}

.cashflow-conversion-track {
    display: block;
    height: 9px;
    border-radius: 5px;
    background: var(--advisor-color-canvas-deep, #e9dece);
}

.cashflow-conversion-track i {
    display: block;
    height: 100%;
    border-radius: 5px;
    background: var(--advisor-color-positive, #3c7056);
}

.cashflow-conversion-steps .is-warning .cashflow-conversion-track i {
    background: var(--advisor-color-negative, #a95243);
}

.cashflow-conversion-steps strong {
    font-size: 15px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.cashflow-conversion-steps em {
    color: var(--book-muted);
    font-size: 12px;
    font-style: normal;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.cashflow-conversion-steps small {
    grid-column: 1 / -1;
    margin-top: -4px;
    color: var(--advisor-color-subtle, #66716b);
    font-size: 11px;
}

.cashflow-idle {
    padding: 16px 18px;
    border: 1px solid var(--book-line);
    border-radius: var(--advisor-radius-panel, 10px);
    background: var(--advisor-color-surface-accent, rgba(247, 237, 217, 0.78));
}

.cashflow-idle > header {
    display: grid;
    gap: 3px;
    margin-bottom: 8px;
}

.cashflow-idle h3 {
    margin: 0;
    font-family: var(--advisor-font-display, "Newsreader", Georgia, serif);
    font-size: 17px;
    font-weight: 500;
    line-height: 1.25;
}

.cashflow-idle > p {
    margin: 0 0 10px;
    color: var(--book-muted);
    font-size: 12px;
}

.cashflow-idle ul {
    display: grid;
    gap: 1px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cashflow-idle button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 8px 0;
    border: 0;
    border-top: 1px solid var(--book-line);
    background: none;
    color: inherit;
    cursor: pointer;
    text-align: left;
}

.cashflow-idle button:hover strong,
.cashflow-idle button:focus-visible strong {
    text-decoration: underline;
}

.cashflow-idle button span {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.cashflow-idle button strong {
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cashflow-idle button em {
    color: var(--book-muted);
    font-size: 11px;
    font-style: normal;
}

.cashflow-idle button b {
    font-size: 13.5px;
    font-variant-numeric: tabular-nums;
}

/* What changed ----------------------------------------------------- */

.cashflow-signal-counts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
}

.cashflow-signal-counts li {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    padding: 5px 11px;
    border: 1px solid var(--book-line);
    border-radius: 999px;
    background: var(--advisor-color-surface, rgba(255, 253, 248, 0.86));
    font-size: 11.5px;
}

.cashflow-signal-counts strong {
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

.cashflow-signal-list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cashflow-signal-list li {
    border-bottom: 1px solid var(--book-line);
}

.cashflow-signal-list li:last-child {
    border-bottom: 0;
}

.cashflow-signal-list button {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.9fr) auto;
    align-items: center;
    gap: 16px;
    width: 100%;
    padding: 12px 12px 12px 14px;
    border: 0;
    border-left: 3px solid transparent;
    background: none;
    color: inherit;
    cursor: pointer;
    text-align: left;
}

.cashflow-signal-list button:hover,
.cashflow-signal-list button:focus-visible {
    background: var(--advisor-color-surface-muted, rgba(245, 238, 226, 0.74));
}

.cashflow-signal-list .is-severity-0 button { border-left-color: var(--advisor-color-negative, #a95243); }
.cashflow-signal-list .is-severity-1 button { border-left-color: var(--advisor-color-accent, #80601d); }
.cashflow-signal-list .is-severity-2 button { border-left-color: var(--advisor-color-positive, #3c7056); }
.cashflow-signal-list .is-severity-3 button { border-left-color: var(--book-line); }

.cashflow-signal-household,
.cashflow-signal-body,
.cashflow-signal-value {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.cashflow-signal-value {
    justify-items: end;
    text-align: right;
}

.cashflow-signal-household strong,
.cashflow-signal-body strong {
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cashflow-signal-household em,
.cashflow-signal-body em {
    color: var(--book-muted);
    font-size: 11.5px;
    font-style: normal;
    line-height: 1.35;
}

.cashflow-signal-value strong {
    font-size: 14px;
    font-variant-numeric: tabular-nums;
}

.cashflow-signal-value em {
    color: var(--book-muted);
    font-size: 11px;
    font-style: normal;
    white-space: nowrap;
}

.cashflow-signals .advisor-open-head button {
    padding: 7px 14px;
    border: 1px solid var(--advisor-color-border);
    border-radius: 999px;
    background: none;
    color: inherit;
    cursor: pointer;
    font-size: 12px;
    white-space: nowrap;
}

.cashflow-signals .advisor-open-head button:hover {
    border-color: var(--advisor-color-accent);
}

.cashflow-signals-empty {
    max-width: 72ch;
    margin: 0;
    color: var(--book-muted);
    font-size: 13px;
    line-height: 1.5;
}

@media (max-width: 1180px) {
    .cashflow-capture-rail {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px 0;
    }

    .cashflow-capture-rail > div:nth-child(odd) {
        padding-left: 0;
        border-left: 0;
    }

    .cashflow-conversion:has(.cashflow-idle) .advisor-card-body {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 820px) {
    .cashflow-capture-lead {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .cashflow-map > header,

    .cashflow-map > header p {
        text-align: left;
    }

    .cashflow-conversion-steps li {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 4px 12px;
    }

    .cashflow-conversion-track {
        grid-column: 1 / -1;
        order: 3;
    }

    .cashflow-conversion-steps small {
        order: 4;
        margin-top: 2px;
    }

    .cashflow-signal-list button {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 4px 12px;
    }

    .cashflow-signal-body {
        grid-column: 1 / -1;
        order: 3;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cashflow-map-flow,
.cashflow-map-node rect {
        transition: none;
    }
}

/* Seeding state: shown while the book is below the money-map coverage gate. */

.practice-cashflow-hq > .cashflow-seeding {
    min-width: 0;
}

.cashflow-seeding-lede {
    max-width: 78ch;
    margin: 0 0 22px;
    color: var(--book-muted);
    font-size: 13.5px;
    line-height: 1.55;
}

.cashflow-gate-list {
    display: grid;
    gap: 2px;
    margin: 0 0 14px;
    padding: 0;
    list-style: none;
    max-width: 780px;
}

.cashflow-gate-list li {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) minmax(0, 1.6fr) auto;
    align-items: center;
    gap: 14px;
    padding: 12px 0;
    border-bottom: 1px solid var(--book-line);
}

.cashflow-gate-list li:last-child {
    border-bottom: 0;
}

.cashflow-gate-label {
    font-size: 13px;
    font-weight: 600;
}

.cashflow-gate-track {
    display: block;
    height: 9px;
    border-radius: 5px;
    background: var(--advisor-color-canvas-deep, #e9dece);
}

.cashflow-gate-track i {
    display: block;
    height: 100%;
    border-radius: 5px;
    background: var(--advisor-color-accent, #80601d);
}

.cashflow-gate-list .is-met .cashflow-gate-track i {
    background: var(--advisor-color-positive, #3c7056);
}

.cashflow-gate-list strong {
    font-size: 14px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: right;
    white-space: nowrap;
}

.cashflow-gate-list small {
    grid-column: 1 / -1;
    margin-top: -4px;
    color: var(--advisor-color-subtle, #66716b);
    font-size: 11px;
}

.cashflow-seeding-note {
    max-width: 78ch;
    margin: 0;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--book-line);
    color: var(--advisor-color-subtle, #66716b);
    font-size: 12.5px;
    line-height: 1.5;
}

@media (max-width: 820px) {
    .cashflow-gate-list li {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 4px 12px;
    }

    .cashflow-gate-track {
        grid-column: 1 / -1;
        order: 3;
    }

    .cashflow-gate-list small {
        order: 4;
        margin-top: 2px;
    }
}

/* ------------------------------------------------------------------ *
 * Aggregate analytics: savings realization, trajectory, spending
 * habits, Budget adherence, and merchant concentration.
 * ------------------------------------------------------------------ */

.practice-cashflow-hq > .cashflow-realization,
.practice-cashflow-hq > .cashflow-trend,
.practice-cashflow-hq > .cashflow-spending,
.practice-cashflow-hq > .cashflow-adherence,
.practice-cashflow-hq > .cashflow-merchants {
    min-width: 0;
}

.cashflow-realization.is-unavailable p,
.cashflow-spending.is-unavailable p,
.cashflow-adherence.is-unavailable p {
    max-width: 70ch;
    margin: 0;
    color: var(--book-muted);
    font-size: 13px;
    line-height: 1.5;
    text-align: left;
}

/* Expected vs actual saving ---------------------------------------- */

.cashflow-realization-lead {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 6px 0 20px;
}

.cashflow-realization-lead > strong {
    flex: none;
    font-family: var(--advisor-font-display, "Newsreader", Georgia, serif);
    font-size: clamp(40px, 4.6vw, 58px);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.03em;
    line-height: 0.95;
    color: var(--advisor-color-accent-strong, #654812);
}

.cashflow-realization-lead p {
    max-width: 42ch;
    margin: 0;
    font-size: 14.5px;
    line-height: 1.45;
}

.cashflow-realization-lead em {
    display: block;
    margin-top: 5px;
    color: var(--book-muted);
    font-size: 12px;
    font-style: normal;
}

.cashflow-realization-gap {
    color: var(--advisor-color-negative, #a95243) !important;
}

.cashflow-realization-bands {
    display: flex;
    gap: 3px;
    margin-bottom: 20px;
}

.cashflow-realization-bands span {
    display: grid;
    gap: 1px;
    min-width: 0;
    padding: 9px 12px;
    border-radius: 6px;
    background: var(--advisor-color-surface-muted, rgba(245, 238, 226, 0.74));
    border-left: 3px solid var(--advisor-color-subtle, #66716b);
}

.cashflow-realization-bands .is-positive { border-left-color: var(--advisor-color-positive, #3c7056); }
.cashflow-realization-bands .is-warning { border-left-color: var(--advisor-color-accent, #80601d); }
.cashflow-realization-bands .is-negative { border-left-color: var(--advisor-color-negative, #a95243); }

.cashflow-realization-bands strong {
    font-size: 17px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.cashflow-realization-bands small {
    color: var(--book-muted);
    font-size: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cashflow-realization-bands em {
    color: var(--advisor-color-subtle, #66716b);
    font-size: 10.5px;
    font-style: normal;
    font-variant-numeric: tabular-nums;
}

.cashflow-realization-list h3 {
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--book-muted);
}

.cashflow-realization-list ul {
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cashflow-realization-list li {
    border-bottom: 1px solid var(--book-line);
}

.cashflow-realization-list li:last-child {
    border-bottom: 0;
}

.cashflow-realization-list button {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    width: 100%;
    padding: 10px 8px 10px 0;
    border: 0;
    background: none;
    color: inherit;
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.cashflow-realization-list button:hover,
.cashflow-realization-list button:focus-visible {
    background: var(--advisor-color-surface-muted, rgba(245, 238, 226, 0.74));
}

.cashflow-realization-household,
.cashflow-realization-figures,
.cashflow-realization-variance {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.cashflow-realization-variance {
    justify-items: end;
    text-align: right;
}

.cashflow-realization-household strong {
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cashflow-realization-household em,
.cashflow-realization-figures em {
    color: var(--book-muted);
    font-size: 11.5px;
    font-style: normal;
    font-variant-numeric: tabular-nums;
}

.cashflow-realization-variance strong {
    font-size: 14px;
    font-variant-numeric: tabular-nums;
    color: var(--advisor-color-negative, #a95243);
}

.cashflow-realization-variance em {
    color: var(--book-muted);
    font-size: 11px;
    font-style: normal;
}

/* Trajectory -------------------------------------------------------- */

.cashflow-trend-canvas {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
}

.cashflow-trend-canvas svg {
    display: block;
    width: 100%;
    min-width: 640px;
    height: auto;
}

.cashflow-trend-grid {
    stroke: var(--advisor-color-border, #d9cdbb);
    stroke-width: 1;
    stroke-dasharray: 2 4;
}

.cashflow-trend-axis,
.cashflow-trend-month {
    fill: var(--book-muted);
    font-size: 10.5px;
    font-variant-numeric: tabular-nums;
}

.cashflow-trend-month.is-partial {
    font-style: italic;
    opacity: 0.6;
}

.cashflow-trend-bar.is-partial,
.cashflow-trend-dot.is-partial {
    opacity: 0.34;
}

.cashflow-trend-line {
    stroke-width: 2;
    stroke-linejoin: round;
    stroke-linecap: round;
}

.cashflow-trend-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
    color: var(--book-muted);
    font-size: 11px;
}

.cashflow-trend-legend li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.cashflow-trend-legend i {
    width: 10px;
    height: 10px;
    border-radius: 2px;
}

.cashflow-trend-legend .is-income i { background: var(--advisor-color-positive, #3c7056); }
.cashflow-trend-legend .is-spending i { background: var(--advisor-color-negative, #a95243); }
.cashflow-trend-legend .is-saving i { background: var(--advisor-color-positive-strong, #28563f); }
.cashflow-trend-legend .is-capture i {
    height: 3px;
    border-radius: 2px;
    background: var(--advisor-color-accent, #80601d);
}

/* Spending habits --------------------------------------------------- */

.cashflow-spending-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 0 0 18px;
}

.cashflow-spending-summary > div {
    display: grid;
    align-content: start;
    gap: 2px;
    padding: 0 18px;
    border-left: 1px solid var(--book-line);
}

.cashflow-spending-summary > div:first-child {
    padding-left: 0;
    border-left: 0;
}

.cashflow-spending-summary dt {
    color: var(--book-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.cashflow-spending-summary dd {
    margin: 0;
    font-size: 21px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.cashflow-spending-summary .is-accent dd {
    color: var(--advisor-color-accent-strong, #654812);
}

.cashflow-spending-summary small {
    color: var(--advisor-color-subtle, #66716b);
    font-size: 11px;
    line-height: 1.35;
}

.cashflow-table-wrap {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
}

.cashflow-spending-table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
}

.cashflow-spending-table th {
    padding: 0 12px 8px 0;
    border-bottom: 1px solid var(--advisor-color-border-strong, #c4b49e);
    color: var(--book-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-align: left;
    text-transform: uppercase;
}

.cashflow-spending-table td {
    padding: 11px 12px 11px 0;
    border-bottom: 1px solid var(--book-line);
    vertical-align: middle;
}

.cashflow-spending-table td.is-numeric {
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.cashflow-spending-table td small {
    display: block;
    color: var(--advisor-color-subtle, #66716b);
    font-size: 10.5px;
}

.cashflow-spending-table button {
    display: grid;
    gap: 1px;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.cashflow-spending-table button:hover strong,
.cashflow-spending-table button:focus-visible strong {
    text-decoration: underline;
}

.cashflow-spending-table button strong {
    font-size: 13px;
    font-weight: 600;
}

.cashflow-spending-table button small {
    text-transform: capitalize;
}

.cashflow-spending-table tr.is-committed button small { color: var(--advisor-color-accent, #80601d); }
.cashflow-spending-table tr.is-flexible button small { color: var(--advisor-color-positive, #3c7056); }

.cashflow-spread {
    position: relative;
    display: block;
    width: 100%;
    min-width: 120px;
    height: 8px;
    border-radius: 4px;
    background: var(--advisor-color-canvas-deep, #e9dece);
}

.cashflow-spread i {
    position: absolute;
    top: 0;
    height: 100%;
    border-radius: 4px;
    background: var(--advisor-color-accent, #80601d);
    opacity: 0.42;
}

.cashflow-spread b {
    position: absolute;
    top: -2px;
    width: 2px;
    height: 12px;
    border-radius: 1px;
    background: var(--advisor-color-accent-strong, #654812);
}

/* Budget adherence and merchant concentration ----------------------- */

.cashflow-adherence-list,
.cashflow-merchant-list {
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cashflow-adherence-list li,
.cashflow-merchant-list li {
    display: grid;
    align-items: center;
    gap: 16px;
    padding: 11px 0;
    border-bottom: 1px solid var(--book-line);
}

.cashflow-adherence-list li {
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto auto;
}

.cashflow-merchant-list li {
    grid-template-columns: minmax(0, 1.6fr) auto auto;
}

.cashflow-adherence-list li:last-child,
.cashflow-merchant-list li:last-child {
    border-bottom: 0;
}

.cashflow-adherence-name,
.cashflow-adherence-figures,
.cashflow-merchant-name,
.cashflow-merchant-reach,
.cashflow-merchant-value {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.cashflow-merchant-reach,
.cashflow-merchant-value {
    justify-items: end;
    text-align: right;
}

.cashflow-adherence-name strong,
.cashflow-merchant-name strong {
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cashflow-adherence-name strong {
    text-transform: capitalize;
}

.cashflow-adherence-name em,
.cashflow-adherence-figures em,
.cashflow-merchant-name em,
.cashflow-merchant-reach em,
.cashflow-merchant-value em {
    color: var(--book-muted);
    font-size: 11.5px;
    font-style: normal;
    font-variant-numeric: tabular-nums;
}

.cashflow-adherence-list > li > strong,
.cashflow-merchant-reach strong,
.cashflow-merchant-value strong {
    font-size: 14px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.cashflow-adherence-list .is-over { color: var(--advisor-color-negative, #a95243); }
.cashflow-adherence-list .is-under { color: var(--advisor-color-positive, #3c7056); }

.cashflow-adherence-list > li > small {
    color: var(--advisor-color-subtle, #66716b);
    font-size: 10.5px;
    white-space: nowrap;
}

@media (max-width: 1180px) {
    .cashflow-spending-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px 0;
    }

    .cashflow-spending-summary > div:nth-child(odd) {
        padding-left: 0;
        border-left: 0;
    }

    .cashflow-realization-bands {
        flex-wrap: wrap;
    }

    .cashflow-realization-bands span {
        flex: 1 1 44% !important;
    }
}

@media (max-width: 820px) {
    .cashflow-realization > header,
    .cashflow-trend > header,
    .cashflow-spending > header,
    .cashflow-adherence > header,
    .cashflow-merchants > header {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .cashflow-realization > header p,
    .cashflow-trend > header p,
    .cashflow-spending > header p,
    .cashflow-adherence > header p,
    .cashflow-merchants > header p {
        text-align: left;
    }

    .cashflow-realization-lead {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .cashflow-realization-list button,
    .cashflow-adherence-list li {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 4px 12px;
    }

    .cashflow-realization-figures,
    .cashflow-adherence-figures {
        grid-column: 1 / -1;
        order: 3;
    }
}

/* ------------------------------------------------------------------ *
 * Tax lanes, decumulation, and institutions.
 * ------------------------------------------------------------------ */

.practice-cashflow-hq > .cashflow-decumulation,
.practice-cashflow-hq > .cashflow-institutions {
    min-width: 0;
}

/* Shared two-tone bar for managed against held-away. */
.cashflow-tax-bar,
.cashflow-institution-bar {
    display: flex;
    width: 100%;
    min-width: 90px;
    height: 9px;
    overflow: hidden;
    border-radius: 5px;
    background: var(--advisor-color-canvas-deep, #e9dece);
}

.cashflow-tax-bar i,
.cashflow-institution-bar i {
    display: block;
    height: 100%;
}

.cashflow-tax-bar .is-managed,
.cashflow-institution-bar .is-managed {
    background: var(--advisor-color-positive-strong, #28563f);
}

.cashflow-tax-bar .is-held-away,
.cashflow-institution-bar .is-held-away {
    background: var(--advisor-color-accent, #80601d);
    opacity: 0.55;
}

/* Tax lanes, nested inside the savings section. */

.cashflow-tax-lanes {
    margin: 18px 0 20px;
}

.cashflow-tax-lanes h3 {
    margin: 0 0 2px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--book-muted);
}

.cashflow-tax-lanes > p {
    margin: 0 0 10px;
    color: var(--book-muted);
    font-size: 12.5px;
}

.cashflow-tax-lanes ul {
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cashflow-tax-lanes li {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) minmax(0, 1.6fr) auto 56px;
    align-items: center;
    gap: 14px;
    padding: 9px 0;
    border-bottom: 1px solid var(--book-line);
}

.cashflow-tax-lanes li:last-child {
    border-bottom: 0;
}

.cashflow-tax-name {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.cashflow-tax-name strong {
    font-size: 13px;
    font-weight: 600;
}

.cashflow-tax-name em,
.cashflow-tax-lanes li > em {
    color: var(--book-muted);
    font-size: 11.5px;
    font-style: normal;
    font-variant-numeric: tabular-nums;
}

.cashflow-tax-lanes li > strong {
    font-size: 14px;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.cashflow-tax-lanes li > em {
    text-align: right;
}

.cashflow-tax-lanes > footer {
    display: flex;
    gap: 14px;
    margin-top: 8px;
    color: var(--book-muted);
    font-size: 11px;
}

.cashflow-tax-lanes > footer span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.cashflow-tax-lanes > footer i {
    width: 10px;
    height: 10px;
    border-radius: 2px;
}

.cashflow-tax-lanes > footer .is-managed i {
    background: var(--advisor-color-positive-strong, #28563f);
}

.cashflow-tax-lanes > footer .is-held-away i {
    background: var(--advisor-color-accent, #80601d);
    opacity: 0.55;
}

/* Decumulation and institutions summaries. */

/* Stacked in the narrower column of a split layout, rather than the
   3-across divider strip used when the section has the full column width. */
.advisor-split-b .cashflow-decumulation-summary {
    grid-template-columns: 1fr;
    gap: 14px 0;
}

.advisor-split-b .cashflow-decumulation-summary > div {
    padding: 0;
    border-left: 0;
}

.cashflow-decumulation-summary,
.cashflow-institutions-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin: 0 0 16px;
}

.cashflow-decumulation-summary > div,
.cashflow-institutions-summary > div {
    display: grid;
    align-content: start;
    gap: 2px;
    padding: 0 18px;
    border-left: 1px solid var(--book-line);
}

.cashflow-decumulation-summary > div:first-child,
.cashflow-institutions-summary > div:first-child {
    padding-left: 0;
    border-left: 0;
}

.cashflow-decumulation-summary dt,
.cashflow-institutions-summary dt {
    color: var(--book-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.cashflow-decumulation-summary dd,
.cashflow-institutions-summary dd {
    margin: 0;
    font-size: 21px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.cashflow-institutions-summary .is-accent dd {
    color: var(--advisor-color-accent-strong, #654812);
}

.cashflow-decumulation-summary small,
.cashflow-institutions-summary small {
    color: var(--advisor-color-subtle, #66716b);
    font-size: 11px;
    line-height: 1.35;
}

/* Lists. */

.cashflow-decumulation-list,
.cashflow-institution-list {
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cashflow-decumulation-list li,
.cashflow-institution-list li {
    border-bottom: 1px solid var(--book-line);
}

.cashflow-decumulation-list li:last-child,
.cashflow-institution-list li:last-child {
    border-bottom: 0;
}

.cashflow-decumulation-list button {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    width: 100%;
    padding: 11px 8px 11px 0;
    border: 0;
    background: none;
    color: inherit;
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.cashflow-decumulation-list button:hover,
.cashflow-decumulation-list button:focus-visible {
    background: var(--advisor-color-surface-muted, rgba(245, 238, 226, 0.74));
}

.cashflow-institution-list li {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.4fr) auto auto;
    align-items: center;
    gap: 16px;
    padding: 11px 0;
}

.cashflow-decumulation-household,
.cashflow-decumulation-figures,
.cashflow-institution-name,
.cashflow-institution-value,
.cashflow-institution-flow {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.cashflow-institution-value,
.cashflow-institution-flow {
    justify-items: end;
    text-align: right;
}

.cashflow-decumulation-household strong,
.cashflow-institution-name strong {
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cashflow-decumulation-household em,
.cashflow-decumulation-figures em,
.cashflow-institution-name em,
.cashflow-institution-value em,
.cashflow-institution-flow em {
    color: var(--book-muted);
    font-size: 11.5px;
    font-style: normal;
    font-variant-numeric: tabular-nums;
}

.cashflow-institution-name em {
    text-transform: capitalize;
}

.cashflow-decumulation-list button > strong,
.cashflow-institution-value strong,
.cashflow-institution-flow strong {
    font-size: 14px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.cashflow-decumulation-note,
.cashflow-institutions-note {
    margin: 10px 0 0;
    color: var(--advisor-color-subtle, #66716b);
    font-size: 11.5px;
}

@media (max-width: 1180px) {
    .cashflow-decumulation-summary,
    .cashflow-institutions-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px 0;
    }

    .cashflow-decumulation-summary > div:nth-child(odd),
    .cashflow-institutions-summary > div:nth-child(odd) {
        padding-left: 0;
        border-left: 0;
    }
}

@media (max-width: 820px) {
    .cashflow-decumulation > header,
    .cashflow-institutions > header {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .cashflow-decumulation > header p,
    .cashflow-institutions > header p {
        text-align: left;
    }

    .cashflow-tax-lanes li,
    .cashflow-decumulation-list button,
    .cashflow-institution-list li {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 4px 12px;
    }

    .cashflow-tax-bar,
    .cashflow-institution-bar,
    .cashflow-decumulation-figures {
        grid-column: 1 / -1;
        order: 3;
    }

    .cashflow-institution-flow {
        grid-column: 1 / -1;
        order: 4;
        justify-items: start;
        text-align: left;
    }
}

/* The band system owns section separation, padding and chart surfaces.
   These rules only cover what is specific to this page. */

.practice-cashflow-hq {
    display: grid;
    gap: 32px;
}

.cashflow-map-canvas,
.cashflow-trend-canvas,
.advisor-chart-canvas {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
}

.cashflow-map-canvas svg,
.cashflow-trend-canvas svg {
    display: block;
    width: 100%;
    min-width: 660px;
    height: auto;
}

.cashflow-map-label {
    fill: var(--advisor-color-ink);
    stroke: var(--advisor-color-canvas);
    paint-order: stroke;
    stroke-width: 3px;
    stroke-linejoin: round;
    font-size: 12.5px;
    font-weight: 500;
}

.cashflow-map-amount,
.cashflow-map-column {
    fill: var(--advisor-color-muted);
    stroke: var(--advisor-color-canvas);
    paint-order: stroke;
    stroke-width: 3px;
    stroke-linejoin: round;
}

.cashflow-trend-axis,
.cashflow-trend-month {
    fill: var(--advisor-color-muted);
    stroke: none;
}

.cashflow-trend-grid {
    stroke: var(--advisor-color-border);
    stroke-dasharray: 2 4;
}

/* Key for the spending dot plot; the chart itself is a shared primitive. */
.cashflow-chart-key {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
    color: var(--advisor-color-muted);
    font-size: 11px;
}

.cashflow-chart-key li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.cashflow-chart-key i {
    width: 10px;
    height: 10px;
    border-radius: 2px;
}

.cashflow-chart-key .is-committed i { background: var(--advisor-color-accent); }
.cashflow-chart-key .is-flexible i { background: var(--advisor-color-positive); }

.cashflow-tax-lanes {
    margin: 18px 0 20px;
}