/* A calm, high-contrast finance workspace, with the same touch layout on iOS. */
:root{--surface:#fff;--page:#f4f6fa;--ink:#172338;--muted:#67748a;--accent:#5266e8;--good:#087c6d;--bad:#c45631;--line:#e3e8f0;--glass:rgba(255,255,255,.88);color:var(--ink);background:var(--page);color-scheme:light;font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
html[data-theme=dark]{--surface:#162132;--page:#0b1320;--ink:#eef3fc;--muted:#a5b3c8;--accent:#a0adff;--good:#75dec5;--bad:#ffb38d;--line:#2c3a50;--glass:rgba(22,33,50,.9);color-scheme:dark}
body{background:var(--page);color:var(--ink)}
button{background:var(--accent);color:#fff;border-radius:14px;font-weight:650;transition:background .16s,transform .16s}
button:active{transform:translateY(1px)}html[data-theme=dark] button{color:#101a30}
input,textarea,select{background:var(--page);color:var(--ink);border:1px solid var(--line);border-radius:12px}
input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent)}
.glass,.card{background:var(--surface);border-color:var(--line);box-shadow:0 4px 22px rgba(20,35,70,.035)}
.shell{grid-template-columns:232px minmax(0,1fr);gap:38px;padding:24px}
.sidebar{background:var(--surface);border-radius:24px;height:calc(100dvh - 48px);top:24px;padding:22px 14px}
.brand{padding:0 8px;letter-spacing:-.4px;margin-bottom:32px}.mark{color:#fff;background:linear-gradient(140deg,#5870f1,#8d60d9);box-shadow:0 7px 16px #5266e825;border-radius:14px}
.sidebar nav button{color:var(--muted);padding:13px 14px;font-weight:550;text-align:left}
.sidebar nav button:hover,.sidebar nav button.active{background:color-mix(in srgb,var(--accent) 9%,var(--surface));color:var(--accent)}
.content{max-width:1480px;width:100%;margin:0 auto;padding:8px 0 32px}.content header{margin:0 0 18px;gap:16px}.content header h1{font-weight:750;font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-1px}.content header small{font-size:.7rem;text-transform:uppercase;letter-spacing:2px}
.header-actions{display:flex;gap:10px;align-items:center;min-width:0;max-width:60%}.theme-toggle{border:1px solid var(--line);background:var(--surface);color:var(--ink);width:48px;flex:0 0 48px;font-size:24px}.pill{background:var(--surface);color:var(--muted);border-color:var(--line);font-size:.8rem}
#identity{max-width:300px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#offlineStatus{font-size:.75rem;letter-spacing:.1px;padding:8px 12px;min-height:38px}
.balance-hero{padding:34px 38px;margin:4px 0 20px;border-radius:26px;display:grid;grid-template-columns:1.1fr 1fr;gap:26px;background:linear-gradient(115deg,#1c3154,#334783 70%,#555aad);color:#fff;position:relative;overflow:hidden}
.balance-hero:before{content:'';position:absolute;width:340px;height:340px;border:1px solid #ffffff18;border-radius:50%;right:-110px;top:-120px;box-shadow:0 0 0 40px #ffffff04,0 0 0 80px #ffffff03;pointer-events:none}.balance-hero>div{position:relative;min-width:0}.overline{font-size:.65rem;font-weight:700;letter-spacing:1.7px;color:var(--muted)}.balance-hero .overline{color:#c9d7ff}.balance-hero h2{font-size:clamp(1.6rem,2.6vw,2.4rem);font-weight:650;line-height:1.12;letter-spacing:-.8px;margin:12px 0}.balance-hero p{color:#cbd4e9;font-size:.85rem;max-width:320px;margin:12px 0 0}.hero-balance{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:12px}.hero-balance>span{font-size:.8rem;color:#d6dff6}.hero-balance>strong{font-size:clamp(2rem,3.5vw,3rem);font-weight:650;letter-spacing:-1px;overflow-wrap:anywhere}.hero-balance>button{color:#273c71;background:#fff;font-size:.8rem;box-shadow:0 5px 20px #101e4920}
.finance-metrics{margin-bottom:22px;gap:16px}.metric{padding:22px 24px;position:relative}.metric>span{font-size:.8rem}.metric strong{font-size:clamp(1.5rem,2.4vw,2rem);font-weight:700;letter-spacing:-.7px;margin:12px 0 8px}.metric small{font-size:.75rem;color:var(--muted);font-weight:400;letter-spacing:0}.metric strong small{font-size:1rem}
.trend-card{padding:26px 28px}.section-head{display:flex;justify-content:space-between;gap:12px;align-items:center}.section-head h2{font-size:1.3rem;margin:8px 0 20px;letter-spacing:-.5px}.section-head .pill{flex:0 0 auto}.trend-controls{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}.period-selector{display:flex;gap:6px;padding:4px;background:var(--page);border:1px solid var(--line);border-radius:14px}.period-selector button,.period-selector select{min-height:40px;font-size:.8rem;border:0;width:auto}.period-selector select{max-width:108px}.date-range{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}.date-range>span{align-self:center;color:var(--muted)}.date-range label{display:grid;gap:5px;font-size:.7rem;color:var(--muted)}.date-range input{min-height:40px;font-size:.8rem;padding:8px;min-width:0;max-width:156px}.date-range button{min-height:40px;font-size:.8rem;padding:8px 13px}#trendError:empty{display:none}#trendError{font-size:.85rem;margin:10px 0}
.chart-caption{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin:22px 0 0;font-size:.75rem;color:var(--muted)}.chart-caption>span{display:flex;align-items:center;gap:7px}.chart-caption small{margin-left:auto}.legend-dot{height:8px;width:8px;border-radius:50%;display:inline-block}.legend-dot.income{background:var(--good)}.legend-dot.expense{background:var(--bad)}.finance-chart{display:block;width:100%;height:auto;min-height:190px;max-height:340px;margin:8px 0}.chart-grid{stroke:var(--line);stroke-dasharray:4 5}.chart-label{fill:var(--muted);font-size:12px}.chart-line{fill:none;stroke-width:3;stroke-linejoin:round;stroke-linecap:round}.chart-line.income{stroke:var(--good)}.chart-line.expense{stroke:var(--bad);stroke-dasharray:8 4}.chart-area{opacity:.06}.chart-area.income,.chart-dot.income{fill:var(--good)}.chart-area.expense,.chart-dot.expense{fill:var(--bad)}.chart-dot{stroke:var(--surface);stroke-width:2}.chart-note{font-size:.7rem;line-height:1.5}.trend-statistics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}.stat-group h3{font-size:.8rem;margin-bottom:12px}.stat-group.income h3{color:var(--good)}.stat-group.expense h3{color:var(--bad)}.stat-group dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0}.stat-group dt{font-size:.7rem;color:var(--muted);margin-bottom:5px}.stat-group dd{margin:0;font-size:1.05rem;font-weight:650;overflow-wrap:anywhere}.trend-details{margin-top:20px;border-top:1px solid var(--line);padding-top:10px}.trend-details summary{color:var(--muted);font-size:.8rem;cursor:pointer;min-height:40px;padding:10px 0}.trend-table{overflow:auto}.trend-table table{min-width:440px;display:table;background:var(--surface);font-size:.8rem}.trend-table thead{position:static;clip-path:none;overflow:visible;display:table-header-group;white-space:normal;width:auto;height:auto}.trend-table tbody{display:table-row-group}.trend-table tr{display:table-row;background:var(--surface);border:0;border-radius:0}.trend-table td,.trend-table th{display:table-cell;padding:10px 12px;white-space:nowrap}
.quick-search{margin-top:20px}.quick-search .toolbar{margin:0}.quick-search input{flex:1;max-width:none}.tag{background:color-mix(in srgb,var(--accent) 10%,var(--surface));color:var(--accent)}table{background:var(--surface)}tbody tr{background:var(--surface)}.ghost{color:var(--muted)}.receipt-sources .ghost{background:var(--page)}.ocr-text pre{background:var(--page);color:var(--ink)}.toast{background:var(--ink);color:var(--surface)}.pwa-update{background:var(--surface);color:var(--ink)}.connection-notice{border:1px solid #dca53f60;background:color-mix(in srgb,#dca53f 9%,var(--surface));color:var(--ink);padding:12px 16px;border-radius:14px;font-size:.8rem;line-height:1.5;margin-bottom:16px}
.splash{background:var(--page);color:var(--ink);gap:16px}.splash .mark{margin:0 auto;width:66px;height:66px;border-radius:22px;font-size:24px}.splash>strong{font-size:1.3rem;letter-spacing:-.4px}.splash>span{font-size:.8rem;padding:0 20px}.wait-screen{position:fixed;inset:0;z-index:22;display:grid;place-items:center;background:color-mix(in srgb,var(--page) 70%,transparent);backdrop-filter:blur(8px);padding:24px}.wait-screen>.card{max-width:420px;width:100%;text-align:center;padding:30px}.wait-screen h2{font-size:1.1rem}.wait-screen p{color:var(--muted);font-size:.85rem}.loading-ring{width:36px;height:36px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;margin:0 auto 22px;animation:wait-spin 1s linear infinite}@keyframes wait-spin{to{transform:rotate(360deg)}}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(min-width:1280px){.stat-group dl{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1024px),(hover:none) and (pointer:coarse){body{background:var(--page)}.shell{display:block;padding:calc(16px + var(--safe-top)) calc(16px + var(--safe-right)) calc(96px + var(--home-clearance)) calc(16px + var(--safe-left))}.sidebar{background:var(--glass);backdrop-filter:blur(24px);height:auto;top:auto;border:1px solid var(--line);border-bottom:0;border-radius:22px 22px 0 0;padding:10px calc(8px + var(--safe-right)) calc(8px + var(--home-clearance)) calc(8px + var(--safe-left));box-shadow:0 -4px 24px #182c5910}.sidebar nav button{text-align:center;padding:7px 2px}.content{padding:0}.header-actions{max-width:100%;width:100%}.header-actions #identity{flex:1;max-width:100%}.content header h1{font-size:1.7rem}.content header{margin-bottom:10px;gap:10px}.theme-toggle{width:40px;flex-basis:40px;min-height:40px;font-size:20px}.balance-hero{padding:24px;border-radius:22px;grid-template-columns:1fr;gap:24px}.balance-hero h2{font-size:1.8rem}.balance-hero p{font-size:.8rem}.hero-balance>strong{font-size:2.1rem}.hero-balance{gap:10px}.hero-balance>span{font-size:.75rem}.finance-metrics{grid-template-columns:1fr;gap:10px}.metric{padding:18px 20px}.metric strong{font-size:1.65rem;margin:8px 0 4px}.trend-card{padding:20px 16px;border-radius:22px}.section-head{align-items:flex-start}.section-head h2{font-size:1.1rem}.section-head .pill{font-size:.65rem;padding:6px 8px;min-height:30px}.trend-controls{display:grid;grid-template-columns:1fr}.period-selector{width:max-content}.date-range{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;width:100%}.date-range>span{display:none}.date-range input{max-width:100%;width:100%;min-height:46px;font-size:.85rem}.date-range button{grid-column:1/-1;min-height:44px}.chart-caption{gap:12px}.chart-caption small{margin-left:0;width:100%;font-size:.7rem}.finance-chart{min-height:0;max-height:none;width:100%}.trend-statistics{grid-template-columns:1fr;gap:22px}.stat-group dl{grid-template-columns:repeat(2,minmax(0,1fr))}.stat-group dd{font-size:1.15rem}.quick-search .toolbar{display:grid}.table tbody tr{background:var(--surface)}.keyboard-open .sidebar{display:none}.keyboard-open .shell{padding-bottom:24px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

.connection-notice button{display:block;margin-top:10px;font-size:.75rem;min-height:40px;padding:8px 12px}

@media(max-width:600px){.balance-hero{gap:16px;padding:22px}.balance-hero h2{font-size:1.4rem;line-height:1.2;margin:10px 0 0}.balance-hero h2 br{display:none}.balance-hero p{display:none}.finance-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.finance-metrics .metric{padding:16px 14px}.finance-metrics .metric strong{font-size:1.3rem}.finance-metrics .metric:last-child{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:4px 12px}.finance-metrics .metric:last-child>span{grid-column:1/-1}.finance-metrics .metric:last-child>strong{margin:4px 0;font-size:1.2rem}.finance-metrics .metric:last-child>small{text-align:right}}
.period-selector button,.period-selector select,.date-range button,.trend-details summary,.theme-toggle,.connection-notice button{min-height:48px}
#offlineStatus,.date-range input{min-height:48px}

[hidden]{display:none!important}
.receipt-subscription{min-width:0;margin:12px 0;padding:14px;border:1px solid var(--border,#dce1ed);border-radius:12px}.receipt-subscription legend{max-width:100%;overflow-wrap:anywhere;padding:0 6px}
