/* Private budget preview. Page-scoped styles keep the Folio VIP shell intact. */ #budgetProfile .bp-profile summary>span[data-manual-heading]:first-child{flex-direction:row;align-items:center;gap:0} #budgetProfile { --bp-mint: var(--signal-green, #76e8b5); --bp-blue: #79b0ff; --bp-gold: var(--chart-gold, #f4c56a); --bp-purple: #a8a0ff; --bp-soft: color-mix(in srgb, var(--bg) 50%, var(--panel)); --bp-line: color-mix(in srgb, var(--border) 72%, transparent); font-variant-numeric: tabular-nums; } #budgetProfile h2, #budgetProfile h3, #budgetProfile p { margin: 0; } #budgetProfile h3 { color: var(--text); font-size: 18px; font-weight: 550; letter-spacing: -.4px; line-height: 1.35; } #budgetProfile button, #budgetProfile input, #budgetProfile select { font-family: inherit; } #budgetProfile button { min-height: 44px; border-radius: 5px; } #budgetProfile button:focus-visible, #budgetProfile input:focus-visible, #budgetProfile select:focus-visible, #budgetProfile summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; } #budgetProfile button:disabled { opacity: .45; } #budgetProfile small { font-size: 11px; line-height: 1.55; } #budgetProfile .bp-start-fresh{margin-top:12px;display:flex;align-items:center;gap:12px;flex-wrap:wrap} #budgetProfile .bp-start-fresh p{color:var(--muted);font-size:11px;line-height:1.5} #budgetProfile .bp-intro { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 2px 2px 23px; } #budgetProfile .bp-eyebrow { margin-bottom: 7px; color: var(--muted); font-size: 10px; letter-spacing: 1.35px; line-height: 1.5; } #budgetProfile .bp-intro h2 { color: var(--text); font-size: clamp(26px, 3.2vw, 36px); line-height: 1.2; font-weight: 500; letter-spacing: -1.2px; } #budgetProfile .bp-intro h2 + p { margin-top: 7px; font-size: 13px; } #budgetProfile .bp-preview { flex-shrink: 0; display: inline-flex; align-items: center; gap: 8px; padding: 7px 11px; border: 1px solid var(--bp-line); border-radius: 4px; color: var(--muted); font-size: 11px; } #budgetProfile .bp-preview i { width: 5px; height: 5px; border-radius: 50%; background: var(--bp-mint); box-shadow: 0 0 9px #76e8b528; } #budgetProfile .bp-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 22px; align-items: start; } #budgetProfile .bp-main { min-width: 0; } #budgetProfile article { margin: 0; padding: 24px 26px; border-radius: 8px; box-shadow: 0 8px 26px #00000010; } #budgetProfile .bp-flow-card { position: relative; overflow: hidden; background: radial-gradient(ellipse at 50% 27%, #79b0ff08, transparent 56%), var(--panel); } #budgetProfile .bp-hero { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding-bottom: 23px; border-bottom: 1px solid var(--bp-line); } #budgetProfile .bp-label { display: block; color: var(--muted); font-size: 11px; line-height: 1.5; } #budgetProfile .bp-estimate { display: inline-block; margin-left: 6px; padding: 0 5px; border: 1px solid var(--bp-line); border-radius: 3px; font-size: 9px; color: var(--muted); } #budgetProfile .bp-headline { margin-top: 7px; color: var(--bp-mint); font-size: clamp(36px, 4.2vw, 54px); line-height: 1.15; font-weight: 500; letter-spacing: -2.3px; white-space: nowrap; } #budgetProfile .bp-definition { margin-top: 7px; font-size: 11px; line-height: 1.5; } #budgetProfile .bp-change { flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; padding-left: 22px; border-left: 1px solid var(--bp-line); text-align: right; } #budgetProfile .bp-change strong { color: var(--text); font-size: 22px; font-weight: 500; letter-spacing: -.5px; line-height: 1.4; } #budgetProfile .bp-change > span:last-child { max-width: 175px; color: var(--muted); font-size: 10px; line-height: 1.5; } #budgetProfile .bp-flow-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-top: 21px; } #budgetProfile .bp-flow-heading h3 { font-size: 15px; } #budgetProfile .bp-flow-heading > span { color: var(--muted); font-size: 10px; } #budgetProfile .bp-flow-desktop { margin: 6px 0 5px; } #budgetProfile .bp-flow-desktop svg { display: block; width: 100%; height: auto; overflow: visible; font-family: inherit; } #budgetProfile .bp-svg-label { fill: var(--muted); font-size: 15px; } #budgetProfile .bp-svg-value { fill: var(--text); font-size: 19px; font-weight: 500; letter-spacing: -.3px; } #budgetProfile .bp-svg-kicker { fill: var(--muted); font-size: 11px; letter-spacing: 1.6px; } #budgetProfile .bp-svg-total { fill: var(--text); font-size: 31px; font-weight: 500; letter-spacing: -1px; } #budgetProfile .bp-svg-output { fill: var(--text); font-size: 25px; font-weight: 500; letter-spacing: -.8px; } #budgetProfile .bp-svg-green { fill: var(--bp-mint); } #budgetProfile .bp-svg-note { fill: var(--muted); font-size: 12px; } #budgetProfile .bp-pool { fill: var(--panel); stroke: color-mix(in srgb, var(--bp-blue) 28%, var(--border)); stroke-width: 1; } #budgetProfile .bp-orbit { fill: none; stroke: var(--bp-blue); stroke-width: 1; stroke-opacity: .16; } #budgetProfile .bp-orbit-outer { stroke-dasharray: 2 7; stroke-opacity: .2; } #budgetProfile .bp-income-ribbon { opacity: .9; } #budgetProfile .bp-flow-mobile { display: none; } #budgetProfile .bp-flow-mobile svg{display:block;width:100%;height:auto;overflow:visible;font-family:inherit} #budgetProfile .bp-flow-mobile .bp-svg-label{font-size:12px} #budgetProfile .bp-flow-mobile .bp-svg-value{font-size:19px;fill:var(--bp-blue)} #budgetProfile .bp-flow-mobile .bp-svg-kicker{font-size:9px;letter-spacing:1px} #budgetProfile .bp-flow-mobile .bp-svg-output{font-size:25px} #budgetProfile .bp-flow-mobile .bp-mobile-total-wide{font-size:24px;letter-spacing:-.5px} #budgetProfile .bp-flow-mobile .bp-svg-note{font-size:10px} #budgetProfile .bp-mobile-committed{fill:var(--bp-gold)} #budgetProfile .bp-mobile-source-backplate{fill:var(--panel);fill-opacity:.94} body.light #budgetProfile .bp-flow-mobile stop[stop-color="#79b0ff"]{stop-color:#276d9f} body.light #budgetProfile .bp-flow-mobile stop[stop-color="#76e8b5"]{stop-color:#087046} body.light #budgetProfile .bp-flow-mobile stop[stop-color="#f4c56a"]{stop-color:#906000} #budgetProfile .bp-flow-key { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-top: 5px; } #budgetProfile .bp-flow-key button { display: flex; align-items: center; gap: 10px; padding: 11px 13px; min-width: 0; background: var(--bp-soft); border: 1px solid var(--bp-line); text-align: left; } #budgetProfile .bp-flow-key button:hover { border-color: color-mix(in srgb, var(--accent) 60%, var(--border)); background: color-mix(in srgb, var(--bp-soft) 90%, var(--accent)); } #budgetProfile .bp-flow-key button.selected { border-color: color-mix(in srgb, var(--bp-mint) 60%, var(--border)); background: color-mix(in srgb, var(--bp-mint) 4%, var(--bp-soft)); } #budgetProfile .bp-flow-key button > span:nth-child(2) { flex: 1; min-width: 0; color: var(--muted); font-size: 10px; line-height: 1.6; } #budgetProfile .bp-flow-key strong { display: block; color: var(--text); font-size: 17px; font-weight: 500; letter-spacing: -.5px; white-space: nowrap; } #budgetProfile .bp-flow-key button > span:last-child { align-self: flex-start; color: var(--muted); font-size: 12px; } #budgetProfile .bp-dot { flex-shrink: 0; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--bp-blue); } #budgetProfile .bp-dot.recurring { background: var(--bp-gold); } #budgetProfile .bp-dot.available { background: var(--bp-mint); } #budgetProfile .bp-dot.everyday { background: var(--bp-blue); } #budgetProfile .bp-dot.investment { background: var(--bp-purple); } #budgetProfile .bp-dot.extra { background: var(--bp-gold); } #budgetProfile .bp-insight { min-height: 38px; margin-top: 13px; color: var(--muted); font-size: 11px; line-height: 1.65; } #budgetProfile .bp-insight b { color: var(--text); font-weight: 500; } #budgetProfile .bp-plan-card { margin-top: 18px; background: var(--panel); } #budgetProfile .bp-plan-top { display: flex; justify-content: space-between; align-items: center; gap: 16px; } #budgetProfile .bp-plan-top .bp-eyebrow { font-size: 9px; margin-bottom: 4px; } #budgetProfile .bp-plan-top h3 { font-size: 18px; } #budgetProfile .bp-plan-status { flex-shrink: 0; color: var(--muted); font-size: 10px; line-height: 1.5; border: 1px solid var(--bp-line); border-radius: 3px; padding: 4px 7px; } #budgetProfile .bp-plan-amounts { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin-top: 20px; } #budgetProfile .bp-plan-amounts > div:first-child > span { display: block; color: var(--muted); font-size: 11px; } #budgetProfile .bp-plan-amounts > div:first-child > strong { display: block; margin-top: 5px; color: var(--text); font-size: 34px; font-weight: 500; letter-spacing: -1.5px; line-height: 1.15; white-space: nowrap; } #budgetProfile .bp-plan-equation { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px 18px; max-width: 56%; } #budgetProfile .bp-plan-equation > span { display: grid; grid-template-columns: 6px auto; column-gap: 6px; align-items: center; color: var(--muted); font-size: 10px; white-space: nowrap; } #budgetProfile .bp-plan-equation b { grid-column: 2; color: var(--text); font-size: 13px; font-weight: 500; } #budgetProfile .bp-plan-track { display: flex; gap: 3px; height: 7px; margin: 20px 0 13px; overflow: hidden; background: var(--bp-soft); } #budgetProfile .bp-plan-track > span { display: block; min-width: 0; height: 100%; } #budgetProfile .bp-track-everyday { background: var(--bp-blue); } #budgetProfile .bp-track-investment { background: var(--bp-purple); } #budgetProfile .bp-track-extra { background: var(--bp-gold); } #budgetProfile .bp-track-remaining { background: color-mix(in srgb, var(--bp-mint) 40%, var(--border)); } #budgetProfile .bp-plan-note { color: var(--muted); font-size: 11px; line-height: 1.65; } #budgetProfile .bp-controls { padding: 22px; min-width: 0; border: 1px solid var(--border); border-radius: 8px; background: var(--panel); } #budgetProfile .bp-controls-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 22px; } #budgetProfile .bp-controls-heading .bp-eyebrow { color: var(--bp-mint); font-size: 9px; margin-bottom: 4px; } #budgetProfile .bp-controls-heading h3 { font-size: 17px; } #budgetProfile .bp-controls-heading button { padding: 6px 11px; color: var(--muted); font-size: 11px; background: transparent; } #budgetProfile .bp-control { margin-top: 19px; } #budgetProfile .bp-control-label, #budgetProfile .bp-control-title label { display: block; font-size: 12px; color: var(--text); font-weight: 500; line-height: 1.5; } #budgetProfile .bp-control small { display: block; margin-top: 7px; color: var(--muted); } #budgetProfile .bp-segment { display: flex; margin-top: 9px; padding: 3px; border: 1px solid var(--bp-line); border-radius: 5px; background: var(--bg); } #budgetProfile .bp-segment button { flex: 1; padding: 6px 9px; background: transparent; border: 1px solid transparent; color: var(--muted); font-size: 12px; } #budgetProfile .bp-segment button[aria-pressed="true"] { background: var(--panel); border-color: color-mix(in srgb, var(--accent) 36%, var(--border)); color: var(--text); box-shadow: 0 1px 4px #0001; } #budgetProfile .bp-segment button:hover { color: var(--text); border-color: var(--border); } #budgetProfile .bp-preset { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 2px 8px; width: 100%; margin-top: 20px; padding: 11px 13px; border-color: color-mix(in srgb, var(--bp-blue) 37%, var(--border)); background: color-mix(in srgb, var(--bp-blue) 5%, var(--panel)); color: var(--text); text-align: left; font-size: 11px; } #budgetProfile .bp-preset > span { color: var(--accent); } #budgetProfile .bp-preset small { grid-column: 1 / -1; color: var(--muted); font-size: 10px; font-weight: 400; } #budgetProfile .bp-preset:hover { border-color: var(--accent); } #budgetProfile .bp-control-divider { margin: 25px 0 4px; padding-top: 18px; border-top: 1px solid var(--bp-line); color: var(--muted); font-size: 10px; } #budgetProfile .bp-control-title { display: flex; justify-content: space-between; align-items: center; gap: 12px; } #budgetProfile .bp-dollar { display: flex; align-items: center; min-height: 44px; border: 1px solid var(--border); border-radius: 5px; background: var(--bg); } #budgetProfile .bp-dollar > span { padding-left: 10px; color: var(--muted); font-size: 13px; } #budgetProfile .bp-dollar input { width: 92px; max-width: 100px; min-width: 0; height: 44px; border: 0; border-radius: 5px; padding: 8px 8px 8px 4px; background: transparent; color: var(--text); font-size: 14px; font-variant-numeric: tabular-nums; text-align: right; } #budgetProfile .bp-dollar input[aria-invalid="true"] { outline: 1px solid #ff4058; outline-offset: 0; } #budgetProfile .bp-range { display: block; width: 100%; height: 28px; padding: 0; margin: 7px 0 0; border: 0; border-radius: 0; background: transparent; accent-color: var(--bp-blue); cursor: pointer; } #budgetProfile .bp-range[data-range="investment"] { accent-color: var(--bp-purple); } #budgetProfile .bp-range[data-range="extraLoan"] { accent-color: var(--bp-gold); } #budgetProfile .bp-loan-select { display: grid; gap: 6px; margin-top: 12px; font-size: 10px; line-height: 1.5; color: var(--muted); } #budgetProfile .bp-loan-select select { width: 100%; max-width: none; min-height: 44px; padding: 8px 11px; border-radius: 5px; background: var(--bg); font-size: 11px; } #budgetProfile .bp-allowance-presets { display: flex; gap: 7px; margin-top: 9px; } #budgetProfile .bp-allowance-presets button { flex: 1; padding: 5px 7px; border-color: var(--bp-line); background: transparent; color: var(--muted); font-size: 10px; } #budgetProfile .bp-allowance-presets button:hover { border-color: var(--accent); color: var(--text); } #budgetProfile .bp-overlap-note { margin-top: 10px; padding-left: 9px; border-left: 2px solid color-mix(in srgb, var(--bp-gold) 55%, var(--border)); color: var(--muted); font-size: 10px; line-height: 1.6; } #budgetProfile .bp-details { margin-top: 18px; border: 1px solid var(--bp-line); border-radius: 6px; background: color-mix(in srgb, var(--panel) 65%, var(--bg)); } #budgetProfile .bp-details summary { display: flex; align-items: center; gap: 15px; min-height: 56px; padding: 13px 20px; cursor: pointer; color: var(--text); font-size: 12px; list-style: none; } #budgetProfile .bp-details summary::-webkit-details-marker { display: none; } #budgetProfile .bp-details summary > span { color: var(--muted); font-size: 10px; } #budgetProfile .bp-details summary > b { margin-left: auto; color: var(--muted); font-size: 18px; font-weight: 400; line-height: 1; transition: transform .15s ease; } #budgetProfile .bp-details[open] summary > b { transform: rotate(45deg); } #budgetProfile .bp-details[open] summary { border-bottom: 1px solid var(--bp-line); } #budgetProfile .bp-ledger { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; padding: 23px 23px 20px; } #budgetProfile .bp-ledger h3, #budgetProfile .bp-loans h3 { font-size: 14px; } #budgetProfile .bp-ledger dl { margin: 12px 0; } #budgetProfile .bp-ledger dl > div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--bp-line); color: var(--muted); font-size: 11px; line-height: 1.5; } #budgetProfile .bp-ledger dt { min-width: 0; } #budgetProfile .bp-ledger dd { margin: 0; flex-shrink: 0; color: var(--text); } #budgetProfile .bp-ledger p, #budgetProfile .bp-loans p, #budgetProfile .bp-sale-note { color: var(--muted); font-size: 10px; line-height: 1.65; } #budgetProfile .bp-loans { margin: 0 23px; padding: 18px 0; border-top: 1px solid var(--bp-line); } #budgetProfile .bp-loans h3 { display: flex; justify-content: space-between; gap: 12px; } #budgetProfile .bp-loans h3 small { font-size: 10px; font-weight: 400; } #budgetProfile .bp-loans [data-loan-ledger] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; margin: 14px 0; } #budgetProfile .bp-loans [data-loan-ledger] > div { display: flex; flex-direction: column; gap: 3px; border-left: 2px solid var(--border); padding-left: 10px; } #budgetProfile .bp-loans [data-loan-ledger] span { font-size: 10px; color: var(--muted); } #budgetProfile .bp-loans [data-loan-ledger] strong { font-size: 16px; color: var(--text); font-weight: 500; } #budgetProfile .bp-loans [data-loan-ledger] small { font-size: 10px; } #budgetProfile .bp-sale-note { padding: 13px 23px; border-top: 1px solid var(--bp-line); } #budgetProfile .bp-footer { margin: 16px 2px 0; max-width: 100%; color: var(--muted); font-size: 10px; line-height: 1.65; } #budgetProfile .bp-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } #budgetProfile .bp-negative { color: #ff4058 !important; } #budgetProfile .bp-positive { color: var(--bp-mint) !important; } body.light #budgetProfile { --bp-mint: #087046; --bp-blue: #276d9f; --bp-purple: #6e43bc; --bp-gold: #906000; } body.light #budgetProfile .bp-negative { color: #bd203b !important; } body.light #budgetProfile .bp-flow-desktop stop[stop-color="#79b0ff"] { stop-color: #276d9f; } body.light #budgetProfile .bp-flow-desktop stop[stop-color="#76e8b5"] { stop-color: #087046; } body.light #budgetProfile .bp-flow-desktop stop[stop-color="#f4c56a"] { stop-color: #906000; } body.light #budgetProfile .bp-flow-desktop [fill="#76e8b5"] { fill: #087046; } body.light #budgetProfile .bp-flow-desktop [fill="#f4c56a"] { fill: #906000; } body.light #budgetProfile .bp-flow-desktop [fill="#79b0ff"] { fill: #276d9f; } body.light #budgetProfile .bp-flow-desktop [fill="#a8a0ff"] { fill: #6e43bc; } @media (max-width: 1180px) and (min-width: 1051px) { #budgetProfile .bp-layout { gap: 18px; } #budgetProfile article { padding: 22px; } #budgetProfile .bp-headline { font-size: 40px; } #budgetProfile .bp-change { padding-left: 16px; } #budgetProfile .bp-change strong { font-size: 18px; } #budgetProfile .bp-change > span:last-child { max-width: 130px; } #budgetProfile .bp-flow-key { gap: 6px; } #budgetProfile .bp-flow-key button { gap: 7px; padding: 10px; } #budgetProfile .bp-flow-key strong { font-size: 15px; } #budgetProfile .bp-plan-equation { gap: 7px 12px; } } @media (max-width: 1050px) { #budgetProfile .bp-layout { grid-template-columns: minmax(0, 1fr); gap: 18px; } #budgetProfile .bp-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 28px; } #budgetProfile .bp-controls-heading, #budgetProfile .bp-preset, #budgetProfile .bp-control-divider, #budgetProfile .bp-overlap-note { grid-column: 1 / -1; } #budgetProfile .bp-controls-heading { margin-bottom: 0; } #budgetProfile .bp-control, #budgetProfile .bp-preset, #budgetProfile .bp-control-divider, #budgetProfile .bp-loan-select, #budgetProfile .bp-allowance-presets, #budgetProfile .bp-overlap-note { margin-top: 0; } #budgetProfile .bp-control-divider { margin-bottom: -3px; } #budgetProfile .bp-preset { width: auto; } #budgetProfile .bp-loan-select { align-self: start; margin-top: 3px; } #budgetProfile .bp-allowance-presets { align-self: center; } } @media (max-width: 680px) { #budgetProfile .bp-intro { flex-direction: column; align-items: flex-start; gap: 10px; padding: 1px 3px 18px; } #budgetProfile .bp-intro h2 { font-size: 27px; letter-spacing: -.8px; } #budgetProfile .bp-intro h2 + p { max-width: 250px; font-size: 11px; } #budgetProfile .bp-intro .bp-eyebrow { font-size: 8px; letter-spacing: .9px; } #budgetProfile .bp-preview { max-width: none; padding: 4px 7px; gap: 5px; font-size: 9px; line-height: 1.5; } #budgetProfile article { padding: 19px 18px; border-radius: 6px; } #budgetProfile .bp-hero { flex-direction: column; align-items: stretch; gap: 16px; padding-bottom: 18px; } #budgetProfile .bp-headline { font-size: clamp(36px, 9.5vw, 50px); letter-spacing: -1.8px; } #budgetProfile .bp-definition { max-width: 295px; font-size: 10px; } #budgetProfile .bp-change { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 4px 12px; padding: 12px 0 0; border-left: 0; border-top: 1px solid var(--bp-line); text-align: left; } #budgetProfile .bp-change .bp-label { font-size: 10px; } #budgetProfile .bp-change strong { font-size: 18px; text-align: right; } #budgetProfile .bp-change > span:last-child { grid-column: 1 / -1; max-width: none; font-size: 9px; } #budgetProfile .bp-flow-heading { margin-top: 19px; } #budgetProfile .bp-flow-heading > span { display: none; } #budgetProfile .bp-flow-desktop { display: none; } #budgetProfile .bp-flow-mobile { display: block; padding: 17px 0 18px; } #budgetProfile .bp-mobile-income { position: relative; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 15px 12px; border: 1px solid color-mix(in srgb, var(--bp-blue) 40%, var(--border)); border-radius: 5px; background: color-mix(in srgb, var(--bp-blue) 5%, var(--bp-soft)); } #budgetProfile .bp-mobile-income > span { color: var(--muted); font-size: 10px; } #budgetProfile .bp-mobile-income strong { color: var(--text); font-size: 28px; font-weight: 500; letter-spacing: -1px; line-height: 1.35; } #budgetProfile .bp-mobile-income small { font-size: 9px; } #budgetProfile .bp-mobile-connector { height: 31px; padding-top: 1px; text-align: center; color: var(--muted); font-size: 20px; line-height: 30px; } #budgetProfile .bp-mobile-destinations { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; } #budgetProfile .bp-mobile-destinations::before { content: ""; position: absolute; top: -8px; left: 25%; right: 25%; height: 8px; border: 1px solid var(--border); border-bottom: 0; } #budgetProfile .bp-mobile-destinations > div { display: grid; grid-template-columns: 6px 1fr; align-items: center; gap: 5px 6px; min-width: 0; padding: 12px 11px; border: 1px solid color-mix(in srgb, var(--bp-gold) 32%, var(--border)); border-radius: 5px; background: var(--bp-soft); } #budgetProfile .bp-mobile-destinations > div:last-child { border-color: color-mix(in srgb, var(--bp-mint) 38%, var(--border)); } #budgetProfile .bp-mobile-destinations > div > span { color: var(--muted); font-size: 10px; } #budgetProfile .bp-mobile-destinations strong { grid-column: 1 / -1; color: var(--text); font-size: clamp(18px, 5.1vw, 25px); font-weight: 500; letter-spacing: -.6px; white-space: nowrap; line-height: 1.35; } #budgetProfile .bp-mobile-destinations > div:last-child strong { color: var(--bp-mint); } #budgetProfile .bp-mobile-destinations small { grid-column: 1 / -1; font-size: 9px; } #budgetProfile .bp-flow-key { gap: 6px; margin-top: 0; } #budgetProfile .bp-flow-key button { justify-content: center; gap: 5px; min-height: 44px; padding: 7px 5px; } #budgetProfile .bp-flow-key button > span:nth-child(2) { flex: 0 1 auto; font-size: 9px; line-height: 1.5; } #budgetProfile .bp-flow-key button > span:last-child, #budgetProfile .bp-flow-key strong { display: none; } #budgetProfile .bp-insight { margin-top: 12px; min-height: 50px; font-size: 10px; } #budgetProfile .bp-plan-card { margin-top: 15px; } #budgetProfile .bp-plan-top { gap: 12px; } #budgetProfile .bp-plan-top h3 { font-size: 16px; } #budgetProfile .bp-plan-top .bp-eyebrow { font-size: 8px; letter-spacing: .9px; } #budgetProfile .bp-plan-status { font-size: 9px; padding: 3px 5px; } #budgetProfile .bp-plan-amounts { flex-direction: column; align-items: flex-start; gap: 16px; margin-top: 17px; } #budgetProfile .bp-plan-amounts > div:first-child > strong { font-size: 32px; } #budgetProfile .bp-plan-equation { justify-content: flex-start; gap: 10px 22px; max-width: none; } #budgetProfile .bp-plan-track { margin-top: 17px; } #budgetProfile .bp-plan-note { font-size: 10px; } #budgetProfile .bp-controls { display: block; padding: 20px 18px; border-radius: 6px; } #budgetProfile .bp-controls-heading { margin-bottom: 21px; } #budgetProfile .bp-controls-heading h3 { font-size: 18px; } #budgetProfile .bp-control { margin-top: 20px; } #budgetProfile .bp-control small { font-size: 11px; } #budgetProfile .bp-preset { margin-top: 20px; width: 100%; } #budgetProfile .bp-control-divider { margin-top: 25px; } #budgetProfile .bp-loan-select { margin-top: 12px; } #budgetProfile .bp-allowance-presets { margin-top: 10px; } #budgetProfile .bp-overlap-note { margin-top: 11px; } #budgetProfile .bp-details { margin-top: 15px; } #budgetProfile .bp-details summary { flex-wrap: wrap; gap: 3px 12px; padding: 13px 17px; } #budgetProfile .bp-details summary > span { order: 2; flex-basis: 100%; font-size: 9px; } #budgetProfile .bp-details summary > b { margin-left: auto; } #budgetProfile .bp-ledger { grid-template-columns: minmax(0, 1fr); gap: 22px; padding: 19px 17px; } #budgetProfile .bp-loans { margin: 0 17px; } #budgetProfile .bp-loans h3 { flex-direction: column; gap: 3px; } #budgetProfile .bp-loans [data-loan-ledger] { grid-template-columns: minmax(0, 1fr); gap: 15px; } #budgetProfile .bp-sale-note { padding: 12px 17px; } #budgetProfile .bp-footer { font-size: 9px; margin-top: 13px; } } @media (prefers-reduced-motion: reduce) { #budgetProfile *, #budgetProfile *::before, #budgetProfile *::after { animation: none !important; transition: none !important; } } #budgetProfile .bp-profile{margin:0 0 20px;border:1px solid var(--border);border-radius:7px;background:var(--panel)} #budgetProfile .bp-profile summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px 22px;min-height:44px;cursor:pointer;list-style:none} #budgetProfile .bp-profile summary::-webkit-details-marker{display:none} #budgetProfile .bp-profile summary>span:first-child{display:flex;align-items:center;gap:24px;min-width:0} #budgetProfile .bp-profile summary b{color:var(--text);font-size:14px;font-weight:550} #budgetProfile .bp-profile-totals{color:var(--muted);font-size:13px;line-height:1.5} #budgetProfile .bp-profile-totals strong{color:var(--text);font-weight:500;margin:0 4px} #budgetProfile .bp-edit-label{color:var(--accent);font-size:13px;white-space:nowrap} #budgetProfile .bp-profile form{padding:4px 22px 22px} #budgetProfile .bp-profile-help{max-width:750px;color:var(--muted);font-size:14px;line-height:1.6} #budgetProfile .bp-profile-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;max-width:760px;margin-top:18px} #budgetProfile .bp-profile-fields label{display:flex;flex-direction:column;gap:8px;font-size:14px;color:var(--text)} #budgetProfile .bp-profile-fields input{width:100%;min-width:0;padding:12px 14px;font-size:16px;line-height:1.4;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:5px} #budgetProfile .bp-profile-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:16px} #budgetProfile .bp-profile-actions button{font-size:14px;padding:10px 14px;border:1px solid var(--border);background:var(--bg);color:var(--text)} #budgetProfile .bp-profile-actions button[type="submit"]{color:var(--bg);background:var(--accent);border-color:var(--accent);font-weight:550} #budgetProfile .bp-profile-actions small{color:var(--muted);font-size:12px} #budgetProfile .bp-profile-message:empty,#budgetProfile .bp-input-error:empty{display:none} #budgetProfile .bp-profile-message,#budgetProfile .bp-input-error{margin-top:12px;font-size:13px;line-height:1.5;color:var(--signal-red,#ff8a93)} #budgetProfile .bp-control-title{gap:12px} #budgetProfile .bp-control-title label{font-size:14px} #budgetProfile .bp-control small{font-size:12px} #budgetProfile .bp-dollar{flex-shrink:0} #budgetProfile .bp-dollar input{font-size:16px} #budgetProfile .bp-profile-notes{border-top:1px solid var(--border);margin-top:20px;padding-top:16px} #budgetProfile .bp-profile-notes:empty{display:none} #budgetProfile .bp-profile-notes p{margin:0 0 9px;font-size:12px;line-height:1.6;color:var(--muted)} #budgetProfile .bp-ledger-total{border-top:1px solid var(--border);padding-top:9px;margin-top:6px;font-weight:550;color:var(--text)} #budgetProfile .bp-empty-flow{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:250px;text-align:center;padding:30px} #budgetProfile .bp-empty-flow strong{color:var(--text);font-size:18px} #budgetProfile .bp-empty-flow p{max-width:440px;font-size:14px;line-height:1.6;color:var(--muted)} #budgetProfile .bp-svg-negative{fill:var(--signal-red,#ff8a93)} body.light #budgetProfile .bp-svg-negative{fill:#bd203b} #budgetProfile [hidden]{display:none!important} @media(max-width:1100px){#budgetProfile .bp-profile summary>span:first-child{align-items:flex-start;flex-direction:column;gap:5px}} @media(max-width:680px){#budgetProfile .bp-profile summary{padding:15px;gap:12px}#budgetProfile .bp-profile summary>span:first-child{gap:5px}#budgetProfile .bp-profile-totals{display:flex;flex-wrap:wrap;gap:3px;font-size:12px}#budgetProfile .bp-profile form{padding:3px 15px 18px}#budgetProfile .bp-profile-fields{grid-template-columns:1fr;gap:14px}#budgetProfile .bp-profile-actions small{flex-basis:100%}#budgetProfile .bp-edit-label{font-size:12px}#budgetProfile .bp-control-title{flex-wrap:wrap}#budgetProfile .bp-control-title label{flex:1}} /* Stream exploration and compact, predictable scenario controls. */ #budgetProfile .bp-controls-heading h3{font-size:21px;font-weight:500;letter-spacing:-.5px} #budgetProfile .bp-control-title{gap:8px;justify-content:flex-start} #budgetProfile .bp-control-title label{flex:0 1 auto;font-size:13px} #budgetProfile .bp-help{display:grid;place-items:center;width:28px;height:28px;min-width:28px;padding:0;border:1px solid var(--bp-line);border-radius:50%;font-size:12px;color:var(--muted);background:transparent} #budgetProfile .bp-help:hover,#budgetProfile .bp-help[aria-expanded="true"]{color:var(--text);border-color:var(--accent);background:var(--bp-soft)} #budgetProfile .bp-help-note{margin:7px 0 9px;padding:10px 12px;font-size:12px;line-height:1.6;color:var(--muted);border-left:2px solid var(--accent);background:var(--bp-soft)} #budgetProfile .bp-amount-row{display:flex;gap:5px;margin-top:7px} #budgetProfile .bp-dollar{flex:1;min-width:0} #budgetProfile .bp-dollar input{width:100%;max-width:none;flex:1;padding-right:12px;appearance:textfield;-moz-appearance:textfield} #budgetProfile .bp-dollar input::-webkit-inner-spin-button,#budgetProfile .bp-dollar input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0} #budgetProfile .bp-step{width:44px;min-height:44px;padding:0;font-size:18px;background:var(--bg);color:var(--muted);border:1px solid var(--border);border-radius:5px} #budgetProfile .bp-step:hover:not(:disabled){color:var(--text);border-color:var(--accent);background:var(--bp-soft)} #budgetProfile .bp-range{height:30px;margin-top:6px} #budgetProfile .bp-range[data-range="recurringDelta"]{accent-color:var(--bp-gold)} #budgetProfile .bp-range-scale{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;font-variant-numeric:tabular-nums} #budgetProfile .bp-chart{position:relative} #budgetProfile .bp-flow-point{cursor:pointer;transition:opacity .14s ease} #budgetProfile .bp-point-hit{fill:transparent;stroke:transparent;stroke-width:1} #budgetProfile .bp-flow-point:focus-visible{outline:none} #budgetProfile .bp-flow-point:focus-visible .bp-point-hit,#budgetProfile .bp-flow-point.bp-point-active .bp-point-hit{fill:var(--bp-soft);fill-opacity:.5;stroke:var(--accent);stroke-opacity:.45} #budgetProfile .bp-flow-point:focus-visible .bp-pool,#budgetProfile .bp-flow-point.bp-point-active .bp-pool{stroke:var(--accent);stroke-width:2} #budgetProfile .bp-flow-point.bp-point-active .bp-income-ribbon{stroke-opacity:1} #budgetProfile .bp-point-dim{opacity:.32} #budgetProfile .bp-flow-point path{transition:stroke-width .16s ease} #budgetProfile .bp-flow-adjustments{display:flex;flex-wrap:wrap;gap:8px 18px;margin:4px 0 12px;color:var(--muted);font-size:11px} #budgetProfile .bp-flow-adjustments:empty{display:none} #budgetProfile .bp-flow-adjustments b{margin-left:8px;font-weight:500;color:var(--text)} #budgetProfile .bp-mobile-sources{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px} #budgetProfile .bp-mobile-sources button{display:flex;flex-direction:column;gap:5px;padding:10px 11px;text-align:left;background:var(--bp-soft);border:1px solid var(--bp-line);border-radius:5px;min-width:0;min-height:60px} #budgetProfile .bp-mobile-sources span{font-size:10px;line-height:1.4;color:var(--muted);overflow-wrap:anywhere} #budgetProfile .bp-mobile-sources strong{font-size:15px;font-weight:500;color:var(--text)} #budgetProfile .bp-mobile-income{width:100%;background:var(--bp-soft)} #budgetProfile .bp-mobile-destinations>button{display:grid;grid-template-columns:6px 1fr;align-items:center;gap:5px 6px;min-width:0;padding:12px 11px;border:1px solid color-mix(in srgb,var(--bp-gold) 32%,var(--border));border-radius:5px;background:var(--bp-soft);text-align:left} #budgetProfile .bp-mobile-destinations>button:last-child{border-color:color-mix(in srgb,var(--bp-mint) 38%,var(--border))} #budgetProfile .bp-mobile-destinations>button>span{color:var(--muted);font-size:10px} #budgetProfile .bp-mobile-destinations>button:last-child strong{color:var(--bp-mint)} #budgetProfile .bp-chart button.bp-point-active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--bp-soft))} #budgetProfile .bp-plan-track{height:15px;overflow:visible;border-radius:3px} #budgetProfile .bp-plan-track>button{display:block;flex-shrink:1;min-width:0;height:100%;min-height:15px;border:0;border-radius:2px;padding:0;transition:filter .14s ease,transform .14s ease} #budgetProfile .bp-plan-track>button:hover,#budgetProfile .bp-plan-track>button:focus-visible{filter:brightness(1.25);transform:scaleY(1.35)} #budgetProfile .bp-allocation-detail{color:var(--text);font-size:11px;line-height:1.5;margin:10px 0} #budgetProfile .bp-allocation-detail:empty{display:none} @media(max-width:680px){#budgetProfile .bp-control-title label{flex:0 1 auto}#budgetProfile .bp-help{width:32px;height:32px;min-width:32px}#budgetProfile .bp-flow-adjustments{font-size:10px}} @media(prefers-reduced-motion:reduce){#budgetProfile .bp-flow-point,#budgetProfile .bp-flow-point path,#budgetProfile .bp-plan-track>button{transition:none}} .folio-sound{position:fixed;right:20px;bottom:18px;z-index:10;display:flex;align-items:center;gap:8px;padding:5px 8px;border:1px solid var(--border);border-radius:8px;background:var(--panel);box-shadow:0 5px 20px #0003;max-width:calc(100% - 32px);font-size:12px} .folio-sound button{display:flex;align-items:center;gap:8px;background:transparent;color:var(--muted);border:0;border-radius:4px;min-height:36px;padding:0 7px;font-size:12px} .folio-sound button:hover{color:var(--text);background:var(--bg)} .folio-sound label{display:flex;align-items:center} .folio-sound input{width:62px;min-width:0;height:32px;padding:0;margin:0;background:transparent;border:0;accent-color:var(--accent)} .folio-sound .folio-sound-help{width:26px;min-height:26px;justify-content:center;border:1px solid var(--border);border-radius:50%;padding:0} .folio-sound p{position:absolute;bottom:calc(100% + 9px);right:0;width:285px;max-width:calc(100vw - 32px);padding:13px 15px;margin:0;font-size:12px;line-height:1.6;background:var(--panel);color:var(--muted);border:1px solid var(--border);border-radius:7px;box-shadow:0 5px 20px #0003} .folio-sound [hidden]{display:none!important} .folio-sound .bp-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} .folio-sound-bars{display:flex;align-items:center;gap:2px;height:14px} .folio-sound-bars i{display:block;width:2px;height:5px;background:var(--accent);border-radius:1px} .folio-sound.is-playing .folio-sound-bars i{animation:folio-sound-pulse 1s ease-in-out infinite alternate} .folio-sound.is-playing .folio-sound-bars i:nth-child(2){animation-delay:-.35s} .folio-sound.is-playing .folio-sound-bars i:nth-child(3){animation-delay:-.7s} @keyframes folio-sound-pulse{to{height:14px}} body{padding-bottom:60px} @media(max-width:680px){.folio-sound{right:16px;bottom:12px;gap:4px}.folio-sound input{width:52px}} @media(prefers-reduced-motion:reduce){.folio-sound.is-playing .folio-sound-bars i{animation:none;height:10px}} /* Put the budget first; keep supporting editors and copy compact. */ body>header.folio-budget-header{display:grid;grid-template-columns:minmax(140px,1fr) minmax(0,2fr) auto;gap:16px;padding:10px 24px;min-height:64px} .folio-budget-header .brand{min-width:0;margin:0;gap:1px} .folio-budget-header .brand strong{font-size:21px;margin:0} .folio-budget-header .brand span{font-size:9px;letter-spacing:.5px;line-height:1.4} .folio-budget-title h1{font-size:22px;line-height:1.2;letter-spacing:-.5px;font-weight:500;margin:0} .folio-budget-title>span{display:block;color:var(--muted);font-size:10px;line-height:1.4;margin-top:3px} .folio-budget-header #theme{font-size:11px;line-height:1.4;min-height:36px;padding:6px 10px} body>main{margin:12px auto 16px;padding:0 18px} #budgetProfile .bp-layout{gap:14px} #budgetProfile article{padding:15px 18px} #budgetProfile .bp-hero{gap:14px;padding-bottom:10px;align-items:center} #budgetProfile .bp-headline{font-size:42px;line-height:1.1;margin-top:3px;letter-spacing:-1.5px} #budgetProfile .bp-definition{font-size:10px;margin-top:4px} #budgetProfile .bp-change{padding-left:16px;gap:2px} #budgetProfile .bp-change strong{font-size:20px} #budgetProfile .bp-change>span:last-child{font-size:10px} #budgetProfile .bp-flow-desktop{margin:8px 0 0} #budgetProfile .bp-flow-key{margin-top:0;gap:6px} #budgetProfile .bp-flow-key button{padding:7px 10px;gap:7px;border-color:transparent} #budgetProfile .bp-flow-key button>span:nth-child(2){font-size:10px;align-self:auto} #budgetProfile .bp-flow-key strong{font-size:16px} #budgetProfile .bp-insight{min-height:18px;line-height:1.5;margin-top:5px;font-size:11px} #budgetProfile .bp-plan-card{margin-top:12px} #budgetProfile .bp-plan-top h3{font-size:16px} #budgetProfile .bp-plan-amounts{margin-top:10px;gap:12px} #budgetProfile .bp-plan-amounts>div:first-child>strong{font-size:30px;margin-top:2px} #budgetProfile .bp-plan-track{height:12px;margin:12px 0 0} #budgetProfile .bp-plan-track>button{min-height:12px} #budgetProfile .bp-plan-note{font-size:11px;margin:9px 0 0} #budgetProfile .bp-plan-note:empty{display:none} #budgetProfile .bp-allocation-detail{margin:7px 0 0} #budgetProfile .bp-details{margin-top:12px} #budgetProfile .bp-details summary{min-height:44px;padding:10px 15px} #budgetProfile .bp-controls{padding:14px 16px} #budgetProfile .bp-controls-heading{margin-bottom:8px} #budgetProfile .bp-controls-heading h3{font-size:19px} #budgetProfile .bp-control{margin-top:10px} #budgetProfile .bp-control-title{gap:7px} #budgetProfile .bp-control-title label{font-size:12px} #budgetProfile .bp-help{width:26px;height:26px;min-width:26px} #budgetProfile .bp-amount-row{margin-top:4px} #budgetProfile .bp-dollar,#budgetProfile .bp-dollar input,#budgetProfile .bp-step{height:36px;min-height:36px} #budgetProfile .bp-dollar input{font-size:16px;padding:4px 10px 4px 4px} #budgetProfile .bp-step{width:38px} #budgetProfile .bp-range{height:24px;margin-top:2px} #budgetProfile .bp-range-scale{font-size:9px;line-height:1.3} #budgetProfile .bp-control-divider{margin:15px 0 0;padding-top:10px} #budgetProfile .bp-loan-select{margin-top:8px;gap:3px} #budgetProfile .bp-loan-select select{min-height:36px;padding:5px 10px} #budgetProfile .bp-profile{margin:12px 0 0} #budgetProfile .bp-profile summary{padding:10px 15px;min-height:44px;gap:12px} #budgetProfile .bp-profile summary>span:first-child{gap:16px} #budgetProfile .bp-profile summary b{font-size:12px} #budgetProfile .bp-profile-totals{font-size:12px} #budgetProfile .bp-profile form{padding:0 15px 15px;margin:8px 0 0} #budgetProfile .bp-profile-help{font-size:12px;margin:0} #budgetProfile .bp-profile-fields{gap:14px;margin-top:10px} #budgetProfile .bp-profile-fields input{max-width:none;padding:8px 11px} #budgetProfile .bp-profile-actions{margin-top:10px} #budgetProfile .bp-footer{font-size:10px;margin:10px 0 0} #budgetProfile .bp-empty-flow{min-height:150px;padding:18px;gap:6px} @media(max-width:1050px){#budgetProfile .bp-controls{gap:12px 22px}#budgetProfile .bp-controls-heading{margin:0}#budgetProfile .bp-control{margin-top:0}} @media(max-width:680px){ body>header.folio-budget-header{grid-template-columns:minmax(0,1fr) auto;padding:9px 14px;gap:7px 10px;min-height:0} .folio-budget-header .brand{flex-direction:row;align-items:baseline;gap:10px} .folio-budget-header .brand strong{font-size:18px} .folio-budget-header .brand span{font-size:8px} .folio-budget-title{grid-column:1/-1;grid-row:2} .folio-budget-title h1{font-size:19px} .folio-budget-title>span{font-size:9px;margin-top:1px} .folio-budget-header #theme{grid-column:2;grid-row:1;font-size:10px;min-height:30px;padding:4px 8px} body>main{margin-top:9px;padding:0 10px} #budgetProfile article{padding:12px 13px} #budgetProfile .bp-hero{flex-direction:row;align-items:center;gap:10px;padding-bottom:8px} #budgetProfile .bp-headline{font-size:36px} #budgetProfile .bp-definition{max-width:225px;font-size:9px} #budgetProfile .bp-change{display:flex;flex-direction:column;align-items:flex-end;border-top:0;border-left:1px solid var(--bp-line);padding:0 0 0 10px;text-align:right} #budgetProfile .bp-change strong{font-size:17px} #budgetProfile .bp-change .bp-label{font-size:9px} #budgetProfile .bp-change>span:last-child{font-size:8px;max-width:75px} #budgetProfile .bp-flow-mobile{padding:10px 0} #budgetProfile .bp-mobile-sources{gap:5px} #budgetProfile .bp-mobile-sources button{min-height:48px;padding:7px 9px;gap:2px} #budgetProfile .bp-mobile-income{padding:9px;gap:0} #budgetProfile .bp-mobile-income strong{font-size:26px} #budgetProfile .bp-mobile-connector{height:22px;line-height:22px;font-size:16px;padding:0} #budgetProfile .bp-mobile-destinations>button{padding:9px;gap:3px 6px} #budgetProfile .bp-mobile-destinations strong{font-size:24px} #budgetProfile .bp-flow-key button{min-height:36px;padding:6px 4px} #budgetProfile .bp-flow-key button>span:nth-child(2){font-size:9px} #budgetProfile .bp-insight{min-height:17px;font-size:10px;line-height:1.5} #budgetProfile .bp-plan-amounts{flex-direction:row;align-items:flex-end;gap:10px} #budgetProfile .bp-plan-equation{justify-content:flex-end;gap:5px 10px;max-width:62%} #budgetProfile .bp-plan-equation>span{font-size:9px} #budgetProfile .bp-plan-equation b{font-size:11px} #budgetProfile .bp-plan-amounts>div:first-child>strong{font-size:28px} #budgetProfile .bp-controls{padding:12px 14px} #budgetProfile .bp-control{margin-top:10px} #budgetProfile .bp-profile summary>span:first-child{gap:3px} #budgetProfile .bp-profile-fields{gap:10px} } @media(pointer:coarse){#budgetProfile .bp-step,#budgetProfile .bp-dollar,#budgetProfile .bp-dollar input{min-height:44px;height:44px}#budgetProfile .bp-step{width:44px}#budgetProfile .bp-help{width:32px;height:32px;min-width:32px}} /* Compact workspace: cash changes and allocations occupy distinct native panels. */ #budgetProfile [hidden]{display:none!important} #budgetProfile .bp-layout{grid-template-columns:minmax(0,1fr) minmax(330px,390px);align-items:start} #budgetProfile .bp-controls{background:transparent;border:0;padding:0;display:block;position:static} #budgetProfile .bp-controls-heading{justify-content:flex-end;margin:0 0 7px;min-height:20px} #budgetProfile .bp-controls-heading h3{font-size:14px;color:var(--muted);letter-spacing:0} #budgetProfile .bp-control-group{padding:12px 14px;border:1px solid var(--border);border-radius:6px;background:var(--panel);margin-bottom:10px} #budgetProfile .bp-control-group>h3{font-size:14px;letter-spacing:0;padding-bottom:2px} #budgetProfile .bp-control-result{display:grid;grid-template-columns:1fr auto;gap:3px 7px;padding:7px 0 0;color:var(--muted);font-size:12px} #budgetProfile .bp-control-result strong{color:var(--text);font-weight:500;font-size:15px} #budgetProfile .bp-control-result small{grid-column:1/-1;font-size:12px} #budgetProfile .bp-loan-scenario{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:8px 14px;align-items:start;border-top:1px solid var(--border);padding-top:10px;margin-top:3px} #budgetProfile .bp-loan-scenario .bp-loan-select{grid-column:1;grid-row:1;margin:0;font-size:13px} #budgetProfile .bp-loan-select-heading{display:flex;justify-content:space-between;align-items:baseline;gap:5px;white-space:nowrap} #budgetProfile .bp-loan-select-heading small{font-size:10px;line-height:1.5;color:var(--bp-gold)} #budgetProfile .bp-loan-scenario .bp-control{grid-column:1;grid-row:2} #budgetProfile .bp-loan-scenario .bp-loan-impact{grid-column:2;grid-row:1/3} #budgetProfile .bp-loan-focus{padding:9px 10px;border:1px solid var(--border);border-radius:5px;background:var(--bp-soft)} #budgetProfile .bp-loan-focus .bp-loan-name{gap:6px;align-items:center;font-size:13px;overflow-wrap:anywhere} #budgetProfile .bp-loan-focus .bp-text-button{font-size:12px;min-height:26px} #budgetProfile .bp-loan-focus-balance{display:flex;flex-direction:column;gap:3px;margin:5px 0 7px;font-size:12px;color:var(--muted)} #budgetProfile .bp-loan-focus-balance strong{font-size:22px;font-weight:500;color:var(--text)} #budgetProfile .bp-timeline{display:grid;grid-template-columns:minmax(0,1fr) 10px minmax(0,1fr);align-items:center;gap:2px} #budgetProfile .bp-timeline>div{display:grid;gap:3px;font-size:10px;line-height:16px;min-width:0;white-space:nowrap} #budgetProfile .bp-timeline strong{font-size:12px;line-height:18px;min-height:18px;font-weight:500;color:var(--text);white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:-.2px} #budgetProfile .bp-term-value{display:flex;align-items:baseline;gap:1px} #budgetProfile .bp-term-number{display:inline-block;width:2ch;text-align:right;flex-shrink:0} #budgetProfile .bp-term-value small{font-size:9px;line-height:inherit;color:inherit} #budgetProfile .bp-loan-focus .bp-term-savings{display:block;min-height:18px;line-height:18px;white-space:nowrap} #budgetProfile .bp-loan-focus .bp-term-savings[aria-hidden=true]{visibility:hidden} @media(max-width:680px){#budgetProfile .bp-timeline>div{font-size:9px}#budgetProfile .bp-timeline strong{font-size:10px}#budgetProfile .bp-term-value small{font-size:8px}} #budgetProfile .bp-timeline>div:last-child strong{color:var(--bp-mint)} #budgetProfile .bp-term-bars{display:grid;gap:4px;margin:8px 0} #budgetProfile .bp-term-bars i{height:4px;border-radius:2px;background:var(--muted);width:100%;opacity:.5} #budgetProfile .bp-term-bars i:last-child{background:var(--bp-mint);opacity:1;transition:width .12s ease} #budgetProfile .bp-loan-focus>.bp-positive{font-size:12px;font-weight:500} #budgetProfile .bp-split{display:flex;flex-wrap:wrap;gap:7px 12px;margin-top:9px;font-size:12px;color:var(--muted)} #budgetProfile .bp-split span{display:grid;gap:3px} #budgetProfile .bp-split b{font-size:14px;color:var(--text);font-weight:500} #budgetProfile .bp-expense-type{display:grid;gap:6px;font-size:14px;color:var(--muted);margin-bottom:12px;max-width:280px} #budgetProfile .bp-expense-type select{width:100%;max-width:none;min-height:38px;padding:6px 9px;background:var(--bg);border:1px solid var(--border);color:var(--text);font-size:14px} #budgetProfile .bp-loan-live-preview{margin-top:12px;padding:10px 12px;border:1px solid var(--border);border-radius:5px;font-size:14px;color:var(--muted)} #budgetProfile .bp-existing-payment{font-size:14px;color:var(--muted);margin-top:10px} #budgetProfile .bp-existing-payment b{color:var(--text);margin-left:8px} #budgetProfile .bp-monthly-changes{border-left:3px solid var(--bp-blue)} #budgetProfile .bp-cash-allocations{border-left:3px solid var(--bp-mint)} #budgetProfile .bp-allocation-control-heading{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:2px} #budgetProfile .bp-allocation-control-heading h3{font-size:14px;letter-spacing:0} #budgetProfile .bp-allocation-units{width:87px;max-width:87px;min-height:28px;padding:3px 5px;border-radius:4px;font-size:11px;background:var(--bg);color:var(--muted);flex-shrink:0} #budgetProfile .bp-dollar>[data-unit-suffix]{padding:0 8px 0 2px;font-size:14px} #budgetProfile .bp-control-title label{font-size:14px} #budgetProfile .section-help,.folio-sound .section-help{position:relative;width:2em!important;height:2em;min-height:2em;min-width:2em;max-height:2em;margin-left:0;flex-shrink:0;border:1px solid var(--muted);border-radius:50%;font:600 7px/1 system-ui;color:var(--muted);background:transparent} #budgetProfile .section-help::after,.folio-sound .section-help::after{content:'';position:absolute;width:24px;height:24px;left:50%;top:50%;transform:translate(-50%,-50%)} #budgetProfile .bp-details-wrap{position:relative;margin-top:12px} #budgetProfile .bp-details-wrap .bp-details{margin-top:0} #budgetProfile .bp-details-heading{display:flex;align-items:center;gap:8px;min-width:0} #budgetProfile .bp-details summary>.bp-details-heading{order:0;flex-basis:auto;font-size:12px;color:var(--text)} #budgetProfile .bp-details-heading>[data-help-label]{font-size:12px;color:var(--text)} #budgetProfile .bp-details-notification{margin-left:3px;cursor:inherit;font-size:10px;line-height:18px;min-width:18px} #budgetProfile .bp-details-help{position:absolute;inset:44px 8px auto;max-height:min(55vh,360px);font-size:12px;padding:12px 14px;z-index:30} #budgetProfile .bp-details-help p{font-size:12px;margin:0 0 8px} #budgetProfile .bp-details-help p:last-child{margin-bottom:0} #budgetProfile [data-flow] [data-point^="source-"] .bp-svg-label,#budgetProfile [data-flow] [data-point^="source-"] .bp-svg-value{fill:var(--bp-blue)} #budgetProfile [data-flow] [data-point="recurring"] .bp-svg-output{fill:var(--bp-gold)} #budgetProfile .bp-mobile-sources span,#budgetProfile .bp-mobile-sources strong{color:var(--bp-blue)} #budgetProfile .bp-mobile-destinations>[data-point="recurring"] strong{color:var(--bp-gold)} @media(pointer:coarse){#budgetProfile .section-help::after,.folio-sound .section-help::after{width:32px;height:32px}} #budgetProfile .bp-chart-tooltip{--bp-tooltip-accent:var(--bp-blue);position:fixed;z-index:60;width:max-content;min-width:220px;max-width:290px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--bp-tooltip-accent) 35%,var(--border));border-left:3px solid var(--bp-tooltip-accent);border-radius:8px;background:color-mix(in srgb,var(--panel) 96%,var(--bp-tooltip-accent));color:var(--text);box-shadow:0 12px 32px #0004,0 0 18px color-mix(in srgb,var(--bp-tooltip-accent) 9%,transparent);max-height:calc(100dvh - 24px);overflow:auto;box-sizing:border-box;backdrop-filter:blur(10px)} #budgetProfile .bp-chart-tooltip[data-kind="recurring"]{--bp-tooltip-accent:var(--bp-gold)} #budgetProfile .bp-chart-tooltip[data-kind="cash"]{--bp-tooltip-accent:var(--bp-mint)} #budgetProfile .bp-chart-tooltip[data-kind="shortfall"]{--bp-tooltip-accent:var(--signal-red)} #budgetProfile .bp-tooltip-heading{display:flex;align-items:center;justify-content:space-between;gap:16px} #budgetProfile .bp-tooltip-heading>span{display:flex;align-items:center;gap:7px;min-width:0;overflow-wrap:anywhere;font-size:14px;line-height:1.35} #budgetProfile .bp-tooltip-heading i{display:block;flex:none;width:6px;height:6px;border-radius:50%;background:var(--bp-tooltip-accent)} #budgetProfile .bp-tooltip-heading strong{font-size:22px;line-height:1.2;font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--bp-tooltip-accent)} #budgetProfile .bp-tooltip-details{display:grid;gap:7px;margin-top:10px;padding-top:9px;border-top:1px solid var(--border)} #budgetProfile .bp-tooltip-details:empty{display:none} #budgetProfile .bp-tooltip-details>div{display:flex;justify-content:space-between;align-items:baseline;gap:18px;font-size:13px;line-height:1.4;color:var(--muted)} #budgetProfile .bp-tooltip-details b{color:var(--text);font-size:14px;font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums} #budgetProfile .bp-tooltip-breakdown{display:grid;gap:5px;margin-top:10px;padding-top:9px;border-top:1px solid var(--border);max-height:240px;overflow-y:auto} #budgetProfile .bp-tooltip-breakdown>div{display:flex;justify-content:space-between;align-items:baseline;gap:18px;font-size:12.5px;line-height:1.35;color:var(--muted)} #budgetProfile .bp-tooltip-breakdown b{color:var(--text);font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums} #budgetProfile .bp-tooltip-breakdown .bp-tooltip-breakdown-total{margin-top:3px;padding-top:6px;border-top:1px solid var(--border);color:var(--text)} #budgetProfile .bp-tooltip-note{margin:9px 0 0;font-size:12px;line-height:1.45;color:var(--muted)} #budgetProfile .bp-control{margin-top:8px} #budgetProfile .bp-help-note{font-size:14px;line-height:1.45;padding:7px 10px} #budgetProfile .bp-control-actions{display:flex;justify-content:flex-end} #budgetProfile .bp-control-actions button{min-height:34px;padding:6px 12px;font-size:14px;background:transparent;color:var(--muted);border:1px solid var(--border)} #budgetProfile .bp-dot.savings,#budgetProfile .bp-track-savings{background:var(--bp-mint)} #budgetProfile .bp-track-remaining{background:color-mix(in srgb,var(--muted) 40%,transparent)} #budgetProfile .bp-plan-top h3{font-size:16px} #budgetProfile .bp-flow-card{padding:10px} #budgetProfile .bp-hero{flex-direction:row;align-items:center;gap:12px;padding:0 4px 7px} #budgetProfile .bp-cash-heading{display:flex;align-items:center;gap:8px;flex-wrap:wrap} #budgetProfile [data-help-label]{font-size:12px} #budgetProfile .bp-cash-heading .bp-estimate{margin-left:0} #budgetProfile .bp-headline{font-size:30px;letter-spacing:-1.1px;margin:0 2px 0 4px;line-height:1.1} #budgetProfile .bp-svg-total{font-size:34px} #budgetProfile .bp-flow-adjustments{margin:2px 4px 0} #budgetProfile .bp-flow-adjustments .bp-net-positive{color:var(--signal-green,#76e8b5);text-shadow:0 0 10px color-mix(in srgb,var(--signal-green,#76e8b5) 28%,transparent)} #budgetProfile .bp-flow-adjustments .bp-net-negative{color:var(--signal-red,#ff4058);text-shadow:0 0 10px color-mix(in srgb,var(--signal-red,#ff4058) 25%,transparent)} body.light #budgetProfile .bp-flow-adjustments b{text-shadow:none} #budgetProfile .bp-chart{position:relative;margin:8px -3px 0} #budgetProfile .bp-flow-desktop{margin:0} #budgetProfile .bp-motion-toggle{position:absolute;top:0;right:0;z-index:2;width:24px;height:24px;min-height:24px;padding:0;font:12px/1 system-ui;border:1px solid var(--border);border-radius:4px;color:var(--muted);background:var(--panel);opacity:.65} #budgetProfile .bp-motion-toggle:hover,#budgetProfile .bp-motion-toggle:focus-visible{opacity:1;color:var(--accent);border-color:var(--accent)} #budgetProfile .bp-flow-wave{pointer-events:none;stroke:var(--bp-blue);opacity:0;animation:bp-flow-in 7s linear infinite;filter:drop-shadow(0 0 3px color-mix(in srgb,var(--bp-blue) 55%,transparent))} #budgetProfile .bp-wave-out{animation-name:bp-flow-out} #budgetProfile .bp-wave-recurring{stroke:var(--bp-gold);filter:drop-shadow(0 0 3px color-mix(in srgb,var(--bp-gold) 50%,transparent))} #budgetProfile .bp-wave-cash{stroke:var(--bp-mint);filter:drop-shadow(0 0 3px color-mix(in srgb,var(--bp-mint) 50%,transparent))} #budgetProfile .bp-pool-pulse{pointer-events:none;fill:none;stroke:var(--bp-blue);stroke-width:1.5;opacity:0;transform-box:fill-box;transform-origin:center;animation:bp-pool-pulse 7s ease-out infinite} #budgetProfile .bp-pulse-echo{animation-delay:.28s;stroke-width:1} #budgetProfile .bp-motion-paused .bp-flow-wave,#budgetProfile .bp-motion-paused .bp-pool-pulse,#budgetProfile .bp-motion-paused .bp-mobile-connector::after,#budgetProfile .bp-motion-paused .bp-mobile-income{animation-play-state:paused} #budgetProfile .bp-mobile-connector{position:relative;overflow:hidden} #budgetProfile .bp-mobile-connector::after{content:'';pointer-events:none;position:absolute;left:calc(50% - 2px);top:-20px;width:4px;height:15px;border-radius:4px;background:linear-gradient(transparent,var(--bp-blue));opacity:0;animation:bp-mobile-in 7s linear infinite} #budgetProfile .bp-mobile-income+.bp-mobile-connector::after{background:linear-gradient(transparent,var(--bp-mint));animation-name:bp-mobile-out} #budgetProfile .bp-mobile-income{animation:bp-mobile-pulse 7s ease-out infinite} #budgetProfile .bp-plan-top{gap:8px;flex-wrap:wrap} #budgetProfile .bp-allocation-presets{display:flex;gap:4px;margin-left:auto;flex-shrink:0} #budgetProfile .bp-allocation-presets button{min-height:27px;padding:4px 7px;border:1px solid var(--border);border-radius:4px;background:transparent;color:var(--muted);font-size:12px;line-height:1.4} #budgetProfile .bp-allocation-presets button:hover,#budgetProfile .bp-allocation-presets button[aria-pressed=true]{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel))} #budgetProfile .bp-plan-status.bp-sr{padding:0;border:0} #budgetProfile .bp-allocation-chart{position:relative;margin:8px 0 0} #budgetProfile .bp-plan-track{height:28px;margin:0;align-items:center;gap:3px} #budgetProfile .bp-plan-track>button{height:28px;min-height:28px;background:transparent;overflow:visible;transform:none;filter:none} #budgetProfile .bp-track-everyday{--account-color:var(--bp-blue)} #budgetProfile .bp-track-savings{--account-color:var(--bp-mint)} #budgetProfile .bp-track-investment{--account-color:var(--bp-purple)} #budgetProfile .bp-track-extra{--account-color:var(--bp-gold)} #budgetProfile .bp-track-remaining{--account-color:var(--muted)} #budgetProfile .bp-allocation-color{display:block;width:100%;height:12px;border-radius:2px;background:var(--account-color);transition:transform .16s ease,filter .16s ease,box-shadow .16s ease} #budgetProfile .bp-track-remaining .bp-allocation-color{opacity:.4} #budgetProfile .bp-plan-track>button:hover,#budgetProfile .bp-plan-track>button:focus-visible{transform:none;filter:none} #budgetProfile .bp-plan-track>button[aria-pressed=true] .bp-allocation-color{transform:translateY(-2px) scaleY(1.5);filter:brightness(1.12);box-shadow:0 5px 14px color-mix(in srgb,var(--account-color) 28%,transparent)} #budgetProfile .bp-allocation-tooltip{bottom:calc(100% + 4px);pointer-events:auto} #budgetProfile .bp-allocation-tooltip[data-kind=everyday]{--account-color:var(--bp-blue)} #budgetProfile .bp-allocation-tooltip[data-kind=savings]{--account-color:var(--bp-mint)} #budgetProfile .bp-allocation-tooltip[data-kind=investment]{--account-color:var(--bp-purple)} #budgetProfile .bp-allocation-tooltip[data-kind=extra]{--account-color:var(--bp-gold)} #budgetProfile .bp-allocation-tooltip[data-kind=remaining]{--account-color:var(--muted)} @media(pointer:coarse){#budgetProfile .bp-plan-track,#budgetProfile .bp-plan-track>button{height:44px;min-height:44px}} @media(prefers-reduced-motion:reduce){#budgetProfile .bp-allocation-color{transition:none}} /* One decorative cycle: sources arrive, the pool pulses, then both outputs leave. Labels, ribbons, hit targets and totals remain visible throughout every phase. */ @keyframes bp-flow-in{0%{stroke-dashoffset:15;opacity:0}5%,35%{opacity:.65}40%,100%{stroke-dashoffset:-100;opacity:0}} @keyframes bp-flow-out{0%,50%{stroke-dashoffset:15;opacity:0}55%,90%{opacity:.7}95%,100%{stroke-dashoffset:-100;opacity:0}} @keyframes bp-pool-pulse{0%,40%{transform:scale(1);opacity:0}45%{opacity:.55}50%,100%{transform:scale(1.4);opacity:0}} @keyframes bp-mobile-in{0%{transform:translateY(0);opacity:0}5%,35%{opacity:.7}40%,100%{transform:translateY(52px);opacity:0}} @keyframes bp-mobile-out{0%,50%{transform:translateY(0);opacity:0}55%,90%{opacity:.7}95%,100%{transform:translateY(52px);opacity:0}} @keyframes bp-mobile-pulse{0%,40%,50%,100%{box-shadow:0 0 0 0 transparent}45%{box-shadow:0 0 0 5px color-mix(in srgb,var(--bp-blue) 12%,transparent)}} @media(prefers-reduced-motion:reduce){#budgetProfile .bp-flow-wave,#budgetProfile .bp-pool-pulse,#budgetProfile .bp-mobile-connector::after{animation:none;opacity:0}#budgetProfile .bp-mobile-income{animation:none}} @media(max-width:680px){#budgetProfile .bp-headline{font-size:26px}#budgetProfile .bp-cash-heading{gap:6px}#budgetProfile .bp-flow-mobile{padding-top:26px}#budgetProfile .bp-allocation-presets button{min-height:30px}#budgetProfile .bp-plan-top h3{font-size:15px}} #budgetProfile .bp-plan-equation{gap:7px 14px;flex-wrap:wrap} #budgetProfile .bp-plan-equation>span{font-size:12px} #budgetProfile .bp-plan-equation b{font-size:14px} #budgetProfile [data-value=remaining].bp-cash-positive,#budgetProfile [data-remaining-percent].bp-cash-positive{color:var(--signal-green,#76e8b5)!important;text-shadow:0 0 12px color-mix(in srgb,var(--signal-green,#76e8b5) 24%,transparent)} #budgetProfile [data-value=remaining].bp-cash-negative,#budgetProfile [data-remaining-percent].bp-cash-negative{color:var(--signal-red,#ff4058)!important;text-shadow:0 0 12px color-mix(in srgb,var(--signal-red,#ff4058) 24%,transparent)} body.light #budgetProfile [data-value=remaining],body.light #budgetProfile [data-remaining-percent]{text-shadow:none} #budgetProfile .bp-remaining-percent{display:flex;justify-content:flex-end;align-items:baseline;gap:6px;margin-top:3px;font-size:11px;color:var(--muted)} #budgetProfile .bp-remaining-percent strong{font-size:13px;font-weight:500;color:var(--text)} @media(pointer:coarse){#budgetProfile .bp-allocation-units{min-height:32px}} #budgetProfile .bp-plan-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:10px} #budgetProfile .bp-plan-actions button,#budgetProfile .bp-text-button{color:var(--accent);background:transparent;border:0;border-radius:0;padding:0;min-height:32px;font-size:14px;text-align:left} #budgetProfile .bp-plan-actions button:hover,#budgetProfile .bp-text-button:hover{text-decoration:underline} #budgetProfile .bp-action-message{font-size:14px;color:var(--muted)} #budgetProfile .bp-action-message:empty{display:none} #budgetProfile .bp-loans h3{align-items:center} #budgetProfile .bp-loan-name{display:flex;align-items:center;justify-content:space-between;gap:10px} #budgetProfile .bp-loans .bp-loan-name>span{font-size:14px;color:var(--text)} #budgetProfile .bp-loans [data-loan-ledger]>div{padding:10px 12px;border:1px solid var(--border);border-radius:5px;gap:5px} #budgetProfile .bp-loans [data-loan-ledger] small{font-size:12px;line-height:1.5;color:var(--muted)} #budgetProfile .bp-loans [data-loan-ledger] .bp-target-loan{border-color:var(--bp-purple)} #budgetProfile .bp-loans [data-loan-ledger] strong{font-size:22px} #budgetProfile .bp-term-row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:13px;margin-top:4px} #budgetProfile .bp-loans .bp-term-row span{font-size:12px} #budgetProfile .bp-loan-impact{font-size:13px;color:var(--muted)} #budgetProfile .bp-loan-impact:empty{display:none} #budgetProfile .bp-baseline-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:14px} #budgetProfile .bp-baseline-columns h3{font-size:14px;margin-bottom:7px} #budgetProfile .bp-line-item{display:grid;grid-template-columns:minmax(0,1fr) 104px 32px;gap:6px;margin-bottom:6px;align-items:center} #budgetProfile .bp-line-item input,#budgetProfile .bp-loan-form-grid input,#budgetProfile .bp-payment-row input{width:100%;max-width:none;min-width:0;min-height:36px;padding:7px 9px;border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:4px;font-size:14px} #budgetProfile .bp-line-item label{min-width:0} #budgetProfile .bp-line-item button{min-height:36px;height:36px;background:transparent;color:var(--muted);padding:0;border:1px solid var(--border);font-size:20px} #budgetProfile .bp-baseline-loans{display:flex;align-items:center;gap:16px;margin-top:12px;font-size:14px} #budgetProfile .bp-profile-fields{margin-top:10px;max-width:100%;gap:16px} #budgetProfile .bp-profile-fields input[readonly]{border:0;background:transparent;padding:0;min-height:24px} #budgetProfile .bp-dialog{color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:18px;width:min(740px,calc(100vw - 28px));max-height:calc(100dvh - 32px);margin:auto;box-shadow:0 18px 60px #0006;overflow:auto} #budgetProfile .bp-dialog::backdrop{background:#0008;backdrop-filter:blur(3px)} #budgetProfile .bp-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px} #budgetProfile .bp-dialog-heading h3{font-size:18px} #budgetProfile .bp-dialog-heading button{background:transparent;border:0;color:var(--muted);width:44px;min-width:44px;height:44px;min-height:44px;flex:0 0 44px;padding:0;font-size:24px} #budgetProfile .bp-dialog-scroll{overflow:auto;max-height:55dvh} #budgetProfile .bp-bill-total{display:flex;justify-content:space-between;align-items:center;font-size:14px;padding:0 0 12px} #budgetProfile .bp-bill-total strong{font-size:22px;font-weight:500} #budgetProfile .bp-bill-row{display:grid;grid-template-columns:minmax(0,1fr) 68px 136px;align-items:center;gap:10px;border-top:1px solid var(--border);padding:10px 0} #budgetProfile .bp-bill-row b{font-size:14px;font-weight:500;overflow-wrap:anywhere} #budgetProfile .bp-bill-row small{display:block;font-size:12px;color:var(--muted);margin-top:3px} #budgetProfile .bp-bill-row strong{font-size:14px;font-weight:500;text-align:right} #budgetProfile .bp-bill-row select{max-width:none;width:100%;min-height:36px;font-size:14px;padding:5px 8px;background:var(--bg);border:1px solid var(--border);color:var(--text)} #budgetProfile .bp-dialog-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px} #budgetProfile .bp-dialog-actions button{min-height:38px;padding:8px 12px;font-size:14px;border:1px solid var(--border);background:var(--bg);color:var(--text)} #budgetProfile .bp-dialog-actions button:first-child{background:var(--accent);border-color:var(--accent);color:var(--bg)} #budgetProfile .bp-dialog-error{font-size:14px;color:var(--signal-red);margin-top:10px} #budgetProfile .bp-dialog-error:empty{display:none} #budgetProfile .bp-mini,#budgetProfile .bp-detection-help p{font-size:14px;color:var(--muted);line-height:1.5;margin-top:8px} #budgetProfile .bp-detection-help,#budgetProfile .bp-payment-details{margin-top:12px} #budgetProfile .bp-detection-help summary,#budgetProfile .bp-payment-details summary{cursor:pointer;font-size:14px;color:var(--muted)} #budgetProfile .bp-loan-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} #budgetProfile .bp-loan-form-grid label,#budgetProfile .bp-payment-row label{display:grid;gap:5px;min-width:0;font-size:14px;color:var(--muted)} #budgetProfile .bp-confirm-terms{display:flex;align-items:center;gap:8px;font-size:14px;margin-top:14px} #budgetProfile .bp-confirm-terms input{width:18px;min-width:18px;margin:0} #budgetProfile .bp-payment-row{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr) 30px;gap:7px;margin:10px 0} #budgetProfile .bp-payment-row button{align-self:end;min-height:36px;padding:0;color:var(--muted);background:transparent;border:0} @media(min-width:1200px){#budgetProfile .bp-control-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px}#budgetProfile .bp-control-group>h3,#budgetProfile .bp-loan-impact,#budgetProfile .bp-loan-select{grid-column:1/-1}#budgetProfile .bp-control{margin-top:0}#budgetProfile .bp-control-title{min-height:38px;align-items:center;gap:4px}#budgetProfile .bp-control-title label{font-size:13px;line-height:1.3}#budgetProfile .bp-step{width:28px}#budgetProfile .bp-amount-row{gap:3px}#budgetProfile .bp-dollar input{font-size:14px}#budgetProfile .bp-dollar>span{font-size:14px}#budgetProfile .bp-range-scale{font-size:11px}} @media(max-width:1050px){#budgetProfile .bp-layout{grid-template-columns:minmax(0,1fr)}#budgetProfile .bp-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px}#budgetProfile .bp-controls-heading,#budgetProfile .bp-control-actions,#budgetProfile .bp-input-error{grid-column:1/-1}#budgetProfile .bp-control-group{margin-bottom:0}#budgetProfile .bp-control{margin-top:9px}} @media(max-width:680px){#budgetProfile .bp-controls{grid-template-columns:minmax(0,1fr);gap:8px}#budgetProfile .bp-control-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px;padding:12px}#budgetProfile .bp-control-group>h3,#budgetProfile .bp-loan-select,#budgetProfile .bp-loan-impact{grid-column:1/-1}#budgetProfile .bp-control{margin-top:0}#budgetProfile .bp-control-title{min-height:44px;gap:4px;flex-wrap:nowrap}#budgetProfile .bp-control-title label{font-size:13px;line-height:1.4}#budgetProfile .bp-step{width:30px}#budgetProfile .bp-amount-row{gap:3px}#budgetProfile .bp-dollar input{font-size:14px;padding-right:4px}#budgetProfile .bp-range-scale{font-size:11px}#budgetProfile .bp-baseline-columns{grid-template-columns:minmax(0,1fr)}#budgetProfile .bp-line-item{grid-template-columns:minmax(0,1fr) 86px 30px}#budgetProfile .bp-plan-amounts{flex-direction:column;align-items:stretch}#budgetProfile .bp-plan-equation{max-width:none;justify-content:flex-start}#budgetProfile .bp-bill-row{grid-template-columns:minmax(0,1fr) 64px;gap:5px 10px}#budgetProfile .bp-bill-row select{grid-column:1/-1}#budgetProfile .bp-loan-form-grid{grid-template-columns:minmax(0,1fr)}#budgetProfile .bp-payment-row{grid-template-columns:1fr 1fr 30px}#budgetProfile .bp-payment-row label:first-child{grid-column:1/-1}#budgetProfile .bp-payment-row label{font-size:12px}} @media(pointer:coarse){#budgetProfile .bp-control-group .bp-step{min-height:44px;height:44px;width:32px}#budgetProfile .bp-dialog button,#budgetProfile .bp-dialog select,#budgetProfile .bp-line-item input{min-height:44px}} .bp-flow-view{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:12px 0}.bp-flow-view label{display:flex;align-items:center;gap:8px}.bp-flow-view select{max-width:100%;width:auto}.bp-flow-note{font-size:.85rem;line-height:1.45;color:var(--muted);margin:8px 0 14px} /* Exact chart-source inspection stays inside The Details. */ #budgetProfile .bp-income-history{padding:16px;min-width:0} #budgetProfile .bp-income-history h3{font-size:14px;margin:0 0 12px} #budgetProfile .bp-income-source{border:1px solid var(--border);border-radius:8px;margin:8px 0;scroll-margin-top:100px} #budgetProfile .bp-income-source>summary{display:flex;gap:12px;justify-content:space-between;align-items:center;padding:12px;min-height:44px;font-size:14px;cursor:pointer} #budgetProfile .bp-income-source>summary span{overflow-wrap:anywhere;min-width:0} #budgetProfile .bp-income-source>summary strong{font-size:12px;white-space:nowrap} #budgetProfile .bp-income-source p{font-size:12px;padding:0 12px;color:var(--muted);line-height:1.6} #budgetProfile .bp-source-highlight{outline:2px solid var(--accent);outline-offset:2px} #budgetProfile .bp-income-transactions{padding:0 12px 12px;overflow:auto} #budgetProfile .bp-income-transactions table{border-collapse:collapse;width:100%;font-size:12px} #budgetProfile .bp-income-transactions caption{text-align:left;color:var(--muted);padding:8px 0} #budgetProfile .bp-income-transactions th{text-align:left;padding:8px 0} #budgetProfile .bp-income-transactions td{vertical-align:top;border-top:1px solid var(--border);padding:8px 0} #budgetProfile .bp-income-transactions td:last-child,#budgetProfile .bp-income-transactions th:last-child{text-align:right;white-space:nowrap;padding-left:12px} #budgetProfile .bp-income-transactions b,#budgetProfile .bp-income-transactions small{display:block;overflow-wrap:anywhere} #budgetProfile .bp-income-transactions small{color:var(--muted);line-height:1.6} #budgetProfile .bp-income-tabs{display:flex;gap:20px;flex-wrap:wrap;margin:12px 0;font-size:14px} #budgetProfile [data-review-excluded-income],#budgetProfile .bp-income-tabs a{color:var(--accent);text-decoration:underline;display:inline-block;padding:8px 0} #budgetProfile [data-income-choice][hidden]{display:none} #budgetProfile .bp-income-dialog[open]{display:flex;flex-direction:column;overflow:hidden} #budgetProfile .bp-income-dialog>*{flex:0 0 auto} #budgetProfile .bp-income-dialog .bp-dialog-scroll{flex:1 1 auto;min-height:0;max-height:45dvh} #budgetProfile .bp-income-dialog .bp-income-tabs{margin:6px 0} #budgetProfile .bp-income-dialog [data-income-list-heading]{margin:4px 0 8px;font-size:14px} #budgetProfile .bp-income-dialog .bp-mini{margin:6px 0;font-size:12px} #budgetProfile .bp-income-dialog .bp-bill-row{grid-template-columns:minmax(0,1fr) 98px 136px} @media(max-width:680px){#budgetProfile .bp-income-dialog .bp-bill-row{grid-template-columns:minmax(0,1fr) 98px}} #budgetProfile .bp-income-dialog .bp-dialog-scroll{padding-right:8px} #budgetProfile .bp-income-source>summary{flex-wrap:nowrap} #budgetProfile .bp-income-source>summary>span{order:0;flex-basis:auto;font-size:14px;color:var(--text)} #budgetProfile .bp-income-verification{grid-column:1/-1;font-size:12px;display:flex;gap:10px;flex-wrap:wrap;align-items:center} #budgetProfile .bp-income-verification label{display:flex;gap:8px;align-items:center} #budgetProfile .bp-income-verification input[type=text]{width:120px;min-height:36px;border:1px solid var(--border);color:var(--text);background:var(--bg);padding:6px} #budgetProfile .bp-income-verification input[type=checkbox]{width:18px;height:18px;flex:none} #budgetProfile .bp-income-verification small{flex-basis:100%} #budgetProfile .bp-income-review{margin-top:14px;font-size:12px} #budgetProfile .bp-income-review summary{cursor:pointer;min-height:44px;padding:10px 0} #budgetProfile .bp-income-review div{padding:10px 0;border-top:1px solid var(--border)} #budgetProfile .bp-income-review small{display:block;color:var(--muted);margin:5px 0} #budgetProfile [data-income-amount]{overflow-wrap:anywhere;white-space:normal} #budgetProfile [data-purpose-actions]{display:flex;flex-wrap:wrap;gap:12px;margin:8px 0} #budgetProfile .bp-decision-dialog{width:min(760px,calc(100vw - 28px));max-height:calc(100dvh - 32px);overflow:auto} #budgetProfile .bp-decision-field{display:grid;gap:6px;margin:12px 0} #budgetProfile .bp-decision-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} #budgetProfile .bp-decision-fields label{display:grid;gap:6px} #budgetProfile .bp-decision-records,#budgetProfile .bp-decision-streams{max-height:260px;overflow:auto} #budgetProfile .bp-decision-choice{display:flex;gap:10px;align-items:center;min-height:44px;padding:10px 0;border-bottom:1px solid var(--bp-line)} #budgetProfile .bp-decision-choice[hidden]{display:none} #budgetProfile .bp-decision-choice input[type=checkbox]{width:20px;height:20px;flex:none} #budgetProfile .bp-decision-choice span{min-width:0;flex:1;overflow-wrap:anywhere} #budgetProfile .bp-decision-choice small{display:block} #budgetProfile .bp-decision-choice strong{white-space:nowrap} #budgetProfile .bp-decision-saved{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 0} #budgetProfile .bp-decision-saved b{flex:1} #budgetProfile .bp-decision-dialog fieldset{min-width:0;margin:14px 0;padding:10px;border:1px solid var(--bp-line);border-radius:8px} @media(max-width:480px){#budgetProfile .bp-decision-fields{grid-template-columns:1fr}#budgetProfile .bp-decision-dialog .bp-dialog-actions{flex-wrap:wrap}} #budgetProfile .bp-start-fresh{margin-top:32px;border-top:1px solid var(--bp-line);padding:20px 0 6px} #budgetProfile [data-budget-start-fresh]{border:1px solid var(--bp-line);background:var(--panel);padding:10px 18px;min-height:44px;border-radius:8px} #budgetProfile .bp-external-choice{display:flex;align-items:center;gap:7px;font-size:11px} #budgetProfile .bp-external-choice input{width:18px;height:18px} /* Contextual Details and one-question clarification, using the existing dialog. */ #budgetProfile .bp-context-source>summary{display:grid;grid-template-columns:minmax(0,1fr) auto auto;min-height:44px} #budgetProfile .bp-context-source .bp-source-status{display:block;font-size:12px;color:var(--muted);margin-top:4px} #budgetProfile .bp-context-source>summary .bp-context-action{font-size:12px;white-space:nowrap} #budgetProfile .bp-context-source>button{margin:8px 12px;min-height:44px} #budgetProfile .bp-source-evidence{margin:12px;overflow-wrap:anywhere} #budgetProfile .bp-source-evidence>summary,#budgetProfile .bp-review-entry>summary,#budgetProfile .bp-other-sources>summary,#budgetProfile .bp-monthly-changes>summary{min-height:44px;cursor:pointer;padding:12px} #budgetProfile .bp-question-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--border);padding:12px;min-width:0} #budgetProfile .bp-question-row span{min-width:0;overflow-wrap:anywhere} #budgetProfile .bp-question-row small{display:block;color:var(--muted);margin-top:4px} #budgetProfile .bp-question-row button,#budgetProfile .bp-question-dialog button,#budgetProfile .bp-question-dialog select,#budgetProfile .bp-question-dialog input{min-height:44px} #budgetProfile .bp-question-dialog{max-width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto} #budgetProfile .bp-question-dialog form{display:block;min-width:0} #budgetProfile .bp-question-dialog h3,#budgetProfile .bp-question-dialog label,#budgetProfile .bp-question-dialog p{overflow-wrap:anywhere} #budgetProfile .bp-question-dialog input,#budgetProfile .bp-question-dialog select{box-sizing:border-box;max-width:100%;width:100%} #budgetProfile .bp-question-dialog [hidden],#budgetProfile .bp-profile [hidden]{display:none!important} #budgetProfile .bp-try-change:not([open])>*:not(summary){display:none} #budgetProfile .bp-try-change>summary,#budgetProfile .bp-category-advanced>summary{min-height:44px;cursor:pointer;padding:12px} #budgetProfile .bp-context-source>summary button{min-height:44px} #budgetProfile .bp-try-change{min-width:0} #budgetProfile .bp-pending-current-income{margin:0 4px} #budgetProfile .bp-pending-current-income:empty{display:none} #budgetProfile .bp-review-deposits>summary{display:flex;align-items:center;gap:4px;min-height:44px;padding:4px 0;cursor:pointer;font-size:12px;color:var(--muted);list-style:none} #budgetProfile .bp-review-deposits>summary::before{content:'›';font-size:18px;line-height:1;transition:transform .15s ease} #budgetProfile .bp-review-deposits[open]>summary::before{transform:rotate(90deg)} #budgetProfile .bp-review-deposits>summary::-webkit-details-marker{display:none} #budgetProfile .bp-review-deposit-list{display:flex;flex-wrap:wrap;gap:6px;padding-bottom:8px} #budgetProfile .bp-pending-current-income button{display:grid;gap:3px;min-height:44px;max-width:100%;text-align:left;white-space:normal;overflow-wrap:anywhere} #budgetProfile .bp-pending-current-income button span,#budgetProfile .bp-pending-current-income button small{color:var(--muted);font-size:12px} #budgetProfile .bp-details:not([open]){padding:0;border:0;border-top:1px solid var(--bp-line);border-bottom:1px solid var(--bp-line);border-radius:0;background:transparent} #budgetProfile .bp-details:not([open])>summary{flex-wrap:nowrap;gap:8px;min-height:44px;padding:0 8px;border:0;font-size:12px} #budgetProfile .bp-details:not([open])>summary>span{order:0;flex-basis:auto;font-size:12px;color:var(--text)} #budgetProfile .bp-details:not([open])>summary>span:nth-of-type(2){display:none} @media(max-width:480px){#budgetProfile .bp-context-source>summary{grid-template-columns:minmax(0,1fr) auto;gap:8px}#budgetProfile .bp-context-source>summary .bp-context-action{grid-column:1/-1;text-align:right}#budgetProfile .bp-question-dialog{padding:14px}#budgetProfile .bp-question-dialog .bp-dialog-actions button{flex:1 1 120px}} /* Flat task list and monthly source rows share one root disclosure. */ #budgetProfile .bp-attention{margin-bottom:24px} #budgetProfile .bp-attention h3,#budgetProfile .bp-monthly-breakdown h3{font-size:15px;margin:16px 0 8px} #budgetProfile .bp-attention-scope{font-size:12px;color:var(--muted);line-height:1.5} #budgetProfile .bp-question-row{align-items:flex-start;padding:14px 0} #budgetProfile .bp-question-row .bp-task-marker{display:flex;flex:0 0 20px;align-items:center;justify-content:center;border-radius:50%;color:var(--text);border:1px solid #e88762;font-size:12px;font-weight:700;min-height:20px} #budgetProfile .bp-question-row .bp-task-copy{flex:1;min-width:0} #budgetProfile .bp-question-row button{flex:0 0 auto;white-space:normal;max-width:130px} #budgetProfile .bp-monthly-breakdown h4{font-size:12px;color:var(--muted);margin:18px 0 8px} #budgetProfile .bp-context-source{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--bp-line);font-size:13px;min-width:0} #budgetProfile .bp-context-source span{min-width:0;overflow-wrap:anywhere} #budgetProfile .bp-context-source small{display:block;color:var(--muted);font-size:12px;margin-top:4px} #budgetProfile .bp-context-source>button{margin:0;min-height:44px} #budgetProfile .bp-details-notification{font-size:11px;white-space:nowrap;width:auto;padding:3px 7px} #budgetProfile .bp-source-dialog{max-width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;overflow-wrap:anywhere} #budgetProfile .bp-source-dialog p small{display:block;color:var(--muted)} @media(max-width:480px){#budgetProfile .bp-question-row{flex-wrap:wrap;gap:8px}#budgetProfile .bp-question-row button{margin-left:28px;max-width:100%}#budgetProfile .bp-context-source{grid-template-columns:minmax(0,1fr) auto;gap:8px}#budgetProfile .bp-context-source>button{grid-column:2;justify-self:end}#budgetProfile .bp-context-source>span{grid-row:span 2}#budgetProfile .bp-context-source>strong{font-size:12px;white-space:nowrap}} #budgetProfile .bp-ledger[hidden]{display:none!important} .bp-transaction-history{margin:18px 0;border:1px solid var(--bp-line,var(--border));border-radius:14px;background:var(--panel,#fff);overflow:hidden} .bp-transaction-history>summary{padding:18px;cursor:pointer;font-weight:700} .bp-history-body{padding:0 18px 18px;min-width:0} .bp-history-filters{display:flex;align-items:end;gap:12px;flex-wrap:wrap} .bp-history-filters label{display:grid;gap:6px;min-width:0;flex:1 1 180px} .bp-history-filters input,.bp-history-filters select{width:100%;min-width:0;box-sizing:border-box;padding:10px;border:1px solid var(--border);border-radius:8px;background:var(--bg);color:var(--text);font:inherit} .bp-history-source{padding:16px 0;border-top:1px solid var(--bp-line,var(--border));min-width:0} .bp-history-heading{display:flex;align-items:center;gap:14px;flex-wrap:wrap} .bp-history-heading>span{flex:1 1 180px;min-width:0} .bp-history-heading small,.bp-history-record small{display:block;font-size:12px;color:var(--muted);overflow-wrap:anywhere} .bp-history-record,.bp-history-heading b,.bp-history-edit-record summary{overflow-wrap:anywhere} .bp-history-record{line-height:1.5} .bp-history-edit-record{border-top:1px solid var(--bp-line,var(--border));padding:12px 0} .bp-history-edit-record summary{cursor:pointer;font-weight:600} .bp-history-edit-record button{margin:4px;max-width:100%;white-space:normal} .bp-history-advanced{margin-top:20px} .bp-history-advanced>summary{cursor:pointer;padding:12px 0} .bp-history-dialog{max-width:720px;width:calc(100% - 36px);box-sizing:border-box} .bp-no-decisions{font-size:13px;color:var(--muted);margin:12px 0} .bp-profile>summary{flex-wrap:wrap} @media(max-width:480px){.bp-history-body{padding:0 12px 12px}.bp-history-filters label{flex-basis:100%}.bp-history-heading{gap:8px}.bp-history-heading>span{flex-basis:100%}.bp-history-dialog{width:calc(100% - 24px);padding:18px}} .bp-baseline-loans h3{font-size:14px;margin:0} /* "The Details" sits in the same box as the panels below it (Manually add…, Transaction history), open or closed. */ #budgetProfile .bp-details,#budgetProfile .bp-details:not([open]){padding:0;border:1px solid var(--border);border-radius:7px;background:var(--panel)} #budgetProfile .bp-details>summary,#budgetProfile .bp-details:not([open])>summary{min-height:44px;padding:10px 15px;gap:10px} #budgetProfile .bp-details>summary>.bp-details-heading,#budgetProfile .bp-details>summary>.bp-details-heading>[data-help-label]{font-size:16px;color:var(--text)} #budgetProfile .bp-details-help{inset:52px 8px auto} /* Loan card sits under the Loan list and its slider, full width, so terms and payoff read clearly. */ #budgetProfile .bp-loan-scenario{grid-template-columns:minmax(0,1fr)} #budgetProfile .bp-loan-scenario .bp-loan-select,#budgetProfile .bp-loan-scenario .bp-control,#budgetProfile .bp-loan-scenario .bp-loan-impact{grid-column:1;grid-row:auto} #budgetProfile .bp-loan-focus .bp-loan-name{display:flex;justify-content:space-between} #budgetProfile .bp-loan-facts{display:flex;flex-wrap:wrap;gap:4px 14px;margin:6px 0 9px;font-size:12px;color:var(--muted)} #budgetProfile .bp-loan-facts b{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums} #budgetProfile .bp-timeline>div small{font-size:10px;color:var(--muted);white-space:nowrap} #budgetProfile .bp-loan-terms{margin-top:9px;border-top:1px solid var(--border);padding-top:7px} #budgetProfile .bp-loan-terms summary{cursor:pointer;font-size:12px;color:var(--bp-gold);min-height:28px;display:flex;align-items:center} #budgetProfile .bp-loan-terms form{display:grid;gap:7px;margin-top:6px} #budgetProfile .bp-loan-terms-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px} #budgetProfile .bp-loan-terms label{display:grid;gap:3px;font-size:11px;color:var(--muted)} #budgetProfile .bp-loan-terms input{min-height:36px;padding:5px 9px;border-radius:5px;border:1px solid var(--border);background:var(--bg);color:var(--text);font-size:14px} #budgetProfile .bp-loan-terms .bp-terms-save{justify-self:start;min-height:36px;padding:0 16px} #budgetProfile .bp-loan-terms .bp-mini{margin:0;font-size:12px;color:var(--muted)} /* The Details: group headings (Income → Loans → Recurring expenses) with how many and how much. */ #budgetProfile .bp-monthly-breakdown h4.bp-breakdown-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:26px 0 6px;padding-bottom:6px;border-bottom:1px solid var(--bp-line);font-size:15px;font-weight:700;letter-spacing:-.15px;color:var(--text)} #budgetProfile .bp-monthly-breakdown .bp-breakdown-group:first-of-type h4.bp-breakdown-heading{margin-top:14px} #budgetProfile .bp-breakdown-heading small{font-size:12px;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap} /* "Action needed" chips above The Details. */ #budgetProfile .bp-action-bar{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px} /* Loan payment updates from the bank: informational notices above The Details (not "Action needed"). */ #budgetProfile .bp-sync-notices{display:grid;gap:8px;margin:0 0 10px} #budgetProfile .bp-sync-notices[hidden]{display:none} #budgetProfile .bp-sync-notice{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:4px 10px;padding:8px 8px 8px 12px;border:1px solid color-mix(in srgb,var(--bp-blue) 38%,var(--border));border-radius:10px;background:color-mix(in srgb,var(--bp-blue) 8%,var(--panel));color:var(--text);font-size:13px;line-height:1.4} #budgetProfile .bp-sync-icon{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:color-mix(in srgb,var(--bp-blue) 18%,transparent);color:var(--bp-blue);font-size:14px;font-weight:700} #budgetProfile .bp-sync-copy{margin:0;min-width:0;overflow-wrap:anywhere} #budgetProfile .bp-sync-copy b{font-weight:650;font-variant-numeric:tabular-nums} #budgetProfile .bp-sync-actions{display:flex;align-items:center;gap:2px} #budgetProfile .bp-sync-actions .bp-text-button{min-height:44px;padding:0 10px;font-size:13px;font-weight:650;color:var(--accent)} #budgetProfile .bp-sync-close{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--muted);font:inherit;font-size:20px;line-height:1;cursor:pointer} #budgetProfile .bp-sync-close:hover{background:color-mix(in srgb,var(--bp-blue) 12%,transparent);color:var(--text)} #budgetProfile .bp-sync-notice button:focus-visible{outline:2px solid var(--accent);outline-offset:1px} #budgetProfile .bp-sync-notice button:disabled{opacity:.55;cursor:progress} #budgetProfile .bp-sync-error{grid-column:2/-1;font-size:12px;font-weight:600;color:var(--chart-red,#ff947f)} #budgetProfile .bp-sync-error:empty{display:none} #budgetProfile .bp-loan-detail-copy .bp-loan-sync-line{color:var(--bp-blue);font-weight:600} @media(max-width:600px){#budgetProfile .bp-sync-notice{grid-template-areas:"icon copy close" ". undo undo" ". err err";align-items:start;gap:0 8px;padding:8px 2px 0 12px}#budgetProfile .bp-sync-actions{display:contents}#budgetProfile .bp-sync-icon{grid-area:icon;margin-top:2px}#budgetProfile .bp-sync-copy{grid-area:copy;padding-top:4px}#budgetProfile .bp-sync-close{grid-area:close;margin-top:-6px}#budgetProfile .bp-sync-actions .bp-text-button{grid-area:undo;justify-self:start;margin-left:-10px}#budgetProfile .bp-sync-error{grid-area:err;padding-bottom:8px}} /* Loan details rows and their inline form. */ #budgetProfile article.bp-loan-detail{padding:12px 14px;font-size:13px;scroll-margin:90px} #budgetProfile .bp-loan-detail-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px} #budgetProfile .bp-loan-detail-copy{min-width:0;overflow-wrap:anywhere} #budgetProfile .bp-loan-detail-copy small{display:block;margin-top:3px;font-size:12px;color:var(--muted)} #budgetProfile .bp-loan-detail-copy .bp-loan-missing{color:var(--bp-gold);font-weight:600} #budgetProfile .bp-loan-detail-copy .bp-loan-saved{color:var(--bp-mint);font-weight:650} #budgetProfile .bp-loan-detail-row>strong{font-variant-numeric:tabular-nums;white-space:nowrap} #budgetProfile .bp-loan-detail-actions{display:flex;align-items:center;gap:14px;justify-content:flex-end} #budgetProfile .bp-loan-detail-actions .bp-text-button{font-size:13px;min-height:44px;white-space:nowrap} #budgetProfile .bp-loan-add{min-height:40px;padding:0 14px;border-radius:8px;border:1px solid color-mix(in srgb,var(--bp-gold) 65%,var(--border));background:color-mix(in srgb,var(--bp-gold) 14%,var(--panel));color:var(--text);font-size:13px;font-weight:650;white-space:nowrap;cursor:pointer} #budgetProfile .bp-loan-add:hover{background:color-mix(in srgb,var(--bp-gold) 22%,var(--panel))} #budgetProfile .bp-loan-form{display:grid;gap:12px;margin:12px 0 4px;padding:14px;border:1px solid var(--bp-line);border-radius:10px;background:var(--bp-soft)} #budgetProfile .bp-loan-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 14px} #budgetProfile .bp-loan-field{display:grid;gap:4px;align-content:start;min-width:0;font-size:12px;color:var(--muted)} #budgetProfile .bp-loan-field>span{color:var(--text);font-weight:600} #budgetProfile .bp-loan-field>span small{font-weight:400;color:var(--muted)} #budgetProfile .bp-loan-field input,#budgetProfile .bp-loan-field select{width:100%;min-height:42px;padding:7px 10px;border-radius:7px;border:1px solid var(--border);background:var(--bg);color:var(--text);font:inherit;font-size:15px;font-variant-numeric:tabular-nums} #budgetProfile .bp-loan-field input:focus-visible,#budgetProfile .bp-loan-field select:focus-visible{outline:2px solid var(--accent);outline-offset:1px} #budgetProfile .bp-loan-field input[aria-invalid="true"]{border-color:var(--chart-red,#ff947f)} #budgetProfile .bp-loan-hint{font-size:11.5px;line-height:1.35;color:var(--muted)} #budgetProfile .bp-field-error{font-size:12px;line-height:1.35;color:var(--chart-red,#ff947f);font-weight:600} #budgetProfile .bp-field-error:empty{display:none} #budgetProfile .bp-loan-escrow{display:contents} #budgetProfile .bp-loan-escrow[hidden]{display:none!important} #budgetProfile .bp-loan-optional{border:0;margin:0} #budgetProfile .bp-loan-optional>summary{display:list-item;min-height:32px;padding:4px 0;font-size:12.5px;color:var(--accent);cursor:pointer;list-style:revert} #budgetProfile .bp-loan-optional>summary::-webkit-details-marker{display:revert} #budgetProfile .bp-loan-optional[open]>.bp-loan-form-grid{margin-top:8px} #budgetProfile .bp-loan-preview{padding:12px 14px;border-radius:8px;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--bp-line));background:color-mix(in srgb,var(--accent) 6%,var(--panel))} #budgetProfile .bp-loan-preview h5{margin:0 0 8px;font-size:12px;font-weight:700;color:var(--text);letter-spacing:.2px} #budgetProfile .bp-loan-preview h5 small{font-weight:500;color:var(--muted)} #budgetProfile .bp-loan-preview-grid{display:grid;grid-template-columns:minmax(0,1.7fr) repeat(3,minmax(0,1fr));gap:10px 16px;margin:0} #budgetProfile .bp-loan-preview-grid dt{font-size:11px;color:var(--muted)} #budgetProfile .bp-loan-preview-grid dd{margin:2px 0 0;font-size:13px;font-variant-numeric:tabular-nums} #budgetProfile .bp-loan-preview-grid dd b{font-size:15px} #budgetProfile .bp-loan-preview-empty{margin:0;font-size:12.5px;color:var(--muted)} #budgetProfile .bp-loan-preview-warn{margin:0;font-size:13px;font-weight:600;color:var(--chart-red,#ff947f)} #budgetProfile .bp-loan-form .bp-dialog-error{margin:0} #budgetProfile .bp-loan-form .bp-dialog-error:empty{display:none} #budgetProfile .bp-loan-form-actions{display:flex;align-items:center;gap:18px} #budgetProfile .bp-loan-save{min-height:44px;padding:0 20px;border-radius:8px;background:var(--accent);color:var(--bg);border:0;font-weight:700;cursor:pointer} #budgetProfile .bp-loan-save:disabled{opacity:.6;cursor:progress} /* Slider card: terms now live in The Details. */ #budgetProfile .bp-loan-terms-missing{display:grid;gap:8px;margin-top:9px;padding-top:9px;border-top:1px solid var(--border)} #budgetProfile .bp-loan-terms-missing p{margin:0;font-size:12.5px;color:var(--text)} #budgetProfile .bp-loan-terms-missing .bp-loan-add{justify-self:start;min-height:38px} @media(max-width:760px){#budgetProfile .bp-loan-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#budgetProfile .bp-loan-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#budgetProfile .bp-loan-preview-grid>div:first-child{grid-column:1/-1}} @media(max-width:480px){#budgetProfile article.bp-loan-detail{padding:12px}#budgetProfile .bp-loan-detail-row{grid-template-columns:minmax(0,1fr) auto}#budgetProfile .bp-loan-detail-actions{grid-column:1/-1;justify-content:flex-start;flex-wrap:wrap}#budgetProfile .bp-loan-form{padding:12px}#budgetProfile .bp-loan-form-grid{grid-template-columns:minmax(0,1fr);gap:10px}#budgetProfile .bp-monthly-breakdown h4.bp-breakdown-heading{font-size:14.5px}} /* Phones: a question's text keeps the row's width; its button wraps beneath it. */ @media(max-width:480px){#budgetProfile .bp-question-row .bp-task-copy{flex:1 1 calc(100% - 40px)}} /* Steppers: ▲ ▼ like Wealth-Calc's. */ #budgetProfile .bp-step{font-size:11px} /* Money in reads as a plus, in the same green as the rest of Budget's good news. */ .bp-deposit-amount{color:var(--signal-green,#76e8b5);font-weight:600;white-space:nowrap} body.light .bp-deposit-amount{color:var(--return-gain)} #budgetProfile .bp-feeds-behind{margin:4px 0 0;font-size:12px;color:var(--muted)} #budgetProfile .bp-income-question{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;margin:12px 0 0;padding:10px 12px;border:1px solid color-mix(in srgb,var(--chart-gold,#b9861f) 55%,var(--border));border-radius:8px;background:color-mix(in srgb,var(--chart-gold,#b9861f) 8%,var(--panel))} #budgetProfile .bp-income-question[hidden]{display:none} .bp-estimate-note{display:flex;align-items:baseline;gap:10px;margin-top:2px} /* Deposits outside a source's headline: a small label, so the main list is the one that adds up. */ .bp-records-aside{margin:16px 0 4px;font-size:12px;font-weight:600;color:var(--muted)} #budgetProfile .bp-income-question p{margin:0;font-size:14px;line-height:1.4;color:var(--text)} #budgetProfile .bp-income-question b{font-weight:550} #budgetProfile .bp-income-question small{display:block;margin-top:2px;font-size:12px;color:var(--muted)} #budgetProfile .bp-income-answers{flex:0 0 auto;display:flex;gap:8px} #budgetProfile .bp-income-answers button{min-width:64px;min-height:36px;padding:6px 14px} @media(max-width:600px){#budgetProfile .bp-income-question{flex-direction:column;align-items:stretch}#budgetProfile .bp-income-answers button{flex:1;min-height:40px}} #budgetProfile [data-move-question] .bp-dialog-actions{flex-wrap:wrap}