/* The Reports parts and pages (reports-area.css holds the tokens and frame): the Overview hero and pace, the Sankey
   card (totals, chart, every dollar, insights), breakdowns, value bars, transactions, the heatmap and cash calendar,
   findings, the drill-down dashboard, sources, creep, fairness, rhythm, bills (opportunities, timeline, overlaps),
   what-if, saved views, the AI briefing, upsell and Ask, the library and Intelligence, then net worth (hero, bridge,
   composition, accounts), budgets (hero ring, lines, suggestions, editor), the money story email and glance cards. */

/* ------------------------------------------------------------------ Overview hero */

.ah.rp-hero {
    --ah-bg: var(--rp-hero-bg);
    --ah-border: var(--rp-border);
    --ah-badge-bg: var(--rp-icon-bg);
    --ah-badge-fg: var(--rp-icon);
    --ah-accent: var(--rp-indigo);
    --dsh-bone: hsl(calc(243.4deg + var(--ci-accent-shift, 0deg)) 75.36% 58.63% / .10);
    grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
    grid-template-rows: auto auto;
}

[data-bs-theme="dark"] .ah.rp-hero {
    --ah-value-pill: hsl(calc(242.17deg + var(--ci-accent-shift, 0deg)) 47.43% 34.31% / .5);
    --ah-pill: hsl(calc(242.17deg + var(--ci-accent-shift, 0deg)) 47.43% 34.31% / .45);
    --dsh-bone: rgba(165, 180, 252, .12);
}

.rp-hero-main { min-height: 300px; }
.rp-hero-content { padding: 1rem 1.25rem; gap: .45rem; }
.rp-hero-help { margin-left: .25rem; }
.rp-hero-value { font-size: clamp(30px, 4.4vw, 46px); }
.rp-hero-value.is-negative { color: var(--rp-negative); }
.rp-hero-change { font-size: 12.5px; font-weight: 600; }
.rp-hero-pills .ah-pill { display: inline-flex; align-items: center; gap: .3rem; }
.rp-hero-legend { display: inline-flex; align-items: center; gap: .4rem; margin-top: auto; font-size: 10.5px; color: var(--ah-muted); }
.rp-hero-swatch { width: 14px; height: 3px; border-radius: 2px; background: var(--rp-hero-line); }
.rp-hero-svg { opacity: .95; }
.rp-hero-stop-0 { stop-color: var(--rp-hero-area); }
.rp-hero-stop-1 { stop-color: var(--rp-hero-area); stop-opacity: 0; }
.rp-hero-line, .rp-hero-glow { stroke: var(--rp-hero-line); }
.rp-hero-zero { stroke: var(--rp-negative); stroke-width: 1; stroke-dasharray: 4 6; opacity: .55; vector-effect: non-scaling-stroke; }

.rp-pace {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: .4rem;
    margin: 14px 14px 14px 0;
    padding: 16px;
    border: 1px solid color-mix(in srgb, var(--rp-tone) 20%, transparent);
    border-radius: 16px;
    background: color-mix(in srgb, var(--rp-card) 78%, transparent);
    backdrop-filter: blur(6px);
}

.rp-pace-value { font-family: var(--tx-font); font-size: 26px; font-weight: 650; font-variant-numeric: tabular-nums; color: var(--rp-text); }
.rp-pace-sub { font-size: 11.5px; color: var(--rp-muted); }
.rp-pace-bar { position: relative; height: 10px; margin-top: 6px; border-radius: 999px; background: var(--rp-track); overflow: visible; }
.rp-pace-fill { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: linear-gradient(90deg, var(--rp-indigo-bright), var(--rp-indigo)); }
.rp-pace-mark { position: absolute; top: -4px; width: 2px; height: 18px; border-radius: 2px; background: var(--rp-text); opacity: .55; }
.rp-pace-legend { display: flex; justify-content: space-between; gap: .5rem; font-size: 11px; color: var(--rp-muted); }
.rp-pace-compare { font-size: 12px; font-weight: 600; }

.rp-hero-tiles {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 1px;
    border-top: 1px solid var(--ah-border);
    background: var(--ah-border);
}

.rp-hero-tile {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    background: var(--ah-tiles-bg, var(--rp-card));
    color: inherit;
    text-decoration: none;
    transition: background-color .15s ease;
}

[data-bs-theme="dark"] .rp-hero-tile { background: color-mix(in srgb, var(--rp-card) 82%, transparent); }
.rp-hero-tile:hover { background: var(--rp-row-hover); color: inherit; }
.rp-hero-tile-chip { display: inline-grid; place-items: center; flex: 0 0 auto; width: 30px; height: 30px; border-radius: 9px; background: var(--rp-icon-bg); color: var(--rp-icon); font-size: 12.5px; }
.rp-hero-tile-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.rp-hero-tile-caption { font-size: 9.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--rp-muted); }
.rp-hero-tile-value { font-family: var(--tx-font); font-size: 17px; font-weight: 650; font-variant-numeric: tabular-nums; color: var(--rp-text); }
.rp-hero-tile-note { font-size: 11px; color: var(--rp-muted); }

@media (max-width: 991.98px) {
    .ah.rp-hero { grid-template-columns: minmax(0, 1fr); }
    .rp-pace { margin: 0 14px 14px; }
}

.rp-pinned { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

/* ------------------------------------------------------------------ The Sankey card */

.rp-flow-totals { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.rp-flow-total {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid var(--rp-tile-border);
    border-radius: 12px;
    background: var(--rp-tile);
}

.rp-flow-total-caption { display: inline-flex; align-items: center; gap: .3rem; font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--rp-muted); }
.rp-flow-total-caption .tx-glyph { font-size: 9px; color: var(--rp-indigo); }
.rp-flow-total-value { font-family: var(--tx-font); font-size: 19px; font-weight: 650; font-variant-numeric: tabular-nums; color: var(--rp-text); }
.rp-flow-total.rp-tone-positive .rp-flow-total-value { color: var(--rp-positive); }
.rp-flow-total.rp-tone-negative .rp-flow-total-value { color: var(--rp-negative); }

@media (max-width: 767.98px) {
    .rp-flow-totals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.rp-sankey-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; border-radius: 14px; }
.rp-sankey { min-width: 640px; }
.rp-sankey-scroll.is-vertical .rp-sankey { min-width: 0; }
.rp-sankey-card.is-compact .rp-sankey { min-width: 560px; }
.rp-sankey-scroll.is-exporting { opacity: .35; }
.rp-sankey-hint { display: none; margin: 6px 0 0; font-size: 11.5px; color: var(--rp-muted); }
@media (max-width: 700px) { .rp-sankey-hint { display: block; } }

/* The Sankey draws its labels as SVG text: they follow the theme (exports redraw with dark labels on white). */
.rp-sankey-scroll:not(.is-exporting) .rp-sankey svg text { fill: var(--rp-text) !important; font-family: "Segoe UI", system-ui, -apple-system, Roboto, sans-serif !important; font-size: 12px !important; font-weight: 500 !important; }
.rp-sankey svg [id*="_node_"] { cursor: pointer; }
.rp-sankey svg path { cursor: pointer; }

/* The hover tooltip follows the theme: a dark card with white text on dark, a white card with dark text on light
   (tokens --rp-tip-* in reports-area.css). The card paints its own surface, and the box Syncfusion draws behind a
   tooltip template is matched to it so no white shell shows through on dark. */
.rp-sankey-tip { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; min-width: 180px; max-width: 280px; color: var(--rp-tip-text); background: var(--rp-tip-bg); border: 1px solid var(--rp-tip-border); border-radius: 10px; box-shadow: var(--rp-tip-shadow); font-size: 12px; line-height: 1.35; }
.rp-sankey-tip strong { display: inline-flex; align-items: center; gap: .3rem; font-size: 12.5px; color: var(--rp-tip-text); }
.rp-sankey-tip-value { font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--rp-tip-text); }
.rp-sankey-tip-note { color: var(--rp-tip-note); }
.rp-sankey-tip-action { margin-top: 3px; font-size: 11px; font-weight: 600; color: var(--rp-tip-action); }
[id$="_tooltip"]:has(.rp-sankey-tip),
[class~="e-tooltip-wrap"]:has(.rp-sankey-tip) { background: var(--rp-tip-bg) !important; border-color: var(--rp-tip-border) !important; color: var(--rp-tip-text) !important; }
[id$="_tooltip"]:has(.rp-sankey-tip) path,
[class~="e-tooltip-wrap"]:has(.rp-sankey-tip) path { fill: var(--rp-tip-bg) !important; stroke: var(--rp-tip-border) !important; }
.rp-sankey-tip-action:empty { display: none; }
.rp-sankey-tip-arrow { font-size: 9px; opacity: .7; }

.rp-dollar { margin-top: 14px; }
.rp-dollar-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.rp-dollar-head .rp-subhead { margin: 0 0 8px; }
.rp-dollar-strip { display: flex; height: 14px; gap: 2px; overflow: hidden; border-radius: 999px; background: var(--rp-track); }
.rp-dollar-seg { flex-basis: 0; min-width: 3px; transition: flex-grow .5s ease; }
.rp-dollar-seg:first-child { border-radius: 999px 0 0 999px; }
.rp-dollar-seg:last-child { border-radius: 0 999px 999px 0; }
.rp-dollar-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 4px 14px; margin: 10px 0 0; padding: 0; list-style: none; }
.rp-dollar-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 6px 6px;
    border: 0;
    border-radius: 10px;
    background: none;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.rp-dollar-row:hover:not(:disabled) { background: var(--rp-row-hover); }
.rp-dollar-row:disabled { cursor: default; }
.rp-dollar-chip {
    --rp-chip: var(--rp-indigo);
    display: inline-grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 8px;
    background: color-mix(in srgb, var(--rp-chip) 16%, transparent);
    color: var(--rp-chip);
    font-size: 11px;
}

.rp-dollar-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; font-weight: 500; }
.rp-dollar-cents { font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--rp-text); }
.rp-dollar-amount { min-width: 58px; text-align: right; font-size: 11.5px; font-variant-numeric: tabular-nums; color: var(--rp-muted); }

.rp-sankey-insights { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; }
.rp-sankey-insight {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--rp-tone-soft) 60%, transparent);
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--rp-text);
}

.rp-sankey-insight-glyph { margin-top: 2px; color: var(--rp-tone); }
.rp-sankey-insight .rp-link { margin-left: auto; flex: 0 0 auto; }

/* ------------------------------------------------------------------ Charts */

.rp-chart { min-width: 0; transition: opacity .2s ease; }
.rp-chart.is-stale { opacity: .55; }
.rp-donut-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 12px; align-items: center; }

@media (max-width: 767.98px) {
    .rp-donut-split { grid-template-columns: minmax(0, 1fr); }
}

/* ------------------------------------------------------------------ Breakdowns */

.rp-breakdown { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.rp-breakdown > .rp-breakdown-item + .rp-breakdown-item { border-top: 1px solid var(--rc-line, rgba(0, 0, 0, .06)); }
.rp-breakdown-row { display: flex; align-items: center; gap: 6px; min-width: 0; }
.rp-breakdown-toggle {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0;
    border-radius: 7px;
    background: none;
    color: var(--rp-muted);
    font-size: 10px;
    cursor: pointer;
}

.rp-breakdown-toggle:hover { background: var(--rp-row-hover); color: var(--rp-indigo); }
.rp-breakdown-toggle.is-empty { cursor: default; }
.rp-breakdown-main {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1 1 auto;
    min-width: 0;
    padding: 9px 4px;
    border: 0;
    border-radius: 10px;
    background: none;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.rp-breakdown-main:hover:not(:disabled) { background: var(--rp-row-hover); }
.rp-breakdown-main:disabled { cursor: default; }
.rp-breakdown-text { display: flex; flex-direction: column; gap: 4px; flex: 1 1 auto; min-width: 0; }
.rp-breakdown-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; font-weight: 600; color: var(--rp-text); }
.rp-breakdown-bar { display: block; height: 6px; border-radius: 999px; background: var(--rp-track); overflow: hidden; }
.rp-breakdown-fill { display: block; height: 100%; border-radius: inherit; transition: width .6s cubic-bezier(.2, .8, .2, 1); }
.rp-breakdown-sub { font-size: 11px; color: var(--rp-muted); }
.rp-breakdown-figures { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; flex: 0 0 auto; min-width: 72px; }
.rp-breakdown-amount { font-size: 13.5px; font-weight: 650; font-variant-numeric: tabular-nums; color: var(--rp-text); }
.rp-breakdown-change { font-size: 11px; font-weight: 600; white-space: nowrap; }
.rp-breakdown-spark { flex: 0 0 72px; width: 72px; height: 26px; }
.rp-breakdown-children { margin: 0 0 6px 28px; padding-left: 8px; border-left: 2px solid var(--rp-track); }
.rp-breakdown-children .rp-breakdown-name { font-size: 12.5px; font-weight: 500; }

@media (max-width: 575.98px) {
    .rp-breakdown-spark { display: none; }
}

/* ------------------------------------------------------------------ Value bars */

.rp-hbars { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; }
.rp-hbar-main {
    display: grid;
    grid-template-columns: minmax(80px, 34%) minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 5px 4px;
    border: 0;
    border-radius: 8px;
    background: none;
    color: inherit;
    text-align: left;
}

button.rp-hbar-main { cursor: pointer; }
button.rp-hbar-main:hover { background: var(--rp-row-hover); }
.rp-hbar-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; color: var(--rp-text); }
.rp-hbar-track { height: 8px; border-radius: 999px; background: var(--rp-track); overflow: hidden; }
.rp-hbar-fill { display: block; height: 100%; border-radius: inherit; background: var(--rp-indigo); opacity: .75; transition: width .6s cubic-bezier(.2, .8, .2, 1); }
.rp-hbar.is-top .rp-hbar-fill { opacity: 1; }
.rp-hbar-value { display: inline-flex; align-items: baseline; gap: .35rem; font-size: 12.5px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rp-hbar-value small { font-size: 10.5px; font-weight: 500; color: var(--rp-muted); }

.rp-cols { display: grid; grid-template-columns: repeat(var(--rp-cols, 7), minmax(0, 1fr)); gap: 6px; align-items: end; height: 190px; padding-top: 6px; }
.rp-cols > .rp-vcol { display: flex; flex-direction: column; align-items: center; gap: 4px; height: 100%; }
.rp-vcol-value { min-height: 15px; font-size: 10.5px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--rp-muted); white-space: nowrap; }
.rp-vcol-track { position: relative; flex: 1 1 auto; width: 100%; max-width: 44px; border-radius: 8px 8px 4px 4px; background: var(--rp-track); overflow: hidden; }
.rp-vcol-fill { position: absolute; inset: auto 0 0 0; border-radius: inherit; background: var(--rp-indigo); opacity: .7; transition: height .6s cubic-bezier(.2, .8, .2, 1); }
.rp-vcol.is-top .rp-vcol-fill { opacity: 1; }
.rp-vcol.is-top .rp-vcol-value { color: var(--rp-text); }
.rp-vcol-label { font-size: 10.5px; color: var(--rp-muted); white-space: nowrap; }
.rp-cols-dense { gap: 2px; }
.rp-cols-dense .rp-vcol-label { font-size: 9px; }
.rp-cols-dense .rp-vcol-track { border-radius: 3px; }

/* ------------------------------------------------------------------ Transactions */

.rp-tx-list { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.rp-tx-list > li + li { border-top: 1px solid var(--rc-line, rgba(0, 0, 0, .06)); }
.rp-tx {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 4px;
    border: 0;
    border-radius: 10px;
    background: none;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.rp-tx:hover { background: var(--rp-row-hover); }
.rp-tx-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rp-tx-name { display: flex; align-items: center; gap: .35rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; font-weight: 600; color: var(--rp-text); }
.rp-tx-sub { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; color: var(--rp-muted); }
.rp-tx-amount { font-size: 13.5px; font-weight: 650; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ------------------------------------------------------------------ Heatmap */

.rp-heat-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; padding-bottom: 4px; }
.rp-heat {
    --rp-cell: 13px;
    display: grid;
    grid-template-columns: 30px auto;
    grid-template-rows: 18px auto;
    gap: 4px 6px;
    width: max-content;
}

.rp-heat-months { grid-column: 2; display: grid; grid-template-columns: repeat(var(--rp-heat-weeks), var(--rp-cell)); gap: 3px; }
.rp-heat-month { padding: 0; border: 0; background: none; color: var(--rp-muted); font-size: 10px; font-weight: 600; text-align: left; white-space: nowrap; cursor: pointer; }
.rp-heat-month:hover { color: var(--rp-indigo); }
.rp-heat-days { grid-column: 1; grid-row: 2; display: grid; grid-template-rows: repeat(7, var(--rp-cell)); gap: 3px; font-size: 9.5px; color: var(--rp-muted); }
.rp-heat-days > span { line-height: var(--rp-cell); }
.rp-heat-grid { grid-column: 2; grid-row: 2; display: grid; grid-template-columns: repeat(var(--rp-heat-weeks), var(--rp-cell)); grid-template-rows: repeat(7, var(--rp-cell)); gap: 3px; }
.rp-heat-cell { display: block; width: var(--rp-cell, 13px); height: var(--rp-cell, 13px); border-radius: 3px; background: var(--rp-heat-0); }
.rp-heat-cell.lv-1 { background: var(--rp-heat-1); }
.rp-heat-cell.lv-2 { background: var(--rp-heat-2); }
.rp-heat-cell.lv-3 { background: var(--rp-heat-3); }
.rp-heat-cell.lv-4 { background: var(--rp-heat-4); }
.rp-heat-cell.is-today { outline: 2px solid var(--rp-text); outline-offset: -1px; }
.rp-heat-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-top: 10px; font-size: 11px; color: var(--rp-muted); }
.rp-heat-legend .rp-heat-cell { --rp-cell: 11px; }
.rp-heat-note { margin-left: 14px; }

@media (min-width: 1400px) {
    .rp-heat { --rp-cell: 15px; }
}

.rp-heat.rp-heat-md { --rp-cell: 20px; }
.rp-heat.rp-heat-lg { --rp-cell: 28px; }
.rp-heat.rp-heat-lg .rp-heat-cell { border-radius: 6px; }
.rp-heat.rp-heat-md .rp-heat-cell { border-radius: 4px; }
.rp-heat-hint { margin-top: 8px; }
.rp-heat-hint i { color: var(--rp-gold, var(--rp-indigo)); margin-right: 4px; }

/* ------------------------------------------------------------------ Cash calendar */

.rp-cal-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.rp-cal { padding: 10px; border: 1px solid var(--rp-tile-border); border-radius: 14px; background: var(--rp-tile); }
.rp-cal-head { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; margin-bottom: 8px; }
.rp-cal-title { padding: 0; border: 0; background: none; color: var(--rp-text); font-family: var(--tx-font); font-size: 13.5px; font-weight: 650; cursor: pointer; }
.rp-cal-title:hover { color: var(--rp-indigo); text-decoration: underline; }
.rp-cal-net { font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; }
.rp-cal-week, .rp-cal-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 3px; }
.rp-cal-week > span { font-size: 9.5px; font-weight: 600; text-align: center; color: var(--rp-muted); }
.rp-cal-day {
    position: relative;
    display: grid;
    place-items: center;
    aspect-ratio: 1 / 1;
    min-width: 0;
    border-radius: 7px;
    background: var(--rp-heat-0);
    font-size: 10.5px;
    font-variant-numeric: tabular-nums;
    color: var(--rp-text);
}

.rp-cal-day.is-blank { background: none; }
.rp-cal-day.is-outside { opacity: .35; }
.rp-cal-day.lv-1 { background: var(--rp-heat-1); }
.rp-cal-day.lv-2 { background: var(--rp-heat-2); }
.rp-cal-day.lv-3 { background: var(--rp-heat-3); color: #FFFFFF; }
.rp-cal-day.lv-4 { background: var(--rp-heat-4); color: #FFFFFF; }
[data-bs-theme="dark"] .rp-cal-day.lv-4 { color: #10131C; }
.rp-cal-day.is-in { background: var(--rp-in-day); }
.rp-cal-day.is-today { outline: 2px solid var(--rp-indigo); outline-offset: -1px; }
.rp-cal-pay { position: absolute; right: 3px; bottom: 3px; width: 5px; height: 5px; border-radius: 50%; background: var(--rp-income); box-shadow: 0 0 0 1.5px var(--rp-card); }
.rp-cal-pay.is-legend { position: static; display: inline-block; }
.rp-cal-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px; font-size: 11px; color: var(--rp-muted); }
.rp-cal-legend > span { display: inline-flex; align-items: center; gap: 6px; }
.rp-cal-legend .rp-cal-day { width: 14px; height: 14px; aspect-ratio: auto; border-radius: 4px; }

/* ------------------------------------------------------------------ Findings */

.rp-findings { display: flex; flex-direction: column; gap: 10px; margin: 12px 0 0; padding: 0; list-style: none; }
.rp-finding {
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--rp-tone) 20%, var(--rp-tile-border));
    border-left: 4px solid var(--rp-tone);
    border-radius: 14px;
    background: var(--rp-card);
}

.rp-finding.is-flagged { background: color-mix(in srgb, var(--rp-negative-soft) 40%, var(--rp-card)); }
.rp-finding-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: flex-start; }
.rp-finding-chip { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--rp-tone-soft); color: var(--rp-tone); font-size: 14px; }
.rp-finding-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.rp-finding-kind { display: inline-flex; align-items: center; gap: .4rem; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rp-tone); }
.rp-finding-title { font-family: var(--tx-font); font-size: 14px; font-weight: 600; color: var(--rp-text); }
.rp-finding-detail { font-size: 12.5px; line-height: 1.45; color: var(--rp-muted); }
.rp-finding-meta { font-size: 11px; color: var(--rp-light); }
.rp-finding-amount { font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--rp-text); }
.rp-finding-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin: 10px 0 0 46px; }
.rp-finding-marks { display: inline-flex; gap: 6px; margin-left: auto; }
.rp-mark {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: 4px 10px;
    border: 1px solid var(--rp-input-border);
    border-radius: 999px;
    background: none;
    color: var(--rp-muted);
    font-size: 11.5px;
    font-weight: 600;
    cursor: pointer;
}

.rp-mark:hover:not(:disabled), .rp-mark.is-on { border-color: var(--rp-indigo); color: var(--rp-indigo); background: var(--rp-indigo-soft); }
.rp-mark:disabled { opacity: .5; cursor: default; }
.rp-finding-tx { margin: 8px 0 0 46px; }
.rp-findings.is-compact { gap: 6px; margin-top: 8px; }
.rp-findings.is-compact .rp-finding { padding: 0; }
.rp-finding-row.is-button { width: 100%; align-items: center; padding: 9px 10px; border: 0; border-radius: inherit; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.rp-finding-row.is-button:hover:not(:disabled) { background: color-mix(in srgb, var(--rp-tone) 6%, transparent); }
.rp-finding-row.is-button:focus-visible { outline: 2px solid var(--rp-indigo); outline-offset: 1px; }
.rp-finding-row.is-button:disabled { cursor: default; }
.rp-findings.is-compact .rp-finding-chip { width: 30px; height: 30px; font-size: 13px; }
.rp-findings.is-compact .rp-finding-title { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rp-findings.is-compact .rp-finding-amount { font-size: 13.5px; }
.rp-kind-chips { margin-bottom: 4px; }

@media (max-width: 575.98px) {
    .rp-finding-actions, .rp-finding-tx { margin-left: 0; }
    .rp-finding-marks { margin-left: 0; }
}

.rp-allclear { display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 14px; background: var(--rp-positive-soft); }
.rp-allclear-chip { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--rp-card); color: var(--rp-positive); font-size: 17px; }
.rp-allclear > div { display: flex; flex-direction: column; gap: 2px; }
.rp-allclear strong { font-size: 14px; color: var(--rp-text); }
.rp-allclear span { font-size: 12px; color: var(--rp-muted); }

/* ------------------------------------------------------------------ Drill-down dashboard */

.rp-drill { display: flex; flex-direction: column; gap: 1rem; transition: opacity .2s ease; }
.rp-drill.is-stale { opacity: .6; }
.rp-drill-hero {
    --rp-drill-color: var(--rp-indigo);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px 18px;
    padding: 18px;
    border: 1px solid color-mix(in srgb, var(--rp-drill-color) 26%, transparent);
    border-radius: 20px;
    background: linear-gradient(140deg, color-mix(in srgb, var(--rp-drill-color) 16%, var(--rp-card)) 0%, var(--rp-card) 70%);
}

.rp-drill-titles { display: flex; flex-direction: column; gap: 3px; flex: 1 1 240px; min-width: 0; }
.rp-drill-kind { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--rp-muted); }
.rp-drill-name { margin: 0; font-family: var(--tx-font); font-size: 22px; font-weight: 650; color: var(--rp-text); overflow-wrap: anywhere; }
.rp-drill-window { font-size: 12px; color: var(--rp-muted); }
.rp-drill-total { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.rp-drill-total-value { font-family: var(--tx-font); font-size: 30px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--rp-text); }
.rp-drill-total-change { font-size: 12.5px; font-weight: 600; }

@media (max-width: 575.98px) {
    .rp-drill-total { align-items: flex-start; }
}

/* The account a drill-down opened on: balance, change and trend (from Net Worth), and why there's no spending. */
.rp-drill-account {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--rp-tile-border);
    border-radius: 16px;
    background: var(--rp-card);
}
.rp-drill-account-chip { display: inline-grid; place-items: center; flex: 0 0 auto; width: 36px; height: 36px; border-radius: 11px; background: var(--rp-indigo-soft); color: var(--rp-indigo); font-size: 14px; }
.rp-drill-account-main { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }
.rp-drill-account-name { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-weight: 650; color: var(--rp-text); }
.rp-drill-account-main small { font-size: 12px; color: var(--rp-muted); }
.rp-drill-account-spark { flex: 0 0 120px; width: 120px; height: 30px; }
.rp-drill-account-figures { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; font-variant-numeric: tabular-nums; }
.rp-drill-account-figures strong { font-size: 16px; color: var(--rp-text); }
.rp-drill-account-figures small { font-size: 12px; font-weight: 600; }
.rp-drill-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 14px;
    background: var(--rp-neutral-soft);
    color: var(--rp-text);
    font-size: 13px;
    line-height: 1.45;
}
.rp-drill-note > :first-child { margin-top: 2px; color: var(--rp-indigo); }
.rp-drill-note.is-locked { background: var(--rp-caution-soft); }
.rp-drill-note.is-locked > :first-child { color: var(--rp-caution); }

@media (max-width: 575.98px) {
    .rp-drill-account-spark { display: none; }
}

/* The drill-down's layout (the popup and Explore, every focus incl. budgets): the trend and Which days share a band, then
   the main column (breakdown, look next, transactions) beside the insight rail (what stands out, the briefing). Both
   bands use the same main | rail track so the gutters line up; each band ends level (Which days' bars and the last card
   in the shorter column take up the slack). Below 1200px it's one column, interleaved by order. */
.rp-drill { --rp-drill-rail: clamp(300px, 34%, 440px); }
.rp-drill-tiles-host { container-type: inline-size; min-width: 0; }
.rp-drill-tiles-host .rp-stats.rp-drill-tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); }
@container (max-width: 879.98px) { .rp-drill-tiles-host .rp-stats.rp-drill-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@container (max-width: 459.98px) { .rp-drill-tiles-host .rp-stats.rp-drill-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.rp-drill-band,
.rp-drill-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--rp-drill-rail);
    align-items: stretch;
    gap: 1rem;
    min-width: 0;
}
.rp-drill-split.is-solo { grid-template-columns: minmax(0, 1fr); }
.rp-drill-band > *, .rp-drill-split > * { min-width: 0; }
.rp-drill-main,
.rp-drill-rail { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.rp-drill-main > :last-child,
.rp-drill-rail > :last-child { flex: 1 0 auto; }

/* Which days fills the band: its bars grow to the trend card's height. */
.rp-drill-days { display: flex; flex-direction: column; }
.rp-drill-days > .rp-card-body { display: flex; flex-direction: column; flex: 1 1 auto; }
.rp-drill-days .rp-cols { flex: 1 1 auto; height: auto; min-height: 190px; }

/* One column: the reading order is the number, then why, then where to go, then every transaction. */
@media (max-width: 1199.98px) {
    .rp-drill-band,
    .rp-drill-split { display: flex; flex-direction: column; }
    .rp-drill-main,
    .rp-drill-rail { display: contents; }
    .rp-drill-main > :last-child,
    .rp-drill-rail > :last-child { flex: 0 0 auto; }
    .rp-drill-breakdown { order: 1; }
    .rp-drill-highlights { order: 2; }
    .rp-drill-related { order: 3; }
    .rp-drill-briefing { order: 4; }
    .rp-drill-transactions { order: 5; }
    .rp-drill-days .rp-cols { min-height: 170px; }
}

/* Full-width highlights read as a 2-up grid; an odd last one spans the row. */
@media (min-width: 640px) and (max-width: 1199.98px) {
    .rp-drill-highlights .rp-highlights.is-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rp-drill-highlights .rp-highlights.is-list > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}

@media (max-width: 575.98px) {
    .rp-drill, .rp-drill-band, .rp-drill-split { gap: .75rem; }
    .rp-drill-days .rp-cols { min-height: 150px; }
}

@media print {
    body.rp-printing .rp-drill-band,
    body.rp-printing .rp-drill-split { display: block; }
    body.rp-printing .rp-drill-band > *,
    body.rp-printing .rp-drill-main > *,
    body.rp-printing .rp-drill-rail > * { margin-bottom: 12px; }
}

.rp-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 10px; font-size: 12px; }
.rp-crumb { color: var(--rp-muted); text-decoration: none; }
.rp-crumb:hover { color: var(--rp-indigo); text-decoration: underline; }
.rp-crumb.is-current { color: var(--rp-text); font-weight: 600; }
.rp-crumb-sep { font-size: 8px; color: var(--rp-light); }
.rp-crumbs > .rp-link { margin-right: 6px; }

.rp-finder { display: flex; flex-direction: column; gap: 12px; margin-bottom: 1rem; }
.rp-finder-head { display: flex; align-items: center; gap: 12px; }
.rp-finder-chip { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: var(--rp-ai-grad); color: #FFFFFF; font-size: 19px; }
.rp-finder-title { margin: 0; font-family: var(--tx-font); font-size: 18px; font-weight: 650; color: var(--rp-text); }
.rp-finder-input { font-size: 15px; padding: .75rem 1rem; }

/* ------------------------------------------------------------------ Income */

.rp-sources { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.rp-source {
    --rp-source: var(--rp-income);
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto auto;
    align-items: center;
    gap: 16px;
    width: 100%;
    padding: 12px 14px 12px 18px;
    border: 1px solid var(--rp-tile-border);
    border-radius: 14px;
    background: var(--rp-card);
    color: inherit;
    text-align: left;
    cursor: pointer;
    overflow: hidden;
}

.rp-source:hover { border-color: var(--rp-source); background: var(--rp-row-hover); }
.rp-source-bar { position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--rp-source); }
.rp-source-main { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.rp-source-name { display: flex; align-items: center; gap: .4rem; font-size: 14px; font-weight: 600; color: var(--rp-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rp-source-sub { font-size: 11.5px; color: var(--rp-muted); }
.rp-source-sub .tx-glyph { font-size: 9.5px; color: var(--rp-source); }
.rp-source-share { display: block; height: 5px; border-radius: 999px; background: var(--rp-track); overflow: hidden; }
.rp-source-share > span { display: block; height: 100%; background: linear-gradient(90deg, color-mix(in srgb, var(--rp-source) 50%, transparent) 0%, var(--rp-source) 100%); border-radius: inherit; }
.rp-source-steady { display: inline-flex; align-items: center; gap: .35rem; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; white-space: nowrap; }
.rp-source-steady.is-steady { background: var(--rp-positive-soft); color: var(--rp-positive); }
.rp-source-steady.is-variable { background: var(--rp-caution-soft); color: var(--rp-caution); }
.rp-source-dates { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: 11.5px; color: var(--rp-muted); white-space: nowrap; }
.rp-source-dates strong { color: var(--rp-text); font-weight: 600; }
.rp-source-figures { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; min-width: 80px; }
.rp-source-figures strong { font-size: 15px; font-variant-numeric: tabular-nums; color: var(--rp-text); }
.rp-source-figures small { font-size: 11px; color: var(--rp-muted); }

@media (max-width: 767.98px) {
    .rp-source { grid-template-columns: minmax(0, 1fr) auto; }
    .rp-source-steady, .rp-source-dates { display: none; }
}

.rp-timeline { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.rp-timeline-item {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 8px;
    border-radius: 12px;
    background: var(--rp-tile);
}

.rp-timeline-item.is-soon { background: color-mix(in srgb, var(--rp-caution-soft) 60%, var(--rp-tile)); }
.rp-timeline-item.is-late { background: color-mix(in srgb, var(--rp-negative-soft) 55%, var(--rp-tile)); }
.rp-timeline-date { display: flex; flex-direction: column; align-items: center; padding: 4px 0; border-radius: 10px; background: var(--rp-card); box-shadow: inset 0 0 0 1px var(--rp-tile-border); }
.rp-timeline-date strong { font-family: var(--tx-font); font-size: 17px; line-height: 1; color: var(--rp-text); }
.rp-timeline-date small { font-size: 9.5px; font-weight: 700; text-transform: uppercase; color: var(--rp-indigo); }
.rp-timeline-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rp-timeline-text strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; color: var(--rp-text); }
.rp-timeline-text small { font-size: 11.5px; color: var(--rp-muted); }
.rp-timeline-value { font-weight: 650; font-variant-numeric: tabular-nums; }

.rp-creep { display: flex; flex-direction: column; gap: 12px; }
.rp-creep-verdict { font-family: var(--tx-font); font-size: 16px; font-weight: 650; color: var(--rp-tone); }
.rp-growth-head { display: flex; justify-content: space-between; margin-bottom: 4px; font-size: 12.5px; font-weight: 600; color: var(--rp-text); }
.rp-growth-bars { display: flex; flex-direction: column; gap: 4px; }
.rp-growth-bar { display: flex; align-items: center; min-height: 22px; padding: 0 8px; border-radius: 7px; background: var(--rp-track); white-space: nowrap; }
.rp-growth-bar small { font-size: 11px; font-weight: 600; color: var(--rp-text); }
.rp-growth-bar.is-now.rp-growth-income { background: color-mix(in srgb, var(--rp-income) 28%, transparent); }
.rp-growth-bar.is-now.rp-growth-spending { background: color-mix(in srgb, var(--rp-spending) 28%, transparent); }

/* ------------------------------------------------------------------ Couple */

.rp-people { margin-bottom: 14px; }
.rp-people-head { display: flex; justify-content: space-between; margin-bottom: 5px; font-size: 12px; }
.rp-people-caption { font-weight: 700; letter-spacing: .04em; text-transform: uppercase; font-size: 10.5px; color: var(--rp-muted); }
.rp-people-total { font-weight: 650; font-variant-numeric: tabular-nums; }
/* You vs partner: the couple share bar with the Snapshot seam blend (CoupleShareBar, couple-share-bar.css). */
.rp-people-bar { display: flex; height: 14px; overflow: hidden; border-radius: 999px; background: var(--rp-track); }
.rp-people-legend { display: flex; justify-content: space-between; gap: .5rem; margin-top: 5px; font-size: 11.5px; color: var(--rp-muted); }
.rp-people-note { display: flex; align-items: flex-start; gap: .45rem; margin: 0; font-size: 12.5px; color: var(--rp-muted); }
.rp-people-note .tx-glyph { margin-top: 2px; color: var(--rp-indigo); }

.rp-fair { display: flex; flex-direction: column; gap: 10px; }
.rp-fair-verdict { font-family: var(--tx-font); font-size: 16px; font-weight: 650; color: var(--rp-tone); }
.rp-fair-row { display: grid; grid-template-columns: 140px minmax(0, 1fr) 56px; align-items: center; gap: 10px; font-size: 12px; color: var(--rp-muted); }
.rp-fair-row b { text-align: right; color: var(--rp-text); font-variant-numeric: tabular-nums; }
.rp-fair-track { height: 10px; border-radius: 999px; background: var(--rp-track); overflow: hidden; }
.rp-fair-fill { display: block; height: 100%; border-radius: inherit; }
.rp-fair-fill.is-cost { background: var(--rp-spending); }
.rp-fair-fill.is-income { background: var(--rp-income); }
.rp-fair-suggest { display: flex; align-items: flex-start; gap: .4rem; padding: 10px 12px; border-radius: 12px; background: var(--rp-indigo-soft); font-size: 12.5px; color: var(--rp-text); }
.rp-fair-suggest .tx-glyph { margin-top: 2px; color: var(--rp-indigo); }

/* ------------------------------------------------------------------ Patterns */

.rp-rhythm { display: flex; flex-direction: column; gap: 12px; }
.rp-rhythm-pair { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.rp-rhythm-glyph { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: var(--rp-icon-bg); color: var(--rp-icon); font-size: 12.5px; }
.rp-rhythm-bars { display: flex; flex-direction: column; gap: 4px; }
.rp-rhythm-row { display: grid; grid-template-columns: 110px minmax(0, 1fr) auto; align-items: center; gap: 8px; font-size: 12px; }
.rp-rhythm > .rp-rhythm-row { grid-template-columns: 30px 150px minmax(0, 1fr) auto; }
.rp-rhythm-label { color: var(--rp-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rp-rhythm-track { height: 8px; border-radius: 999px; background: var(--rp-track); overflow: hidden; }
.rp-rhythm-track > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, color-mix(in srgb, var(--rp-indigo) 30%, transparent) 0%, color-mix(in srgb, var(--rp-indigo) 62%, transparent) 100%); }
.rp-rhythm-track.is-strong > span { background: linear-gradient(90deg, color-mix(in srgb, var(--rp-indigo) 50%, transparent) 0%, var(--rp-indigo) 100%); }
.rp-rhythm-row b { font-variant-numeric: tabular-nums; white-space: nowrap; }
.rp-rhythm-ratio { font-family: var(--tx-font); font-size: 20px; font-weight: 700; color: var(--rp-text); }
.rp-rhythm-busy { display: flex; align-items: center; gap: .4rem; margin: 0; font-size: 12.5px; color: var(--rp-muted); }
.rp-rhythm-busy b { color: var(--rp-text); }

.rp-alert-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin-bottom: 6px; }
.rp-limits { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.rp-limit { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, 30%); gap: 12px; align-items: center; padding: 10px 12px; border-radius: 12px; background: var(--rp-tile); }
.rp-limit-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rp-limit-text strong { font-size: 13px; color: var(--rp-text); }
.rp-limit-text small { font-size: 11.5px; color: var(--rp-muted); }
.rp-limit-track { position: relative; height: 8px; border-radius: 999px; background: var(--rp-track); overflow: hidden; }
.rp-limit-track > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--rp-caution), var(--rp-negative)); }

/* ------------------------------------------------------------------ Bills */

.rp-opps { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.rp-opp {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    align-items: flex-start;
    padding: 14px;
    border: 1px solid color-mix(in srgb, var(--rp-positive) 22%, var(--rp-tile-border));
    border-radius: 16px;
    background: linear-gradient(150deg, color-mix(in srgb, var(--rp-positive-soft) 70%, var(--rp-card)) 0%, var(--rp-card) 75%);
}

.rp-opp-stopped { border-color: color-mix(in srgb, var(--rp-caution) 28%, var(--rp-tile-border)); background: linear-gradient(150deg, color-mix(in srgb, var(--rp-caution-soft) 70%, var(--rp-card)) 0%, var(--rp-card) 75%); }
.rp-opp-chip { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: var(--rp-card); color: var(--rp-positive); font-size: 14px; box-shadow: 0 2px 8px rgba(0, 0, 0, .06); }
.rp-opp-stopped .rp-opp-chip { color: var(--rp-caution); }
.rp-opp-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.rp-opp-kind { font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rp-positive); }
.rp-opp-stopped .rp-opp-kind { color: var(--rp-caution); }
.rp-opp-text strong { font-family: var(--tx-font); font-size: 14px; color: var(--rp-text); }
.rp-opp-text span { font-size: 12px; line-height: 1.45; color: var(--rp-muted); }
.rp-opp-save { display: flex; flex-direction: column; align-items: flex-end; }
.rp-opp-save b { font-family: var(--tx-font); font-size: 18px; color: var(--rp-positive); font-variant-numeric: tabular-nums; }
.rp-opp-save small { font-size: 10.5px; color: var(--rp-muted); }

.rp-price-arrow { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; background: var(--rp-tile); }
.rp-overlaps { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.rp-overlap { display: flex; flex-direction: column; gap: 4px; padding: 12px; border-radius: 14px; background: var(--rp-caution-soft); }
.rp-overlap-family { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rp-caution); }
.rp-overlap-cost { font-family: var(--tx-font); font-size: 18px; color: var(--rp-text); }
.rp-overlap-cost small { font-size: 11px; font-weight: 500; color: var(--rp-muted); }
.rp-overlap-names { font-size: 12px; color: var(--rp-muted); }

/* ------------------------------------------------------------------ What-if */

.rp-whatif-total {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 12px;
    margin-bottom: 12px;
    padding: 12px 14px;
    border-radius: 14px;
    background: var(--rp-tile);
    transition: background-color .3s ease;
}

.rp-whatif-total.is-on { background: var(--rp-positive-soft); }
.rp-whatif-caption { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rp-muted); }
.rp-whatif-value { font-family: var(--tx-font); font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--rp-positive); }
.rp-whatif-value small { font-size: 13px; font-weight: 500; color: var(--rp-muted); }
.rp-whatif-year { font-size: 13px; font-weight: 600; color: var(--rp-text); }
.rp-whatif { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.rp-whatif-row { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(120px, 1fr) 72px; gap: 12px; align-items: center; }
.rp-whatif-label { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 8px; align-items: center; min-width: 0; }
.rp-whatif-label .rp-dollar-chip { grid-row: 1 / span 2; }
.rp-whatif-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 600; color: var(--rp-text); }
.rp-whatif-usual { font-size: 11px; color: var(--rp-muted); }
.rp-whatif-out { text-align: right; font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; }

.rp-range {
    --rp-range-color: var(--rp-indigo);
    --rp-range-fill: 100%;
    width: 100%;
    height: 6px;
    appearance: none;
    -webkit-appearance: none;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--rp-range-color) 0 var(--rp-range-fill), var(--rp-track) var(--rp-range-fill) 100%);
    cursor: pointer;
}

.rp-range::-webkit-slider-thumb { -webkit-appearance: none; width: 18px; height: 18px; border: 3px solid var(--rp-card); border-radius: 50%; background: var(--rp-range-color); box-shadow: 0 1px 6px rgba(0, 0, 0, .25); }
.rp-range::-moz-range-thumb { width: 14px; height: 14px; border: 3px solid var(--rp-card); border-radius: 50%; background: var(--rp-range-color); box-shadow: 0 1px 6px rgba(0, 0, 0, .25); }
.rp-range:focus-visible { outline: 2px solid var(--rp-focus); outline-offset: 4px; }

@media (max-width: 575.98px) {
    .rp-whatif-row { grid-template-columns: minmax(0, 1fr) 64px; }
    .rp-whatif-row .rp-range { grid-column: 1 / -1; grid-row: 2; }
}

/* ------------------------------------------------------------------ Saved views */

.rp-views { position: relative; }
.rp-views-count { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--rp-indigo); color: #FFFFFF; font-size: 10.5px; font-weight: 700; }
[data-bs-theme="dark"] .rp-views-count { color: #10131C; }
.rp-views-backdrop { position: fixed; inset: 0; z-index: 40; }
.rp-views-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 41;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: min(360px, calc(100vw - 32px));
    padding: 14px;
    border: 1px solid var(--rp-card-border);
    border-radius: 16px;
    background: var(--rp-menu-bg);
    box-shadow: var(--rp-shadow-pop);
    animation: rp-pop .16s ease-out both;
}

.rp-views-head { display: flex; align-items: center; justify-content: space-between; }
.rp-views-head strong { font-family: var(--tx-font); font-size: 14px; }
.rp-views-list { display: flex; flex-direction: column; gap: 2px; max-height: 280px; margin: 0; padding: 0; overflow-y: auto; list-style: none; }
.rp-views-list > li { display: flex; align-items: center; gap: 6px; }
.rp-views-item {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 8px;
    flex: 1 1 auto;
    min-width: 0;
    padding: 8px;
    border: 0;
    border-radius: 10px;
    background: none;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.rp-views-item:hover { background: var(--rp-row-hover); }
.rp-views-glyph { grid-row: 1 / span 2; align-self: center; color: var(--rp-indigo); }
.rp-views-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 600; }
.rp-views-sub { font-size: 11px; color: var(--rp-muted); }
.rp-views-save { display: flex; flex-direction: column; gap: 6px; padding-top: 10px; border-top: 1px solid var(--rc-line, rgba(0, 0, 0, .06)); }
.rp-views-save-row { display: flex; gap: 6px; }
.rp-views-wait { display: flex; flex-direction: column; gap: 8px; --dsh-bone: hsl(calc(243.4deg + var(--ci-accent-shift, 0deg)) 75.36% 58.63% / .09); }

/* ------------------------------------------------------------------ AI: briefing, upsell, ask */

.rp-ai-card { position: relative; overflow: hidden; }
.rp-ai-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: var(--rp-ai-grad);
}

.rp-ai-wait { display: flex; flex-direction: column; gap: 8px; --dsh-bone: hsl(calc(258.31deg + var(--ci-accent-shift, 0deg)) 89.53% 66.27% / .1); }
/* An unwritten briefing: one centred block (orb, what it is, the pitch, what it gives, the button) that reads well in a
   narrow rail and in a card stretched across half the page. */
.rp-ai-start { display: flex; flex-direction: column; align-items: center; gap: 10px; max-width: 560px; margin: 0 auto; padding: 18px 8px; text-align: center; }
.rp-ai-start-orb {
    display: inline-grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--rp-ai-grad);
    color: #FFFFFF;
    font-size: 18px;
    box-shadow: 0 0 0 8px hsl(calc(258.31deg + var(--ci-accent-shift, 0deg)) 89.53% 66.27% / .1), 0 10px 26px hsl(calc(258.31deg + var(--ci-accent-shift, 0deg)) 89.53% 66.27% / .25);
}
.rp-ai-start-title { font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--rp-text); }
.rp-ai-pitch { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--rp-muted); text-wrap: pretty; }
.rp-ai-start-gets { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 2px 0 4px; padding: 0; list-style: none; }
.rp-ai-start-gets li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid var(--rp-tile-border, rgba(127, 127, 127, .18));
    background: color-mix(in srgb, var(--rp-accent, #7C6AF2) 6%, transparent);
    font-size: 11.5px;
    font-weight: 600;
    color: var(--rp-text);
}
.rp-ai-start-gets li .tx-glyph, .rp-ai-start-gets li i { color: var(--rp-accent, #7C6AF2); font-size: 10.5px; }
.rp-ai-card.is-compact .rp-ai-start { padding: 8px 4px; gap: 8px; }
.rp-ai-card.is-compact .rp-ai-start-orb { width: 38px; height: 38px; font-size: 15px; }
.rp-ai-card.is-compact .rp-ai-start-gets { display: none; }
.rp-ai-model { display: inline-flex; align-items: center; gap: .35rem; font-size: 11px; color: var(--rp-muted); }
.rp-ai-thinking { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px 12px; align-items: center; }
.rp-ai-orb {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--rp-ai-grad);
    color: #FFFFFF;
    animation: rp-orb 1.6s ease-in-out infinite;
}

@keyframes rp-orb {
    0%, 100% { box-shadow: 0 0 0 0 hsl(calc(258.31deg + var(--ci-accent-shift, 0deg)) 89.53% 66.27% / .45); transform: scale(1); }
    50% { box-shadow: 0 0 0 10px hsl(calc(258.31deg + var(--ci-accent-shift, 0deg)) 89.53% 66.27% / 0); transform: scale(1.05); }
}

.rp-ai-thinking-text { display: flex; flex-direction: column; gap: 2px; }
.rp-ai-thinking-text strong { font-size: 13.5px; color: var(--rp-text); }
.rp-ai-thinking-text span { font-size: 12px; color: var(--rp-muted); }
.rp-ai-thinking-lines { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 8px; --dsh-bone: hsl(calc(258.31deg + var(--ci-accent-shift, 0deg)) 89.53% 66.27% / .1); }
.rp-ai-error { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: 10px 12px; border-radius: 12px; background: var(--rp-negative-soft); font-size: 12.5px; color: var(--rp-negative); }
.rp-ai-briefing { display: flex; flex-direction: column; gap: 6px; }
.rp-ai-headline { margin: 0; font-family: var(--tx-font); font-size: 18px; font-weight: 650; line-height: 1.3; color: var(--rp-text); }
.rp-ai-card.is-compact .rp-ai-headline { font-size: 15.5px; }
.rp-ai-summary { margin: 0; font-size: 13.5px; line-height: 1.55; color: var(--rp-text); }
/* What it found: one card per finding. A tone-colored icon and status label, the title and the why, the key figures it
   rests on as small tiles (the long sentences fold into "The numbers behind this"), and an Open button for the slice it
   names. The tone (good news, needs attention, worth a look, good to know) colors the rail, wash, icon and button. */
.rp-ai-findings { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.rp-ai-finding {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: flex-start;
    padding: 14px 16px 14px 20px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--rp-tone) 24%, var(--rp-tile-border));
    border-radius: 16px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--rp-tone-soft) 70%, var(--rp-tile)) 0%, var(--rp-tile) 62%);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.rp-ai-finding::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: linear-gradient(180deg, var(--rp-tone), color-mix(in srgb, var(--rp-tone) 30%, transparent));
}

.rp-ai-finding:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--rp-tone) 55%, var(--rp-tile-border)); box-shadow: var(--rp-shadow); }
.rp-ai-finding-icon { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 13px; background: var(--rp-tone-soft); color: var(--rp-tone); font-size: 16px; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--rp-tone) 28%, transparent); }
.rp-ai-finding-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.rp-ai-finding-top { display: flex; align-items: center; gap: 8px; }
.rp-ai-finding-kicker { padding: 2px 9px; border-radius: 999px; background: var(--rp-tone-soft); color: var(--rp-tone); font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.rp-ai-finding-num { margin-left: auto; font-family: var(--tx-font); font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--rp-light); }
.rp-ai-finding-title { font-family: var(--tx-font); font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--rp-text); }
.rp-ai-finding-detail { margin: 0; font-size: 13px; line-height: 1.55; color: var(--rp-muted); }
.rp-ai-figures { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; margin: 8px 0 0; }
.rp-ai-figure { display: flex; flex-direction: column; gap: 1px; min-width: 0; padding: 8px 11px; border: 1px solid var(--rp-tile-border); border-radius: 11px; background: var(--rp-card); }
.rp-ai-figure dt { overflow: hidden; font-size: 10.5px; font-weight: 600; letter-spacing: .04em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; color: var(--rp-muted); }
.rp-ai-figure dd { margin: 0; font-family: var(--tx-font); font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--rp-text); }
.rp-ai-figure:first-child dd:not(.rp-ai-figure-sub) { color: var(--rp-tone); }
.rp-ai-figure dd.rp-ai-figure-sub { font-family: inherit; font-size: 11px; font-weight: 500; line-height: 1.4; color: var(--rp-muted); }
.rp-ai-more { margin-top: 6px; }
.rp-ai-more summary { display: inline-flex; align-items: center; gap: .4rem; font-size: 11.5px; font-weight: 600; color: var(--rp-muted); cursor: pointer; list-style: none; user-select: none; }
.rp-ai-more summary::-webkit-details-marker { display: none; }
.rp-ai-more summary:hover { color: var(--rp-text); }
.rp-ai-more summary:focus-visible { outline: 2px solid var(--rp-focus); outline-offset: 2px; border-radius: 6px; }
.rp-ai-more-caret { font-size: 9px; transition: transform .18s ease; }
.rp-ai-more[open] .rp-ai-more-caret { transform: rotate(90deg); }
.rp-ai-more ul { margin: 6px 0 0; padding: 8px 12px 8px 26px; border: 1px solid var(--rp-tile-border); border-radius: 10px; background: var(--rp-card); font-size: 11.5px; line-height: 1.5; color: var(--rp-muted); }
.rp-ai-more li + li { margin-top: 4px; }
.rp-ai-finding-open {
    display: inline-flex;
    align-items: center;
    align-self: center;
    gap: .4rem;
    padding: 7px 13px;
    border: 1px solid color-mix(in srgb, var(--rp-tone) 40%, transparent);
    border-radius: 999px;
    background: var(--rp-tone-soft);
    color: var(--rp-tone);
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    transition: background .18s ease, color .18s ease;
}

.rp-ai-finding-open:hover { background: var(--rp-tone); color: var(--rp-card); }
.rp-ai-finding-open:focus-visible { outline: 2px solid var(--rp-focus); outline-offset: 2px; }
.rp-ai-finding-open .tx-glyph { font-size: 11px; transition: transform .18s ease; }
.rp-ai-finding-open:hover .tx-glyph { transform: translateX(3px); }
.rp-ai-card.is-compact .rp-ai-finding { gap: 10px; padding: 12px 12px 12px 16px; }
.rp-ai-card.is-compact .rp-ai-finding-icon { width: 34px; height: 34px; font-size: 14px; }
.rp-ai-card.is-compact .rp-ai-finding-num { display: none; }
@media (max-width: 640px) {
    .rp-ai-finding { grid-template-columns: auto minmax(0, 1fr); }
    .rp-ai-finding-open { grid-column: 1 / -1; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
    .rp-ai-finding, .rp-ai-finding-open, .rp-ai-finding-open .tx-glyph, .rp-ai-more-caret { transition: none; }
    .rp-ai-finding:hover { transform: none; }
}
.rp-ai-actions { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; counter-reset: rp-step; }
.rp-ai-action {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 12px;
    align-items: flex-start;
    padding: 10px 12px 10px 40px;
    border-radius: 12px;
    background: var(--rp-tile);
    counter-increment: rp-step;
}

.rp-ai-action::before {
    content: counter(rp-step);
    position: absolute;
    top: 10px;
    left: 10px;
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--rp-ai-grad);
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 700;
}

.rp-ai-action-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rp-ai-action-text strong { font-size: 13.5px; color: var(--rp-text); }
.rp-ai-action-text span { font-size: 12.5px; line-height: 1.45; color: var(--rp-muted); }
.rp-ai-action .rp-link { grid-column: 1 / -1; justify-self: start; }
.rp-ai-impact { display: flex; flex-direction: column; align-items: flex-end; }
.rp-ai-impact-month { display: inline-flex; align-items: baseline; gap: 1px; white-space: nowrap; }
.rp-ai-impact b { font-family: var(--tx-font); font-size: 16px; color: var(--rp-positive); font-variant-numeric: tabular-nums; }
.rp-ai-impact small { font-size: 10.5px; color: var(--rp-muted); }
.rp-ai-watch { margin: 0; padding-left: 1.1rem; font-size: 12.5px; line-height: 1.5; color: var(--rp-text); }
.rp-ai-questions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.rp-ai-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--rc-line, rgba(0, 0, 0, .06)); }
.rp-ai-feedback { display: inline-flex; gap: 6px; margin-left: auto; }
.rp-ai-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 4px 16px; max-height: 260px; margin: 8px 0 0; padding: 10px; overflow-y: auto; border-radius: 12px; background: var(--rp-tile); }
.rp-ai-facts-row { display: flex; justify-content: space-between; gap: 10px; font-size: 11.5px; }
.rp-ai-facts-row dt { font-weight: 500; color: var(--rp-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rp-ai-facts-row dd { margin: 0; font-weight: 600; color: var(--rp-text); white-space: nowrap; }

.rp-upsell { display: flex; flex-direction: column; gap: 14px; }
.rp-upsell-head { display: flex; align-items: flex-start; gap: 14px; }
.rp-upsell-crown { display: inline-grid; place-items: center; flex: 0 0 auto; width: 48px; height: 48px; border-radius: 15px; background: var(--rp-gold-grad); color: #FFFFFF; font-size: 19px; box-shadow: 0 8px 24px rgba(194, 122, 26, .3); }
.rp-upsell.is-compact .rp-upsell-crown { width: 38px; height: 38px; border-radius: 12px; font-size: 15px; }
.rp-upsell-copy { display: flex; flex-direction: column; gap: 3px; }
.rp-upsell-eyebrow { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--rp-gold); }
.rp-upsell-title { font-family: var(--tx-font); font-size: 20px; font-weight: 650; color: var(--rp-text); }
.rp-upsell.is-compact .rp-upsell-title { font-size: 15px; }
.rp-upsell-text { font-size: 13px; line-height: 1.5; color: var(--rp-muted); }
.rp-upsell-features { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.rp-upsell.is-compact .rp-upsell-features { grid-template-columns: minmax(0, 1fr); gap: 4px; }
.rp-upsell-features > li { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border-radius: 12px; background: var(--rp-tile); }
.rp-upsell.is-compact .rp-upsell-features > li { padding: 6px 10px; }
.rp-upsell-features > li.is-asked { background: var(--rp-gold-soft); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--rp-gold) 35%, transparent); }
.rp-upsell-features span { display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; }
.rp-upsell-features strong { color: var(--rp-text); }
.rp-upsell-features small { font-size: 12px; color: var(--rp-muted); }
.rp-upsell-glyph { margin-top: 2px; color: var(--rp-accent); }
.rp-upsell-sample { margin: 0; padding: 14px; border: 1px dashed var(--rp-card-border); border-radius: 14px; }
.rp-upsell-sample figcaption { display: inline-flex; align-items: center; gap: .35rem; margin-bottom: 8px; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rp-muted); }
.rp-upsell-sample-body { display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; color: var(--rp-muted); filter: saturate(.9); }
.rp-upsell-sample-body strong { font-size: 14px; color: var(--rp-text); }
.rp-upsell-sample-row { display: flex; align-items: center; }
.rp-upsell-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }

.rp-ask { display: flex; flex-direction: column; gap: 12px; }
.rp-ask-suggest { display: flex; flex-wrap: wrap; gap: 6px; }
.rp-ask-turns { display: flex; flex-direction: column; gap: 14px; max-height: 560px; margin: 0; padding: 0 4px 0 0; overflow-y: auto; list-style: none; }
.rp-ask-turn { display: flex; flex-direction: column; gap: 8px; }
.rp-ask-q { display: flex; align-items: flex-start; gap: 8px; align-self: flex-end; max-width: 85%; padding: 9px 12px; border-radius: 14px 14px 4px 14px; background: var(--rp-indigo); color: #FFFFFF; font-size: 13px; }
[data-bs-theme="dark"] .rp-ask-q { color: #10131C; }
.rp-ask-q .tx-glyph { margin-top: 3px; font-size: 10px; opacity: .8; }
.rp-ask-a { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 8px; }
.rp-ask-orb { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--rp-ai-grad); color: #FFFFFF; font-size: 11px; }
.rp-ask-a-body { min-width: 0; padding: 10px 12px; border-radius: 4px 14px 14px 14px; background: var(--rp-tile); font-size: 13px; line-height: 1.55; color: var(--rp-text); }
.rp-ask-a-body p { margin: 0 0 6px; }
.rp-ask-a-body p:last-child { margin-bottom: 0; }
/* The answer is sanitized HTML (ReportAnswerHtml): paragraphs, emphasis, lists, headings. */
.rp-ask-html > :last-child { margin-bottom: 0; }
.rp-ask-html strong, .rp-ask-html b { font-weight: 650; color: var(--rp-text); }
.rp-ask-html em, .rp-ask-html i { color: var(--rp-muted); }
.rp-ask-html ul, .rp-ask-html ol { margin: 0 0 6px; padding-left: 1.2rem; }
.rp-ask-html li + li { margin-top: 2px; }
.rp-ask-html h1, .rp-ask-html h2, .rp-ask-html h3, .rp-ask-html h4 { margin: 8px 0 4px; font-family: var(--tx-font); font-size: 13.5px; font-weight: 650; color: var(--rp-text); }
.rp-ask-html blockquote { margin: 0 0 6px; padding: 2px 0 2px 10px; border-left: 3px solid var(--rp-border); color: var(--rp-muted); }
.rp-ask-table { margin-top: 8px; max-width: 100%; overflow-x: auto; }
.rp-ask-follow { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.rp-ask-typing { display: inline-flex; gap: 4px; }
.rp-ask-typing > span:not(.visually-hidden) { width: 7px; height: 7px; border-radius: 50%; background: var(--rp-accent); animation: rp-typing 1.1s ease-in-out infinite; }
.rp-ask-typing > span:nth-child(2) { animation-delay: .15s; }
.rp-ask-typing > span:nth-child(3) { animation-delay: .3s; }

@keyframes rp-typing {
    0%, 80%, 100% { opacity: .3; transform: translateY(0); }
    40% { opacity: 1; transform: translateY(-3px); }
}

.rp-ask-form { display: flex; align-items: center; gap: 8px; }
.rp-ask-input { flex: 1 1 auto; }

/* ------------------------------------------------------------------ Library and Intelligence */

.rp-library { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 16px; }
.rp-library-title { margin: 0 0 8px; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--rp-muted); }
.rp-library-items { display: flex; flex-direction: column; gap: 6px; }
.rp-library-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid var(--rp-tile-border);
    border-radius: 14px;
    background: var(--rp-card);
    color: inherit;
    text-decoration: none;
    transition: border-color .15s ease, transform .12s ease, box-shadow .2s ease;
}

.rp-library-item:hover { border-color: var(--rp-indigo); transform: translateY(-1px); box-shadow: var(--rp-shadow); color: inherit; }
.rp-library-chip { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: var(--rp-tone-soft); color: var(--rp-tone); font-size: 14px; }
.rp-library-chip.rp-tone-accent { background: var(--rp-ai-grad); color: #FFFFFF; }
.rp-library-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rp-library-text strong { display: inline-flex; align-items: center; gap: .35rem; font-size: 13.5px; color: var(--rp-text); }
.rp-library-text span { font-size: 11.5px; line-height: 1.4; color: var(--rp-muted); }
.rp-library-crown { color: var(--rp-gold); font-size: 10px; }
.rp-library-chev { color: var(--rp-light); font-size: 10px; }

.rp-intel-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    padding: 20px;
    border: 1px solid var(--rp-border);
    border-radius: 22px;
    background: var(--rp-hero-bg);
}

.rp-intel-hero-copy { display: flex; flex-direction: column; gap: 4px; max-width: 80ch; }
.rp-intel-hero-title { margin: 0; font-family: var(--tx-font); font-size: 24px; font-weight: 650; color: var(--rp-text); }
.rp-intel-story { box-shadow: var(--rp-shadow-pop); }
.rp-intel-brief { display: flex; flex-direction: column; gap: 6px; }
.rp-intel-open { align-self: flex-end; }
.rp-intel-locked { padding: 22px; }

.rp-models { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.rp-models > li { display: flex; align-items: flex-start; gap: 10px; }
.rp-models > li > div { display: flex; flex-direction: column; gap: 2px; }
.rp-models strong { font-size: 13px; color: var(--rp-text); }
.rp-models small { font-size: 12px; line-height: 1.45; color: var(--rp-muted); }
.rp-models-chip { display: inline-grid; place-items: center; flex: 0 0 auto; width: 32px; height: 32px; border-radius: 10px; color: #FFFFFF; font-size: 13px; }
.rp-models-chip.is-luna { background: linear-gradient(135deg, #60A5FA, hsl(calc(238.73deg + var(--ci-accent-shift, 0deg)) 83.53% 66.67%)); }
.rp-models-chip.is-terra { background: linear-gradient(135deg, hsl(calc(258.31deg + var(--ci-accent-shift, 0deg)) 89.53% 66.27%), #D946EF); }
.rp-grounded { display: flex; flex-direction: column; gap: 8px; margin: 0; padding-left: 1.2rem; font-size: 12.5px; line-height: 1.5; color: var(--rp-muted); }
.rp-grounded strong { color: var(--rp-text); }

/* Your briefings (Intelligence): search, quick filters with counts, rich rows that open the viewer, and a pager. */
.rp-bh-tools { display: flex; flex-direction: column; gap: 10px; margin-bottom: 12px; }
.rp-bh-search { position: relative; display: flex; align-items: center; max-width: 560px; }
.rp-bh-search-glyph { position: absolute; left: 12px; color: var(--rp-muted); font-size: 12.5px; pointer-events: none; }
.rp-bh-search-input { padding-left: 34px; padding-right: 34px; }
.rp-bh-search-input::-webkit-search-cancel-button { display: none; }
.rp-bh-search-clear { position: absolute; right: 6px; display: inline-grid; place-items: center; width: 26px; height: 26px; border: 0; border-radius: 8px; background: transparent; color: var(--rp-muted); cursor: pointer; }
.rp-bh-search-clear:hover { background: var(--rp-neutral-soft); color: var(--rp-text); }
.rp-bh-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.rp-bh-chip-btn.is-on { border-color: var(--rp-indigo); background: var(--rp-indigo-soft); color: var(--rp-indigo-strong); }
[data-bs-theme="dark"] .rp-bh-chip-btn.is-on { color: var(--rp-indigo-bright); }
.rp-bh-chip-btn.is-on .rp-chip-count { background: color-mix(in srgb, var(--rp-indigo) 18%, transparent); color: inherit; }
.rp-bh-chip-btn:focus-visible, .rp-bh-row:focus-visible, .rp-bh-page:focus-visible { outline: 2px solid var(--rp-focus); outline-offset: 1px; }
.rp-bh-sep { width: 1px; height: 20px; margin: 0 4px; background: var(--rp-tile-border); }
.rp-bh-periods { display: inline-flex; flex-wrap: wrap; gap: 6px; }

.rp-bh-error { margin-bottom: 10px; }
.rp-bh-list { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; transition: opacity .2s ease; }
.rp-bh-list.is-stale { opacity: .55; }
.rp-bh-skel { display: flex; flex-direction: column; gap: 8px; padding: 14px; border: 1px solid var(--rp-tile-border); border-radius: 14px; }
.rp-bh-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 14px;
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--rp-tile-border);
    border-radius: 14px;
    background: var(--rp-card);
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease, transform .12s ease;
}
.rp-bh-row:hover { border-color: color-mix(in srgb, var(--rp-indigo) 55%, var(--rp-tile-border)); background: var(--rp-row-hover, var(--rp-tile)); }
.rp-bh-row:active { transform: translateY(1px); }
.rp-bh-row.is-pinned { border-color: color-mix(in srgb, var(--rp-accent) 40%, var(--rp-tile-border)); }
.rp-bh-row.is-open { border-color: var(--rp-indigo); }
.rp-bh-chip { display: inline-grid; place-items: center; align-self: start; width: 34px; height: 34px; border-radius: 11px; background: var(--rp-accent-soft); color: var(--rp-accent); font-size: 13px; }
.rp-bh-chip.is-deep { background: linear-gradient(135deg, hsl(calc(258.31deg + var(--ci-accent-shift, 0deg)) 89.53% 66.27%), #D946EF); color: #FFFFFF; }
.rp-bh-main { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.rp-bh-top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.rp-bh-report { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rp-indigo); }
[data-bs-theme="dark"] .rp-bh-report { color: var(--rp-indigo-bright); }
.rp-bh-focus { max-width: 100%; padding: 1px 8px; overflow: hidden; border-radius: 999px; background: var(--rp-neutral-soft); font-size: 11px; color: var(--rp-text); text-overflow: ellipsis; white-space: nowrap; }
.rp-bh-pin { color: var(--rp-accent); font-size: 11px; }
.rp-bh-headline { overflow: hidden; font-size: 14px; font-weight: 650; line-height: 1.35; color: var(--rp-text); text-overflow: ellipsis; white-space: nowrap; }
.rp-bh-summary { display: -webkit-box; overflow: hidden; font-size: 12.5px; line-height: 1.45; color: var(--rp-muted); -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.rp-bh-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 2px; font-size: 11px; color: var(--rp-light, var(--rp-muted)); }
.rp-bh-meta > span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.rp-bh-side { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; min-width: 0; }
.rp-bh-tones { display: inline-flex; gap: 4px; }
.rp-bh-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--rp-tone, var(--rp-muted)); }
.rp-bh-dot.rp-tone-neutral { background: var(--rp-muted); opacity: .55; }
.rp-bh-counts { font-size: 11.5px; color: var(--rp-muted); white-space: nowrap; }
.rp-bh-impact { display: inline-flex; align-items: baseline; gap: 4px; padding: 2px 8px; border-radius: 999px; background: var(--rp-positive-soft); color: var(--rp-positive); font-size: 12px; font-weight: 650; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rp-bh-impact small { font-size: 10px; font-weight: 500; }
.rp-bh-fb { font-size: 12px; }
.rp-bh-go { color: var(--rp-muted); font-size: 12px; transition: transform .15s ease, color .15s ease; }
.rp-bh-row:hover .rp-bh-go { color: var(--rp-indigo); transform: translateX(2px); }
.rp-bh-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 28px 16px; border: 1px dashed var(--rp-tile-border); border-radius: 14px; text-align: center; color: var(--rp-muted); font-size: 12.5px; }
.rp-bh-empty > :first-child { font-size: 18px; color: var(--rp-indigo); }
.rp-bh-empty strong { font-size: 14px; color: var(--rp-text); }

.rp-bh-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--rc-line, rgba(0, 0, 0, .06)); }
.rp-bh-range { font-size: 12px; color: var(--rp-muted); font-variant-numeric: tabular-nums; }
.rp-bh-pages { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.rp-bh-page { min-width: 32px; height: 32px; padding: 0 8px; border: 1px solid var(--rp-tile-border); border-radius: 10px; background: var(--rp-card); color: var(--rp-text); font-size: 12.5px; font-variant-numeric: tabular-nums; cursor: pointer; }
.rp-bh-page:hover:not(:disabled) { border-color: var(--rp-indigo); color: var(--rp-indigo); }
.rp-bh-page.is-on { border-color: var(--rp-indigo); background: var(--rp-indigo); color: #FFFFFF; font-weight: 650; }
.rp-bh-page:disabled:not(.is-on) { opacity: .55; cursor: default; }
.rp-bh-gap { padding: 0 4px; color: var(--rp-muted); }

@media (max-width: 767.98px) {
    .rp-bh-row { grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px 12px; padding: 12px; }
    .rp-bh-side { grid-column: 2 / 3; grid-row: 2; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
    .rp-bh-go { grid-column: 3; grid-row: 1; align-self: center; }
    .rp-bh-headline { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
    .rp-bh-sep { display: none; }
}

@media (max-width: 575.98px) {
    .rp-bh-chips { flex-wrap: nowrap; overflow-x: auto; margin: 0 -4px; padding: 0 4px 2px; scrollbar-width: none; }
    .rp-bh-chips::-webkit-scrollbar { display: none; }
    .rp-bh-chips > .rp-chip, .rp-bh-periods > .rp-chip { flex: 0 0 auto; }
    .rp-bh-periods { flex-wrap: nowrap; }
    .rp-bh-chip { width: 30px; height: 30px; border-radius: 10px; font-size: 12px; }
    .rp-bh-meta { gap: 3px 10px; }
    .rp-bh-pager { justify-content: center; }
    .rp-bh-range { width: 100%; text-align: center; }
}

/* The briefing viewer: what was asked (a sticky side panel) beside what came back; stacked below 992px. */
.rp-bv { display: grid; grid-template-columns: minmax(260px, 340px) minmax(0, 1fr); align-items: start; gap: 18px; }
.rp-bv-request {
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--rp-tile-border);
    border-radius: 16px;
    background: var(--rp-tile);
}
.rp-bv-response { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 16px 18px; border: 1px solid var(--rp-card-border); border-radius: 16px; background: var(--rp-card); }
.rp-bv-label { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--rp-muted); }
.rp-bv-label > :first-child { color: var(--rp-accent); }
.rp-bv-dl { display: flex; flex-direction: column; margin: 0; }
.rp-bv-row { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 10px; padding: 7px 0; font-size: 12.5px; }
.rp-bv-row + .rp-bv-row { border-top: 1px solid var(--rc-line, rgba(0, 0, 0, .06)); }
.rp-bv-row dt { display: flex; align-items: center; gap: 7px; font-weight: 500; color: var(--rp-muted); }
.rp-bv-row dt .tx-glyph { width: 14px; text-align: center; font-size: 11px; }
.rp-bv-row dd { margin: 0; color: var(--rp-text); font-weight: 550; overflow-wrap: anywhere; }
.rp-bv-row dd small { font-weight: 400; color: var(--rp-muted); }
.rp-bv-facts summary { display: flex; align-items: center; gap: 6px; padding: 6px 0; font-size: 12px; font-weight: 600; color: var(--rp-indigo); cursor: pointer; list-style: none; }
.rp-bv-facts summary::-webkit-details-marker { display: none; }
.rp-bv-facts[open] .rp-ai-more-caret { transform: rotate(90deg); }
.rp-bv-facts-filter { margin-top: 6px; padding: .4rem .7rem; font-size: 12.5px; }
.rp-bv-facts-list { grid-template-columns: minmax(0, 1fr); max-height: 320px; background: var(--rp-card); }
.rp-bv-facts-list .is-cited dt { font-weight: 600; color: var(--rp-text); }
.rp-bv-cited { margin-right: 5px; color: var(--rp-accent); font-size: 9px; }
.rp-bv-request .rp-footnote { margin-top: 0; }
.rp-bv-skel { display: flex; flex-direction: column; gap: 12px; min-height: 180px; }
.rp-bv-dialog .rc-ghost-btn.is-on { border-color: var(--rp-accent); color: var(--rp-accent); background: var(--rp-accent-soft); }

@media (max-width: 991.98px) {
    .rp-bv { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .rp-bv-request { position: static; }
    .rp-bv-dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; }
    .rp-bv-row + .rp-bv-row { border-top: 0; }
    .rp-bv-row { grid-template-columns: minmax(0, 1fr); gap: 2px; border-bottom: 1px solid var(--rc-line, rgba(0, 0, 0, .06)); }
}

@media (max-width: 575.98px) {
    .rp-bv-dl { column-gap: 12px; }
    .rp-bv-row { padding: 6px 0; font-size: 12px; }
    .rp-bv-response { padding: 12px; }
    .rp-bv-request { padding: 12px; }
}

/* ------------------------------------------------------------------ Net worth, budgets, the money story email, glance cards */

.rp-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem .75rem;
    padding: 10px 14px;
    border: 1px solid color-mix(in srgb, var(--rp-tone) 30%, transparent);
    border-radius: 14px;
    background: var(--rp-tone-soft);
    color: var(--rp-text);
    font-size: 12.5px;
}

.rp-banner > .tx-glyph { color: var(--rp-tone); }
.rp-banner > span { flex: 1 1 260px; min-width: 0; }
.rp-banner strong { font-weight: 650; }

.rp-notes { padding: 4px 2px; font-size: 12px; color: var(--rp-muted); }
.rp-notes summary { display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; font-weight: 600; color: var(--rp-indigo); }
.rp-notes ul { margin: 8px 0 0; padding-left: 1.2rem; line-height: 1.55; }

.rp-pill-soft { background: var(--rp-neutral-soft); color: var(--rp-muted); font-size: 10px; padding: 1px 7px; }
.rp-pill-good { background: var(--rp-positive-soft); color: var(--rp-positive); font-size: 10px; padding: 1px 7px; }
.rp-pill-warn { background: var(--rp-caution-soft); color: var(--rp-caution); font-size: 10px; padding: 1px 7px; }
.rp-pill-stale { background: var(--rp-caution-soft); color: var(--rp-caution); font-size: 10px; padding: 1px 7px; }

/* The net worth hero: the window behind the figure, owned against owed, and the pace on the right. */
.rp-hero-compare { font-size: 11.5px; color: var(--ah-muted, var(--rp-muted)); }
.rp-nw-split { display: flex; width: min(320px, 100%); height: 8px; gap: 2px; margin: 4px 0 2px; border-radius: 999px; overflow: hidden; }
.rp-nw-split > span { display: block; height: 100%; min-width: 2px; }
.rp-nw-split-own, .rp-dot-own { background: var(--rp-positive); }
.rp-nw-split-owe, .rp-dot-owe { background: color-mix(in srgb, var(--rp-caution) 85%, var(--rp-negative)); }
.rp-nw-projection { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 6px 0 0; }
.rp-nw-projection > div { padding: 8px 10px; border-radius: 12px; background: var(--rp-tile); box-shadow: inset 0 0 0 1px var(--rp-tile-border); }
.rp-nw-projection dt { font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--rp-muted); }
.rp-nw-projection dd { margin: 2px 0 0; font-family: var(--tx-font); font-size: 16px; font-weight: 650; font-variant-numeric: tabular-nums; color: var(--rp-text); }
.rp-nw-goal { display: inline-flex; align-items: center; gap: .45rem; padding: 6px 10px; border-radius: 10px; background: var(--rp-positive-soft); color: var(--rp-text); font-size: 12.5px; }
.rp-nw-goal .tx-glyph { color: var(--rp-positive); }

/* The bridge: a waterfall in HTML. Totals in indigo, steps up green and down red; a cut total gets a zigzag. */
.rp-bridge { display: grid; grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column; gap: 8px; align-items: end; min-height: 250px; }
.rp-bridge-col { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; text-align: center; }
.rp-bridge-value { font-family: var(--tx-font); font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rp-bridge-value.rp-bridge-total { color: var(--rp-text); }
.rp-bridge-value.rp-bridge-positive { color: var(--rp-positive); }
.rp-bridge-value.rp-bridge-caution { color: var(--rp-caution); }
.rp-bridge-plot { position: relative; width: 100%; max-width: 64px; height: 170px; border-bottom: 1px solid var(--rp-tile-border); }
.rp-bridge-bar { position: absolute; left: 10%; right: 10%; border-radius: 6px; }
.rp-bridge-bar.rp-bridge-total { background: linear-gradient(180deg, var(--rp-indigo-bright), var(--rp-indigo)); }
.rp-bridge-bar.rp-bridge-positive { background: linear-gradient(180deg, color-mix(in srgb, var(--rp-positive) 80%, #FFFFFF), var(--rp-positive)); }
.rp-bridge-bar.rp-bridge-caution { background: linear-gradient(180deg, color-mix(in srgb, var(--rp-caution) 75%, #FFFFFF), var(--rp-caution)); }
.rp-bridge-bar.is-broken { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.rp-bridge-bar.is-broken::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 10px;
    height: 7px;
    background: linear-gradient(135deg, transparent 33%, var(--rp-card) 33%, var(--rp-card) 66%, transparent 66%) 0 0 / 8px 7px repeat-x;
}

.rp-bridge-label { font-size: 11.5px; font-weight: 650; color: var(--rp-text); line-height: 1.2; }
.rp-bridge-note { font-size: 10px; line-height: 1.25; color: var(--rp-muted); }
.rp-bridge-caption { margin-top: 12px; }

/* What you own and owe. */
.rp-comp + .rp-comp { margin-top: 14px; padding-top: 4px; border-top: 1px dashed var(--rp-tile-border); }
.rp-comp-head { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; }
.rp-comp-head .rp-subhead { margin: 10px 0 8px; }
.rp-comp-head strong { font-family: var(--tx-font); font-size: 16px; color: var(--rp-text); }
.rp-comp-bar { display: flex; gap: 2px; height: 14px; border-radius: 999px; overflow: hidden; background: var(--rp-track); }
.rp-comp-bar > span { display: block; height: 100%; min-width: 3px; }
.rp-comp-list { display: flex; flex-direction: column; gap: 4px; margin: 10px 0 0; padding: 0; list-style: none; }
.rp-comp-list > li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto 64px; align-items: center; gap: 8px; padding: 4px 0; font-size: 12.5px; }
.rp-comp-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--rp-text); }
.rp-comp-share { font-size: 11px; color: var(--rp-muted); }
.rp-comp-change { text-align: right; font-size: 11.5px; color: var(--rp-muted); font-variant-numeric: tabular-nums; }

/* Every account. */
.rp-nw-group { justify-content: space-between; }
.rp-nw-group:first-child { margin-top: 0; }
.rp-nw-group small { font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--rp-muted); }
.rp-nw-accounts { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.rp-nw-account {
    --rp-acct: var(--rp-indigo);
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) 96px auto;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 9px 12px;
    border: 1px solid var(--rp-tile-border);
    border-radius: 13px;
    background: var(--rp-tile);
    color: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease;
}

.rp-nw-account:hover { border-color: var(--rp-acct); background: var(--rp-row-hover); }
.rp-nw-account:focus-visible { outline: 2px solid var(--rp-focus); outline-offset: 1px; }
.rp-nw-account-chip { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: color-mix(in srgb, var(--rp-acct) 14%, transparent); color: var(--rp-acct); font-size: 12.5px; }
.rp-nw-account-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rp-nw-account-name { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; min-width: 0; font-size: 13.5px; font-weight: 600; color: var(--rp-text); }
.rp-nw-account-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.rp-nw-mask { font-size: 11px; font-weight: 500; color: var(--rp-muted); }
.rp-nw-account-sub { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; color: var(--rp-muted); }
.rp-nw-spark { width: 96px; height: 28px; --rp-spark: var(--rp-acct); }
.rp-nw-account-figures { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; min-width: 88px; }
.rp-nw-account-figures strong { font-family: var(--tx-font); font-size: 14.5px; font-variant-numeric: tabular-nums; color: var(--rp-text); }
.rp-nw-account-figures small { font-size: 11px; color: var(--rp-muted); white-space: nowrap; }

@media (max-width: 575.98px) {
    .rp-nw-account { grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; padding: 9px 10px; }
    .rp-comp-list > li { grid-template-columns: auto minmax(0, 1fr) auto 58px; }
    .rp-comp-share { display: none; }
    .rp-bridge { gap: 4px; }
    .rp-bridge-note { display: none; }
}

.rp-milestone .rp-timeline-date small { color: var(--rp-tone); }

@media (max-width: 575.98px) {
    .rp-nw-hero .rp-hero-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rp-nw-hero .rp-hero-tile { padding: 10px 12px; }
    .rp-nw-hero .rp-hero-tile-chip { display: none; }
}

/* Forms shared by the Budgets pages (fields, money inputs, switches). */
.rp-form { display: flex; flex-direction: column; gap: 14px; }
.rp-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; }
.rp-field:disabled { opacity: .8; }
.rp-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.rp-label { padding: 0; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--rp-muted); }
.rp-label small { font-weight: 500; letter-spacing: 0; text-transform: none; }
.rp-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.rp-select { appearance: auto; }
/* Native popup lists are painted from the select's own background; a translucent
   dark surface makes Chromium fall back to white. Keep it opaque per theme. */
[data-bs-theme="light"] .rp-select { color-scheme: light; background-color: var(--rp-input-bg); }
[data-bs-theme="dark"] .rp-select { color-scheme: dark; background-color: color-mix(in srgb, #FFFFFF 4%, var(--rp-card, #151B28)); }
[data-bs-theme="dark"] .rp-select option,
[data-bs-theme="dark"] .rp-select optgroup { background-color: #151B28; color: #E6E8F2; }
[data-bs-theme="dark"] .rp-select option:disabled { color: #6B7190; }
[data-bs-theme="dark"] .rp-select option:checked { background-color: #2B3045; color: #FFFFFF; }
.rp-money { position: relative; display: flex; align-items: center; }
.rp-money > span { position: absolute; left: 12px; font-weight: 600; color: var(--rp-muted); pointer-events: none; }
.rp-money > .rp-input { padding-left: 26px; font-family: var(--tx-font); font-size: 18px; font-weight: 650; font-variant-numeric: tabular-nums; }
.rp-hint { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 12px; color: var(--rp-muted); }
.rp-hint strong { color: var(--rp-text); }
.rp-form-error { display: flex; align-items: center; gap: .45rem; margin: 0; padding: 8px 12px; border-radius: 10px; background: var(--rp-negative-soft); color: var(--rp-negative); font-size: 12.5px; font-weight: 600; }
.rp-form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 6px; border-top: 1px solid var(--rp-tile-border); }
.rp-form-spacer { flex: 1 1 auto; }
.rp-link-danger { color: var(--rp-negative); }
.rp-link-danger:hover:not(:disabled) { color: var(--rp-negative); }

@media (max-width: 575.98px) {
    .rp-field-grid { grid-template-columns: minmax(0, 1fr); }
}

/* A switch (a styled checkbox: still a checkbox for keyboards and screen readers). */
.rp-switch { position: relative; display: flex; align-items: flex-start; gap: 12px; cursor: pointer; }
.rp-switch > input { position: absolute; opacity: 0; width: 44px; height: 26px; margin: 0; cursor: pointer; }
.rp-switch-track { position: relative; flex: 0 0 auto; width: 44px; height: 26px; border-radius: 999px; background: var(--rp-input-border); transition: background-color .2s ease; }
.rp-switch-track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #FFFFFF; box-shadow: 0 1px 4px rgba(0, 0, 0, .25); transition: transform .2s ease; }
.rp-switch > input:checked + .rp-switch-track { background: var(--rp-indigo); }
.rp-switch > input:checked + .rp-switch-track::after { transform: translateX(18px); }
.rp-switch > input:focus-visible + .rp-switch-track { outline: 2px solid var(--rp-focus); outline-offset: 2px; }
.rp-switch > input:disabled + .rp-switch-track { opacity: .5; }
.rp-switch.is-locked { cursor: default; }
.rp-switch-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rp-switch-text strong { font-size: 13.5px; color: var(--rp-text); }
.rp-switch-text small { font-size: 12px; line-height: 1.45; color: var(--rp-muted); }

/* The money story by email. */
.rp-story-email { display: flex; flex-direction: column; gap: 12px; }
.rp-story-email-points { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; font-size: 12px; line-height: 1.45; color: var(--rp-muted); }
.rp-story-email-points > li { display: flex; gap: 8px; }
.rp-story-email-points .tx-glyph { flex: 0 0 auto; margin-top: 2px; color: var(--rp-accent); }
.rp-story-email.is-on .rp-switch-text strong { color: var(--rp-accent); }
.rp-story-email-last { display: flex; align-items: center; gap: .4rem; }

/* The Overview's glance cards: net worth and the budget plan's latest period. */
.rp-glance { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.rp-glance-card {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid var(--rp-card-border);
    border-radius: 18px;
    background: var(--rp-card);
    box-shadow: var(--rp-shadow);
    color: inherit;
    text-decoration: none;
    transition: border-color .15s ease, transform .15s ease;
}

.rp-glance-card:hover { border-color: var(--rp-indigo); color: inherit; transform: translateY(-1px); }
.rp-glance-card:focus-visible { outline: 2px solid var(--rp-focus); outline-offset: 2px; }
.rp-glance-chip { display: inline-grid; place-items: center; flex: 0 0 auto; width: 40px; height: 40px; border-radius: 12px; background: var(--rp-tone-soft); color: var(--rp-tone); font-size: 15px; }
.rp-glance-text { display: flex; flex: 1 1 auto; flex-direction: column; gap: 1px; min-width: 0; }
.rp-glance-caption { font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rp-muted); }
.rp-glance-value { font-family: var(--tx-font); font-size: 21px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--rp-text); }
.rp-glance-note { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; color: var(--rp-muted); }
.rp-glance-spark { flex: 0 0 auto; width: 120px; height: 34px; }
.rp-glance-go { flex: 0 0 auto; font-size: 11px; color: var(--rp-muted); }

@media (max-width: 767.98px) {
    .rp-glance { grid-template-columns: minmax(0, 1fr); gap: .75rem; }
}

/* ------------------------------------------------------------------ Motion */

@media (prefers-reduced-motion: reduce) {
    .rp-ai-orb, .rp-ask-typing > span, .rp-spin { animation: none !important; }
    .rp-breakdown-fill, .rp-hbar-fill, .rp-vcol-fill, .rp-dollar-seg, .rpb-bullet-fill, .rpb-ring-fill, .rpb-goal-fill, .rp-switch-track, .rp-switch-track::after, .rp-glance-card { transition: none !important; }
}
