:root{color-scheme:dark;--bg:#0b1016;--panel:#111922;--soft:#17222d;--line:#263543;--text:#edf3f6;--muted:#8fa1ae;--accent:#70d3ad;--danger:#ee7b7b;--warn:#e6b85f;--shadow:0 16px 40px rgba(0,0,0,.18);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
html[data-theme="light"]{color-scheme:light;--bg:#f3f6f7;--panel:#fff;--soft:#f0f4f5;--line:#dce5e8;--text:#162128;--muted:#657680;--accent:#187d64;--danger:#bd4e4e;--warn:#906716;--shadow:0 12px 30px rgba(31,47,58,.08)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.45 inherit}button,input,select{font:inherit}button{color:inherit;cursor:pointer}button,input,select{outline:0}.app-shell{min-height:100vh;display:grid;grid-template-columns:248px 1fr}.sidebar{height:100vh;position:sticky;top:0;padding:22px 16px;background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:12px;padding:0 8px 24px}.brand-mark{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);font-weight:800}.brand strong,.brand span,.privacy-note strong,.privacy-note small{display:block}.brand span,.privacy-note small{font-size:11px;color:var(--muted)}.main-nav{display:grid;gap:5px}.nav-item{border:0;background:transparent;color:var(--muted);min-height:44px;padding:0 12px;border-radius:10px;display:flex;align-items:center;justify-content:space-between}.nav-item:hover{background:var(--soft);color:var(--text)}.nav-item.active{background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--text);box-shadow:inset 2px 0 var(--accent)}kbd{font-size:10px;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:2px 5px}.sidebar-footer{margin-top:auto;display:grid;gap:12px}.privacy-note{display:flex;gap:9px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--soft)}.status-dot{width:7px;height:7px;margin-top:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 14%,transparent)}.main-area{min-width:0}.topbar{height:88px;position:sticky;top:0;z-index:15;padding:16px clamp(20px,4vw,46px);display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(12px)}.topbar h1{margin:2px 0 0;font-size:24px;letter-spacing:-.035em}.top-actions{display:flex;align-items:center;gap:10px}.date-chip,.badge{padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--muted);font-size:11px}.content{max-width:1540px;margin:auto;padding:28px clamp(20px,4vw,46px) 60px}.view{display:none}.view.active{display:block}.eyebrow{margin:0;color:var(--accent);font-size:10px;font-weight:800;letter-spacing:.12em}h2{margin:3px 0 0;font-size:18px}p{margin-top:0}.muted,.fine-print{color:var(--muted)}.fine-print{font-size:11px}.button{min-height:38px;padding:0 14px;border:1px solid var(--line);border-radius:9px;background:var(--soft);font-size:12px;font-weight:700}.button.primary{background:var(--accent);border-color:var(--accent);color:#09251d}.button.ghost{background:transparent}.button.danger{color:var(--danger)}.button.full{width:100%}.text-button{border:0;background:none;color:var(--accent);font-size:11px;font-weight:700}.icon-button{width:38px;height:38px;border:1px solid var(--line);border-radius:9px;background:var(--panel)}.hidden{display:none!important}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:14px}.metric,.panel,.finance-card{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow)}.metric{min-height:118px;border-radius:15px;padding:18px}.metric-label{display:flex;justify-content:space-between;color:var(--muted);font-size:11px}.metric-value{margin-top:14px;font-size:clamp(21px,2.2vw,30px);font-weight:800;letter-spacing:-.04em}.metric-sub{margin-top:5px;color:var(--muted);font-size:10px}.grid{display:grid;gap:14px;margin-top:14px}.grid.two-wide{grid-template-columns:1.25fr .75fr}.planner-grid{grid-template-columns:minmax(290px,.7fr) 1.3fr}.panel{border-radius:15px;padding:20px;min-width:0}.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:15px}.stack-list{display:grid;gap:8px}.progress-row{padding:10px 0;border-top:1px solid var(--line)}.progress-row:first-child{border-top:0}.progress-head,.progress-meta,.balance-line{display:flex;justify-content:space-between;gap:12px}.progress-head{font-size:12px;margin-bottom:8px}.progress-head span,.progress-meta{color:var(--muted)}.progress-meta{font-size:9px;margin-top:7px}.progress-track{height:7px;background:var(--soft);border-radius:999px;overflow:hidden}.progress-track i{display:block;height:100%;background:var(--accent);border-radius:inherit}.reminder{display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:center;padding:9px 0;border-top:1px solid var(--line)}.reminder:first-child{border-top:0}.reminder-date{width:38px;height:38px;display:grid;place-items:center;text-align:center;background:var(--soft);border-radius:9px;line-height:1}.reminder-date b,.reminder-date small,.reminder strong,.reminder small{display:block}.reminder-date small,.reminder small{font-size:9px;color:var(--muted)}.reminder .due{font-size:9px;color:var(--warn)}.empty-state{padding:18px;border:1px dashed var(--line);border-radius:10px;text-align:center;color:var(--muted);font-size:11px}.empty-state strong{display:block;color:var(--text);margin-bottom:3px}.chart-legend{display:flex;gap:10px;color:var(--muted);font-size:9px}.chart-legend span{display:flex;gap:4px;align-items:center}.chart-legend i{width:6px;height:6px;border-radius:50%}.legend-in{background:var(--accent)}.legend-out{background:#cf8a78}.mini-chart{height:165px;display:grid;grid-template-columns:repeat(14,1fr);gap:4px;align-items:end}.chart-day{height:100%;display:flex;flex-direction:column;justify-content:flex-end}.chart-bars{height:135px;display:flex;align-items:flex-end;justify-content:center;gap:2px}.chart-bar{width:38%;min-height:2px;border-radius:3px 3px 0 0}.chart-bar.in{background:var(--accent)}.chart-bar.out{background:#cf8a78}.chart-day label{text-align:center;font-size:8px;color:var(--muted)}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:11px}th,td{padding:10px;border-bottom:1px solid var(--line);text-align:left}th{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.numeric{text-align:right}.amount-in{color:var(--accent)}.amount-out{color:#cf8a78}.type-pill{display:inline-block;padding:3px 6px;border:1px solid var(--line);border-radius:999px;font-size:8px}.row-delete{border:0;background:none;color:var(--muted);font-size:10px}.split-layout{display:grid;grid-template-columns:minmax(280px,340px) 1fr;gap:22px;align-items:start}.wide-form{grid-template-columns:minmax(280px,330px) 1fr}.sticky-form{position:sticky;top:112px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{display:grid;gap:5px;color:var(--muted);font-size:10px;font-weight:700}.field input,.field select,.inline-controls input,.inline-controls select{min-height:40px;width:100%;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:var(--soft);color:var(--text)}.span-2{grid-column:span 2}.form-actions{display:flex;gap:8px}.section-toolbar{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.finance-card{border-radius:14px;padding:17px}.finance-card-header{display:flex;justify-content:space-between;gap:10px;margin-bottom:15px}.finance-card h3{margin:0;font-size:14px}.subtitle{font-size:9px;color:var(--muted);margin-top:3px}.card-menu{display:flex;gap:5px}.card-menu button{padding:5px 7px;border:1px solid var(--line);border-radius:7px;background:var(--soft);font-size:9px}.card-menu .delete:hover{color:var(--danger)}.balance-line{align-items:baseline;margin-bottom:8px}.balance-line strong{font-size:21px}.balance-line small{color:var(--muted)}.card-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:14px}.fact{padding:8px;background:var(--soft);border-radius:8px}.fact span,.fact strong{display:block}.fact span{font-size:8px;color:var(--muted);text-transform:uppercase}.fact strong{font-size:10px;margin-top:3px}.card-actions{margin-top:14px;display:flex}.card-actions .button{flex:1}.responsive-heading{align-items:center}.inline-controls{display:flex;gap:7px}.inline-controls input{width:190px}.inline-controls select{width:140px}.projection-empty{min-height:180px;display:grid;place-items:center;border:1px dashed var(--line);border-radius:10px;color:var(--muted);text-align:center;padding:20px}.projection-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.projection-metric{padding:12px;background:var(--soft);border-radius:10px}.projection-metric span,.projection-metric strong{display:block}.projection-metric span{font-size:9px;color:var(--muted)}.projection-metric strong{font-size:16px;margin-top:4px}.timeline-item{display:grid;grid-template-columns:24px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}.timeline-index{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent);font-size:9px}.timeline-item strong,.timeline-item small{display:block}.timeline-item small,.timeline-item>span:last-child{font-size:9px;color:var(--muted)}.action-list{display:grid}.action-row{width:100%;min-height:64px;padding:11px 0;border:0;border-top:1px solid var(--line);background:none;display:flex;justify-content:space-between;align-items:center;text-align:left}.action-row:first-child{border-top:0}.action-row strong,.action-row small{display:block}.action-row small{font-size:9px;color:var(--muted)}.action-row b{font-size:9px;color:var(--accent)}.file-action{position:relative}.file-action input{position:absolute;inset:0;opacity:0}.danger-zone{display:flex;justify-content:space-between;align-items:center;gap:14px}.danger-zone strong,.danger-zone small{display:block}.danger-zone small{font-size:9px;color:var(--muted)}hr{border:0;border-top:1px solid var(--line);margin:20px 0}.print-report{margin-top:14px}.report-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}.report-stat,.report-block{padding:12px;border:1px solid var(--line);border-radius:10px}.report-stat span,.report-stat strong{display:block}.report-stat span{font-size:8px;color:var(--muted);text-transform:uppercase}.report-stat strong{margin-top:4px}.report-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.report-block h3{margin:0 0 8px}.report-line{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-top:1px solid var(--line);font-size:10px}.report-line span{color:var(--muted)}.toast-region{position:fixed;right:18px;bottom:18px;z-index:100}.toast{padding:11px 13px;border:1px solid var(--line);border-radius:9px;background:var(--soft);box-shadow:var(--shadow);font-size:10px}.mobile-only{display:none}
@media(max-width:1100px){.metric-grid{grid-template-columns:repeat(2,1fr)}.grid.two-wide,.planner-grid{grid-template-columns:1fr}.card-grid{grid-template-columns:1fr}.report-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.app-shell{display:block}.sidebar{position:fixed;inset:0 auto 0 0;width:min(82vw,280px);transform:translateX(-105%);transition:.2s;box-shadow:20px 0 50px rgba(0,0,0,.3)}.sidebar.open{transform:none}.mobile-only{display:inline-grid;place-items:center}.topbar{height:78px;padding:14px 16px}.topbar .eyebrow,.date-chip{display:none}.content{padding:18px 14px 48px}.split-layout,.wide-form{grid-template-columns:1fr}.sticky-form{position:static}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.responsive-heading{align-items:flex-start;flex-direction:column}.inline-controls{width:100%}.inline-controls input,.inline-controls select{width:50%}kbd{display:none}}
@media(max-width:580px){.metric-grid{grid-template-columns:1fr 1fr;gap:9px}.metric{padding:14px;min-height:102px}.metric-value{font-size:20px}.panel{padding:15px}.card-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.span-2{grid-column:span 1}.card-facts{grid-template-columns:1fr 1fr}.report-grid,.report-columns{grid-template-columns:1fr}.inline-controls{flex-direction:column}.inline-controls input,.inline-controls select{width:100%}}
@media print{:root{--bg:#fff;--panel:#fff;--soft:#f5f5f5;--text:#111;--muted:#555;--line:#ddd;color-scheme:light}.sidebar,.topbar,.view:not(#view-reports),#view-reports>:not(.print-report),.toast-region{display:none!important}.app-shell{display:block}.content{padding:0}#view-reports{display:block!important}.print-report{box-shadow:none;border:0;margin:0}}

/* Sidebar navigation icons */
.nav-label{display:flex;align-items:center;gap:11px;min-width:0}
.nav-icon{width:17px;height:17px;flex:0 0 17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;color:var(--muted);transition:color .16s ease,transform .16s ease}
.nav-item:hover .nav-icon{color:var(--text)}
.nav-item.active .nav-icon{color:var(--accent)}
.nav-item.active:hover .nav-icon{color:var(--accent)}
.nav-item:hover .nav-icon{transform:translateX(1px)}

/* Clearer debt entry form */
#view-debts .split-layout{grid-template-columns:minmax(320px,390px) 1fr}
.debt-form{gap:16px}
.form-intro{margin:0;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--accent) 7%,var(--soft));color:var(--muted);font-size:10px;line-height:1.55}
.form-section{padding:14px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--soft) 54%,transparent)}
.form-section-heading{display:flex;align-items:flex-start;gap:9px;margin-bottom:13px}
.form-section-heading strong,.form-section-heading small{display:block}
.form-section-heading strong{font-size:11px;color:var(--text)}
.form-section-heading small{margin-top:2px;font-size:9px;font-weight:400;color:var(--muted)}
.step-number{width:20px;height:20px;flex:0 0 20px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent);font-size:9px;font-weight:800}
.field-label{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--text);font-size:10px}
.field-label em{font-style:normal;font-size:8px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.05em}
.field-label em.optional{color:var(--muted);font-weight:600}
.field-help{display:block;color:var(--muted);font-size:8.5px;font-weight:400;line-height:1.4}
.input-suffix{display:grid;grid-template-columns:1fr auto;align-items:stretch}
.input-suffix input{border-radius:8px 0 0 8px!important}
.input-suffix span{display:grid;place-items:center;padding:0 9px;border:1px solid var(--line);border-left:0;border-radius:0 8px 8px 0;background:var(--panel);color:var(--muted);font-size:9px;font-weight:700}
@media(max-width:820px){#view-debts .split-layout{grid-template-columns:1fr}}
@media(max-width:580px){.form-section{padding:12px}.field-help{font-size:9px}}


/* Debt payment modal */
.payment-modal{width:min(92vw,470px);max-width:470px;padding:0;border:0;border-radius:16px;background:transparent;color:var(--text);box-shadow:0 28px 80px rgba(0,0,0,.45)}
.payment-modal::backdrop{background:rgba(3,8,13,.7);backdrop-filter:blur(5px)}
.modal-card{padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--panel);box-shadow:var(--shadow)}
.modal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.modal-header h2{font-size:20px}
.modal-close{width:34px;height:34px;border:1px solid var(--line);border-radius:9px;background:var(--soft);color:var(--muted);font-size:22px;line-height:1}
.modal-close:hover{color:var(--text)}
.payment-balance{display:grid;grid-template-columns:1fr auto;gap:3px 12px;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:var(--soft)}
.payment-balance span{color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.06em}
.payment-balance strong{grid-row:1 / span 2;grid-column:2;align-self:center;font-size:16px}
.payment-balance small{color:var(--muted);font-size:9px}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}
.payment-modal[open]{animation:paymentModalIn .14s ease-out}
@keyframes paymentModalIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:580px){.payment-modal{width:calc(100vw - 24px)}.modal-card{padding:16px}.payment-balance{grid-template-columns:1fr}.payment-balance strong{grid-row:auto;grid-column:auto}.modal-actions .button{flex:1}}

/* Cloud sync status */
.status-dot[data-sync="connecting"]{background:var(--warn)}
.status-dot[data-sync="synced"]{background:var(--accent)}
.status-dot[data-sync="local"]{background:var(--warn)}
.status-dot[data-sync="locked"]{background:var(--danger)}