:root{--green:#172c49;--ink:#20324a;--muted:#85878b;--line:#e7dfd3;--bg:#f4efe6;--accent:#e8d6b9}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,Segoe UI,Arial,sans-serif;font-size:14px}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible{outline:3px solid #9aaac0;outline-offset:3px}button{transition:background .15s}h1,h2,p{margin-top:0}h1{font-size:32px;letter-spacing:-1px;margin-bottom:8px;font-weight:650}h2{font-size:18px;letter-spacing:-.3px;margin-bottom:7px}p{line-height:1.6;color:var(--muted)}.hidden{display:none!important}aside{width:238px;position:fixed;inset:0 auto 0 0;background:#fffdf8;border-right:1px solid var(--line);padding:34px 22px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:650;letter-spacing:-.8px;color:var(--green);white-space:nowrap}.brand-icon{background:var(--green);color:var(--accent);width:35px;height:35px;border-radius:10px;display:grid;place-items:center;font-size:25px}.nav-label{font-size:10px;letter-spacing:1.8px;margin:50px 12px 14px;color:#98a09c}nav{display:grid;gap:7px}nav button{background:none;border:0;text-align:left;color:#79817e;padding:13px 14px;border-radius:8px;display:flex;align-items:center;gap:13px;font-weight:500}nav button span{font-size:22px;line-height:20px;width:22px}nav button.active{background:#eae1d3;color:var(--green);font-weight:650}nav button:hover{background:#f0e9df}.sidebar-note{margin-top:auto;padding:18px 14px;border:1px solid var(--line);border-radius:12px}.sidebar-note span{font-size:12px;font-weight:650}.sidebar-note p{font-size:12px;margin:7px 0 0}.sidebar-bottom{display:grid;gap:7px;padding-top:24px}.quiet{border:0;background:none;color:#7a8580;padding:8px;text-align:left;font-size:12px}main{margin-left:238px;padding:44px 44px 18px;max-width:1720px}header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:34px}header p{margin-bottom:0}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:600;color:#8d9790;margin-bottom:12px}.header-actions{display:flex;gap:14px;align-items:center}.primary{background:var(--green);color:#fffdf8;border:0;padding:13px 18px;border-radius:8px;font-size:12px;font-weight:600;white-space:nowrap}.primary:hover{background:#284567}.month-picker{display:flex;align-items:center;gap:9px;white-space:nowrap;border:1px solid var(--line);border-radius:8px;background:#fffdf8;padding:6px}.month-picker button{border:0;background:none;font-size:22px;color:#7b8980;width:25px}.month-picker span{font-size:12px;min-width:104px;text-align:center;font-weight:600}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:24px}.stat{background:#fffdf8;border:1px solid var(--line);border-radius:13px;padding:23px 21px;min-height:158px}.stat>span{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#69776f}.stat b{width:26px;height:26px;background:#f3f5f1;border-radius:7px;display:grid;place-items:center;font-weight:400;font-size:18px}.stat strong{display:block;font-size:27px;letter-spacing:-1px;margin:18px 0 10px;font-weight:650;overflow-wrap:anywhere}.stat small{font-size:10px;color:#929b94}.stat.balance{background:var(--green);color:#fffdf8;border-color:var(--green)}.balance>span{color:#e8e0d4}.balance small{color:#c4ccda}.balance b{background:#314965;color:var(--accent)}.green{color:#508869}.red{color:#c77664}.amber{color:#ad9756}.two-columns{display:grid;grid-template-columns:1.35fr 1fr;gap:24px;margin-bottom:24px}.panel{padding:26px;background:#fffdf8;border:1px solid var(--line);border-radius:14px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:26px}.panel-head p{font-size:11px;margin:0}.tag{color:#809076;font-size:10px;background:#f2ebe0;border:1px solid #e6dac8;padding:6px 10px;border-radius:6px;white-space:nowrap}.category{margin:18px 0}.category-label{display:flex;justify-content:space-between;font-size:12px;margin-bottom:9px}.category-label em{font-style:normal;font-size:10px;color:#8a958e;margin-left:8px}.bar{height:7px;background:#f0e9df;border-radius:5px;overflow:hidden}.bar>i{display:block;height:100%;border-radius:5px}.forecast{background:#eee5d7;display:flex;flex-direction:column;min-height:300px}.forecast h2{font-size:23px;line-height:1.3;max-width:250px}.forecast>strong{font-size:36px;letter-spacing:-1.2px;margin:12px 0}.forecast p{font-size:12px;max-width:310px}.forecast #forecast-detail{font-size:11px;color:#6e806c;margin-top:4px}.forecast-foot{margin-top:auto;padding-top:22px;font-size:10px;color:#8a9682}.text-button{background:none;border:0;padding:0;color:var(--green);font-size:11px;font-weight:600}.row{display:grid;grid-template-columns:minmax(120px,1fr) 100px 120px 115px 95px;gap:14px;align-items:center;padding:17px 0;border-top:1px solid #eef0eb}.row-main{display:flex;align-items:center;gap:12px;min-width:0}.row-icon{width:35px;height:35px;background:#eee6d9;color:#6c7b8e;border-radius:10px;display:grid;place-items:center;flex-shrink:0}.row-title{font-size:12px;font-weight:600;overflow-wrap:anywhere}.row-sub{display:block;color:#969d98;font-size:10px;margin-top:5px}.row-date{font-size:11px;color:#7b8880}.row-amount{font-size:12px;font-weight:600;text-align:right}.row-actions{display:flex;justify-content:flex-end;gap:8px}.row-actions button{border:0;background:#f0e9df;color:#6c7c6f;border-radius:5px;padding:6px;font-size:12px}.status{font-size:10px;padding:5px 8px;border-radius:5px;justify-self:start;background:#f4f0df;color:#9d8948;white-space:nowrap}.status.done{background:#eaf3e9;color:#558664}.status.overdue{background:#faece8;color:#bb715d}.empty{padding:32px 10px;text-align:center;color:#9aa297;font-size:13px}.filters{display:flex;gap:12px;margin-bottom:24px}.filters input{flex:1;min-width:0}.filters select{width:auto;max-width:220px}.fixed-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.fixed-card{border:1px solid var(--line);background:#fffdf8;border-radius:12px;padding:23px}.fixed-card h2{font-size:16px}.fixed-card strong{display:block;font-size:25px;margin:22px 0 10px}.fixed-card p{font-size:12px}.fixed-card button{margin-top:10px}.section-intro{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}.section-intro p{margin:0}.pension-intro{background:#ebe8e0;border:1px solid #e4e0d6;border-radius:14px;padding:26px 32px;margin-bottom:24px;display:flex;justify-content:space-between;align-items:center}.pension-intro h2{font-size:25px}.pension-intro p{font-size:13px;margin:8px 0 0;color:#898578}.pension-heart{font-size:70px;color:#afac96;font-weight:200}.pension-stats{grid-template-columns:repeat(3,1fr)}footer{display:flex;justify-content:space-between;margin-top:34px;border-top:1px solid var(--line);padding-top:18px;font-size:10px;color:#a0a79f}footer span{font-size:10px}dialog{border:1px solid var(--line);border-radius:18px;padding:27px;width:440px;max-width:calc(100vw - 24px);max-height:92dvh;color:var(--ink);box-shadow:0 25px 100px #163b3433}dialog::backdrop{background:#14382e66;backdrop-filter:blur(3px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.close{font-size:26px;background:none;border:0;color:#8a948c}form{display:grid;gap:15px}label{display:grid;gap:8px;font-size:12px;color:#6b7a70}input,select{width:100%;border:1px solid #dfe5dd;border-radius:7px;padding:11px 12px;background:#fffdf8;color:var(--ink);outline:none}input:focus,select:focus{border-color:#8798af;box-shadow:0 0 0 3px #e9edf3}small{color:#8b948c;line-height:1.5;font-size:11px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.check{display:flex;align-items:center;gap:9px}.check input{width:16px;height:16px;accent-color:var(--green)}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--green);color:#fffdf8;padding:14px 22px;border-radius:9px;box-shadow:0 6px 30px #143b3430;display:none;max-width:90vw;z-index:100}.auth{min-height:100dvh;display:grid;place-items:center;background:#eee5d7;padding:20px}.auth-card{background:#fffdf8;padding:42px;width:420px;max-width:100%;border-radius:20px;box-shadow:0 20px 100px #172c4910}.auth-card .brand{margin-bottom:36px}.auth-card h1{font-size:38px;line-height:1.15}.auth-card p{font-size:13px}#auth-error{color:#b65d4c;margin:0}.demo-banner{background:#ebe2d4;border-radius:7px;padding:10px 14px;color:#7c715f;font-size:10px;letter-spacing:.5px;margin-bottom:24px}
@media(min-width:1450px){main{padding:48px 56px}.stat strong{font-size:32px}.panel{padding:30px}}
@media(max-width:1150px){aside{width:204px;padding:28px 16px}.brand{font-size:18px}main{margin-left:204px;padding:30px 24px}header{align-items:flex-start;flex-direction:column}.header-actions{align-self:flex-end;margin-top:-15px}.stats{gap:12px}.stat{padding:18px 14px}.stat strong{font-size:23px}.two-columns{grid-template-columns:1.15fr 1fr;gap:16px}.row{grid-template-columns:minmax(90px,1fr) 75px 95px 90px 80px;gap:8px}.fixed-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){aside{inset:auto 0 0;width:100%;height:76px;padding:8px 8px max(8px,env(safe-area-inset-bottom));border:0;border-top:1px solid var(--line);z-index:20;display:block}aside>.brand,.nav-label,.sidebar-note,.sidebar-bottom{display:none}nav{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}nav button{flex-direction:column;gap:3px;padding:7px 1px;font-size:10px;border-radius:8px}nav button span{font-size:21px}main{margin:0;padding:26px 18px 100px}header{gap:22px;margin-bottom:22px}h1{font-size:29px}.header-actions{align-self:auto;width:100%;justify-content:space-between;margin:0;gap:8px}.header-actions .primary{padding:13px 11px;font-size:11px}.month-picker{gap:2px}.month-picker span{min-width:93px;font-size:11px}.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:18px}.stat{min-height:145px;padding:16px 13px}.stat>span{font-size:10px}.stat strong{font-size:23px;margin:18px 0 10px}.stat small{font-size:9px}.stat b{width:22px;height:22px}.two-columns{grid-template-columns:1fr;gap:18px;margin-bottom:18px}.panel{padding:20px 16px}.panel-head{gap:10px;align-items:flex-start;margin-bottom:20px}h2{font-size:16px}.panel-head p{font-size:10px}.row{grid-template-columns:minmax(100px,1fr) auto;gap:8px;padding:16px 0}.row-main{grid-column:1;grid-row:1}.row-date{grid-column:1;grid-row:2;padding-left:47px}.row-amount{grid-column:2;grid-row:1}.row .status{grid-column:1;grid-row:3;margin-left:47px}.row-actions{grid-column:2;grid-row:2/4}.row-title{font-size:12px}.forecast{min-height:280px}.filters{display:grid;grid-template-columns:1fr 1fr;gap:8px}.filters input{grid-column:1/-1}.filters select{width:100%;max-width:none;font-size:11px}.fixed-grid{grid-template-columns:1fr}.section-intro{flex-direction:column;align-items:flex-start}.pension-intro{padding:24px 20px}.pension-intro h2{font-size:22px}.pension-heart{font-size:48px}.pension-stats{grid-template-columns:1fr}.pension-stats .stat{min-height:135px}.pension-stats strong{font-size:30px}.pension-stats .stat>span{font-size:12px}#pension .panel-head{flex-direction:column;gap:15px}footer{margin-top:25px}.auth-card{padding:28px}.forecast>strong{font-size:34px}}

/* Navy and beige theme; compact monthly overview. */
aside{background:var(--green);border-right:0;padding-top:34px}
aside .brand{color:#f5eddf}aside .brand-icon{background:#e6d4b5;color:#172c49}
.nav-label{color:#8594a9}nav button{color:#b5c0cf}nav button.active{background:#e6d4b5;color:#172c49}nav button:hover{background:#2b4261;color:#fffdf8}nav button.active:hover{background:#efdfc4;color:#172c49}
.sidebar-bottom{margin-top:auto}.quiet{color:#acb8ca}.quiet:hover{color:#f1dfc2}
main{padding-top:42px}header{margin-bottom:30px}header .eyebrow{display:none}header h1{font-size:30px}header p{font-size:12px;color:#8b8a86}.demo-banner{background:none;border:1px dashed #d8ccba;color:#8a7d68;padding:8px 12px;font-size:9px;margin-bottom:27px}
.overview-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-bottom:28px}.overview-stats .stat{min-height:166px;padding:25px 26px}.overview-stats .stat>span{font-size:12px;color:#8b8c8e}.overview-stats .stat strong{font-size:34px;margin:20px 0 13px;font-weight:600}.overview-stats .stat small{font-size:10px;color:#96928a}.overview-stats .balance>span{color:#e4d8c4}.overview-stats .balance small{color:#acb9cb}.overview-stats .balance strong{color:#f9f1e3}
.overview-panels{grid-template-columns:1.3fr 1fr;gap:24px}.overview-panels .panel{padding:25px 26px;min-width:0}.overview-panels .panel-head{margin-bottom:22px;min-height:22px}.overview-panels h2{font-size:15px;font-weight:600;margin:0}.overview-panels .text-button{font-size:10px;white-space:nowrap}
.payment-row{display:flex;align-items:center;gap:13px;padding:18px 0;border-top:1px solid var(--line)}.payment-date{width:42px;height:47px;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f0e8dc;flex-shrink:0}.payment-date strong{font-size:17px;font-weight:600}.payment-date span{font-size:9px;text-transform:uppercase;margin-top:2px;color:#93826b}.payment-description{min-width:0}.payment-description strong{display:block;font-size:12px;font-weight:550;overflow-wrap:anywhere}.payment-description small{display:block;font-size:10px;color:#979189;margin-top:6px}.payment-amount{margin-left:auto;font-size:12px;font-weight:600;white-space:nowrap}.payment-row>button{background:none;border:1px solid #ded6c8;color:#65758a;width:26px;height:26px;border-radius:50%;flex-shrink:0}.payment-row>button:hover{background:#e8dcc8}.category{margin:19px 0}.category-label{font-size:11px}.category-label strong{font-weight:550}.category-label em{display:none}.bar{height:5px;background:#eee7dc}.category-foot{font-size:9px;color:#a29a8d;display:block;margin-top:22px}.pension-intro{background:#e9dfcf;border-color:#ded1bf}.pension-heart{color:#b4a185}.tag{color:#7c7163}.status.done{background:#e5ebf2;color:#536d90}.green{color:#526d91}.sidebar-note{display:none}.auth-card .brand-icon{background:#172c49;color:#e6d4b5}
@media(min-width:1450px){.overview-stats .stat strong{font-size:38px}main{padding:48px 56px}}
@media(max-width:1150px){.overview-stats .stat{padding:23px 18px}.overview-stats .stat strong{font-size:28px}.overview-panels{grid-template-columns:1.2fr 1fr;gap:18px}.overview-panels .panel{min-height:auto;padding:22px 18px}}
@media(min-width:761px) and (max-width:960px){.overview-panels{grid-template-columns:1fr}}
@media(max-width:760px){aside{background:#172c49;padding-top:6px}nav button{color:#b6c0ce}nav button.active{background:#e6d4b5}.sidebar-bottom{display:none}main{padding:26px 18px 100px}header{margin-bottom:22px}.overview-stats{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}.overview-stats .balance{grid-column:1/-1;min-height:142px}.overview-stats .stat{padding:20px 18px;min-height:138px}.overview-stats .stat strong{font-size:25px;margin:17px 0 10px}.overview-stats .balance strong{font-size:36px}.overview-stats .stat>span{font-size:11px}.overview-stats .stat small{font-size:9px;line-height:1.5;display:block}.overview-panels{grid-template-columns:1fr;gap:18px}.overview-panels .panel{padding:22px 18px}.payment-row{gap:10px}.payment-amount{font-size:11px}.payment-description strong{font-size:11px}.demo-banner{font-size:8px;line-height:1.5;margin-bottom:23px}.pension-stats .stat.balance{background:#172c49}}