:root { --ink:#17251f; --muted:#66736d; --green:#28634d; --green-dark:#173f32; --line:#dce5df; --paper:#f4f6f3; --white:#fff; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial, Helvetica, sans-serif; }
body.modal-open { overflow:hidden; }
button, input, select { font:inherit; }
button { cursor:pointer; }
.login-page { min-height:100vh; width:100%; padding:32px 18px; display:grid; place-items:center; background:radial-gradient(circle at top,#e5f0e9 0,#f4f6f3 52%); }
.login-card { width:min(430px,100%); padding:38px; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:0 24px 70px #193d2d20; }
.login-brand { width:48px; height:48px; margin-bottom:24px; border-radius:14px; display:grid; place-items:center; background:var(--green-dark); color:#fff; font:700 25px Georgia,serif; }
.login-card h1 { margin:8px 0 12px; font:700 34px/1.08 Georgia,serif; letter-spacing:-.025em; }
.login-card>p { margin:0 0 24px; color:var(--muted); line-height:1.55; }
.login-error { margin-bottom:18px; padding:11px 13px; border:1px solid #efc4bb; border-radius:9px; background:#fff1ee; color:#8f3324; font-size:13px; }
.login-form { display:grid; gap:17px; }
.password-field { position:relative; display:block; }
.password-field input { padding-right:48px; }
.password-field button { position:absolute; top:50%; right:7px; width:34px; height:34px; padding:0; transform:translateY(-50%); border:0; border-radius:8px; background:#edf3ef; color:var(--green-dark); font-size:18px; line-height:1; }
.password-field button:hover { background:#dfece5; }
.login-form .primary { width:100%; margin-top:5px; }
.login-form label small { color:var(--muted); font-size:11px; font-weight:400; line-height:1.4; }
.wallet-operations-toggle { min-height:50px; padding:9px 12px; display:grid!important; grid-template-columns:auto minmax(0,1fr)!important; grid-template-rows:auto auto; align-items:center; gap:2px 9px; border:1px solid var(--line); border-radius:9px; background:#f7faf8; color:var(--green-dark)!important; cursor:pointer; transition:opacity .16s ease,background .16s ease; }
.wallet-operations-toggle input { grid-row:1/3; width:18px!important; height:18px!important; min-height:0!important; margin:0; accent-color:#247654; }
.wallet-operations-toggle span { font-size:13px; font-weight:800; line-height:1.3; }
.wallet-operations-toggle small { grid-column:2; }
.wallet-operations-toggle.is-disabled { opacity:.52; background:#f1f3f2; cursor:not-allowed; }
.account-modal-backdrop { position:fixed; inset:0; z-index:100; padding:20px; display:grid; place-items:center; background:#102f26a8; backdrop-filter:blur(4px); }
#expense-breakdown-modal { z-index:120; }
.account-modal { position:relative; width:min(430px,100%); max-height:calc(100vh - 40px); overflow-y:auto; padding:34px 38px 38px; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:0 28px 90px #102f2655; }
.account-modal h2 { margin:8px 0 24px; font:700 34px/1.08 Georgia,serif; letter-spacing:-.025em; }
.modal-close { position:absolute; top:13px; right:14px; width:34px; height:34px; border:0; border-radius:50%; background:#f0f4f1; color:#52615a; font-size:24px; line-height:1; }
.register-link { width:100%; margin-top:17px; padding:5px; border:0; background:transparent; color:var(--green); text-decoration:underline; font-weight:700; }
.registration-success { display:grid; gap:12px; padding:18px; border-radius:12px; background:#edf6f1; color:var(--green-dark); }
.registration-success b { font:700 21px Georgia,serif; }
.registration-success span { color:var(--muted); font-size:13px; line-height:1.5; }
.login-form button:disabled { opacity:.65; cursor:wait; }
.app-shell { min-height:100vh; display:flex; flex-direction:column; }
.topbar { height:76px; background:#fff; border-bottom:1px solid var(--line); display:flex; align-items:center; padding:0 4vw; gap:4vw; position:sticky; top:0; z-index:20; }
.brand { border:0; background:none; display:flex; align-items:center; gap:10px; font-size:20px; font-weight:750; color:var(--ink); }
.brand span { width:34px; height:34px; border-radius:11px; display:grid; place-items:center; background:var(--green-dark); color:#fff; font-family:Georgia,serif; }
nav { display:flex; align-self:stretch; gap:8px; position:absolute; left:50%; top:0; bottom:0; transform:translateX(-50%); }
nav button { border:0; background:transparent; padding:0 18px; color:#65716c; position:relative; }
nav button.active { color:var(--green-dark); font-weight:700; }
nav button.active:after { content:""; position:absolute; left:18px; right:18px; height:3px; bottom:0; border-radius:2px; background:var(--green); }
.account-wrap { position:relative; margin-left:auto; }
.account { background:#f2f6f3; border:1px solid #e1e8e3; border-radius:24px; padding:7px 13px 7px 8px; display:flex; gap:9px; align-items:center; color:var(--ink); }
.account-menu { position:absolute; top:calc(100% + 8px); right:0; z-index:30; width:150px; padding:5px; border:1px solid var(--line); border-radius:10px; background:#fff; box-shadow:0 12px 32px #173f3226; }
.account-menu a,.account-menu button { width:100%; min-height:36px; padding:8px 11px; display:flex; align-items:center; border:0; border-radius:7px; background:transparent; color:var(--ink); text-decoration:none; font-size:13px; text-align:left; }
.account-menu a:hover,.account-menu button:hover { background:#edf4f0; color:var(--green-dark); }
.avatar { width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:#d9e8df; font-size:11px; font-weight:800; }
.demo-banner { min-height:42px; padding:8px 4vw; display:flex; align-items:center; justify-content:center; gap:16px; background:#fff5d9; color:#6f581d; font-size:13px; border-bottom:1px solid #f0dfa6; }
.demo-banner b { text-transform:uppercase; font-size:11px; letter-spacing:.08em; background:#f4d66f; border-radius:5px; padding:5px 8px; }
.demo-banner button { border:0; background:transparent; text-decoration:underline; font-weight:700; color:#5e4811; }
main { width:min(1440px, 94vw); margin:0 auto; padding:22px 0 80px; flex:1 0 auto; }
.page-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:28px; }
.page-heading h1 { margin:6px 0 8px; font:700 clamp(34px,4vw,50px)/1.06 Georgia,serif; letter-spacing:-.035em; }
.page-heading p { margin:0; color:var(--muted); max-width:720px; line-height:1.6; }
.eyebrow { color:var(--green); text-transform:uppercase; letter-spacing:.12em; font-size:11px; font-weight:800; }
.eyebrow.light { color:#b8d4c7; }
.primary,.secondary,.ghost { border-radius:10px; padding:12px 17px; font-weight:700; border:1px solid transparent; }
.primary { color:#fff; background:var(--green-dark); }
.secondary { background:#fff; color:var(--green-dark); border-color:var(--line); }
.ghost { background:transparent; color:var(--muted); border-color:var(--line); }
.wallet-card { min-height:108px; padding:17px 30px; color:#fff; border-radius:18px; display:grid; grid-template-columns:1.7fr .7fr .7fr auto; align-items:center; gap:24px; background:linear-gradient(120deg,#173d31,#285f4d); box-shadow:0 14px 38px #193d2d20; }
.wallet-card>div:first-child { display:flex; flex-direction:column; gap:3px; }
.wallet-credit-total { margin-bottom:5px; display:flex; align-items:center; flex-wrap:wrap; gap:5px 10px; }
.wallet-credit-total>span { color:#d6e7df; font-size:11px; font-weight:700; }
.wallet-credit-total>b { color:#fff; font-size:14px; }
.wallet-credit-total label { flex-direction:row; align-items:center; gap:5px; color:#d6e7df; font-size:10px; white-space:nowrap; cursor:pointer; }
.wallet-credit-total input[type="checkbox"] { width:15px; height:15px; margin:0; accent-color:#e3f0e9; }
.wallet-balance-line { display:flex; align-items:center; gap:7px; }
.wallet-edit { width:22px; height:22px; padding:0!important; display:grid; place-items:center; flex:0 0 22px; border:1px solid #ffffff45!important; border-radius:6px!important; background:#ffffff14!important; color:#fff!important; font-size:13px; }
.wallet-card strong { font:700 32px Georgia,serif; line-height:1.05; transition:color .16s ease,transform .16s ease; }
.wallet-card strong.is-projected { color:#ffe29a; transform:translateX(2px); }
.wallet-card small { color:#bad0c5; }
.wallet-stat { border-left:1px solid #ffffff2e; padding-left:24px; display:flex; flex-direction:column; gap:3px; }
.wallet-stat span { color:#b9cdc4; font-size:12px; }
.wallet-card .wallet-stat-button { min-width:0; padding:9px 12px 9px 24px; align-items:flex-start; border:0; border-left:1px solid #ffffff2e; border-radius:0; background:transparent; color:#fff; text-align:left; }
.wallet-card .wallet-stat-button:hover,.wallet-card .wallet-stat-button:focus-visible { border-radius:9px; background:#ffffff12; outline:1px solid #ffffff30; }
.wallet-stat-button b { color:#fff; }
.wallet-card button { color:#163c2f; border:0; background:#e3f0e9; border-radius:10px; padding:11px 16px; font-weight:800; }
.timeline-note { height:34px; display:flex; gap:9px; align-items:center; color:#7b8781; font-size:12px; }
.timeline-note span { width:8px; height:8px; background:#bd523d; border-radius:50%; }
.timeline-note i { margin-left:auto; font-style:normal; }
.table-stack { border:1px solid var(--line); border-radius:16px; background:#fff; overflow:hidden; }
.finance-row { display:grid; grid-template-columns:minmax(245px,30%) 1fr; min-height:152px; border-bottom:1px solid var(--line); }
.finance-row.compact-row { min-height:88px; }
.finance-row.finance-section { min-height:88px; }
.finance-row:last-child { border-bottom:0; }
.row-info { padding:22px 25px; border-right:1px solid var(--line); position:relative; overflow:hidden; }
.compact-row .row-info { padding:0; }
.row-info:before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:#76ae92; }
.amber .row-info:before { background:#d5a94d; }.rose .row-info:before { background:#d88474; }.violet .row-info:before { background:#8d7ab7; }
.row-info-main { min-width:0; }
.bank-row-info { padding:0; }
.bank-section-heading,.simple-section-heading { height:44px; padding:0 18px 0 25px; display:flex; align-items:center; border-bottom:1px solid var(--line); }
.bank-section-heading h3,.simple-section-heading h3 { margin:0; font-size:20px; }
.section-toggle { width:100%; height:100%; padding:0; display:flex; align-items:center; gap:9px; border:0; background:transparent; color:var(--ink); text-align:left; }
.section-toggle>span { width:14px; color:var(--green-dark); font-size:11px; }
.finance-row.is-collapsed { min-height:88px; }
.finance-row.is-collapsed .finance-detail-list,.finance-row.is-collapsed .bank-credit-table,.finance-row.is-collapsed .finance-detail-amount { display:none; }
.section-delete-button { padding:4px 7px; border:1px solid #d8a69d; border-radius:6px; background:#fff8f6; color:#9b3e2e; font-size:10px; font-weight:700; }
.mint .simple-section-heading { background:#dff1e7; }
.rose .simple-section-heading { background:#dfeaf8; }
.violet .simple-section-heading { background:#fff2c7; }
.simple-section-body { min-height:107px; padding:22px 25px; }
.compact-row .simple-section-body { min-height:44px; padding:0 25px; display:flex; align-items:center; }
.total-row-label { font-size:12px; }
.finance-section .row-info { padding:0; }
.finance-entry-list { display:flex; flex-direction:column; }
.finance-entry-list:after,.bank-row-info:after { content:""; display:block; height:10px; min-height:10px; flex:0 0 10px; background:#f5f8f6; }
.finance-detail-list { display:flex; flex-direction:column; }
.finance-data-line,.finance-add-line { height:44px; min-height:44px; flex:0 0 44px; padding:0 18px 0 25px; display:flex; align-items:center; border-bottom:1px solid #edf0ee; }
.finance-add-line { gap:12px; }
.finance-data-line { font-size:12px; font-weight:700; }
.finance-data-button { width:100%; border:0; background:#fff; color:var(--ink); text-align:left; cursor:pointer; }
.finance-income-name { min-width:0; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.income-section-heading { padding:0; display:grid; grid-template-columns:7fr 3fr; }
.income-section-heading .section-toggle { padding:0 18px 0 25px; }
.income-balance-title { height:100%; padding:0 12px; display:flex; align-items:center; border-left:1px solid var(--line); background:#fffcf4; color:#52615a; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.06em; }
.income-finance-pair { min-height:44px; display:grid; grid-template-columns:7fr 3fr; }
.income-finance-pair .finance-data-line { min-width:0; }
.income-debt-balance { min-width:0; height:44px; padding:0 12px; display:flex; align-items:center; border-bottom:1px solid #edf0ee; border-left:1px solid var(--line); background:#fffcf4; }
.income-debt-balance b { color:#7d5e16; font-size:11px; white-space:nowrap; transition:color .16s ease,transform .16s ease; }
.income-debt-balance b.is-projected { color:#174b39; transform:translateX(2px); }
.finance-data-button:hover { background:#eef6f1; color:var(--green-dark); }
.finance-add-line { border-bottom:0; }
.finance-total-label { height:44px; min-height:44px; flex:0 0 44px; padding:0 18px 0 25px; display:flex; align-items:center; border-top:1px solid var(--line); background:#f5f8f6; font-size:12px; font-weight:800; }
.bank-credit-table { display:grid; grid-template-columns:7fr 3fr; }
.bank-credit-column-title { padding:12px 12px 4px 25px; }
.bank-credit-column-title.balance-title { padding-left:12px; border-left:1px solid var(--line); background:#fffcf4; }
.bank-credit-pair { display:contents; }
.bank-credit-name,.bank-credit-balance { min-height:48px; margin:0; padding:8px 12px 8px 25px; display:flex; flex-direction:column; justify-content:center; gap:3px; }
.bank-credit-link { width:100%; border:0; border-radius:0; background:#fff; color:var(--ink); text-align:left; cursor:pointer; }
.bank-credit-link:hover { background:#eef6f1; color:var(--green-dark); }
.bank-credit-balance { padding-left:12px; border-left:1px solid var(--line); background:#fffcf4; }
.bank-credit-name b,.bank-credit-balance b { font-size:12px; line-height:1.25; }
.bank-credit-name span,.bank-credit-balance span { color:var(--muted); font-size:10px; }
.bank-credit-balance b { color:#7d5e16; white-space:nowrap; transition:color .16s ease,transform .16s ease; }
.bank-credit-balance b.is-projected { color:#174b39; transform:translateX(2px); }
.bank-add-button { margin:2px 12px 14px 25px; justify-self:start; }
.bank-balance-spacer { border-left:1px solid var(--line); background:#fffcf4; }
.row-info h3 { margin:7px 0; font:700 20px Georgia,serif; }
.row-info p { margin:0 0 13px; font-size:12px; color:var(--muted); line-height:1.45; }
.text-button { border:0; padding:0; background:none; color:var(--green); font-size:12px; font-weight:700; }
.calendar-clip { overflow-x:auto; overflow-y:hidden; scrollbar-gutter:stable; overscroll-behavior-inline:contain; contain:paint; border-left:3px solid #bd523d; }
.calendar-clip::-webkit-scrollbar { height:10px; }
.calendar-clip::-webkit-scrollbar-track { background:#eef2ef; }
.calendar-clip::-webkit-scrollbar-thumb { background:#9eaaa4; border:2px solid #eef2ef; border-radius:10px; }
.calendar-frame { width:max-content; min-width:100%; height:100%; display:flex; flex-direction:column; }
.calendar-month-strip { width:max-content; min-width:100%; height:22px; flex:0 0 22px; display:flex; background:#edf3ef; border-bottom:1px solid var(--line); }
.calendar-month { position:relative; height:22px; flex:0 0 auto; display:block; border-right:1px solid #cfdcd5; color:var(--green-dark); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.07em; }
.calendar-month span { position:sticky; left:8px; width:max-content; height:22px; margin:0; padding:0 7px; display:flex; align-items:center; justify-content:flex-start; white-space:nowrap; }
.calendar-month.calendar-month-tone-0 { background:#dfeee6; }
.calendar-month.calendar-month-tone-1 { background:#f4e5c4; }
.calendar-month-add-spacer { width:50px; flex:0 0 50px; background:#e3eee8; }
.calendar { width:max-content; min-width:100%; display:flex; flex:1 1 auto; min-height:0; }
.day-cell { width:95px; border-right:1px solid #edf0ee; background:#fff; flex:0 0 auto; position:relative; }
.day-cell.weekend { background:#f7f3ec; }
.day-cell.calendar-month-tone-0 { background:#f8fcfa; }
.day-cell.calendar-month-tone-1 { background:#fff9ee; }
.day-cell.weekend.calendar-month-tone-0 { background:#edf6f1; }
.day-cell.weekend.calendar-month-tone-1 { background:#f8edda; }
.day-cell.calendar-month-start { border-left:3px solid #b3832f; }
.finance-value-cell { position:relative; }
.finance-value-cell[data-finance-kind="expense"],.finance-value-cell[data-finance-kind="income"] { transition:box-shadow .14s ease,background-color .14s ease,opacity .14s ease; }
.finance-value-cell[data-finance-kind="expense"].is-selected,.finance-value-cell[data-finance-kind="income"].is-selected { z-index:2; box-shadow:inset 0 0 0 2px #23664f; }
.finance-value-cell[data-finance-cell-drag="1"] { cursor:grab; }
.finance-value-cell[data-finance-cell-drag="1"]:active { cursor:grabbing; }
.finance-value-cell.is-dragging,.finance-value-cell.is-moving { opacity:.46; }
.finance-value-cell.is-drop-target { z-index:3; background:#e4f3ec; box-shadow:inset 0 0 0 3px #2d8061; }
.finance-cell-delete { position:absolute; top:3px; right:3px; z-index:3; width:17px; height:17px; padding:0; display:grid; place-items:center; border:1px solid #edc6bf; border-radius:50%; background:#fff7f5; color:#b84638; font-size:12px; line-height:1; font-weight:900; opacity:.72; cursor:pointer; }
.finance-cell-delete:hover,.finance-cell-delete:focus-visible { border-color:#b84638; background:#b84638; color:#fff; opacity:1; outline:none; }
.expense-cell-info { position:absolute; top:3px; left:3px; z-index:4; width:18px; height:18px; padding:0; display:grid; place-items:center; border:1px solid #d6e1ec; border-radius:4px; background:#fff; color:#fff; cursor:pointer; }
.expense-cell-info span { width:13px; height:13px; display:grid; place-items:center; border-radius:50%; background:#2672b8; font:900 9px/1 Arial,sans-serif; }
.expense-cell-info:hover,.expense-cell-info:focus-visible { border-color:#2672b8; box-shadow:0 0 0 2px rgba(38,114,184,.14); outline:none; }
.day-cell.today { box-shadow:none; }
.date-head { height:22px; padding:3px 10px; border-bottom:1px solid #edf0ee; display:flex; justify-content:space-between; align-items:center; }
.date-head b { font-size:14px; }.date-head span { color:#8a958f; font-size:10px; text-transform:uppercase; }
.amount { display:grid; place-items:center; height:105px; color:#b2bab6; font-size:12px; }
.compact-row .day-cell { display:grid; grid-template-rows:44px minmax(44px,1fr); }
.compact-row .amount { height:auto; min-height:44px; }
.amount.has-value { color:var(--ink); font-weight:750; }
.finance-section .day-cell { display:flex; flex-direction:column; }
.finance-section .amount { min-height:44px; height:44px; flex:0 0 44px; border-bottom:1px solid #edf0ee; cursor:cell; position:relative; }
.finance-section-total { min-height:44px!important; height:44px!important; flex:0 0 44px!important; border-top:1px solid var(--line); border-bottom:0!important; background:#f5f8f6; cursor:default!important; font-weight:800; }
.finance-section .finance-section-total { margin-top:auto; }
.amber .day-cell { display:flex; flex-direction:column; }
.amber .finance-section-total { margin-top:auto; }
.bank-calendar-column-spacer { min-height:29px; height:29px; flex:0 0 29px; border-bottom:1px solid #edf0ee; }
.bank-credit-payment { min-height:48px; height:48px; flex:0 0 48px; border-bottom:1px solid #edf0ee; font-size:11px; }
.bank-credit-payment { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; }
.bank-credit-payment small { color:#a34d35; font-size:8px; font-weight:700; white-space:nowrap; }
.bank-credit-payment .credit-principal-note { color:var(--green-dark); }
.credit-payment-delete { position:absolute; top:2px; right:3px; width:15px; height:15px; padding:0; display:grid; place-items:center; border:0; border-radius:50%; background:#f5ded9; color:#9e3f31; font-size:11px; line-height:1; }
.staircase-payment-edit-button { position:absolute; top:2px; right:21px; width:15px; height:15px; padding:0; display:grid; place-items:center; border:0; border-radius:4px; background:#fff; color:#176044; font-size:9px; line-height:1; }
.editable-credit-payment { cursor:cell; }
.editable-credit-payment:hover { background:#fff8dc; }
.scheduled-credit-payment { cursor:default; }
.bank-credit-payment.staircase-credit-payment { cursor:help; }
.bank-credit-payment.staircase-credit-payment.scenario-green { border-color:#237653; background:#237653; color:#fff; }
.bank-credit-payment.staircase-credit-payment.scenario-red { border-color:#b84638; background:#b84638; color:#fff; }
.bank-credit-payment.staircase-credit-payment small { color:#fff; text-transform:uppercase; }
.bank-credit-payment.early-credit-payment { border-color:#c99b18; background:#ffd84d; color:#2c240d; }
.bank-credit-payment.early-credit-payment small { color:#6f5200; text-transform:uppercase; }
.credit-payment-input { width:calc(100% - 8px); height:34px; padding:0 4px; border:1px solid var(--green); border-radius:6px; text-align:center; font-weight:800; }
.optional-credit-field > span { color:#6f7f77; }
.bank-calendar-add-spacer { min-height:30px; flex:1 0 30px; }
.finance-section .amount.recurring:after { content:attr(data-repeat-mark); position:absolute; top:3px; right:5px; color:#55766a; font-size:10px; }
.finance-section .calendar-spacer { min-height:44px; height:44px; flex:0 0 44px; }
.finance-cell-input { width:calc(100% - 8px); height:32px; margin:6px 4px; padding:0 5px; border:1px solid #4f846f; border-radius:5px; text-align:center; font:700 12px Arial,sans-serif; outline:none; }
.add-month { width:50px; border:0; background:#edf5f0; color:var(--green); font-size:24px; }
.calendar-footer { display:flex; align-items:center; justify-content:flex-end; gap:15px; padding:14px; color:var(--muted); font-size:12px; }
.calendar-footer button { border:1px solid var(--line); background:#fff; color:var(--green); border-radius:8px; padding:8px 12px; font-weight:700; }
.finance-row-modal h2 { font-size:29px; }
.finance-row-modal.is-expense-entry { width:max-content; max-width:calc(100vw - 40px); padding:25px 30px 28px; }
.finance-row-modal.is-expense-entry h2 { margin:5px 0 17px; }
.finance-row-modal.is-expense-entry .login-form { gap:13px; }
.finance-name-debt-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:14px; }
.finance-name-field { min-width:0; }
.finance-debt-toggle { min-height:44px; padding:0 13px; display:flex!important; grid-template-columns:none!important; flex-direction:row!important; align-items:center; gap:9px; border:1px solid var(--line); border-radius:9px; background:#f7faf8; color:var(--green-dark)!important; font-weight:800!important; cursor:pointer; }
.finance-debt-toggle input { width:18px!important; height:18px; margin:0; accent-color:#247654; }
.finance-entry-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:5px; color:var(--muted); font-size:13px; }
.finance-entry-heading button { padding:8px 12px; border:1px solid #b8d0c5; border-radius:9px; background:#f5faf7; color:var(--green); font-weight:800; }
.finance-entry-values { display:grid; gap:10px; width:min(610px,calc(100vw - 100px)); }
.finance-entry-value { padding:13px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 12px; align-items:end; border:1px solid var(--line); border-radius:12px; background:#fbfdfc; }
.finance-entry-value label { min-width:0; }
.finance-entry-value > label:not(.finance-entry-monthly) > input { width:100%; text-align:center; }
.finance-debt-date-pair { min-width:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; }
.finance-debt-date-pair label,.finance-debt-date-pair input { min-width:0; width:100%; }
.finance-debt-date-pair input { text-align:center; }
.finance-entry-monthly { grid-column:1; justify-self:start; width:max-content!important; display:flex!important; grid-template-columns:none!important; flex-direction:row!important; align-items:center; justify-content:flex-start; gap:8px; font-size:13px; color:var(--muted); text-align:left; }
.finance-entry-monthly input { width:18px!important; height:18px; margin:0; accent-color:#247654; }
.finance-entry-monthly span { white-space:nowrap; }
.finance-entry-actions { grid-column:2; grid-row:2; justify-self:end; display:flex; gap:8px; }
.finance-entry-actions button { min-width:92px; padding:10px 13px; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--green); font-weight:800; }
.finance-entry-actions .finance-entry-cancel { color:#ad4638; border-color:#efb8af; background:#fff8f6; }
.finance-entry-save { width:100%; }
.finance-delete-list { display:grid; gap:9px; }
.finance-delete-item { min-width:0; padding:11px 12px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; border:1px solid var(--line); border-radius:10px; }
.finance-delete-item div { min-width:0; display:grid; gap:5px; }
.finance-delete-item b { font-size:13px; }
.finance-delete-item span { color:var(--muted); font-size:11px; line-height:1.5; }
.finance-delete-item button { padding:7px 9px; border:1px solid #e1aaa0; border-radius:7px; background:#fff7f5; color:#a33b2b; font-size:11px; font-weight:700; }
.finance-delete-empty { margin:0; color:var(--muted); }
.credit-layout { display:block; }
.form-card,.helper-card,.loans-card,.forecast-card,.schedule-card { background:#fff; border:1px solid var(--line); border-radius:16px; }
.form-card { width:min(1100px,100%); margin:0 auto; padding:30px 34px; }
.section-title { display:flex; gap:14px; align-items:center; margin-bottom:24px; }
.section-title h2 { margin:0 0 4px; font:700 23px Georgia,serif; }.section-title p { margin:0; color:var(--muted); font-size:13px; }
.icon { width:38px; height:38px; border-radius:10px; display:grid; place-items:center; background:#e7f0eb; color:var(--green); font-size:20px; }
.form-grid { display:grid; gap:22px; }
.credit-main-fields { display:grid; grid-template-columns:24ch 24ch 24ch 14ch 14ch; gap:16px; align-items:end; justify-content:center; }
.credit-main-fields .compact-credit-amount,
.credit-main-fields .compact-remaining-balance { width:14ch; justify-self:center; }
.credit-main-fields label { text-align:center; }
.credit-main-fields input,
.credit-main-fields select { text-align:center; text-align-last:center; }
.bank-picker { position:relative; width:100%; }
.bank-picker-trigger { width:100%; height:44px; padding:0 10px; display:grid; grid-template-columns:26px 1fr auto; align-items:center; gap:9px; border:1px solid #d8e1dc; border-radius:9px; background:#fbfcfb; color:var(--ink); text-align:left; font-weight:700; }
.bank-picker-trigger:focus,.bank-picker.open .bank-picker-trigger { border-color:#5f907a; box-shadow:0 0 0 3px #dcebe4; outline:none; }
.bank-picker-trigger img,.bank-picker-menu img { width:26px; height:26px; display:block; border-radius:7px; object-fit:contain; background:#fff; }
.bank-picker-trigger i { font-size:16px; font-style:normal; transition:transform .16s ease; }
.bank-picker.open .bank-picker-trigger i { transform:rotate(180deg); }
.bank-picker-menu { position:absolute; z-index:30; top:calc(100% + 5px); left:0; right:0; padding:5px; display:grid; gap:2px; border:1px solid #d8e1dc; border-radius:9px; background:#fff; box-shadow:0 14px 35px #173f3226; }
.bank-picker-menu button { width:100%; min-height:38px; padding:5px 8px; display:grid; grid-template-columns:26px 1fr; align-items:center; gap:9px; border:0; border-radius:6px; background:#fff; color:var(--ink); text-align:left; font-size:12px; font-weight:700; }
.bank-picker-menu button:hover,.bank-picker-menu button.selected { background:#edf5f0; }
.credit-compact-fields { display:grid; gap:16px; justify-items:center; }
.credit-details-row,.credit-command-row { display:grid; justify-content:center; align-items:end; gap:14px; }
.credit-details-row { width:100%; grid-template-columns:15ch repeat(2,12ch) 18ch 14ch 12ch 12ch; justify-content:space-between; column-gap:0; }
.credit-command-row { grid-template-columns:25ch 22ch auto; align-items:end; gap:24px; }
.minimum-term-reduction-field { min-width:25ch; }
.credit-compact-fields label { display:grid; grid-template-rows:28px 44px; width:100%; gap:7px; text-align:center; }
.credit-compact-fields label>span { display:grid; place-items:end center; line-height:1.15; }
.credit-compact-fields input,.credit-compact-fields select { width:100%; min-width:0; justify-self:stretch; text-align:center; text-align-last:center; padding-left:6px; padding-right:6px; }
.credit-compact-fields .compact-date input[type="text"] { font-size:12px; letter-spacing:.02em; }
.credit-compact-fields .compact-date { width:14ch; }
.credit-compact-fields input[type="date"] { font-size:12px; }
.credit-compact-fields .payment-total-field input { color:var(--green-dark); font-weight:800; }
label { display:flex; flex-direction:column; gap:8px; font-size:12px; color:#56635d; font-weight:700; }
label.wide { grid-column:1/-1; }
input,select { height:44px; width:100%; border:1px solid #d8e1dc; border-radius:9px; padding:0 12px; background:#fbfcfb; color:var(--ink); outline:none; }
input[type="number"] { appearance:textfield; -moz-appearance:textfield; }
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { margin:0; -webkit-appearance:none; }
input:focus,select:focus { border-color:#5f907a; box-shadow:0 0 0 3px #dcebe4; }
.form-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:25px; }
.credit-command-row .form-actions { margin-top:0; align-self:end; }
.credit-command-row .form-actions button { height:44px; }
.credit-form-error { margin:17px 0 -10px; color:#a53b2c; font-size:12px; font-weight:700; text-align:right; }
.credit-summary { width:min(1100px,100%); min-height:54px; margin:18px auto 0; padding:11px 16px; display:flex; align-items:center; justify-content:space-between; gap:18px; border:1px solid #d8e5de; border-radius:12px; background:#f1f7f4; }
.credit-summary p { margin:0; display:flex; align-items:baseline; flex-wrap:wrap; gap:8px; color:var(--green-dark); }
.credit-summary p span { font-size:14px; font-weight:800; }
.credit-summary p strong { font-size:17px; }
.credit-summary label { flex-direction:row; align-items:center; gap:8px; white-space:nowrap; cursor:pointer; }
.credit-summary input[type="checkbox"] { width:18px; height:18px; margin:0; accent-color:var(--green); }
.helper-card { padding:26px; background:#eef5f1; }
.helper-icon { width:46px; height:46px; display:grid; place-items:center; border-radius:50%; background:#d4e6dc; color:var(--green-dark); font:700 22px Georgia,serif; }
.helper-card h3 { margin:20px 0 14px; font:700 20px Georgia,serif; }
.helper-card ul { padding:0; margin:0; list-style:none; color:#5b6962; line-height:2.2; font-size:13px; }
.helper-card li:before { content:"✓"; margin-right:8px; color:var(--green); font-weight:800; }
.credit-list { display:grid; gap:16px; margin-top:22px; }
.empty-credit-list { padding:28px; border:1px dashed #cdd8d1; border-radius:14px; background:#fff; color:var(--muted); text-align:center; }
.credit-list .loans-card { margin-top:0; }
.loans-card { margin-top:22px; overflow:hidden; }
.loans-head { padding:18px 22px; display:flex; justify-content:space-between; background:#f8faf8; border-bottom:1px solid var(--line); }
.loans-head>div { display:flex; align-items:center; gap:12px; }.loans-head div div { display:flex; flex-direction:column; gap:3px; }
.loans-head small,.loan-summary small { display:block; color:var(--muted); font-size:11px; margin-top:3px; font-weight:400; }
.loan-head-actions { align-items:flex-end!important; gap:6px!important; }
.loan-head-actions>div { flex-direction:row!important; gap:6px!important; }
.loan-head-actions button { padding:4px 8px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--green-dark); font-size:11px; font-weight:700; }
.loan-head-actions button.danger { color:#a53b2c; border-color:#e8c9c3; }
.bank-logo { width:36px; height:36px; border-radius:9px; background:#fff; display:grid; place-items:center; overflow:hidden; }
.bank-logo img { width:100%; height:100%; object-fit:contain; }
.loan-combined-row { min-height:98px; padding:14px 20px; display:grid; grid-template-columns:minmax(360px,34vw) 150px 175px 150px minmax(0,1fr) 126px; align-items:center; gap:18px; background:#fff; }
.loan-combined-row>*,.loan-combined-main,.loan-combined-value,.loan-combined-actions { align-self:center; }
.loan-combined-main { min-width:0; min-height:70px; padding:0; display:grid; grid-template-columns:24px 38px minmax(0,1fr); align-items:center; gap:12px; border:0; background:transparent; color:var(--ink); text-align:left; }
.loan-combined-main .chevron { justify-self:start; }
.loan-combined-title { min-width:0; display:flex; flex-direction:column; gap:6px; }
.loan-combined-title b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; }
.loan-combined-title small,.loan-combined-value span,.loan-combined-value small { color:var(--muted); font-size:11px; font-weight:400; }
.loan-combined-value { min-width:0; min-height:70px; display:flex; flex-direction:column; justify-content:center; gap:5px; }
.loan-combined-value strong { white-space:nowrap; font-size:15px; }
.loan-combined-value strong.loan-last-payment { color:var(--green-dark); font-size:12px; font-weight:700; white-space:normal; }
.loan-combined-actions { grid-column:6; min-height:70px; display:grid; align-content:center; gap:6px; }
.loan-combined-actions button { width:126px; height:32px; padding:0 10px; border:1px solid var(--line); border-radius:7px; background:#fff; color:var(--green-dark); font-size:11px; font-weight:700; }
.loan-combined-actions button.danger { color:#a53b2c; border-color:#e8c9c3; }
.loan-combined-actions button.close-credit { background:var(--green-dark); border-color:var(--green-dark); color:#fff; }
.loan-combined-actions button.close-credit:hover,.loan-combined-actions button.close-credit:focus-visible { background:#236d55; border-color:#236d55; outline:none; }
.loan-summary { width:100%; padding:20px 24px; display:grid; grid-template-columns:30px 1fr auto; text-align:left; align-items:center; border:0; background:#fff; color:var(--ink); }
.loan-summary strong { text-align:right; }.chevron { font-size:28px; color:#86918b; transition:.2s; }.chevron.open { transform:rotate(90deg); }
.loan-detail { padding:17px 24px 20px 54px; display:grid; grid-template-columns:repeat(4,1fr); background:#fbfcfb; border-top:1px solid #edf1ee; gap:15px; }
.loan-detail div { display:flex; flex-direction:column; gap:7px; }.loan-detail span { color:var(--muted); font-size:11px; }.loan-detail b { font-size:14px; }
.loan-early-panel { padding:18px 24px 22px 54px; border-top:1px solid #e6ece8; background:#f8faf8; }
.loan-early-history { display:grid; gap:6px; align-content:start; }
.loan-early-history-row { min-height:36px; display:grid; grid-template-columns:90px 1fr auto auto; align-items:center; gap:8px; padding:5px 8px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.loan-early-history-row span { color:var(--muted); font-size:10px; }.loan-early-history-row b { font-size:11px; }
.loan-early-history-row button { height:26px; padding:0 7px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--green-dark); font-size:9px; font-weight:700; }
.loan-early-history-row button.danger { color:#a53b2c; border-color:#e8c9c3; }
.loan-early-empty { align-self:center; color:var(--muted); font-size:11px; }
.forecast-card { position:relative; padding:22px 18px; display:grid; grid-template-columns:92px auto; align-items:end; justify-content:center; gap:20px; overflow:visible; }
.forecast-scenario-picker { position:relative; align-self:end; display:grid; justify-items:start; }
.forecast-scenario-picker::after { content:""; position:absolute; top:0; right:-11px; bottom:0; width:2px; border-radius:2px; background:#b8c9c0; }
.forecast-scenario-button { width:92px; height:44px; padding:0 9px; overflow:hidden; border:2px solid #d4a922; border-radius:9px; background:#202a2f; color:#fff; font-size:11px; font-weight:800; box-shadow:0 5px 14px #a7802433; }
.forecast-scenario-button.is-active { border-color:#237653; box-shadow:0 0 0 3px #23765322,0 5px 14px #173f3230; }
.forecast-scenario-button.scenario-green { border-color:#237653; background:#237653; }
.forecast-scenario-button.scenario-red { border-color:#b84638; background:#b84638; box-shadow:0 0 0 3px #b8463822,0 5px 14px #4a171230; }
.forecast-controls { padding:0; display:grid; grid-template-columns:220px 86px 235px 115px 218px; align-items:end; justify-content:start; column-gap:12px; row-gap:12px; }
.forecast-controls label:first-child,.forecast-controls button { grid-column:auto; }
.forecast-entry-row > label { min-width:0; text-align:center; }
.forecast-entry-row button { height:44px; }
.forecast-entry-row input:disabled { background:#edf1ef; color:#82908a; cursor:not-allowed; }
.forecast-credit-picker { position:relative; width:100%; }
.forecast-credit-picker-trigger { width:100%; padding:0 9px; display:grid; grid-template-columns:26px minmax(0,1fr) auto; align-items:center; gap:8px; border:1px solid #d8e1dc; border-radius:9px; background:#fbfcfb; color:var(--ink); text-align:left; font-weight:700; }
.forecast-credit-picker-trigger:focus,.forecast-credit-picker.open .forecast-credit-picker-trigger { border-color:#5f907a; box-shadow:0 0 0 3px #dcebe4; outline:none; }
.forecast-credit-picker-trigger img,.forecast-credit-picker-menu img { width:26px; height:26px; display:block; border-radius:7px; object-fit:contain; background:#fff; }
.forecast-credit-picker-trigger span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.forecast-credit-picker-trigger i { font-size:16px; font-style:normal; transition:transform .16s ease; }
.forecast-credit-picker.open .forecast-credit-picker-trigger i { transform:rotate(180deg); }
.forecast-credit-picker-menu { position:absolute; z-index:40; top:calc(100% + 5px); left:0; right:0; max-height:330px; padding:5px; overflow-y:auto; display:grid; gap:2px; border:1px solid #d8e1dc; border-radius:9px; background:#fff; box-shadow:0 14px 35px #173f3226; }
.forecast-credit-picker-menu button { width:100%; min-height:40px; height:auto; padding:6px 8px; display:grid; grid-template-columns:26px minmax(0,1fr); align-items:center; gap:9px; border:0; border-radius:6px; background:#fff; color:var(--ink); text-align:left; font-size:12px; font-weight:700; }
.forecast-credit-picker-menu button:hover,.forecast-credit-picker-menu button.selected { background:#edf5f0; }
.forecast-credit-picker-menu button span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.forecast-entry-actions { display:flex; align-items:stretch; gap:8px; }
.forecast-entry-actions [data-action="save-forecast-early"] { width:105px; min-width:105px; padding:0 8px; white-space:nowrap; }
.forecast-entry-actions [data-action="undo-forecast-credit-action"] { width:105px; min-width:105px; padding:0 8px; white-space:nowrap; }
.forecast-entry-actions button:disabled { opacity:.48; cursor:not-allowed; }
.forecast-section-title { flex-wrap:wrap; }
.forecast-mortgage-toggle { margin-left:auto; flex-direction:row; align-items:center; gap:7px; white-space:nowrap; cursor:pointer; }
.forecast-mortgage-toggle input[type="checkbox"] { width:17px; height:17px; margin:0; accent-color:var(--green); }
.forecast-save-status { flex:1 1 360px; margin:0 0 0 28px; color:var(--green-dark); font-size:12px; font-weight:700; line-height:1.45; }
.money-input { position:relative; }.money-input input { padding-right:35px; }.money-input span { position:absolute; right:14px; top:13px; color:var(--muted); }
.forecast-result { padding:32px; color:#fff; background:var(--green-dark); }
.forecast-result h2 { font:700 25px Georgia,serif; margin:9px 0 24px; }
.big-result { display:flex; align-items:center; gap:13px; }.big-result strong { font:700 64px Georgia,serif; }.big-result>span { font-size:18px; }.big-result small { display:block; color:#abc5b9; font-size:11px; margin-top:5px; }
.compare { display:flex; align-items:center; gap:16px; border-top:1px solid #ffffff24; border-bottom:1px solid #ffffff24; margin:24px 0; padding:17px 0; }
.compare div { display:flex; flex-direction:column; gap:4px; }.compare span { color:#aec4ba; font-size:11px; }.compare b { font-size:15px; }
.forecast-result p { font-size:12px; color:#c4d5cd; }
.deposit-heading { margin-bottom:22px; }
.deposit-calculator-card,.deposit-bank-comparison { padding:28px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.deposit-controls { display:grid; grid-template-columns:minmax(220px,320px) minmax(190px,280px) 150px; justify-content:center; align-items:end; gap:18px; }
.deposit-controls label { display:grid; gap:8px; text-align:center; font-weight:700; }
.deposit-controls button { height:44px; }
.deposit-result { margin-top:25px; display:grid; grid-template-columns:repeat(3,1fr); overflow:hidden; border:1px solid #cddbd4; border-radius:13px; background:#f4f8f6; }
.deposit-result div { min-height:105px; display:grid; place-content:center; gap:8px; text-align:center; border-right:1px solid #cddbd4; }
.deposit-result div:last-child { border-right:0; }
.deposit-result span { color:var(--muted); font-size:12px; }
.deposit-result strong { color:var(--green-dark); font:700 27px Georgia,serif; }
.deposit-source { margin-top:14px; min-height:20px; color:var(--muted); font-size:12px; text-align:center; }
.deposit-source a { color:var(--green); font-weight:700; }.deposit-source .warning { color:#ad4738; }
.deposit-error { margin:12px 0 0; color:#ad4738; text-align:center; font-weight:700; }
.deposit-bank-comparison { margin-top:20px; }.deposit-bank-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
.deposit-bank-card { padding:18px; display:grid; grid-template-columns:42px 1fr; gap:6px 12px; border:1px solid var(--line); border-radius:12px; background:#fbfcfb; }
.deposit-bank-card.is-selected { border-color:#5f907a; box-shadow:0 0 0 3px #dcebe4; }
.deposit-bank-card img { width:42px; height:42px; grid-row:1/4; object-fit:contain; border-radius:10px; }
.deposit-bank-card b { font-size:15px; }.deposit-bank-card strong { color:var(--green-dark); font-size:20px; }.deposit-bank-card small { color:var(--muted); }
.deposit-settings { margin-top:22px; padding-top:18px; border-top:1px solid var(--line); }
.deposit-settings summary { cursor:pointer; color:var(--green-dark); font:700 18px Georgia,serif; }
.deposit-settings form { margin-top:15px; display:grid; gap:12px; }.deposit-settings form>p { margin:0; color:var(--muted); font-size:12px; }
.deposit-settings-list { display:grid; gap:9px; }
.deposit-setting-row { display:grid; grid-template-columns:minmax(120px,1fr) 145px 155px 130px; align-items:center; gap:10px; padding:12px; border:1px solid var(--line); border-radius:9px; }
.deposit-setting-row label { display:flex; align-items:center; gap:7px; font-size:12px; font-weight:700; }
.deposit-setting-row input[type="number"] { height:40px; text-align:center; }.deposit-settings-success { color:var(--green)!important; font-weight:700; }
.deposit-setting-auto,.deposit-setting-manual { display:grid!important; gap:4px!important; text-align:center; }.deposit-setting-auto small,.deposit-setting-manual small { color:var(--muted); font-size:10px; }.deposit-setting-auto strong { color:var(--green-dark); font-size:16px; }
.profile-modal:has(.admin-profile-tabs) { width:min(1120px,94vw); height:min(780px,92vh); max-height:none; overflow:hidden; display:flex; flex-direction:column; }
.admin-profile-tabs { margin:18px 0; display:grid; grid-template-columns:repeat(3,1fr); overflow:hidden; border:1px solid var(--line); border-radius:10px; background:#edf3ef; }
.admin-profile-tabs button { min-height:48px; border:0; border-right:1px solid var(--line); border-radius:0; background:transparent; color:var(--muted); font-weight:800; }.admin-profile-tabs button:last-child { border-right:0; }.admin-profile-tabs button.is-active { background:#fff; color:var(--green-dark); }
.admin-profile-panel { flex:1; min-height:0; height:560px; overflow:auto; }.admin-profile-panel[hidden] { display:none!important; }
.admin-profile-panel iframe { width:100%; height:100%; min-height:0; border:1px solid var(--line); border-radius:10px; background:#f7faf8; }
.admin-profile-panel .login-form { width:min(480px,100%); margin:25px auto; }.admin-profile-panel.deposit-settings { margin-top:0; padding-top:0; border-top:0; }
.help-heading { margin-bottom:20px; }
.help-card { padding:28px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.help-card+.help-card { margin-top:16px; }
.help-card h2 { margin:0 0 20px; font:700 25px Georgia,serif; }
.help-formulas { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.help-formulas article { min-height:76px; padding:14px 16px; display:grid; grid-template-columns:minmax(135px,auto) 1fr; align-items:center; gap:16px; border:1px solid var(--line); border-radius:12px; background:#f8faf8; }
.help-formulas code,.help-note code { color:#174b39; background:#e3f0e9; border-radius:6px; padding:5px 7px; font-weight:800; white-space:nowrap; }
.help-formulas article div { display:flex; flex-direction:column; gap:4px; }
.help-formulas article span,.help-note { color:var(--muted); font-size:13px; line-height:1.45; }
.help-note { margin:20px 0 0; padding-top:18px; border-top:1px solid var(--line); }
.report-heading { margin-bottom:20px; }
.report-card { padding:26px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.report-card h2 { margin:0 0 18px; font:700 25px Georgia,serif; }
.report-table-wrap { overflow-x:auto; }
.report-table { width:100%; min-width:780px; border-collapse:collapse; }
.report-table th,.report-table td { padding:14px 16px; border-bottom:1px solid var(--line); text-align:left; font-size:13px; }
.report-table th { background:#edf4f0; color:#52615a; font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.report-table tbody tr:last-child td { border-bottom:0; }
.suggestion-forum,.suggestion-login-card { border:1px solid var(--line); border-radius:18px; background:#fff; }
.suggestion-forum { max-width:980px; margin:0 auto; overflow:hidden; }
.suggestion-forum-heading { padding:24px 28px 18px; border-bottom:1px solid var(--line); }
.suggestion-forum-heading h2,.suggestion-login-card h2 { margin:5px 0 0; font:700 27px/1.1 Georgia,serif; }
.suggestion-form { display:grid; gap:14px; padding:20px 28px 26px; border-top:1px solid var(--line); background:#f7faf8; }
.suggestion-form label { display:grid; gap:7px; color:var(--ink); font-size:13px; font-weight:700; }
.suggestion-form textarea { width:100%; min-height:105px; border:1px solid #cfdbd4; border-radius:10px; background:#fff; padding:12px 14px; color:var(--ink); line-height:1.5; resize:vertical; }
.suggestion-form-actions { display:flex; justify-content:flex-end; gap:10px; }
.suggestion-form-actions button { min-width:128px; min-height:44px; }
.suggestion-success { margin:0; padding:11px 13px; border-radius:9px; background:#e7f3ec; color:#1c6548; font-size:13px; font-weight:700; }
.suggestion-list { display:grid; max-height:520px; overflow-y:auto; }
.suggestion-item { padding:18px 28px; border-bottom:1px solid var(--line); background:#fff; }
.suggestion-item:last-child { border-bottom:0; }
.suggestion-item-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.suggestion-item h3 { margin:0; font-size:15px; }
.suggestion-item-author { display:block; margin-top:5px; color:var(--green); font-size:11px; font-weight:700; }
.suggestion-item p { margin:12px 0 0; color:#4f5e57; font-size:13px; line-height:1.5; white-space:pre-wrap; }
.suggestion-item time { color:var(--muted); font-size:11px; white-space:nowrap; }
.suggestion-status { display:inline-flex; margin-top:11px; padding:5px 8px; border-radius:6px; background:#e5efe9; color:var(--green-dark); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.suggestion-status.status-planned { background:#fff1c9; color:#755a0d; }
.suggestion-status.status-completed { background:#dcefe4; color:#17613f; }
.suggestion-empty { margin:0; padding:34px; color:var(--muted); text-align:center; }
.suggestion-login-card { max-width:580px; padding:28px; display:grid; gap:15px; }
.suggestion-login-card p { margin:0; color:var(--muted); }
.suggestion-login-card button { justify-self:start; }
.report-income { color:#1d6a4c; font-weight:700; }
.report-expense { color:#9b4939; font-weight:700; }
.report-empty { padding:28px!important; color:var(--muted); text-align:center!important; }
.period-close-modal { width:min(560px,100%); }
.period-details-modal { width:min(720px,100%); }
.period-details-range { margin:-10px 0 18px; color:var(--muted); font-size:13px; }
.period-details-list { max-height:min(480px,55vh); overflow:auto; border:1px solid var(--line); border-radius:11px; background:#fbfcfb; }
.period-details-row { min-height:48px; padding:9px 14px; display:grid; grid-template-columns:100px minmax(0,1fr) auto; align-items:center; gap:14px; border-bottom:1px solid var(--line); }
.period-details-row:last-child { border-bottom:0; }
.period-details-row time { color:var(--muted); font-size:12px; }
.period-details-row span { min-width:0; font-size:13px; font-weight:700; overflow-wrap:anywhere; }
.period-details-row small { display:block; margin-top:3px; color:var(--muted); font-size:10px; font-weight:400; }
.period-details-row b { white-space:nowrap; font-size:13px; }
.period-details-empty { margin:0; padding:28px 18px; color:var(--muted); text-align:center; }
.period-details-total { margin-top:14px; padding:14px 16px; display:flex; align-items:center; justify-content:space-between; border-radius:10px; background:#edf4f0; }
.period-details-total span { font-weight:800; }
.period-details-total b { font-size:18px; }
.income-card-modal { width:min(900px,100%); }
.expense-breakdown-modal { width:min(610px,100%); }
.expense-row-card-modal { width:min(900px,100%); }
.expense-row-card-date { margin:-8px 0 18px; color:var(--muted); font-size:13px; }
.expense-title-input { width:100%; min-height:48px; padding:5px 9px; border:1px solid #5f907a; border-radius:8px; background:#fff; color:var(--ink); font:inherit; box-shadow:0 0 0 3px #dcebe4; }
.expense-debt-issued-field { width:min(310px,100%); margin:0 0 14px; }
.expense-debt-issued-field input { text-align:center; }
.expense-card-tabs { margin:0 0 16px; padding:4px; display:grid; grid-template-columns:1fr 1fr; gap:4px; border-radius:11px; background:#edf3ef; }
.expense-card-tabs button { min-height:40px; padding:8px 14px; border:0; border-radius:8px; background:transparent; color:#53635c; font-weight:800; }
.expense-card-tabs button.is-active { background:#fff; color:var(--green-dark); box-shadow:0 1px 5px #123d2b18; }
.finance-section .amount[data-finance-kind="expense"][data-finance-recurrence]:not([data-finance-recurrence="once"]) { background:#fff1b8; color:#5f4900; }
.expense-row-card-heading { margin:0 0 10px; display:flex; align-items:center; justify-content:space-between; gap:16px; color:var(--muted); font-size:13px; }
.expense-row-card-heading button { padding:8px 12px; border:1px solid #b8d0c5; border-radius:9px; background:#f5faf7; color:var(--green); font-weight:800; }
.expense-month-list { margin:0 0 10px; overflow:hidden; border:1px solid var(--line); border-radius:11px; background:#fbfcfb; }
.expense-month-list-head,.expense-month-list-row { min-height:42px; display:grid; grid-template-columns:1fr 1fr 42px 38px; align-items:center; border-bottom:1px solid var(--line); }
.expense-month-list-head { background:#edf4f0; color:var(--green-dark); font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.07em; }
.expense-month-list-row:last-child { border-bottom:0; }
.expense-month-list-head span { height:100%; padding:9px 16px; display:flex; align-items:center; }
.expense-month-list-head span:nth-child(2) { justify-content:flex-end; border-left:1px solid var(--line); text-align:right; }
.expense-month-list-head span:nth-child(3) { justify-content:center; border-left:1px solid var(--line); }
.expense-month-list-head span:last-child { padding:0; justify-content:center; border-left:1px solid var(--line); }
.expense-month-list-head.is-debt-return span:nth-child(3) { padding:0; justify-content:center; border-left:1px solid var(--line); }
.expense-month-list-row input { width:100%; height:100%; min-height:41px; padding:8px 15px; border:0; border-radius:0; background:#fff; color:#17251f; font-size:13px; font-weight:700; }
.expense-month-list-row input[name="amount"] { border-left:1px solid var(--line); text-align:right; }
.expense-breakdown-open { width:100%; height:100%; min-height:41px; padding:0; border:0; border-left:1px solid var(--line); background:#fff; color:var(--green); font-size:18px; font-weight:900; cursor:pointer; }
.expense-breakdown-open:hover,.expense-breakdown-open:focus-visible { position:relative; z-index:1; background:#f8fbf9; box-shadow:inset 0 0 0 2px #5f907a; outline:none; }
.expense-breakdown-open:disabled { background:#f3f5f4; color:#a4aea9; cursor:not-allowed; }
.expense-month-list-row input:focus { position:relative; z-index:1; box-shadow:inset 0 0 0 2px #5f907a; outline:none; }
.expense-month-row-delete { width:100%; height:100%; min-height:41px; padding:0; display:grid; place-items:center; border:0; border-left:1px solid var(--line); background:#fff7f5; color:#b84638; font-size:17px; font-weight:900; cursor:pointer; }
.expense-month-row-delete:hover,.expense-month-row-delete:focus-visible { background:#b84638; color:#fff; outline:none; }
.expense-month-list-empty { margin:0; padding:18px; color:var(--muted); text-align:center; font-size:12px; }
.expense-row-card-footer { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:stretch; }
.expense-row-card-save { width:100%; margin:0; display:block; transition:transform .16s ease,box-shadow .16s ease,filter .16s ease; }
.expense-row-delete-button { min-width:150px; padding:11px 16px; border:1px solid #e3b3aa; border-radius:9px; background:#fff8f6; color:#a13e2e; font-weight:700; }
.expense-row-delete-button:hover,.expense-row-delete-button:focus-visible { background:#a13e2e; color:#fff; outline:none; }
.expense-row-card-save:hover:not(:disabled),.expense-row-card-save:focus-visible:not(:disabled) { transform:translateY(-2px); box-shadow:0 9px 20px rgba(11,58,45,.24); filter:brightness(1.06); }
.expense-row-card-save:active:not(:disabled) { transform:translateY(0) scale(.98); box-shadow:0 3px 8px rgba(11,58,45,.2); }
.expense-row-card-save.is-saving { position:relative; color:transparent; cursor:wait; }
.expense-row-card-save.is-saving::after { content:""; position:absolute; left:50%; top:50%; width:18px; height:18px; margin:-11px 0 0 -11px; border:2px solid rgba(255,255,255,.42); border-top-color:#fff; border-radius:50%; animation:expense-save-spin .7s linear infinite; }
@keyframes expense-save-spin { to { transform:rotate(360deg); } }
.expense-breakdown-heading { display:grid; grid-template-columns:1fr; margin-bottom:18px; }
.expense-breakdown-heading h2 { margin-bottom:0; white-space:nowrap; }
.expense-breakdown-date { margin:0 0 15px; color:var(--muted); font-size:13px; }
.expense-breakdown-rows { display:grid; gap:9px; }
.expense-breakdown-list-head,.expense-breakdown-row { display:grid; grid-template-columns:14ch minmax(20ch,1fr) 12ch 28px; gap:8px; align-items:center; }
.expense-breakdown-list-head { margin-bottom:7px; padding:0 2px; color:var(--muted); font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.06em; }
.expense-breakdown-list-head span { text-align:center; }
.expense-breakdown-row input { text-align:center; }
.expense-breakdown-row input[readonly] { background:#f4f7f5; color:#53635c; }
.expense-item-label { min-width:10ch; }
.expense-item-amount { width:12ch; }
.expense-remove-item { width:28px; height:28px; padding:0; border:1px solid #e3b3aa; border-radius:7px; background:#fff8f6; color:#a13e2e; font-size:18px; }
.expense-remove-placeholder { width:28px; }
.expense-breakdown-summary { margin-top:18px; padding-top:15px; display:grid; grid-template-columns:1fr 1fr; gap:12px; border-top:1px solid var(--line); }
.expense-breakdown-summary>div { padding:13px; display:flex; flex-direction:column; gap:5px; border-radius:10px; background:#f2f6f3; }
.expense-breakdown-summary span { color:var(--muted); font-size:11px; }
.expense-breakdown-summary b { font-size:16px; }
.expense-breakdown-summary .over-limit { color:#a13e2e; }
.expense-breakdown-save { width:100%; margin-top:14px; }
.income-name-form { margin:-8px 0 22px; display:grid; grid-template-columns:1fr auto; align-items:end; gap:10px; }
.income-name-form label { min-width:0; }
.income-name-form button { min-height:44px; }
.income-card-values-heading { margin:0 0 10px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.income-card-intro { margin:0; color:var(--muted); font-size:13px; }
.income-card-values-heading button { min-height:36px; padding:7px 12px; border:1px solid #b9cdc3; border-radius:8px; background:#edf5f0; color:var(--green-dark); font-size:12px; font-weight:800; }
.income-card-values-heading button:hover { background:#dfeee6; }
.income-card-values { max-height:min(450px,50vh); overflow:auto; display:block; border:1px solid var(--line); border-radius:11px; background:#fbfcfb; }
.income-value-card { padding:14px; display:grid; grid-template-columns:minmax(220px,1fr) 18ch 100px; gap:11px 14px; align-items:end; border:1px solid var(--line); border-radius:12px; background:#f8faf8; }
.income-value-card label { min-width:0; }
.income-value-card > label:not(.income-monthly-toggle) input { width:100%; height:44px; }
.income-value-card input[data-income-date-input] { font-variant-numeric:tabular-nums; }
.income-monthly-toggle { grid-column:1; grid-row:2; align-self:center; display:flex!important; flex-direction:row!important; align-items:center; gap:9px; color:#40544b; font-size:12px; font-weight:700; cursor:pointer; }
.income-monthly-toggle input { width:18px!important; height:18px!important; min-height:0!important; flex:0 0 18px; margin:0; accent-color:#237653; }
.income-card-actions { grid-column:3; grid-row:1; align-self:end; display:flex; justify-content:center; gap:8px; }
.income-card-actions button { width:100%; height:44px; padding:0 13px; border-radius:8px; font-weight:700; }
.income-delete-button { border:1px solid #e3b3aa; background:#fff8f6; color:#a13e2e; }
.income-card-empty { margin:0; padding:22px; border-radius:10px; background:#f5f7f5; color:var(--muted); text-align:center; font-size:13px; }
.income-card-empty-actions { display:grid; gap:12px; }
.income-row-delete-button { justify-self:end; min-width:150px; padding:11px 16px; border:1px solid #e3b3aa; border-radius:9px; background:#fff8f6; color:#a13e2e; font-weight:700; }
.income-card-footer { margin-top:14px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; }
.income-card-save { width:100%; min-height:44px; margin:0; }
.schedule-monthly-toggle { width:max-content!important; min-height:28px; margin:0; display:flex!important; grid-template-columns:none!important; flex-direction:row!important; align-items:center; gap:9px; color:#40544b; font-size:13px; font-weight:800; cursor:pointer; }
.schedule-monthly-toggle input { width:18px!important; height:18px!important; min-height:0!important; margin:0; flex:0 0 18px; accent-color:#237653; }
.schedule-monthly-toggle span { white-space:nowrap; }
.expense-schedule-toggles { margin:0; display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
[data-action="add-income-date-sum"]:disabled,[data-action="add-expense-date-sum"]:disabled,[data-action="add-finance-date-sum"]:disabled,[data-action="add-credit-payment-edit-row"]:disabled { opacity:.45; cursor:not-allowed; }
.period-close-intro { margin:-10px 0 20px; color:var(--muted); font-size:13px; line-height:1.5; }
.period-date-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.period-date-grid input[readonly] { background:#f4f6f3; color:var(--ink); }
.period-reference-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:end; }
.period-reference-row input[readonly] { background:#f4f6f3; color:var(--ink); }
.period-bank-fix { min-height:44px; padding:10px 12px; display:flex!important; flex-direction:row!important; align-items:center; gap:9px; border:1px solid var(--line); border-radius:10px; background:#eef6f1; color:var(--green-dark); font-weight:700; }
.period-bank-fix input { width:18px!important; height:18px; margin:0; accent-color:var(--green-dark); }
.period-bank-fix span { line-height:1.25; }
.period-preview { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.period-preview>div { padding:13px; display:flex; flex-direction:column; gap:5px; border:1px solid var(--line); border-radius:10px; background:#f8faf8; }
.period-preview-history { cursor:pointer; }
.period-preview-history:hover,.period-preview-history:focus-visible { border-color:#6f9f88; outline:0; }
.period-preview span { color:var(--muted); font-size:11px; }
.period-preview b { font-size:15px; }
.period-preview .period-preview-total { grid-column:1/-1; background:#e5f1ea; }
.schedule-card { position:relative; margin-top:22px; padding:26px; overflow:hidden; }
.forecast-schedule { overflow-x:auto; padding-bottom:0; overscroll-behavior-inline:contain; contain:paint; scrollbar-width:none; -ms-overflow-style:none; }
.forecast-schedule::-webkit-scrollbar { display:none; width:0; height:0; }
.forecast-schedule-empty { padding:30px; border:1px dashed var(--line); border-radius:12px; color:var(--muted); text-align:center; }
.forecast-sticky-scroll { position:fixed; left:0; right:0; bottom:0; z-index:100; height:18px; overflow-x:scroll; overflow-y:hidden; border:1px solid #bac8c0; border-bottom:0; border-radius:7px 7px 0 0; background:#eef3f0; scrollbar-color:#74877d #e5ece8; scrollbar-width:auto; }
.forecast-sticky-scroll.is-attached { position:absolute; z-index:8; }
.forecast-sticky-scroll > div { height:1px; }
.forecast-more-dates { position:sticky; left:0; width:min(410px,100%); padding:14px 10px 4px; display:flex; align-items:center; gap:12px; }
.forecast-more-dates button { min-height:38px; }
.forecast-more-dates span { color:var(--muted); font-size:12px; white-space:nowrap; }
.forecast-sticky-scroll::-webkit-scrollbar { height:17px; }
.forecast-sticky-scroll::-webkit-scrollbar-track { background:#e5ece8; }
.forecast-sticky-scroll::-webkit-scrollbar-thumb { border:3px solid #e5ece8; border-radius:10px; background:#74877d; }
.forecast-legend { display:flex; flex-wrap:wrap; gap:9px 18px; padding:0 0 18px; }
.forecast-legend>span { display:grid; grid-template-columns:10px auto; column-gap:7px; align-items:center; }
.forecast-legend i { grid-row:1/3; width:9px; height:9px; border-radius:2px; }
.forecast-legend b { font-size:11px; }.forecast-legend small { color:var(--muted); font-size:9px; }
.forecast-credit-rows { min-width:max-content; border-top:1px solid var(--line); }
.forecast-credit-row { display:flex; align-items:stretch; min-width:max-content; border-bottom:1px solid var(--line); }
.forecast-credit-row-title { position:sticky; left:0; z-index:4; width:clamp(380px,26vw,410px); flex:0 0 clamp(380px,26vw,410px); display:grid; grid-template-columns:38px minmax(150px,1fr) 150px; align-items:stretch; gap:0; padding:0; border-right:1px solid var(--line); background:var(--paper); }
.forecast-credit-row-title i { width:10px; height:10px; flex:0 0 10px; margin-top:3px; border-radius:2px; }
.forecast-credit-row-title div { display:flex; flex-direction:column; gap:4px; }
.forecast-credit-row-title b { font:700 14px Georgia,serif; white-space:nowrap; }
.forecast-credit-row-title small { color:var(--muted); font-size:9px; }
.forecast-timeline { min-width:max-content; display:flex; padding:18px 22px 20px; }
.forecast-event { width:165px; flex:0 0 165px; position:relative; display:flex; flex-direction:column; align-items:center; }
.forecast-event-card { width:142px; min-height:118px; padding:11px; display:flex; flex-direction:column; gap:6px; border:1px solid var(--line); border-top-width:4px; border-radius:7px; background:#fff; box-shadow:3px 4px 0 #edf2ef; z-index:2; }
.forecast-event-card span { color:var(--muted); font-size:10px; text-transform:uppercase; }.forecast-event-card b { font:700 14px Georgia,serif; }.forecast-event-card strong { font-size:12px; }
.forecast-event-card small { color:#a34d35; font-size:9px; font-weight:700; }
.forecast-event-card .forecast-principal { color:var(--green-dark); }
.forecast-event-card .forecast-balance { color:var(--muted); }
.forecast-event-actions { display:flex; gap:5px; margin-top:auto; }
.forecast-event-actions button { padding:3px 5px; border:1px solid var(--line); border-radius:5px; background:#fff; color:var(--green-dark); font-size:8px; }
.forecast-node { width:14px; height:14px; margin-top:18px; border:3px solid #e2ece7; border-radius:3px; z-index:2; }
.forecast-connector { position:absolute; left:82px; right:-83px; bottom:6px; height:2px; background:#bdc9c3; z-index:1; }
.forecast-grid { min-width:max-content; border:1px solid var(--line); border-radius:10px; overflow:clip; background:#fff; }
.forecast-grid-header,.forecast-grid-row { display:flex; min-width:max-content; }
.forecast-grid-header { position:sticky; top:0; z-index:5; border-bottom:1px solid var(--line); background:#f6f8f6; }
.forecast-grid-corner { position:sticky; left:0; z-index:7; width:clamp(380px,26vw,410px); flex:0 0 clamp(380px,26vw,410px); display:grid; grid-template-columns:38px minmax(150px,1fr) 150px; align-items:stretch; gap:0; padding:0; border-right:1px solid var(--line); background:#f6f8f6; }
.forecast-grid-corner>* { min-height:81px; padding:10px 7px; display:flex; align-items:center; justify-content:center; border-right:1px solid var(--line); text-align:center; }
.forecast-grid-corner>*:last-child { border-right:0; }
.forecast-grid-corner-cell { position:relative; }
.forecast-column-resizer { position:absolute; top:0; right:-5px; bottom:0; z-index:9; width:10px; padding:0; border:0; background:transparent; cursor:col-resize; touch-action:none; }
.forecast-column-resizer::after { content:""; position:absolute; top:18%; bottom:18%; left:4px; width:2px; border-radius:2px; background:#b9c9c0; opacity:.35; transition:opacity .15s,background .15s; }
.forecast-column-resizer:hover::after,.forecast-column-resizer.is-resizing::after { background:#237653; opacity:1; }
body.forecast-column-resizing { cursor:col-resize; user-select:none; }
.forecast-grid-corner b { font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.forecast-grid-corner span { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.06em; }
.forecast-grid-header-calendar { min-width:max-content; }
.forecast-credit-total-strip { display:flex; min-width:max-content; margin-bottom:4px; }
.forecast-credit-total-corner { position:sticky; left:0; z-index:4; flex:0 0 auto; background:#fff; }
.forecast-grid-credit-total-track,.forecast-grid-balance-track,.forecast-grid-date-track,.forecast-grid-track { display:grid; min-width:max-content; }
.forecast-grid-credit-total { min-height:30px; padding:5px 1px; display:flex; align-items:center; justify-content:center; color:var(--green-dark); font-size:9px; line-height:1; font-weight:900; letter-spacing:-.055em; white-space:nowrap; text-align:center; }
.forecast-grid-balance-track { border-bottom:1px solid var(--line); background:#e9f1ec; }
.forecast-grid-date { min-height:46px; padding:7px 4px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; border-right:1px solid var(--line); color:var(--green-dark); font-size:10px; line-height:1.2; font-weight:800; text-align:center; text-transform:uppercase; }
.forecast-grid-date span { display:block; white-space:nowrap; }
.forecast-grid-wallet-balance { min-height:35px; padding:8px 3px; display:flex; align-items:center; justify-content:center; border-right:1px solid #ccd9d1; color:#17251f; font-size:12px; line-height:1.1; font-weight:900; letter-spacing:-.02em; white-space:nowrap; text-align:center; }
.forecast-grid-wallet-balance.is-negative { color:#b84638; }
.forecast-grid-row { min-height:92px; border-bottom:1px solid var(--line); }
.forecast-grid-row:last-child { border-bottom:0; }
.forecast-grid-row .forecast-credit-row-title { align-items:stretch; background:#fff; }
.forecast-credit-number,.forecast-credit-name-column,.forecast-credit-balance-column { min-width:0; padding:12px 8px; display:flex!important; align-items:center; justify-content:center; border-right:1px solid var(--line); }
.forecast-credit-number { color:var(--muted); font-size:12px; font-weight:900; }
.forecast-credit-name-column { flex-direction:row!important; justify-content:flex-start; gap:9px; }
.forecast-credit-name-column .forecast-credit-info { align-items:flex-start; }
.forecast-credit-balance-column { flex-direction:column!important; gap:5px!important; text-align:center; }
.forecast-credit-balance-column .forecast-credit-time { margin:0!important; padding:0!important; background:none!important; color:var(--green-dark)!important; white-space:nowrap; }
.forecast-credit-balance-column .forecast-staircase-time { margin:0; padding:3px 6px; }
.forecast-credit-balance-column .forecast-staircase-empty { color:var(--muted); font-size:11px; font-weight:800; }
.forecast-grid-row .forecast-credit-balance-column .forecast-credit-live-balance { margin:0; color:#52675e; font-size:9px; line-height:1.2; font-weight:800; white-space:nowrap; }
.forecast-grid-row .forecast-credit-balance-column .forecast-credit-live-balance.is-projected { color:var(--green-dark); }
.forecast-grid-row .forecast-credit-row-title span { color:var(--muted); font-size:9px; }
.forecast-grid-row .forecast-credit-row-title small { color:var(--green-dark); font-size:10px; font-weight:800; }
.forecast-grid-row .forecast-credit-row-title .forecast-credit-time { color:var(--green-dark); font-size:11px; line-height:1.25; font-weight:800; white-space:nowrap; }
.forecast-grid-row .forecast-credit-row-title .forecast-credit-time.is-fastest-closing { width:max-content; margin-top:2px; padding:4px 7px; border-radius:5px; background:#237653; color:#fff; }
.forecast-grid-row .forecast-credit-row-title .forecast-credit-time.is-highest-rate { width:max-content; margin-top:2px; padding:4px 7px; border-radius:5px; background:#b84638; color:#fff; }
.forecast-grid-row .forecast-credit-row-title .forecast-credit-time-row { display:flex; flex-direction:row; align-items:center; flex-wrap:nowrap; gap:5px; }
.forecast-grid-row .forecast-credit-row-title .forecast-staircase-time { width:max-content; padding:4px 7px; border:1px solid #c99b18; border-radius:5px; background:#ffd84d; color:#2c240d; font-size:10px; line-height:1.25; font-weight:900; white-space:nowrap; }
.forecast-grid-cell { position:relative; display:flex; align-items:center; justify-content:center; min-height:92px; border-right:1px solid #edf1ef; }
.forecast-grid-cell::before { content:""; position:absolute; left:0; right:0; top:50%; height:2px; background:#bdc9c3; transform:translateY(-50%); }
.forecast-grid-cell:first-child::before { left:50%; }
.forecast-grid-cell:last-child::before { right:50%; }
.forecast-grid-cell.is-last-payment::before { right:50%; }
.forecast-grid-cell.is-after-last::before { display:none; }
.forecast-grid-node { position:relative; z-index:2; width:14px; height:14px; border:3px solid #e2ece7; border-radius:3px; background:#fff; }
.forecast-grid-payment { position:relative; z-index:3; width:82px; min-height:58px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; padding:6px 4px; border:1px solid var(--line); border-top-width:4px; border-radius:7px; background:#fff; box-shadow:3px 4px 0 #edf2ef; }
.forecast-grid-payment strong { font-size:12px; }
.forecast-grid-payment small { color:#a34d35; font-size:8px; font-weight:800; text-transform:uppercase; }
.forecast-grid-payment.has-staircase { color:#fff; cursor:help; }
.forecast-grid-payment.has-staircase.scenario-green { border-color:#237653; background:#237653; box-shadow:3px 4px 0 #b8d8c9; }
.forecast-grid-payment.has-staircase.scenario-red { border-color:#b84638; background:#b84638; box-shadow:3px 4px 0 #e2b2ac; }
.forecast-grid-payment.has-staircase strong,.forecast-grid-payment .forecast-staircase-mark { color:#fff; }
.forecast-grid-payment .forecast-staircase-mark { text-transform:none; }
.forecast-grid-actions { position:absolute; top:3px; right:3px; display:flex; gap:2px; opacity:0; transition:opacity .15s ease; }
.forecast-grid-payment:hover .forecast-grid-actions,.forecast-grid-payment:focus-within .forecast-grid-actions { opacity:1; }
.forecast-grid-actions button { width:18px; height:18px; padding:0; border:1px solid var(--line); border-radius:4px; background:#fff; color:var(--green-dark); font-size:10px; line-height:1; }
.forecast-grid-payment.has-staircase .forecast-grid-actions button { border-color:#ffffff99; color:#176044; }
.forecast-grid-payment.has-staircase .forecast-grid-actions [data-staircase-payment-delete] { color:#9e3f31; }
.color-0 { background:#2d7458; }.color-1 { background:#d2a340; }.color-2 { background:#c96e60; }.color-3 { background:#7662a4; }.color-4 { background:#397ea1; }.color-5 { background:#8d6545; }
.color-border-0 { border-top-color:#2d7458; }.color-border-1 { border-top-color:#d2a340; }.color-border-2 { border-top-color:#c96e60; }.color-border-3 { border-top-color:#7662a4; }.color-border-4 { border-top-color:#397ea1; }.color-border-5 { border-top-color:#8d6545; }
.event-line { display:flex; min-width:850px; padding:35px 25px 18px; }
.event { position:relative; flex:1; display:flex; flex-direction:column; align-items:flex-start; }
.event-card { width:136px; min-height:92px; border:1px solid var(--line); border-radius:3px; background:#fff; padding:11px; box-shadow:4px 4px 0 #eef2ef; display:flex; flex-direction:column; gap:6px; z-index:2; }
.event-card span { color:var(--muted); font-size:10px; text-transform:uppercase; }.event-card b { font:700 14px Georgia,serif; }.event-card small { font-weight:700; }
.event i { width:14px; height:14px; margin:19px 0 0 60px; background:var(--green); border:3px solid #dce9e2; border-radius:2px; z-index:2; }
.event.early i { background:#d2a340; }.event.early .event-card { background:#fffbec; border-color:#eadba6; }
.connector { position:absolute; height:2px; background:#bdc9c3; left:67px; right:-67px; bottom:6px; z-index:1; }
.staircase-details-modal { width:min(620px,100%); }
.staircase-details-content { display:grid; gap:14px; }
.staircase-details-summary { padding:15px 17px; display:grid; grid-template-columns:1fr auto; gap:8px 18px; border-radius:11px; background:#fff7d9; }
.staircase-details-summary span { color:var(--muted); font-size:12px; }
.staircase-details-summary b { text-align:right; }
.staircase-details-list { display:grid; gap:8px; }
.staircase-details-source { min-height:52px; padding:11px 13px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:5px 12px; border:1px solid var(--line); border-radius:9px; background:#f8faf8; }
.staircase-details-source b { font-size:13px; }
.staircase-details-source strong { grid-row:1/3; grid-column:2; color:var(--green-dark); font-size:13px; }
.staircase-details-source span { color:var(--muted); font-size:11px; }
.staircase-date-edit-modal { width:min(480px,100%); }
.staircase-date-edit-intro { margin:0; color:var(--muted); line-height:1.5; }
.staircase-date-edit-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.staircase-date-edit-actions button { min-height:44px; }
.staircase-carryover-explanation { margin:0; padding:14px 16px; border-left:4px solid #d2a340; border-radius:8px; background:#fff8df; color:#574817; font-size:13px; line-height:1.55; }
.staircase-carryover-explanation b { display:block; margin-bottom:4px; color:#3e3210; }
.forecast-scenario-modal { width:min(760px,100%); height:min(610px,calc(100vh - 40px)); display:flex; flex-direction:column; }
.forecast-staircase-start { display:grid; grid-template-columns:minmax(180px,240px) minmax(150px,220px); align-items:center; gap:6px 14px; margin:0 0 12px; }
.forecast-staircase-start > span { font-weight:700; }
.forecast-staircase-start input { width:100%; min-height:42px; }
.forecast-staircase-start small { grid-column:1 / -1; color:var(--muted); line-height:1.4; }
.forecast-staircase-start-error { margin:-5px 0 10px; color:#a42e22; font-weight:700; }
.forecast-scenario-options { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:18px; }
.forecast-scenario-options button { min-height:105px; padding:15px; display:flex; flex-direction:column; align-items:flex-start; gap:8px; border:2px solid var(--line); border-radius:11px; background:#fff; color:var(--ink); text-align:left; }
.forecast-scenario-options button b { font-size:14px; }
.forecast-scenario-options button span { color:var(--muted); font-size:11px; line-height:1.45; }
.forecast-scenario-options button.green { border-color:#80b39b; }
.forecast-scenario-options button.red { border-color:#d99a92; }
.forecast-scenario-options button.is-selected.green { background:#237653; color:#fff; }
.forecast-scenario-options button.is-selected.red { background:#b84638; color:#fff; }
.forecast-scenario-options button.is-selected:not(.green):not(.red) { background:#edf2ef; }
.forecast-scenario-options button.is-selected span { color:inherit; opacity:.85; }
.forecast-scenario-info { min-height:190px; flex:1 0 190px; padding:17px 19px; border:1px solid var(--line); border-radius:11px; background:#f6f9f7; }
.forecast-scenario-info h3 { margin:0 0 11px; font:700 23px Georgia,serif; }
.forecast-scenario-info p { margin:8px 0 0; color:#3f5048; font-size:15px; line-height:1.6; }
.forecast-scenario-confirm { width:220px; min-height:46px; margin:16px auto 0; display:block; }
.credit-payment-edit-modal { width:min(900px,100%); }
.credit-close-modal { width:min(520px,100%); }
.credit-close-summary { margin:0 0 18px; padding:16px 18px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:8px 18px; border:1px solid #d8e5de; border-radius:12px; background:#f1f7f4; }
.credit-close-summary span { color:var(--muted); font-size:12px; }
.credit-close-summary strong { font-size:20px; }
.credit-close-note { margin:0 0 18px; color:var(--muted); font-size:13px; line-height:1.55; }
.credit-close-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.credit-close-actions .primary { background:#a84335; }
.credit-payment-edit-form { display:grid; gap:14px; }
.credit-payment-edit-intro { margin:-10px 0 4px; color:var(--muted); font-size:13px; }
.credit-payment-edit-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; color:var(--muted); font-size:13px; }
.credit-payment-edit-heading button { padding:8px 12px; border:1px solid #b8d0c5; border-radius:9px; background:#f5faf7; color:var(--green); font-weight:800; }
.credit-payment-edit-list { max-height:min(450px,50vh); overflow:auto; border:1px solid var(--line); border-radius:11px; background:#fbfcfb; }
.credit-payment-edit-list-head,.credit-payment-edit-row { min-height:42px; display:grid; grid-template-columns:1fr 1fr 38px; align-items:center; border-bottom:1px solid var(--line); }
.credit-payment-edit-list-head { background:#edf4f0; color:var(--green-dark); font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.07em; }
.credit-payment-edit-row:last-child { border-bottom:0; }
.credit-payment-edit-list-head span { height:100%; padding:9px 16px; display:flex; align-items:center; }
.credit-payment-edit-list-head span:nth-child(2) { justify-content:flex-end; border-left:1px solid var(--line); }
.credit-payment-edit-list-head span:last-child { padding:0; border-left:1px solid var(--line); }
.credit-payment-edit-row input { width:100%; height:42px; padding:0 15px; border:0; border-radius:0; background:#fff; font-weight:700; }
.credit-payment-edit-row input[name="amount"] { border-left:1px solid var(--line); text-align:right; }
.credit-payment-edit-row button { width:100%; height:42px; padding:0; border:0; border-left:1px solid #edcfc8; background:#fff7f5; color:#b84638; font-size:18px; font-weight:800; }
.credit-payment-edit-note { margin:0; padding:12px 14px; border-radius:9px; background:#f0f5f2; color:#53625b; font-size:12px; line-height:1.5; }
.credit-payment-edit-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.credit-payment-edit-actions button { min-height:44px; }
@media(max-width:600px) {
  .deposit-controls,.deposit-result,.deposit-bank-cards { grid-template-columns:1fr; }
  .deposit-result div { border-right:0; border-bottom:1px solid #cddbd4; }.deposit-result div:last-child { border-bottom:0; }
  .deposit-setting-row { grid-template-columns:1fr; }
  .credit-payment-edit-actions { grid-template-columns:1fr; }
}
footer { min-height:70px; flex-shrink:0; border-top:1px solid var(--line); background:#fff; color:#7a8680; padding:0 4vw; display:flex; justify-content:space-between; align-items:center; font-size:12px; }
@media(max-width:1200px) {
  .loan-combined-row { grid-template-columns:minmax(260px,1fr) 120px 145px 150px 116px; gap:10px; }
  .loan-combined-actions { grid-column:auto; }
  .loan-combined-actions button { width:116px; }
  .forecast-card { grid-template-columns:92px minmax(0,1fr); }
  .forecast-entry-row { grid-template-columns:1fr 1fr 218px; }
}
@media(max-width:900px) {
  .topbar { height:auto; padding:14px 4vw; flex-wrap:wrap; }.topbar nav { order:3; position:static; transform:none; width:100%; height:42px; overflow-x:auto; }.topbar nav button { white-space:nowrap; padding:0 11px; }
  .account span:last-child,.demo-banner span { display:none; }.demo-banner { justify-content:space-between; }
  main { padding-top:28px; }.page-heading { align-items:flex-start; flex-direction:column; }
  .wallet-card { grid-template-columns:1fr 1fr; }.wallet-card>div:first-child { grid-column:1/-1; }.wallet-card button { grid-column:1/-1; }
  .finance-row { grid-template-columns:210px 1fr; }
  .forecast-card { align-items:start; }
  .forecast-entry-row { grid-template-columns:1fr 1fr; }.forecast-entry-row button { grid-column:1/-1; }.helper-card { display:none; }
  .credit-main-fields { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .credit-details-row { grid-template-columns:15ch repeat(2,12ch) 18ch 14ch 12ch 12ch; }
  .loan-combined-row { grid-template-columns:minmax(240px,1fr) 120px 145px 150px 116px; gap:14px; }
  .loan-combined-actions button { width:116px; }
}
@media(max-width:600px) {
  .brand { font-size:17px; }.account-wrap { margin-left:auto; }.page-heading h1 { font-size:36px; }
  .wallet-card { grid-template-columns:1fr; padding:23px; }.wallet-card>div:first-child,.wallet-card button { grid-column:auto; }.wallet-stat { border-left:0; border-top:1px solid #ffffff2b; padding:15px 0 0; }
  .wallet-card .wallet-stat-button { width:100%; padding:15px 0 0; border-left:0; border-top:1px solid #ffffff2b; }
  .period-details-row { grid-template-columns:82px minmax(0,1fr); gap:8px 12px; }
  .period-details-row b { grid-column:2; }
  .forecast-card { grid-template-columns:1fr; align-items:start; }
  .forecast-scenario-picker { justify-self:start; align-items:center; transform:none; }
  .forecast-scenario-picker::after { display:none; }
  .forecast-scenario-options { grid-template-columns:1fr; }
  .forecast-staircase-start { grid-template-columns:1fr; }
  .finance-row-modal.is-expense-entry { width:100%; max-width:100%; padding:25px 22px 28px; }
  .finance-entry-values { width:100%; }
  .finance-entry-value { grid-template-columns:1fr; }
  .finance-debt-date-pair { grid-template-columns:1fr 1fr; }
  .finance-entry-monthly { grid-column:auto; }
  .finance-entry-actions { grid-column:auto; grid-row:auto; justify-content:flex-end; }
  .timeline-note i { display:none; }.finance-row { display:block; }.row-info { border-right:0; border-bottom:1px solid var(--line); }.calendar-clip { height:148px; }.calendar { height:126px; }.amount { height:82px; }
  .form-card { padding:24px 18px; }
  .form-grid,.forecast-controls { grid-template-columns:1fr; }.form-grid .wide { grid-column:auto; }.forecast-controls label:first-child,.forecast-controls button { grid-column:auto; }
  .forecast-entry-actions { width:100%; }
  .forecast-entry-actions button { flex:1 1 0; width:auto!important; min-width:0!important; }
  .forecast-save-status { flex-basis:100%; margin:0; }
  .help-formulas { grid-template-columns:1fr; }
  .help-formulas article { grid-template-columns:1fr; gap:10px; }
  .period-date-grid,.period-reference-row,.period-preview { grid-template-columns:1fr; }
  .period-preview .period-preview-total { grid-column:auto; }
  .income-name-form,.income-value-card { grid-template-columns:1fr; }
  .income-monthly-toggle { grid-column:auto; grid-row:auto; }
  .income-card-actions { grid-column:auto; grid-row:auto; justify-content:stretch; }
  .income-card-actions button { flex:1; }
  .income-row-delete-button { width:100%; justify-self:stretch; }
  .income-card-footer { grid-template-columns:1fr; }
  .expense-row-card-footer { grid-template-columns:1fr; }
  .expense-row-delete-button { width:100%; }
  .expense-breakdown-list-head,.expense-breakdown-row { grid-template-columns:11ch minmax(0,1fr) 10ch 28px; }
  .expense-breakdown-summary { grid-template-columns:1fr; }
  .credit-main-fields { grid-template-columns:1fr; }
  .credit-main-fields { grid-template-columns:1fr; }
  .credit-details-row { grid-template-columns:repeat(2,12ch); }
  .credit-command-row { grid-template-columns:1fr; width:100%; }
  .credit-command-row .compact-scheme { width:22ch; justify-self:center; }
  .credit-command-row .form-actions { justify-content:center; }
  .credit-summary { align-items:flex-start; flex-direction:column; }
  .credit-summary label { white-space:normal; }
  .loan-combined-row { grid-template-columns:1fr 1fr; gap:14px; }
  .loan-combined-main { grid-column:1/-1; }
  .loan-last-payment-value { grid-column:1/-1; }
  .loan-combined-actions { grid-column:1/-1; grid-template-columns:1fr 1fr; }
  .loan-combined-actions button { width:100%; }
  .loan-combined-actions button.close-credit { grid-column:1/-1; }
  .loan-detail { grid-template-columns:1fr 1fr; padding-left:24px; }.forecast-result { padding:25px; } footer { gap:14px; flex-direction:column; justify-content:center; }
  .loan-early-panel { padding-left:24px; }
}