:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#203d36;background:#f4f5ef;font-size:16px}*{box-sizing:border-box}body{margin:0}header{max-width:980px;margin:auto;padding:28px 24px 16px;display:flex;align-items:center;justify-content:space-between}header small{color:#647970;font-size:12px;letter-spacing:2px}h1{font-size:26px;margin:8px 0}h1 span{color:#b99552;margin-left:12px}h2{font-size:30px;margin:8px 0 24px;letter-spacing:1px}h3{font-size:17px}button,input,select{font:inherit}button{cursor:pointer;border:1px solid #dae2d9;background:#fff;color:#234f42;border-radius:12px;padding:11px 15px;min-height:44px}button:disabled{opacity:.5;cursor:wait}button.selected{background:#164e43;color:#fff;border-color:#164e43}.status{padding:10px 20px;text-align:center;background:#e8ecdf;color:#526745;font-size:12px}main{max-width:980px;margin:auto;padding:18px 24px 130px}.intro p{font-size:13px;color:#778079}.card{background:#fff;border:1px solid #e3e6dc;border-radius:22px;padding:24px;margin-bottom:20px;box-shadow:0 5px 22px #183f3004}.segments{display:flex;gap:8px}.segments button{flex:1}label{display:block;font-size:13px;color:#607168;margin:16px 0 10px}input,select{display:block;width:100%;margin-top:8px;padding:13px;border:1px solid #dce3d9;border-radius:10px;background:#fcfdf9;color:#263b34;font-size:16px;min-width:0}.amount-label{margin:28px 0}.amount-label span{float:right}.amount-label input{font-size:48px;background:white;border:0;border-bottom:1px solid #e2e7df;border-radius:0;padding:8px 0;font-weight:600;font-variant-numeric:tabular-nums}.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.shortcuts{display:flex;gap:8px;margin:12px 0}.shortcuts button{background:#f6f7f1;font-size:13px;padding:8px 14px}details{margin:22px 0}summary{cursor:pointer;color:#66796e;font-size:14px;min-height:35px}.primary{background:#164e43;color:white;border:0;width:100%;font-weight:600;padding:16px}.section-head{display:flex;justify-content:space-between;align-items:center}.section-head span,.muted{font-size:12px;color:#77857b}.row{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid #e3e6dc;border-radius:16px;padding:16px;margin:9px 0}.row .icon{background:#edf2e6;border-radius:13px;min-width:43px;padding:10px;text-align:center}.row .info{flex:1;min-width:0}.row .info small{display:block;color:#839084;margin-top:5px;font-size:11px;overflow-wrap:anywhere}.row strong{font-variant-numeric:tabular-nums}.row .actions{display:flex;gap:5px}.row .actions button{font-size:12px;padding:7px}.empty{text-align:center;color:#7e8b7f;padding:30px;font-size:14px}.total-card{display:flex;flex-direction:column;gap:12px;background:#164e43;color:#fff;border-radius:22px;padding:30px;margin:20px 0}.total-card strong{font-size:42px;font-variant-numeric:tabular-nums}.total-card span{font-size:12px;color:#c3d8c9}.period-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:15px 0;font-size:12px}.period-nav button{font-size:12px;padding:8px}.bar{height:7px;background:#e9eee4;border-radius:5px;margin:10px 0 18px}.bar i{display:block;height:100%;background:#9aad7d;border-radius:5px}.category-line{display:flex;justify-content:space-between;font-size:14px}.fund-card{background:#fff;padding:20px;border-radius:18px;border:1px solid #e3e6dc;margin-bottom:16px}.fund-card p{font-size:12px;color:#7b897d}.fund-card strong{font-size:23px}nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:12px;background:#fcfdf9ed;border-top:1px solid #e0e5db;padding:12px 16px calc(12px + env(safe-area-inset-bottom));backdrop-filter:blur(10px)}nav button{border:0;min-width:100px;background:transparent}#notice{position:fixed;bottom:95px;left:50%;transform:translateX(-50%);background:#203d36;color:white;padding:14px 20px;border-radius:16px;max-width:90vw;width:max-content;z-index:5;box-shadow:0 8px 25px #0002}#notice button{margin-left:12px;padding:7px 12px;min-height:35px}a{color:#164e43}[hidden]{display:none!important}:focus-visible{outline:3px solid #c5ab70;outline-offset:3px}@media(min-width:760px){#entry{max-width:650px;margin:auto}#reports{max-width:820px;margin:auto}}@media(max-width:500px){header{padding:22px 18px 12px}main{padding:16px 14px 140px}.card{padding:20px}.row{flex-wrap:wrap}.row .actions{width:100%;justify-content:flex-end}.period-nav{flex-wrap:wrap}.period-nav span{order:-1;width:100%;text-align:center}.section-head span{font-size:10px}nav{gap:0}nav button{flex:1;min-width:0}}
/* Daily overview and entry sheet */
:root{background:#f6f7fb;color:#28364b}header{max-width:1080px;padding-top:24px}header small{letter-spacing:1.5px;color:#8a92a2}h1{font-size:23px;letter-spacing:1px}h1 span{color:#7e91ba}header button{border:1px solid #e5e9f0;color:#526482}.status{background:transparent;color:#8993a3;text-align:left;max-width:1080px;margin:auto;padding:0 24px 12px;font-size:11px}main{max-width:1080px;padding-top:14px}.dashboard-heading{display:flex;justify-content:space-between;align-items:center;margin:6px 0 24px}.dashboard-heading p{font-size:10px;letter-spacing:2px;color:#98a0b1;margin:0 0 8px}.dashboard-heading h2{font-size:28px;margin:0;letter-spacing:1px}.currency-badge{font-size:11px;color:#7b879b;border:1px solid #e0e5ef;border-radius:30px;padding:8px 12px}.period-tabs{display:flex;background:#e9edf5;border-radius:14px;padding:5px;gap:5px;max-width:440px;margin:0 auto 20px}.period-tabs button{background:none;border:0;flex:1;color:#818da3;border-radius:10px;font-size:14px;min-height:39px;padding:8px}.period-tabs button.selected{background:white;color:#354e7c;box-shadow:0 2px 7px #28364b0c;font-weight:600}.date-toolbar{display:flex;align-items:center;justify-content:space-between;max-width:440px;margin:0 auto 20px;text-align:center}.date-toolbar>button{width:40px;padding:0;border-color:#e1e7f0;color:#7b88a0;font-size:25px;min-height:40px}.date-toolbar strong{font-size:14px;color:#50617c}.date-picker{font-size:10px;margin:7px 0 0;display:flex;align-items:center;justify-content:center;gap:8px;color:#8e98aa}.date-picker input{font-size:11px;border:0;background:none;padding:0;width:115px;margin:0;color:#8e98aa}.total-card{background:linear-gradient(120deg,#344e7b,#506f9d);padding:28px 32px;position:relative;overflow:hidden;box-shadow:0 12px 32px #3e597b1a;margin:0 0 26px;border-radius:24px;gap:14px}.total-card::after{content:'';position:absolute;width:240px;height:240px;border:1px solid #ffffff14;border-radius:50%;right:-65px;top:-110px;pointer-events:none}.hero-top{display:flex;justify-content:space-between;align-items:center}.hero-top small{font-size:13px;letter-spacing:1px}.hero-top>span{font-size:10px;background:#ffffff12;padding:5px 10px;border-radius:30px;color:#d3dfed}.total-card>strong{font-size:52px;font-weight:500;letter-spacing:-1px}.total-card>strong::before{content:'$';font-size:24px;margin-right:8px;opacity:.65}.total-card .hero-note{color:#c5d3e5;font-size:11px}.hero-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;border-top:1px solid #ffffff20;padding-top:20px;margin-top:4px}.hero-metrics div{display:flex;flex-direction:column;gap:7px}.hero-metrics small{font-size:10px;color:#c5d3e5}.hero-metrics b{font-size:17px;font-weight:500;font-variant-numeric:tabular-nums}.card{border:1px solid #edf0f5;box-shadow:0 4px 20px #23365203;border-radius:20px;padding:22px}.analysis-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:22px}.section-head{margin:0 0 14px}.section-head h3{font-size:16px;margin:0;color:#3c4e6a}.section-head span{color:#97a0af;font-size:10px}.category-item{display:block;width:100%;border:0;padding:10px 0 0;background:none;text-align:left;min-height:60px;border-radius:0;color:#4b5d79}.category-item .bar{height:6px;margin:12px 0;background:#eef1f6}.category-item .bar i{background:#92a6c8}.category-line{font-size:13px}.category-line span:last-child{font-size:12px;color:#8291a9}.fund-card{padding:20px;border:1px solid #edf0f5;border-radius:18px;background:#fff}.fund-card h3{font-size:12px;color:#8593ab;margin:0 0 12px}.fund-card strong{color:#435b82;font-size:23px;font-weight:500}.fund-card p{font-size:10px;color:#98a2b2;line-height:1.8}.fund-card p:last-child{border-top:1px solid #eff1f5;padding-top:10px}.analysis-grid #funds{grid-template-columns:1fr}.analysis-grid .fund-card{margin-bottom:0}.analysis-grid{margin-bottom:28px}.row{background:#fff;border-color:#edf0f5;padding:18px;border-radius:16px;gap:14px}.row .icon{background:#edf1f8;color:#627ba6;font-size:19px}.row .info>span{font-size:14px;color:#3b4e69}.row .info small{font-size:10px;color:#99a3b2}.row strong{font-size:17px;color:#41587f;font-weight:500}.row .actions button{border:0;background:#f6f8fc;color:#8998b0;font-size:11px;min-height:36px}.filters{background:#edf1f7;padding:0 18px 12px;border-radius:15px;margin-bottom:15px}.filters label{font-size:11px}#filter-toggle{padding:5px 13px;min-height:33px;border-color:#e2e7ef;font-size:11px;color:#8293ad}.empty{background:white;border:1px dashed #dee5ef;border-radius:18px;padding:35px 15px;color:#93a0b3;line-height:2;font-size:13px}.empty small{font-size:11px;color:#abb4c2}nav{background:#fffffff2;border-color:#e8ecf3;gap:30px;box-shadow:0 -4px 20px #2e3b5304}nav button{color:#9ba6b8;font-size:13px}nav button.selected{background:none;color:#405e8c;font-weight:600}nav .add-entry{background:#405d8a;color:white;border-radius:15px;min-width:150px;box-shadow:0 5px 14px #405d8a25}nav .add-entry span{font-size:23px;vertical-align:middle;margin-right:6px}dialog{border:0;border-radius:26px;padding:24px;width:min(540px,calc(100% - 28px));max-height:90dvh;overflow-y:auto;background:#fff;color:#344762;box-shadow:0 25px 80px #15274135}dialog::backdrop{background:#14243e65;backdrop-filter:blur(5px)}.sheet-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.sheet-head h2{font-size:24px;margin:6px 0 0}.sheet-head small{font-size:11px;color:#9aa5b5}.sheet-head button{border:0;background:#f1f4f9;border-radius:50%;width:36px;min-height:36px;padding:0;color:#8b9ab0}dialog .card{padding:0;border:0;box-shadow:none;margin:0}dialog .amount-label input{font-size:44px;color:#3c547c}dialog .segments{background:#f1f4f9;padding:4px;border-radius:12px}dialog .segments button{border:0;background:none;color:#8796ab;font-size:13px;padding:10px}dialog .segments button.selected{background:white;box-shadow:0 2px 8px #21334e0a;color:#3d5a86}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:12px 0 22px}.category-choice{display:flex;flex-direction:column;align-items:center;gap:8px;border:1px solid transparent;background:#f6f8fc;padding:13px 5px;color:#8998b1;border-radius:14px}.category-choice span{font-size:24px;line-height:30px}.category-choice small{font-size:11px}.category-choice[aria-pressed=true]{background:#edf2fb;border-color:#7896c2;color:#345787;box-shadow:0 0 0 1px #7896c2}.primary{background:#405d8a;border-radius:14px}input,select{border-color:#e3e9f1;background:#fbfcfe;color:#526780}label{color:#8695ab}dialog details{margin:18px 0}dialog summary{color:#8c9aaf;font-size:12px}.shortcuts button{background:#f5f7fb;color:#7a8da9;border-color:#e6ebf3;font-size:11px}#notice{background:#354d71;font-size:12px}dialog #notice{position:sticky;transform:none;bottom:0;left:0;margin-top:10px;max-width:100%;width:100%;box-shadow:none}#percentage-note{font-size:10px;line-height:1.7}button:focus-visible{outline-color:#92abd4}
@media(min-width:760px){#reports{max-width:920px}.total-card{padding:32px 40px}.hero-metrics{max-width:520px}.analysis-grid #funds{grid-template-columns:1fr 1fr}.row .actions{width:auto;margin-left:14px}.row{flex-wrap:nowrap}}
@media(max-width:600px){header{padding:22px 20px 12px}.status{padding:0 20px 12px}main{padding:12px 18px 130px}.dashboard-heading h2{font-size:25px}.dashboard-heading{margin-bottom:20px}.currency-badge{font-size:10px;padding:7px 9px}.total-card{padding:25px}.total-card>strong{font-size:47px}.analysis-grid{grid-template-columns:1fr;gap:0}.analysis-grid #funds{grid-template-columns:1fr 1fr;gap:12px}.category-card{margin-bottom:22px}.fund-card{padding:16px}.fund-card p{font-size:10px}.row{flex-wrap:wrap}.row .actions{width:100%;margin-top:0;justify-content:flex-end;border-top:1px solid #f3f5f8;padding-top:8px}.row .actions button{padding:5px 12px}.row strong{font-size:16px}nav{gap:10px;padding-left:20px;padding-right:20px}nav button{flex:1;min-width:0}nav .add-entry{min-width:135px;flex:1.35}dialog{margin:auto auto 0;width:100%;max-width:540px;border-radius:25px 25px 0 0;padding:22px 22px calc(22px + env(safe-area-inset-bottom));max-height:94dvh}.category-grid{gap:8px}.category-choice{padding:11px 3px}#notice{bottom:100px}}
.analysis-grid{align-items:start}.category-card{min-height:185px}.total-card .hero-note{color:#e0e8f4}.hero-metrics small{color:#d7e1ee}.row .info small{color:#77869b}.fund-card p{color:#78869b}.category-choice{color:#677b9b}.status{color:#788598}
@media(max-width:759px){.analysis-grid{grid-template-columns:1fr;gap:0}.analysis-grid #funds{grid-template-columns:1fr 1fr;gap:12px}.category-card{margin-bottom:22px}.fund-card{padding:18px}.category-card{min-height:135px}}
/* Larger supporting text for comfortable reading */
header small,.status,.currency-badge,.dashboard-heading p,.date-picker,.date-picker input,.hero-top small,.hero-top>span,.total-card .hero-note,.hero-metrics small,.section-head span,.category-line span:last-child,.fund-card h3,.fund-card p,.row .info small,.row .actions button,.filters label,#filter-toggle,.empty small,.sheet-head small,.category-choice small,dialog .segments button,dialog summary,.shortcuts button,#notice,#percentage-note,.muted{font-size:14px}
label,.category-line,.row .info>span,nav button{font-size:16px}.hero-metrics b{font-size:20px}.category-choice{min-height:90px}.fund-card p{line-height:1.8}.row .actions button{min-height:44px}.section-head{gap:12px}.section-head span{text-align:right}.hero-top>span{padding:7px 12px}.dashboard-heading p{letter-spacing:1px;font-size:12px}.date-picker input{width:145px}.date-picker{margin-top:10px}#sync-state{font-size:15px;line-height:1.7;color:#4b6388}#sync-login{margin:16px 0}.analysis-grid #funds{grid-template-columns:1fr}.row .info small{line-height:1.7}
@media(max-width:759px){.analysis-grid #funds{grid-template-columns:1fr}.currency-badge{font-size:12px}.hero-metrics{gap:8px}.hero-metrics small{font-size:13px}.hero-metrics b{font-size:18px}.category-choice small{font-size:14px}.fund-card h3,.fund-card p,.row .info small{font-size:14px}.section-head span{font-size:13px}}
.auto-toggle{display:flex;align-items:center;gap:12px;padding:15px;background:#edf2fb;border-radius:12px}.auto-toggle input{width:22px;height:22px;min-width:22px;margin:0}.status{line-height:1.8}#disconnect-backup{margin-top:10px}

#notice{display:flex;align-items:center;gap:10px}#notice>span{flex:1;line-height:1.6}#notice #notice-close{flex-shrink:0;padding:4px 10px;margin:0;background:transparent;color:inherit;border-color:#ffffff55}#notice.error{background:#8c3540}.payday-setting{display:flex;align-items:center;gap:12px;margin:0 0 10px}.payday-setting select{width:100px;margin:0}.filters{margin-bottom:18px}#fund-range{line-height:1.6}

.row[role="button"]{cursor:pointer}.row[role="button"]:hover{border-color:#9baed0;background:#fafbff}.record-chevron{font-size:24px;color:#8b9bb5}.danger{color:#a33742;border-color:#e5bfc5}#edit-actions{margin:18px 0}#savings-wrap{margin-top:18px}

.spending-chart{width:190px;height:190px;border-radius:50%;margin:18px auto 24px;display:grid;place-items:center;box-shadow:0 7px 22px #334e7b12}.chart-center{width:138px;height:138px;background:white;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.chart-center small{font-size:13px;color:#8a96a8}.chart-center strong{font-size:25px;color:#405676;max-width:125px;overflow-wrap:anywhere}.legend-item{display:grid;grid-template-columns:10px 1fr auto 48px;gap:10px;align-items:center;width:100%;padding:11px 0;border:0;border-bottom:1px solid #f0f2f6;border-radius:0;background:none;text-align:left;font-size:14px;color:#54647c}.legend-item i{width:9px;height:9px;border-radius:50%}.legend-item strong{font-size:14px;font-weight:600}.legend-item small{font-size:12px;text-align:right;color:#8a96a8}.savings-card{background:linear-gradient(150deg,#fff,#f1f6f4);padding:26px}.savings-card h3{font-size:14px;color:#668a7e}.savings-card .savings-total{display:block;font-size:38px;letter-spacing:-1px;color:#3c6c5c;margin:8px 0 22px}.savings-metrics{display:grid;grid-template-columns:1fr 1fr;gap:20px 12px;padding-bottom:22px}.savings-metrics div{display:flex;flex-direction:column;gap:7px}.savings-metrics small{font-size:13px;color:#81948b}.savings-metrics b{font-size:18px;font-weight:600;color:#425f54;overflow-wrap:anywhere}.savings-accounts{border-top:1px solid #dfe9e3;padding-top:14px}.savings-accounts>div{display:flex;justify-content:space-between;padding:10px 0;font-size:14px;color:#71897e}.savings-accounts b{color:#486b5c}.filters{display:flex;gap:12px;align-items:center}.filters label{display:flex;align-items:center;gap:8px;flex:1;min-width:0;font-size:13px;margin:0}.filters select{flex:1;min-width:0;width:auto;margin:0;padding:8px 24px 8px 9px;font-size:13px;min-height:36px}.refund-back{margin:0 0 14px;background:#edf2f9;border:0;color:#536c92;font-size:14px}@media(max-width:500px){.filters{gap:8px}.filters label{gap:5px;font-size:12px}.filters select{font-size:12px;padding-right:18px}.savings-card .savings-total{font-size:34px}}

/* Equal mobile filter columns with native touch controls. */
#filters{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;background:transparent;padding:0;align-items:start}#filters label{display:block;min-width:0;margin:0;color:#77869c;font-size:13px;line-height:20px}#filters select{display:block;width:100%;height:44px;min-height:44px;margin:6px 0 0;padding:0 32px 0 12px;font-size:16px;line-height:normal;border:1px solid #e1e7f0;border-radius:12px;background-color:#fff;color:#4c607c;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='m2 2 4 4 4-4' fill='none' stroke='%238494ab' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}@media(max-width:759px){.row[role="button"]{flex-wrap:nowrap;gap:10px}.row[role="button"] .info{min-width:0}.row[role="button"]>strong{white-space:nowrap}.row[role="button"] .record-chevron{flex-shrink:0}.savings-card{padding:22px}}

/* Subtle scrolling indicators retain native scrolling behavior. */
html,dialog{scrollbar-width:thin;scrollbar-color:#a5b1c04d transparent}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#a5b1c04d;border-radius:8px}::-webkit-scrollbar-thumb:hover{background:#8998ab80}

/* Warm paper, deep teal, and quiet accents for a personal mobile journal. */
:root{background:#f7f6f2;color:#324b46;--ink:#324b46;--teal:#36786b;--muted:#788d85;--line:#e6ebe5}
body{background:radial-gradient(ellipse at 90% 0,#e7efe5 0,transparent 450px),#f7f6f2}
header{padding:24px 22px 12px}header small{color:#7b9085;font-size:12px;letter-spacing:1px}h1{color:#315c50;font-size:24px;letter-spacing:2px}h1 span{color:#d4a96d}header>button{background:#ffffffb0;border-color:#e1e7dd;color:#62786c;border-radius:50px;font-size:14px;padding:8px 17px}
.status{color:#829086;font-size:12px;line-height:1.6;padding:0 22px 8px}.dashboard-heading{margin:14px 0 22px}.dashboard-heading p{color:#85978b;font-size:13px;letter-spacing:1px;margin-bottom:9px}.dashboard-heading h2{font-size:28px;font-weight:650;letter-spacing:1px;color:#324e43}.currency-badge{color:#758a7d;border-color:#dde5d9;background:#ffffff66;font-size:11px;padding:7px 10px}
.period-tabs{background:#eaece5;border:1px solid #e3e8df;padding:4px;border-radius:16px}.period-tabs button{color:#7b8c80;font-size:14px;min-height:40px}.period-tabs button.selected{color:#3f6b59;background:#fffefb;box-shadow:0 3px 9px #395c4610;border-radius:12px}.date-toolbar{margin-bottom:20px}.date-toolbar strong{color:#536e5e;font-size:14px}.date-toolbar>button{border:0;background:#e9eee5;color:#708671;border-radius:50%;width:38px;min-height:38px}.date-picker,.date-picker input{color:#8b988b;font-size:12px}
.total-card{background:linear-gradient(125deg,#33665a,#4e8a75);border:1px solid #ffffff30;border-radius:28px;padding:28px;box-shadow:0 12px 26px #3b69551c;gap:15px}.total-card::after{width:225px;height:225px;top:-92px;right:-67px;border:32px solid #ffffff06}.hero-top small{font-size:15px;letter-spacing:1px;color:#e2efe4}.hero-top>span{font-size:12px;background:#ffffff13;color:#dcebd9;padding:6px 10px}.total-card>strong{font-size:56px;font-weight:550;letter-spacing:-2px;line-height:1.2}.total-card>strong::before{font-size:27px;color:#d4e6d6}.total-card .hero-note{color:#c4dace;font-size:12px}.hero-metrics{padding-top:18px;gap:10px}.hero-metrics small{font-size:12px;color:#cfe1d3}.hero-metrics b{font-size:19px;color:#f5f9f2;font-weight:550}
.card,.row,.fund-card{border-color:#e9ece5;box-shadow:0 5px 20px #54694a05}.card{border-radius:25px;background:#fffefb;padding:23px}.section-head{margin-bottom:16px}.section-head h3{color:#455e50;font-size:17px;letter-spacing:.5px}.section-head span{color:#94a18f;font-size:12px}.category-card{background:#fffefb}.spending-chart{box-shadow:0 8px 25px #7f937815;width:184px;height:184px}.chart-center{background:#fffefb;width:132px;height:132px}.chart-center small{color:#8c9a89;font-size:12px}.chart-center strong{color:#486453;font-size:25px}.legend-item{color:#647562;border-bottom-color:#eff0e8;gap:9px;font-size:14px}.legend-item strong{color:#4d6853}.legend-item small{color:#8c9a88}
.savings-card{background:linear-gradient(145deg,#eff3e7,#e6edde);border:1px solid #dfe7d7;border-radius:25px;padding:25px;box-shadow:0 6px 20px #697e5108}.savings-card h3{color:#758865;font-size:14px}.savings-card .savings-total{color:#526f43;font-size:40px;letter-spacing:-1px}.savings-metrics{gap:21px 14px}.savings-metrics small{color:#879578;font-size:12px}.savings-metrics b{color:#5d7650;font-size:18px}.savings-accounts{border-color:#d6dfcd}.savings-accounts>div{color:#7b8c6a;font-size:14px}.savings-accounts b{color:#5c764b}
#filters{gap:10px;margin-bottom:16px}#filters label{color:#8a9985;font-size:12px}#filters select{border-color:#e1e6dc;background-color:#fffefb;color:#61735b;border-radius:13px;font-size:15px;height:44px;padding-left:12px}.row{border-radius:20px;background:#fffefb;margin:10px 0;padding:17px 15px;gap:11px}.row .icon{background:#f1eee4;border:1px solid #ebe9dc;border-radius:15px;min-width:42px;padding:10px;color:#8c947b}.row .info>span{color:#4a6051;font-weight:550;font-size:16px}.row .info small{color:#94a08d;font-size:12px;line-height:1.7;margin-top:5px}.row>strong{color:#526849;font-size:18px;font-weight:600}.record-chevron{color:#bdc6b4;font-size:22px}.row[role="button"]:hover{border-color:#cbd8c1;background:#fffffc}
nav{background:#fffefbd9;backdrop-filter:blur(18px);border-color:#e2e6dc;box-shadow:0 -4px 20px #52694b05;padding:12px 16px calc(12px + env(safe-area-inset-bottom));gap:10px}nav button{color:#9da88f;font-size:14px;border-radius:16px}nav button.selected{color:#547249;background:#eff3e8}nav .add-entry{background:linear-gradient(125deg,#427b65,#5a9273);color:#fffdf4;border:1px solid #ffffff20;box-shadow:0 5px 13px #46725825;border-radius:18px;font-weight:600;min-height:52px}nav .add-entry span{color:#dbe9c9}
dialog{background:#f7f7f0;border:1px solid #e1e7d8;border-radius:28px;padding:24px;box-shadow:0 20px 70px #30433330}dialog::backdrop{background:#263f3659;backdrop-filter:blur(4px)}.sheet-head h2{color:#3c5e4b;font-size:26px}.sheet-head small{color:#8a9b80}.sheet-head>button{background:#e9eee1;color:#839576;border-radius:50%;border:0}.sheet-head{align-items:center}#form{background:transparent;padding:0;border:0;box-shadow:none}.segments{background:#e9eddf;border-radius:15px;padding:4px;gap:4px}.segments button{background:transparent;border:0;color:#89977c;border-radius:11px}.segments button.selected{background:#fffef7;color:#507348;box-shadow:0 2px 6px #536d3c0c}.amount-label{color:#718568}.amount-label input{background:transparent;color:#42683e;border-bottom-color:#dce4d3;font-size:50px;letter-spacing:-1px}.category-choice{border-color:#e4e9db;background:#fffef8;border-radius:17px}.category-choice[aria-pressed="true"]{background:#edf3e4;border-color:#a7c190;color:#547842;box-shadow:0 3px 10px #6485460b}label{color:#819475}input,select{background:#fffef9;border-color:#e2e8d9;color:#576d4c;border-radius:13px}input:focus,select:focus{outline-color:#b5ca9f}.primary{background:linear-gradient(125deg,#477b63,#639575);color:#fffef5;border-radius:16px;box-shadow:0 5px 12px #4e7e5e15;min-height:52px}.refund-back{background:#e9f0df;color:#698854}.muted{color:#8c9d83}#notice{background:#426b53;border-radius:18px;font-size:14px}.empty{color:#8d9b83;line-height:1.7}:focus-visible{outline:3px solid #c8b787;outline-offset:3px}
@media(max-width:759px){header{padding:23px 20px 10px}.status{padding:0 20px 8px}main{padding:12px 18px 125px}.dashboard-heading h2{font-size:27px}.dashboard-heading{gap:12px}.analysis-grid{gap:0}.total-card{padding:25px 24px}.total-card>strong{font-size:53px}.hero-metrics b{font-size:18px}.category-card{margin-bottom:25px}.savings-card{padding:24px}.analysis-grid{margin-bottom:29px}.row .info small{font-size:12px}.row>strong{font-size:17px}dialog{margin:auto auto 0;max-width:540px;width:100%;border-radius:28px 28px 0 0;padding:24px 22px calc(24px + env(safe-area-inset-bottom));max-height:94dvh}nav .add-entry{min-width:128px}#filters select{font-size:16px}}
@media(prefers-reduced-motion:no-preference){button,.row{transition:background-color .18s,border-color .18s,box-shadow .18s}button:active:not(:disabled){transform:translateY(1px)}}
dialog .segments{background:#e9eddf}dialog .segments button{color:#7b8c6d;background:transparent}dialog .segments button.selected{background:#fffef7;color:#507348}dialog .amount-label input{color:#42683e}dialog .category-choice small{color:#78896d}dialog .category-choice[aria-pressed="true"] small{color:#547842}

/* Centered dialogs keep their full rounded frame within the viewport. */
dialog#entry-dialog{margin:auto;width:calc(100% - 32px);max-width:540px;max-height:calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:0;border-radius:26px;overflow:hidden}
#entry-dialog #entry{max-height:calc(100dvh - 44px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;padding:0 22px 24px;scrollbar-width:thin}
#entry-dialog .sheet-head{position:sticky;top:0;z-index:3;background:#f7f7f0;margin:0 -22px 12px;padding:22px 22px 12px;align-items:flex-start;border-bottom:1px solid #e5eadd;box-shadow:0 6px 10px #f7f7f0cc}
#entry-dialog .sheet-head>div{padding-right:48px}#entry-dialog #close-entry{position:absolute;right:16px;top:16px;width:44px;height:44px;padding:0;display:grid;place-items:center;font-size:21px;flex-shrink:0}
:root{font-size:17px}button,input,select{font-size:17px}.status,header small{font-size:14px}.dashboard-heading p{font-size:15px}.currency-badge{font-size:13px}.period-tabs button{font-size:16px}.date-toolbar strong{font-size:16px}.date-picker,.date-picker input{font-size:14px}.hero-top small{font-size:17px}.hero-top>span,.total-card .hero-note,.hero-metrics small{font-size:14px}.hero-metrics b{font-size:20px}.section-head h3{font-size:19px}.section-head span{font-size:14px}.chart-center small{font-size:14px}.legend-item,.legend-item strong{font-size:16px}.legend-item small{font-size:14px}.savings-card h3{font-size:16px}.savings-metrics small{font-size:14px}.savings-metrics b{font-size:20px}.savings-accounts>div{font-size:16px}#filters label{font-size:14px}.row .info>span{font-size:18px}.row .info small{font-size:14px}.row>strong{font-size:19px}nav button{font-size:16px}.sheet-head small,dialog label,dialog .category-choice small,dialog .segments button,.muted,#notice{font-size:16px}.empty{font-size:16px}
@media(prefers-reduced-motion:no-preference){
 button,input,select,.category-choice,.row[role="button"]{transition:background-color .2s,border-color .2s,color .2s,box-shadow .2s,transform .16s}
 button:active:not(:disabled),.row[role="button"]:active{transform:scale(.96)}
 .category-choice[aria-pressed="true"]{animation:choice-pop .22s ease-out}
 #entry-dialog[open]{animation:dialog-in .24s cubic-bezier(.2,.8,.2,1)}#entry-dialog[open]::backdrop{animation:backdrop-in .24s ease-out}
 #entry-dialog.closing{animation:dialog-out .16s ease-in forwards}#entry-dialog.closing::backdrop{animation:backdrop-out .16s ease-in forwards}
 .page:not([hidden]){animation:page-in .22s ease-out}#notice:not([hidden]){animation:notice-in .2s ease-out}
 @keyframes dialog-in{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
 @keyframes dialog-out{to{opacity:0;transform:translateY(10px) scale(.97)}}
 @keyframes backdrop-in{from{opacity:0}to{opacity:1}}@keyframes backdrop-out{to{opacity:0}}
 @keyframes choice-pop{50%{transform:scale(1.04)}}@keyframes page-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
 @keyframes notice-in{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
}
@media(max-width:380px){main{padding-left:14px;padding-right:14px}.hero-metrics small{font-size:13px}.currency-badge{font-size:12px}.legend-item{gap:7px}.legend-item,.legend-item strong{font-size:15px}#entry-dialog #entry{padding-left:18px;padding-right:18px}#entry-dialog .sheet-head{margin-left:-18px;margin-right:-18px;padding-left:18px;padding-right:18px}}

header.brand-banner{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;margin:18px auto 14px;padding:22px 26px;max-width:1032px;width:calc(100% - 36px);background:linear-gradient(110deg,#365f51,#648c6e);border:1px solid #ffffff40;border-radius:22px;box-shadow:0 7px 20px #42644d12}.brand-banner small{color:#d5e2cf;font-size:13px;letter-spacing:1px}.brand-banner h1{font-size:30px;letter-spacing:4px;color:#fffef2;margin:8px 0 0}.brand-banner h1 span{font-size:16px;color:#e7c99c;vertical-align:middle;margin-left:14px}.brand-mark{font-size:80px;line-height:1;color:#d8e6c63b;position:absolute;right:20px;top:3px;pointer-events:none}.period-tabs{max-width:480px}.period-tabs button{padding:8px 4px}nav{gap:5px}nav button{min-width:0;flex:1;padding:9px 5px;font-size:14px}nav .add-entry{min-width:0;flex:1.4;font-size:15px;white-space:nowrap}@media(max-width:759px){header.brand-banner{margin-top:16px;padding:20px 22px}.brand-banner h1{font-size:28px}.period-tabs button{font-size:15px}nav{padding-left:12px;padding-right:12px;gap:4px}nav .add-entry{min-width:0}.brand-banner small{font-size:13px}}
/* Mobile native date controls must be allowed to shrink inside grid tracks. */
#form>.grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}#form>.grid>label{min-width:0;width:100%}#form #date,#form #payment{box-sizing:border-box;width:100%;max-width:100%;min-width:0;height:50px;margin-top:8px;font-size:16px;padding:10px 11px}#form #date{appearance:none;-webkit-appearance:none;display:block}#form #date::-webkit-date-and-time-value{min-width:0;text-align:left}#form #date::-webkit-datetime-edit{padding:0;min-width:0}#entry-dialog .category-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}#entry-dialog .category-choice{width:100%;aspect-ratio:1;height:auto;min-height:0;min-width:0;padding:7px 3px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px}#entry-dialog .category-choice>span{font-size:25px;line-height:1}#entry-dialog .category-choice>small{font-size:15px;line-height:1.25}@media(max-width:380px){#form>.grid{grid-template-columns:minmax(0,1fr)}#entry-dialog .category-choice>small{font-size:14px}}

nav{display:grid;grid-template-columns:1fr 1fr 1.35fr 1fr 1fr;align-items:center;gap:4px}nav button{width:100%;min-width:0;padding:10px 2px;font-size:13px;white-space:nowrap}nav .add-entry{min-width:0;font-size:14px;min-height:52px}#records{max-width:820px;margin:auto}#record-search{margin-bottom:20px}@media(max-width:380px){nav{padding-left:8px;padding-right:8px;gap:2px}nav button{font-size:12px}nav .add-entry{font-size:13px}}

.amount-label{position:relative;padding-top:5px}.amount-label #currency{position:absolute;right:0;top:-4px;width:145px;height:38px;padding:5px 8px;font-size:14px;margin:0}.amount-label>input{clear:both;margin-top:18px}#currency-conversion{background:#eaf0e2;padding:10px 12px;border-radius:12px;line-height:1.6;margin-top:-10px}#update-rates,#save-rate{margin:5px 5px 12px 0}
