:root {
  --surface:#232429; --background:#1f1e23; --line:#37383e; --grid-line:#1b1c20;
  --text:#f0f0f2; --muted:#a0a0a6; --faint:#898990; --accent:#ff524c;
  --income:#509fe7; --expense:#ff6d69; --picker-header:#7d7e83; --focus:#91c4ff;
  color-scheme:dark; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text); background:var(--surface); font-size:16px; -webkit-font-smoothing:antialiased;
}
* { box-sizing:border-box; }
body { margin:0; font-size:.9375rem; }
.app-document { height:100%; }
.app-page { height:100%; }
button,input,select,textarea { font:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; color:inherit; }
button:disabled { opacity:.42; cursor:default; }
button { touch-action:manipulation; }
a { color:inherit; text-decoration:none; }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible { outline:2px solid var(--focus); outline-offset:2px; }
button svg { pointer-events:none; }
svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip { position:fixed; inset-block-start:-100px; inset-inline-start:10px; z-index:200; background:var(--surface); padding:10px; }
.skip:focus { inset-block-start:10px; }
.app { max-width:600px; margin-inline:auto; height:100%; padding-block-start:env(safe-area-inset-top); display:flex; flex-direction:column; position:relative; overflow:hidden; background:var(--surface); }
.topbar { min-height:44px; display:grid; grid-template-columns:88px minmax(0,1fr) 88px; align-items:center; padding-inline:16px; flex:none; }
.topbar h1 { font-size:1.0625rem; line-height:1.25; font-weight:500; text-align:center; margin:0; }
.toolbar-start,.toolbar-end { display:flex; align-items:center; gap:0; }
.toolbar-end { justify-content:flex-end; }
.icon-button { border:none; background:none; min-width:40px; min-height:40px; display:inline-grid; place-items:center; padding:7px; color:var(--text); flex:none; border-radius:3px; }
.icon-button svg { width:23px; height:23px; }
.periodbar { min-height:40px; display:flex; justify-content:space-between; align-items:center; gap:8px; padding-inline:0; }
.period-title { background:none; border:0; padding:7px 10px; min-height:38px; font-weight:400; font-size:.9375rem; }
.modes { display:flex; flex:none; min-height:36px; border-block-end:1px solid var(--line); }
.modes:empty { display:none; }
.modes button { background:none; border:0; border-block-end:3px solid transparent; flex:1; min-width:0; min-height:36px; padding:7px 0 8px; font-size:.875rem; white-space:nowrap; color:var(--muted); }
.modes button:first-child { flex:1.25; }
.modes button:nth-child(2) { flex:.85; }
.modes button:nth-child(3) { flex:.9; }
.modes button.active { color:var(--text); border-block-end-color:var(--accent); }
.totals { min-height:48px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:center; border-block-end:1px solid var(--line); flex:none; padding-block:3px 3px; padding-inline:7px; }
.totals div { text-align:center; min-width:0; padding-inline:3px; }
.totals span { display:block; font-size:.8125rem; line-height:1.25; margin-block-end:3px; }
.totals strong { font-size:.875rem; font-weight:500; font-variant-numeric:tabular-nums; line-height:1.2; display:block; white-space:nowrap; }
.income { color:var(--income); }
.expense { color:var(--expense); }
.transfer { color:var(--text); }
.muted { color:var(--muted); }
#page { flex:1; min-height:0; overflow:auto; scroll-padding-block:10px 85px; outline:none; }
#page.calendar-page { overflow:auto; display:flex; }
.calendar { display:flex; flex-direction:column; width:100%; min-height:calc(18rem + 122px); height:100%; }
.weekdays { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); min-height:14px; flex:none; text-align:center; border-block-end:1px solid var(--line); font-size:.6875rem; color:var(--muted); line-height:1.2; }
.weekdays span:nth-child(6) { color:var(--income); }
.weekdays span:nth-child(7) { color:var(--expense); }
.calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); grid-template-rows:repeat(6,minmax(0,1fr)); flex:1; min-height:0; }
.calendar-day { min-width:0; min-height:0; background:var(--surface); border:0; border-inline-end:1px solid var(--grid-line); border-block-end:1px solid var(--grid-line); padding:0; display:flex; flex-direction:column; text-align:start; position:relative; overflow:hidden; }
.calendar-day:nth-child(7n) { border-inline-end:0; }
.calendar-day.outside { background:var(--background); color:var(--faint); }
.calendar-date { display:block; padding:1px 3px 0; font-size:.75rem; line-height:1.4; min-height:17px; }
.calendar-day.saturday .calendar-date { color:var(--income); }
.calendar-day.sunday .calendar-date { color:var(--expense); }
.calendar-day.outside .calendar-date { color:var(--faint); }
.calendar-day.today .calendar-date { background:#f0f0f2; color:#25262b; }
.calendar-money { display:grid; grid-template-rows:repeat(3,minmax(1rem,auto)); padding:0 3px; margin-block-start:auto; width:100%; font-size:.625rem; line-height:1rem; font-variant-numeric:tabular-nums; }
.calendar[data-balance=false] .calendar-money { grid-template-rows:repeat(2,minmax(1rem,auto)); }
.calendar-money>span { display:block; min-width:0; white-space:nowrap; text-align:end; }
.calendar-money>span>span { display:inline-block; width:100%; line-height:1.2; vertical-align:baseline; }
.calendar-money .income { grid-row:1; }
.calendar-money .expense { grid-row:2; }
.calendar-money .net { grid-row:3; color:var(--text); }
.bottom-navigation { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); min-height:49px; flex:none; background:var(--background); border-block-start:1px solid var(--line); padding-block:4px calc(5px + env(safe-area-inset-bottom)); z-index:10; }
.bottom-navigation a { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; color:var(--muted); font-size:.6875rem; min-height:39px; }
.bottom-navigation svg { width:23px; height:23px; }
.bottom-navigation a.active { color:var(--accent); }
.floating-actions { position:absolute; inset-inline-end:15px; inset-block-end:calc(61px + env(safe-area-inset-bottom)); display:flex; gap:13px; z-index:12; }
.floating-actions:empty { display:none; }
.fab { width:50px; height:50px; padding:11px; border:0; background:#38393f; border-radius:50%; display:grid; place-items:center; color:var(--text); }
.fab svg { width:26px; height:26px; }
.fab.primary { background:var(--accent); color:#fff; }
.fab.primary svg { width:29px; height:29px; stroke-width:1.6; }
.ledger { padding-block-end:88px; }
.day-heading { min-height:40px; display:flex; align-items:center; padding:5px 14px; gap:8px; background:var(--surface); border-block:1px solid var(--line); }
.day-number { font-size:1.5rem; font-weight:600; line-height:1; }
.day-caption { display:flex; flex-direction:column; gap:1px; font-size:.625rem; color:var(--muted); line-height:1.2; }
.day-caption em { font-style:normal; color:var(--background); background:#c2c2c6; border-radius:2px; width:fit-content; padding:1px 4px; }
.day-totals { margin-inline-start:auto; display:flex; flex:1; gap:15px; font-size:.6875rem; font-variant-numeric:tabular-nums; align-items:center; justify-content:flex-end; min-width:0; }
.day-totals>span { flex:1; min-width:0; white-space:nowrap; text-align:end; }
.day-number,.day-caption { flex-shrink:0; }
.day-heading .icon-button { min-height:30px; min-width:27px; padding:3px; color:var(--muted); }
.transaction { display:grid; grid-template-columns:72px minmax(0,1fr) fit-content(43%); align-items:center; gap:8px; width:100%; padding:8px 15px; min-height:46px; border:0; border-block-end:1px solid var(--line); background:var(--surface); text-align:start; }
.transaction-category { color:var(--muted); font-size:.75rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.transaction-text { min-width:0; }
.transaction-title { display:block; font-size:.875rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height:1.25; }
.transaction-account { display:block; font-size:.6875rem; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height:1.25; margin-block-start:3px; }
.transaction-amount { min-width:0; white-space:nowrap; font-size:.875rem; font-variant-numeric:tabular-nums; text-align:end; }
.transaction-amount small { display:block; font-size:.625rem; color:var(--muted); margin-block-start:3px; }
.load-more { display:block; margin:12px auto; }
.outline-button,.primary-button,.danger-button { min-height:42px; border:1px solid var(--faint); background:none; border-radius:7px; color:var(--text); padding:10px 15px; display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.primary-button { background:var(--accent); border-color:var(--accent); color:#fff; }
.danger-button { background:none; color:var(--expense); border-color:var(--expense); }
.text-button { min-height:40px; color:var(--text); background:none; border:0; padding:8px 12px; }
.empty { color:var(--muted); text-align:center; display:flex; flex-direction:column; justify-content:center; align-items:center; min-height:230px; height:100%; padding:25px; gap:14px; }
.empty svg { width:40px; height:40px; color:var(--faint); }
.empty p { margin:0; font-size:.875rem; line-height:1.5; }
.empty .text-button { color:var(--income); }
.loading { padding:40px 20px; text-align:center; color:var(--muted); font-size:.8125rem; }
.month-row,.week-row,.asset-row { display:flex; width:100%; justify-content:space-between; align-items:center; gap:10px; text-align:start; border:0; border-block-end:1px solid var(--line); min-height:48px; background:var(--surface); padding:11px 16px; }
.month-name { font-weight:600; font-size:.875rem; }
.month-row small { display:block; color:var(--muted); font-size:.625rem; margin-block-start:5px; }
.month-values { display:grid; flex:1; grid-template-columns:repeat(2,minmax(0,1fr)); min-width:0; gap:5px 20px; font-variant-numeric:tabular-nums; font-size:.8125rem; text-align:end; }
.month-name,.week-row>span:first-child { flex-shrink:0; }
.month-values>span,.month-values>small { white-space:nowrap; }
.month-values small { grid-column:1/-1; margin:0; }
.week-row { padding-inline-start:45px; background:var(--background); font-size:.75rem; }
.week-row.current { background:#572926; }
.section-heading { padding:17px 17px 8px; margin:0; font-size:.8125rem; font-weight:400; color:var(--muted); background:var(--background); border-block-end:1px solid var(--line); }
.asset-row { font-size:.875rem; }
.asset-row .asset-value { text-align:end; white-space:nowrap; font-variant-numeric:tabular-nums; }
.asset-row small { display:block; font-size:.6875rem; color:var(--muted); margin-block-start:4px; }
.ibt-row { align-items:flex-start; }
.ibt-row>span { min-width:0; overflow-wrap:anywhere; }
.ibt-row>span:last-child { flex-shrink:0; max-width:45%; text-align:end; }
.ibt-form p { font-size:.875rem; line-height:1.5; }
.ibt-form .field-control { white-space:normal; overflow-wrap:anywhere; }
.general-section { padding:18px; border-block-end:8px solid var(--background); }
.general-section h2 { font-size:1rem; font-weight:500; margin:0 0 16px; display:flex; align-items:center; gap:10px; }
.general-box { border:1px solid var(--line); border-radius:4px; padding:12px 18px; }
.general-line { display:flex; justify-content:space-between; gap:16px; padding:9px 0; font-size:.8125rem; font-variant-numeric:tabular-nums; }
.export-button { display:flex; margin:14px 18px; width:calc(100% - 36px); }
.budget-track { height:22px; border-radius:3px; background:var(--line); position:relative; overflow:hidden; margin-block:10px 6px; }
.budget-track i { display:block; height:100%; background:var(--accent); max-width:100%; }
.budget-track span { position:absolute; inset-inline-end:5px; inset-block-start:2px; font-size:.8125rem; color:var(--text); }
.budget-values { display:flex; justify-content:space-between; gap:10px; font-size:.75rem; font-variant-numeric:tabular-nums; }
.search-bar { display:flex; margin:5px 14px 10px; align-items:center; background:#36373d; border-radius:8px; padding-inline:10px; }
.search-bar svg { color:var(--muted); width:18px; height:18px; }
.search-bar input { width:100%; min-width:0; background:none; border:0; color:var(--text); padding:9px 7px; font-size:1rem; outline-offset:-2px; }
.search-bar input::placeholder { color:var(--muted); }
.search-wrap { flex:none; }
.filter-list { padding:10px 16px 22px; }
.filter-list label { display:grid; grid-template-columns:105px minmax(0,1fr); align-items:center; gap:12px; min-height:50px; border-block-end:1px solid var(--line); font-size:.8125rem; }
.filter-list input,.filter-list select { width:100%; min-width:0; background:var(--surface); color:var(--text); border:0; padding:10px 4px; min-height:44px; font-size:1rem; }
.filter-actions { display:flex; padding-block-start:18px; gap:12px; }
.filter-actions button { flex:1; }
.settings-row { display:flex; width:100%; align-items:center; gap:14px; padding:15px 23px; min-height:47px; border:0; background:var(--surface); text-align:start; }
.settings-row svg { color:var(--muted); width:20px; height:20px; }
.settings-row>span { flex:1; min-width:0; }
.settings-row small { display:block; color:var(--muted); font-size:.6875rem; margin-block-start:4px; line-height:1.4; }
.settings-row .trailing { flex:none; color:var(--muted); font-size:.6875rem; }
.settings-info { padding:18px 23px; color:var(--muted); font-size:.75rem; line-height:1.6; }
.stats-tabs { display:flex; flex:none; border-block-end:1px solid var(--line); }
.stats-tabs button { width:50%; background:none; border:0; border-block-end:3px solid transparent; min-height:40px; padding:12px 6px; color:var(--muted); font-size:.8125rem; }
.stats-tabs button.active { border-block-end-color:var(--accent); color:var(--text); }
.graph-segment { display:flex; border:1px solid var(--line); border-radius:8px; overflow:auto; min-height:30px; min-width:min(100%,calc(12rem + 18px)); flex:1; }
.graph-segment button { flex:1 0 0; min-width:max-content; white-space:nowrap; background:var(--background); border:0; padding:4px 6px; color:var(--muted); font-size:.8125rem; }
.graph-segment button.active { background:var(--accent); color:#fff; border-radius:6px; }
.stats-toolbar { padding-inline:18px; display:flex; gap:13px; align-items:center; min-height:44px; }
.period-select { background:none; border:1px solid var(--faint); border-radius:5px; color:var(--text); padding:3px 9px; min-height:28px; font-size:.8125rem; }
.pie-wrap { min-height:260px; border-block-end:8px solid var(--background); }
.pie-wrap svg { display:block; width:100%; height:100%; stroke:none; overflow:visible; }
.pie-wrap text { fill:var(--text); font-family:inherit; font-size:var(--label-size); }
.pie-label-name { font-weight:600; }
.category-row { width:100%; min-height:46px; background:var(--surface); border:0; border-block-end:1px solid var(--line); display:grid; grid-template-columns:38px minmax(0,1fr) fit-content(45%); align-items:center; gap:9px; padding:9px 15px; text-align:start; font-size:.9375rem; }
.category-percent { border-radius:3px; padding:4px 3px; font-size:.75rem; text-align:center; color:#202025; font-variant-numeric:tabular-nums; }
.category-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.category-icon { display:inline-flex; align-items:center; justify-content:center; width:1.5em; height:1.5em; flex:none; border-radius:50%; background:var(--line); color:var(--text); vertical-align:middle; }
.category-icon svg { width:1.1em; height:1.1em; fill:currentColor; stroke:none; }
.category-label { display:flex; align-items:center; gap:7px; min-width:0; }
.category-name>span:last-child { overflow:hidden; text-overflow:ellipsis; }
.transaction-category-label { display:flex; flex-direction:column; align-items:flex-start; gap:3px; }
.transaction-category-label>span:last-child { max-width:100%; overflow:hidden; text-overflow:ellipsis; }
.picker-option>.category-icon { display:flex; margin:0 auto 5px; font-size:1rem; }
.one-column .picker-option>.category-icon { display:inline-flex; margin:0 8px 0 0; }
.field-control>.category-icon { margin-inline-end:8px; }
.category-value { min-width:0; white-space:nowrap; font-size:.9375rem; font-variant-numeric:tabular-nums; text-align:end; }
.trend { padding:15px 14px 20px; background:var(--background); }
.trend svg { width:100%; height:160px; stroke:none; overflow:visible; }
.trend text { font-family:inherit; font-size:10px; fill:var(--muted); }
.trend polyline { stroke:var(--accent); stroke-width:3; fill:none; }
.trend circle { fill:var(--accent); cursor:pointer; }
.note-row { background:var(--surface); width:100%; border:0; border-block-end:1px solid var(--line); padding:15px 19px; text-align:start; }
.note-row strong { display:block; font-weight:500; margin-block-end:6px; }
.note-row p { margin:0 0 7px; color:var(--muted); font-size:.8125rem; line-height:1.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.note-row small { font-size:.6875rem; color:var(--muted); }
#message { position:fixed; inset-inline:12px; inset-block-end:calc(68px + env(safe-area-inset-bottom)); margin-inline:auto; max-width:570px; z-index:100; background:#45464d; color:#fff; border-radius:6px; display:flex; align-items:center; gap:12px; font-size:.8125rem; line-height:1.4; box-shadow:0 3px 12px #0003; }
#message:not(:empty) { padding:10px 12px; }
#message span { flex:1; }
#message button { background:none; border:0; color:#c5deff; min-height:30px; padding:4px; font-size:.8125rem; }
#message button svg { width:17px; height:17px; }
dialog { color:var(--text); background:var(--surface); border:0; outline:none; padding:0; max-width:calc(100% - 24px); max-height:90dvh; overscroll-behavior:contain; }
dialog::backdrop { background:#0005; }
.dialog-header { display:flex; align-items:center; justify-content:space-between; padding:5px 12px; min-height:45px; border-block-end:1px solid var(--line); gap:12px; }
.dialog-header h2 { font-size:1rem; font-weight:500; margin:0; }
.small-dialog { width:360px; border-radius:9px; padding:10px; }
.small-dialog .dialog-header { border:0; padding:3px 3px 8px; }
.small-dialog .dialog-header h2 { line-height:1.4; }
.confirm-actions { display:flex; gap:10px; padding:10px 0 4px; }
.confirm-actions button { flex:1; }
.picker-dialog { position:fixed; margin:0 auto; inset:auto 0 0; width:100%; max-width:600px; max-height:46dvh; border-radius:0; }
.picker-dialog::backdrop { background:transparent; }
.picker-header { display:flex; align-items:center; background:var(--picker-header); color:#101115; min-height:43px; padding-inline:15px 7px; }
.picker-header h2 { flex:1; font-weight:400; font-size:.9375rem; margin:0; }
.picker-header .icon-button { color:#25262b; min-height:38px; min-width:38px; }
.picker-body { max-height:calc(46dvh - 43px); overflow:auto; overscroll-behavior:contain; padding-block-end:env(safe-area-inset-bottom); }
.picker-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.picker-option { min-height:50px; border:0; border-inline-end:1px solid var(--line); border-block-end:1px solid var(--line); background:var(--surface); font-size:.8125rem; padding:10px 5px; overflow-wrap:anywhere; }
.picker-option small { display:block; color:var(--muted); font-size:.625rem; margin-block-start:3px; }
.picker-option.selected { color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); }
.picker-group { grid-column:1/-1; background:var(--background); margin:0; padding:10px 15px; font-size:.75rem; font-weight:400; color:var(--muted); }
.one-column .picker-option { display:block; width:100%; text-align:start; padding-inline:17px; }
.day-dialog { position:fixed; inset:0; margin:0; width:100%; max-width:none; height:100%; max-height:none; padding-block-start:calc(env(safe-area-inset-top) + 178px); background:transparent; overflow:hidden; }
.day-dialog[open] { display:flex; flex-direction:column; }
.day-dialog::backdrop { background:transparent; }
.day-backdrop { position:absolute; inset:0; width:100%; height:100%; padding:0; border:0; border-radius:0; background:#0005; touch-action:manipulation; }
.day-sheet { position:relative; width:100%; max-width:600px; min-height:0; flex:1; margin-inline:auto; display:flex; flex-direction:column; border-radius:5px 5px 0 0; overflow:hidden; background:var(--surface); }
.app-page:has(.day-dialog[open]) .calendar { visibility:hidden; }
.day-dialog .day-heading { min-height:52px; padding:10px 14px 8px; border-block-start:0; }
.day-dialog .day-number { font-size:1.5rem; }
.day-body { flex:1; min-height:0; overflow:auto; padding-block-end:80px; overscroll-behavior:contain; }
.day-body .ledger { padding:0; }
.day-footer { display:flex; gap:70px; align-items:center; min-height:53px; padding:3px 14px calc(9px + env(safe-area-inset-bottom)); border-block-start:1px solid var(--line); }
.day-footer button { color:var(--muted); }
.day-footer .close-day { margin-inline-start:auto; color:var(--text); font-size:.8125rem; }
.day-dialog .floating-actions { inset-block-end:calc(71px + env(safe-area-inset-bottom)); }
.full-dialog { position:fixed; inset:0; margin:0 auto; width:100%; max-width:600px; height:100dvh; max-height:100dvh; padding-block:env(safe-area-inset-top) env(safe-area-inset-bottom); overflow:hidden; }
.full-dialog[open] { display:flex; flex-direction:column; }
.full-dialog::backdrop { background:var(--surface); }
.editor-header { min-height:44px; display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; padding-inline:13px; }
.editor-header h2 { font-size:1.0625rem; margin:0; font-weight:500; }
.back-button { display:flex; align-items:center; justify-content:flex-start; gap:1px; color:var(--text); background:none; border:0; padding:3px 0; min-height:40px; font-size:.9375rem; white-space:nowrap; }
.back-button svg { width:19px; }
.editor-header>.icon-button { justify-self:end; }
.editor-scroll { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; padding-block-end:25px; }
.type-tabs { display:flex; gap:5px; padding:4px 14px 15px; }
.type-tabs button { width:33.333%; border:1px solid #15161b; border-radius:5px; padding:6px 5px; min-height:28px; background:var(--background); color:var(--muted); font-size:.875rem; }
.type-tabs button.active { border-color:var(--accent); color:var(--accent); background:var(--surface); }
.type-tabs button.active[data-type=income] { border-color:var(--income); color:var(--income); }
.editor-fields { padding:0 18px 20px 14px; }
.edit-field { display:grid; grid-template-columns:68px minmax(0,1fr); gap:0; min-height:44px; align-items:center; }
.edit-field>span,.edit-field>label { font-size:.875rem; color:var(--muted); }
.field-control { width:100%; text-align:start; background:none; color:var(--text); border:0; border-block-end:1px solid var(--line); min-height:44px; padding:10px 6px; font-size:.9375rem; line-height:1.3; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.field-control:focus-visible { outline-offset:-2px; }
input.field-control { font-size:1rem; }
.field-control.active { border-block-end-color:var(--accent); }
.field-control.date-control { display:flex; align-items:center; justify-content:space-between; gap:5px; }
.field-control .repeat-button { display:grid; justify-items:center; font-size:.5625rem; color:var(--muted); }
.field-control .repeat-button svg { width:20px; height:20px; }
.detail-section { border-block-start:8px solid var(--background); padding:15px 17px; }
.detail-section .tag-button { background:var(--background); border:0; border-radius:14px; padding:7px 9px; color:var(--muted); font-size:.8125rem; }
.detail-label { display:flex; align-items:center; gap:10px; margin-block:14px 7px; padding:4px 5px; border-block-end:1px solid var(--line); }
.detail-label label { flex:1; color:var(--muted); font-size:.8125rem; }
.detail-label .icon-button { color:var(--muted); min-height:30px; min-width:30px; padding:3px; }
.detail-section textarea { width:100%; resize:vertical; min-height:58px; padding:11px 3px; border:0; background:none; color:var(--muted); font-size:.875rem; line-height:1.35; }
.editor-actions { display:flex; gap:8px; padding:4px 14px 10px; }
.editor-actions button { min-width:0; flex:1; font-size:.8125rem; padding:10px 5px; }
.editor-actions button svg { width:19px; height:19px; }
.save-actions { display:flex; gap:7px; padding:12px 14px; }
.save-actions .primary-button { flex:3; }
.save-actions .outline-button { flex:1; }
.field-error { margin:4px 14px; color:#ffb5b1; font-size:.8125rem; line-height:1.5; }
.field-error:empty { display:none; }
.calculator-dialog { max-height:64dvh; }
.calculator-display { display:flex; align-items:center; background:var(--surface); border-block-end:1px solid var(--line); padding-inline:12px; }
.calculator-display input { width:100%; border:0; background:none; color:var(--text); text-align:end; font-size:1.5rem; padding:10px 3px; min-height:45px; }
.calculator-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.calculator-grid button { background:var(--surface); border:0; border-inline-end:1px solid var(--line); border-block-end:1px solid var(--line); min-height:68px; font-size:1.25rem; padding:9px 5px; }
.calculator-grid .calc-done { background:var(--accent); color:#fff; }
.calculator-grid button svg { width:25px; height:25px; }
.note-form { padding:18px 20px; }
.note-form input,.note-form textarea { display:block; width:100%; color:var(--text); background:none; border:0; padding:12px 0; font-size:1rem; }
.note-form input[name=title] { font-weight:600; margin-block-start:16px; }
.note-form textarea { min-height:180px; resize:vertical; line-height:1.5; }
.note-form input[type=date] { width:130px; border:1px solid var(--muted); border-radius:3px; padding:7px; font-size:1rem; }
.settings-form { padding:10px 18px 25px; }
.settings-form label { display:flex; align-items:center; gap:15px; min-height:48px; justify-content:space-between; border-block-end:1px solid var(--line); font-size:.875rem; }
.settings-form select,.settings-form input[type=number] { max-width:155px; min-width:0; font-size:1rem; background:var(--surface); color:var(--text); border:0; padding:9px 2px; }
.settings-form input[type=checkbox] { width:22px; height:22px; accent-color:var(--accent); }
.settings-form .primary-button { margin-block-start:20px; width:100%; }
.help-copy { padding:16px 20px 22px; font-size:.875rem; line-height:1.6; max-width:70ch; }
.help-copy p { margin:0 0 16px; }
.help-copy .outline-button { width:100%; }
.login-page { display:grid; place-items:center; min-height:100dvh; padding:30px 22px; }
.login-card { width:100%; max-width:340px; }
.brand-mark { color:var(--accent); font-size:2.5rem; font-weight:600; margin-block-end:25px; }
.login-card .eyebrow { color:var(--muted); font-size:.8125rem; }
.login-card h1 { font-size:2rem; font-weight:600; margin:7px 0 10px; }
.login-intro { color:var(--muted); margin-block-end:28px; }
.login-card form { display:grid; gap:18px; }
.login-card label { display:grid; gap:8px; font-size:.8125rem; }
.login-card input { width:100%; background:var(--background); color:var(--text); border:1px solid var(--faint); border-radius:5px; padding:12px; min-height:48px; font-size:1rem; }
.login-card .primary-button { width:100%; justify-content:space-between; }
.form-error { margin:0; color:#ffb5b1; font-size:.8125rem; }
.form-error:empty { display:none; }
.login-foot { color:var(--muted); font-size:.75rem; margin-block-start:25px; }
@media (hover:hover) { button:not(:disabled):hover,a:hover { background-color:#ffffff08; } .primary-button:hover,.fab.primary:hover { background:#ee564e; } }
@media (min-width:601px) { .app { border-inline:1px solid var(--line); } }
@media (max-width:360px) { .modes button { font-size:.75rem; } .transaction { grid-template-columns:53px minmax(0,1fr) fit-content(43%); gap:6px; padding-inline:10px; } .transaction-title { font-size:.8125rem; } .transaction-amount { font-size:.75rem; } .totals strong { font-size:.8125rem; } .day-totals { gap:8px; } .type-tabs { padding-inline:11px; } .edit-field { grid-template-columns:60px minmax(0,1fr); } .calendar-money { padding-inline:2px; } .editor-actions { gap:5px; padding-inline:10px; } .editor-actions button { font-size:.75rem; } }
@media (max-height:650px) { .calculator-grid button { min-height:42px; } .topbar { min-height:40px; } .periodbar { min-height:35px; } }
@media (prefers-reduced-motion:no-preference) { .fab:active:not(:disabled) { transform:scale(.96); transition:transform 150ms ease-out; } }
@media (forced-colors:active) { button,a,input,select,textarea { border:1px solid transparent; } .modes button:first-child { flex:1.25; }
.modes button:nth-child(2) { flex:.85; }
.modes button:nth-child(3) { flex:.9; }
.modes button.active { border-block-end-color:Highlight; } }
[hidden] { display:none!important; }
.month-picker { width:360px; border-radius:6px; }
.month-picker .periodbar input { width:100px; text-align:center; font-size:1.25rem; background:none; color:var(--text); border:0; padding:9px; }
.month-picker-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:10px; gap:5px; }
.month-picker-grid button { min-height:44px; color:var(--text); background:none; border:1px solid var(--line); border-radius:4px; }
.month-picker-grid .selected { color:var(--accent); border-color:var(--accent); }
.month-picker>.text-button { display:block; margin:0 auto 10px; }
.filter-dialog { max-height:85dvh; overflow:auto; }
.settings-form input:not([type=checkbox]) { max-width:190px; min-width:0; border:0; border-block-end:1px solid var(--muted); padding:8px 3px; font-size:1rem; background:none; color:var(--text); }
.note-form[data-note-color=red] textarea { color:#ffaaa5; }
.note-form[data-note-color=orange] textarea { color:#ffbd7b; }
.note-form[data-note-color=yellow] textarea { color:#ffe98e; }
.note-form[data-note-color=green] textarea { color:#a0dca1; }
.note-form[data-note-color=blue] textarea { color:#a4cbff; }
.note-form[data-note-color=purple] textarea { color:#d6b8ff; }
.date-value-row { position:relative; min-width:0; }
.date-value-row>.field-control { padding-inline-end:46px; }
.repeat-control { position:absolute; inset-block-start:0; inset-inline-end:0; border:0; background:none; color:var(--muted); min-height:44px; min-width:42px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; padding:2px; }
.repeat-control svg { width:19px; height:19px; }
.repeat-control small { font-size:.5625rem; }
.weekdays span:nth-child(6),.weekdays span:nth-child(7) { color:var(--muted); }
.weekdays span.saturday { color:var(--income); }
.weekdays span.sunday { color:var(--expense); }

.calculator-grid { padding-block-end:env(safe-area-inset-bottom); }
.receipt-list { display:flex; flex-wrap:wrap; gap:10px; }
.receipt-list>div { position:relative; }
.receipt-thumbnail { display:block; padding:0; border:1px solid var(--line); background:none; width:84px; height:84px; overflow:hidden; }
.receipt-thumbnail img { width:100%; height:100%; object-fit:cover; }
.receipt-list .icon-button { position:absolute; inset:0 0 auto auto; background:var(--background); min-width:26px; min-height:26px; padding:4px; }
.receipt-list .icon-button svg { width:18px; height:18px; }
.receipt-full { flex:1; min-height:0; overflow:auto; display:flex; flex-direction:column; align-items:center; gap:16px; padding:15px; }
.receipt-full img { max-width:100%; height:auto; object-fit:contain; }

.detail-section textarea:focus { font-size:1rem; }

.trend { --trend-color:var(--accent); }
.trend.income-trend { --trend-color:var(--income); }
.trend polyline { stroke:var(--trend-color); }
.trend circle { fill:var(--trend-color); }
.trend circle.selected { fill:var(--text); stroke:var(--trend-color); stroke-width:3; }
.trend text.selected { fill:var(--trend-color); }
.trend svg { background-image:linear-gradient(#ffffff02 1px,transparent 1px),linear-gradient(90deg,#ffffff02 1px,transparent 1px); background-size:7px 7px; }
.month-row,.week-row { min-height:52px; padding-block:8px; }
.month-name { font-size:1rem; }
.month-row small { font-size:.6875rem; margin-block-start:3px; }
.month-values { font-size:.875rem; }
.month-values small { font-size:.6875rem; margin:0; }
.week-row { padding-inline-start:54px; font-size:.875rem; }
.general-section { padding-inline:20px; }
.general-box { padding-inline:22px; }
.general-section h2 { font-size:1.0625rem; }
.budget-overview { display:grid; grid-template-columns:34% minmax(0,1fr); gap:10px; width:100%; padding:10px 0 0; border:0; background:none; text-align:start; }
.budget-caption { align-self:end; color:var(--muted); font-size:.75rem; }
.budget-caption strong { display:block; color:var(--text); margin-block-start:7px; font-weight:400; font-size:.9375rem; white-space:nowrap; }
.budget-progress { position:relative; min-width:0; padding-block-start:12px; }
.budget-progress .budget-track { display:block; margin:0 0 6px; }
.budget-progress .budget-track span { color:var(--text); font-size:.9375rem; }
.budget-progress .budget-values { font-size:.9375rem; }
.budget-today { position:absolute; top:-14px; transform:translateX(-50%); background:#62636b; color:var(--text); border-radius:12px; padding:2px 8px; font-size:.75rem; }
.budget-today::after { content:''; position:absolute; left:50%; top:100%; border:4px solid transparent; border-block-start-color:#62636b; }
.asset-heading { display:flex; justify-content:space-between; align-items:end; gap:12px; padding:20px 20px 5px; margin:0; min-height:44px; background:var(--background); border-block-end:1px solid var(--line); color:var(--muted); font-size:.9375rem; font-weight:400; }
.asset-heading>span:last-child { display:flex; flex-direction:column; align-items:end; font-size:.875rem; }
.assets-page .asset-row { min-height:46px; padding-inline:20px; font-size:.9375rem; }
.stats-toolbar { min-height:44px; padding-inline:20px; gap:4px 14px; flex-wrap:wrap; }
.graph-segment { border-color:var(--line); }
.graph-segment button { font-size:.9375rem; }
.graph-segment button+button { border-inline-start:1px solid var(--line); }
.period-select { min-width:54px; min-height:30px; font-size:.9375rem; display:flex; align-items:center; justify-content:center; gap:4px; padding-inline:6px; white-space:nowrap; }
.period-select svg { width:10px; height:10px; }
.stats-tabs button { min-height:44px; font-size:.875rem; }
.day-totals { font-size:.75rem; }
.day-heading.compact { min-height:35px; padding:5px 15px; gap:6px; }
.day-heading.compact .day-number { font-size:1.25rem; }
.day-heading.compact .day-totals { font-size:.875rem; }
.day-heading.compact .day-caption { font-size:.6875rem; }
.filter-header { display:grid; grid-template-columns:40px minmax(0,1fr) 35px auto 35px; align-items:center; min-height:40px; background:#2d375a; padding-inline:15px; }
.filter-hint { margin:0; padding:16px 22px; background:#4c5277; font-size:.8125rem; }
.filter-scroll { flex:1; min-height:0; overflow:auto; background:var(--surface); }
.filter-charts { min-height:170px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:center; padding:10px 12px 12px; gap:10px; border-block-end:1px solid var(--line); }
.filter-charts>div { display:flex; flex-direction:column; align-items:center; gap:7px; min-width:0; }
.filter-charts>div>span { color:var(--muted); font-size:.875rem; }
.filter-charts strong { font-size:.875rem; font-weight:400; white-space:nowrap; }
.filter-ring { width:100px; max-width:100%; aspect-ratio:1; border-radius:50%; background:conic-gradient(var(--ring-color) var(--percent),var(--ring-faded) 0); display:grid; place-items:center; position:relative; }
.filter-ring.income { --ring-color:var(--income); --ring-faded:#355e8e; }
.filter-ring.expense { --ring-color:var(--expense); --ring-faded:#863c41; }
.filter-ring::before { content:''; position:absolute; inset:8px; background:var(--surface); border-radius:50%; }
.filter-ring strong { position:relative; color:var(--text); font-size:1rem; }
.filter-charts .filter-balance { gap:17px; }
.filter-tabs { display:flex; min-height:40px; border-block-end:1px solid var(--line); }
.filter-tabs button { width:33.333%; min-height:40px; padding:8px; border:0; border-block-end:3px solid transparent; background:none; color:var(--muted); font-size:.9375rem; }
.filter-tabs button.active { color:var(--text); border-block-end-color:var(--accent); }
.filter-entity { display:grid; grid-template-columns:20px minmax(0,1fr) minmax(70px,27%) minmax(70px,22%); gap:16px; align-items:center; padding:8px 20px 8px 22px; min-height:40px; border-block-end:1px solid var(--line); font-size:.875rem; }
.filter-entity input { width:20px; height:20px; margin:0; accent-color:var(--accent); }
.filter-entity>span:nth-child(2) { overflow-wrap:anywhere; }
.filter-entity>span:nth-child(n+3) { font-size:.6875rem; text-align:end; font-variant-numeric:tabular-nums; }
.filter-entity small { display:block; color:var(--muted); font-size:.6875rem; margin-block-start:4px; }
.filter-group { margin:0; padding:7px 24px; min-height:30px; background:var(--background); border-block-end:1px solid var(--line); color:var(--muted); font-size:.75rem; font-weight:400; }
.filter-entity.child>span:nth-child(2) { padding-inline-start:10px; }
@media(max-width:360px) { .filter-entity { grid-template-columns:20px minmax(0,1fr) minmax(55px,26%) minmax(55px,26%); gap:7px; padding-inline:13px; } .filter-charts { gap:6px; padding-inline:7px; } .filter-charts strong { font-size:.75rem; } }
.search-form { display:flex; gap:10px; align-items:center; padding:6px 18px 10px; border-block-end:1px solid var(--line); }
.search-form .search-bar { flex:1; min-width:0; margin:0; padding-inline:7px; min-height:36px; border:1px solid #3d3e44; }
.search-form .search-bar input { min-height:34px; padding:6px; }
.search-cancel { display:none; background:none; border:0; min-height:40px; padding:4px 0; font-size:1rem; }
.search-form:focus-within .search-cancel { display:block; }
.search-app #page { background:var(--background); padding-block-end:env(safe-area-inset-bottom); }
.search-filters { padding:6px 20px 10px 17px; background:var(--surface); }
.search-filters .edit-field { grid-template-columns:65px minmax(0,1fr); min-height:49px; }
.search-filters .edit-field>span { font-size:.9375rem; }
.search-amounts { display:flex; align-items:center; gap:10px; min-width:0; }
.search-amounts .field-control { min-width:0; color:var(--muted); text-align:center; }
.search-results .ledger { padding-block-end:20px; }
.selection-dialog { width:410px; max-width:calc(100% - 30px); max-height:82dvh; padding:0; border-radius:5px; }
.selection-dialog[open] { display:flex; flex-direction:column; }
.selection-dialog h2 { margin:0; padding:22px 23px 12px; font-size:1.0625rem; font-weight:600; }
.selection-dialog .filter-tabs button { width:50%; }
.selection-list { min-height:0; max-height:58dvh; overflow:auto; }
.selection-list label { display:flex; align-items:center; gap:14px; padding:12px 23px; min-height:46px; border-block-end:1px solid var(--line); font-size:.9375rem; }
.selection-list input { margin:0; width:22px; height:22px; flex:none; accent-color:var(--accent); }
.selection-list small { color:var(--muted); font-size:.75rem; margin-inline-start:10px; }
.selection-actions { display:flex; min-height:50px; border-block-start:8px solid var(--background); }
.selection-actions button { width:50%; min-height:50px; background:none; border:0; font-size:1.0625rem; font-weight:500; }
.selection-actions button+button { color:var(--accent); border-inline-start:1px solid var(--line); }
.search-results>.totals { border-block-start:8px solid var(--background); min-height:56px; background:var(--surface); }
.search-results .transaction { border-block-end:0; }
.search-results .transaction-category { font-size:.6875rem; }
.transaction-category time { display:block; margin-block-end:4px; font-size:.6875rem; }
.search-results .totals span { font-size:.875rem; }
.topbar>*,.editor-header>*,.filter-header>* { transform:translateY(-4px); }
#periodbar .periodbar>button { transform:translateY(-4px); }

.budget-progress.full .budget-track span { color:#202025; }

:root [data-amount-wrap] { white-space:normal; overflow-wrap:anywhere; }
.calendar-money [data-amount-wrap] { line-height:1.4; }
.calendar:has([data-amount-wrap]) { height:auto; }
.calendar:has([data-amount-wrap]) .calendar-grid { flex:none; grid-template-rows:repeat(6,auto); }
.calendar-day:has([data-amount-wrap]) { min-height:8rem; }
.pull-spinner { position:absolute; inset-inline-start:50%; z-index:5; width:22px; height:22px; margin-inline-start:-11px; pointer-events:none; opacity:0; }
.pull-spinner svg { width:100%; height:100%; display:block; }
.pull-spinner rect { fill:var(--muted); opacity:0; }
.pull-spinner rect.shown { opacity:calc(1 - var(--index) * .1); }
#page.pull-settling { transition:transform 250ms cubic-bezier(.2,.8,.2,1); }
@media (prefers-reduced-motion:no-preference) {
  .pull-spinner.spinning svg { animation:pull-spin .8s steps(8) infinite; }
}
@keyframes pull-spin { to { transform:rotate(1turn); } }