:root{color-scheme:dark;--bg: #0a0b0f;--surface: #14161d;--surface-2: #191c24;--surface-3: #21242e;--hover: rgba(255, 255, 255, .045);--border: rgba(255, 255, 255, .075);--border-2: rgba(255, 255, 255, .13);--text: #eef1f6;--text-dim: #99a1b0;--text-faint: #626b79;--accent: #7c8bff;--accent-2: #a78bfa;--accent-ink: #ffffff;--accent-soft: rgba(124, 139, 255, .15);--pos: #35d29a;--neg: #fb7185;--warn: #f5c451;--shadow-1: 0 1px 2px rgba(0, 0, 0, .5);--shadow-2: 0 14px 34px -14px rgba(0, 0, 0, .7);--ring: 0 0 0 3px rgba(124, 139, 255, .4);--r-xs: 8px;--r-sm: 12px;--r: 16px;--r-lg: 22px;--r-xl: 28px;--r-full: 999px;--nav-h: 64px;--maxw: 480px}@media(prefers-color-scheme:light){:root{color-scheme:light;--bg: #eef1f7;--surface: #ffffff;--surface-2: #f6f8fc;--surface-3: #eef1f7;--hover: rgba(15, 23, 42, .035);--border: rgba(15, 23, 42, .09);--border-2: rgba(15, 23, 42, .16);--text: #10131a;--text-dim: #5a6473;--text-faint: #8a93a3;--accent: #5b6cf0;--accent-2: #7c5cf0;--accent-soft: rgba(91, 108, 240, .12);--pos: #0f9d6b;--neg: #e5484d;--warn: #c98a00;--shadow-1: 0 1px 2px rgba(15, 23, 42, .06);--shadow-2: 0 16px 30px -16px rgba(15, 23, 42, .22);--ring: 0 0 0 3px rgba(91, 108, 240, .28)}}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Hiragino Kaku Gothic ProN,Yu Gothic,Meiryo,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overscroll-behavior-y:none}.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;letter-spacing:-.01em}button{font:inherit;color:inherit;cursor:pointer}input{font:inherit}:focus-visible{outline:none;box-shadow:var(--ring);border-radius:var(--r-xs)}.app{position:relative;max-width:var(--maxw);margin:0 auto;min-height:100dvh;overflow-x:clip;display:flex;flex-direction:column;background:radial-gradient(120% 60% at 50% -10%,rgba(124,139,255,.08),transparent 60%),var(--bg)}.app-bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:max(12px,env(safe-area-inset-top)) 18px 12px;background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--border)}.brand{display:flex;align-items:center;gap:10px;font-weight:750;font-size:1.15rem;letter-spacing:-.02em}.brand-mark{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:9px;font-size:1rem;font-weight:800;color:var(--accent-ink);background:linear-gradient(150deg,var(--accent),var(--accent-2));box-shadow:0 4px 14px -4px var(--accent)}.sync-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:var(--r-full);border:1px solid var(--border);background:var(--surface);color:var(--text-dim);font-size:.72rem;font-weight:600;transition:background .12s ease,color .12s ease}.sync-pill:hover{color:var(--text);background:var(--surface-3)}.sync-pill svg{width:15px;height:15px}.sync-row{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text-dim);text-align:left;transition:background .12s ease,color .12s ease,border-color .12s ease}.sync-row:hover{background:var(--hover);color:var(--text);border-color:var(--border-2)}.sync-row svg{width:18px;height:18px;flex:none}.sync-row-main{display:flex;flex-direction:column;gap:1px;min-width:0}.sync-row-label{font-size:.84rem;font-weight:650}.sync-row-sub{font-size:.72rem;color:var(--text-faint)}.sync-dot{width:7px;height:7px;border-radius:50%;background:var(--text-faint)}.sync-dot.on{background:var(--pos);box-shadow:0 0 0 3px color-mix(in srgb,var(--pos) 25%,transparent)}.sync-dot.syncing{background:var(--accent);animation:pulse 1s ease-in-out infinite}.sync-dot.error{background:var(--neg)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.app-main{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:16px 16px calc(var(--nav-h) + 30px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:16px}.tab-bar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;justify-content:center;padding-bottom:env(safe-area-inset-bottom);background:color-mix(in srgb,var(--bg) 72%,transparent);backdrop-filter:saturate(1.4) blur(16px);-webkit-backdrop-filter:saturate(1.4) blur(16px);border-top:1px solid var(--border)}.tab-bar-inner{width:100%;max-width:var(--maxw);height:var(--nav-h);display:grid;grid-template-columns:repeat(3,1fr)}.tab{border:none;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--text-faint);font-size:.66rem;font-weight:650;letter-spacing:.01em;transition:color .15s ease}.tab svg{width:22px;height:22px}.tab.active{color:var(--accent)}.tab:active{transform:translateY(.5px)}.app-body{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column}.view{display:flex;flex-direction:column;gap:16px}.side-nav{display:none;width:248px;flex:none;flex-direction:column;gap:6px;padding:22px 14px;border-right:1px solid var(--border);position:sticky;top:0;height:100dvh}.side-brand{display:flex;align-items:center;gap:10px;font-weight:750;font-size:1.2rem;letter-spacing:-.02em;padding:6px 10px 20px}.side-nav-items{display:flex;flex-direction:column;gap:4px}.side-tab{display:flex;align-items:center;gap:13px;width:100%;padding:11px 12px;border:none;border-radius:12px;background:transparent;color:var(--text-dim);font-weight:650;font-size:.95rem;text-align:left;transition:background .12s ease,color .12s ease}.side-tab svg{width:20px;height:20px}.side-tab:hover{background:var(--hover);color:var(--text)}.side-tab.active{background:var(--accent-soft);color:var(--accent)}.side-nav-footer{margin-top:auto;padding:8px 6px 4px}.card{background:linear-gradient(180deg,var(--surface-2),var(--surface));border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-1)}.section-title{display:flex;align-items:center;justify-content:space-between;padding:4px 4px 0;font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint)}.hero{padding:18px 18px 20px;position:relative;overflow:hidden}.hero-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.month-nav{display:inline-flex;align-items:center;gap:4px;background:var(--surface-3);border:1px solid var(--border);border-radius:var(--r-full);padding:3px}.month-arrow{width:30px;height:30px;border:none;border-radius:50%;background:transparent;color:var(--text-dim);font-size:1.15rem;line-height:1;display:grid;place-items:center;transition:background .12s ease,color .12s ease}.month-arrow:hover:not(:disabled){background:var(--hover);color:var(--text)}.month-arrow:disabled{opacity:.3;cursor:default}.month-label{min-width:108px;text-align:center;font-weight:650;font-size:.9rem}.hero-badge{font-size:.68rem;font-weight:700;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em}.hero-main{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.hero-metrics{display:none}.hero-total{font-size:2.9rem;font-weight:800;line-height:1;letter-spacing:-.03em}.hero-sub{margin-top:10px;display:flex;align-items:center;gap:10px;font-size:.82rem;color:var(--text-dim)}.delta{display:inline-flex;align-items:center;gap:4px;font-weight:700;padding:3px 8px;border-radius:var(--r-full)}.delta.up{color:var(--neg);background:color-mix(in srgb,var(--neg) 14%,transparent)}.delta.down{color:var(--pos);background:color-mix(in srgb,var(--pos) 14%,transparent)}.delta.flat{color:var(--text-dim);background:var(--surface-3)}.dot-sep{color:var(--text-faint)}.hero-spark{margin-top:16px;width:100%;height:46px;display:block}.smart-add{padding:14px;display:flex;flex-direction:column;gap:12px}.smart-field{position:relative;display:flex;align-items:center;gap:10px;background:var(--surface-3);border:1px solid var(--border);border-radius:var(--r);padding:12px 14px;transition:border-color .15s ease,box-shadow .15s ease}.smart-field:focus-within{border-color:var(--accent);box-shadow:var(--ring)}.smart-field .lead{color:var(--text-faint);display:grid;place-items:center}.smart-field .lead svg{width:18px;height:18px}.smart-input{flex:1;border:none;background:transparent;color:var(--text);font-size:1rem;outline:none;min-width:0}.smart-input::placeholder{color:var(--text-faint)}.parse-preview{display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-height:20px;padding:0 2px;font-size:.8rem;color:var(--text-dim)}.parse-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:var(--r-full);background:var(--surface-3);border:1px solid var(--border);font-weight:650}.parse-chip.amount{color:var(--text);background:var(--accent-soft);border-color:transparent}.parse-hint{color:var(--text-faint)}.amount-strip{display:flex;align-items:center;gap:6px;min-height:40px}.amount-strip .yen{font-size:1.4rem;font-weight:700;color:var(--text-faint)}.amount-strip .amt{font-size:2rem;font-weight:800;line-height:1;letter-spacing:-.02em}.amount-strip .yen{line-height:1}.amount-strip .amt.is-zero{color:var(--text-faint)}.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.cat-chip{min-width:0;display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 4px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-3);color:var(--text-dim);transition:transform .1s ease,border-color .12s ease,background .12s ease}.cat-chip .cat-emoji{font-size:1.35rem;line-height:1}.cat-chip .cat-label{min-width:0;font-size:.72rem;font-weight:650;line-height:1.15;text-align:center}.cat-chip.selected{color:var(--text);border-color:transparent;background:color-mix(in srgb,var(--chip) 22%,var(--surface-3));box-shadow:inset 0 0 0 1.5px var(--chip)}.cat-chip:active{transform:scale(.96)}.add-btn{border:none;border-radius:var(--r);padding:14px;font-size:.98rem;font-weight:750;letter-spacing:-.01em;color:var(--accent-ink);background:linear-gradient(150deg,var(--accent),var(--accent-2));box-shadow:0 8px 22px -10px var(--accent);transition:transform .1s ease,opacity .15s ease}.add-btn:active:not(:disabled){transform:scale(.985)}.add-btn:disabled{opacity:.4;box-shadow:none;cursor:not-allowed}.transactions{display:flex;flex-direction:column;gap:12px}.tx-head{display:flex;align-items:baseline;justify-content:space-between;padding:2px 2px 0}.tx-head h3{font-size:.95rem;font-weight:700}.tx-meta{font-size:.82rem;color:var(--text-dim)}.list-wrap{display:flex;flex-direction:column;gap:16px}.date-group{display:flex;flex-direction:column;gap:6px}.date-header{display:flex;justify-content:space-between;align-items:baseline;padding:2px 6px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint)}.date-total{color:var(--text-dim)}.rows{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden}.expense-row{display:flex;align-items:center;gap:12px;padding:12px 14px;position:relative}.expense-row+.expense-row{border-top:1px solid var(--border)}.row-emoji{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:11px;font-size:1.15rem;background:color-mix(in srgb,var(--chip) 18%,var(--surface-2));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--chip) 30%,transparent)}.row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.row-cat{font-weight:650;font-size:.92rem}.row-note{font-size:.8rem;color:var(--text-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row-amount{font-weight:700;font-size:.95rem}.row-delete{border:none;background:transparent;color:var(--text-faint);width:30px;height:30px;border-radius:8px;display:grid;place-items:center;transition:color .12s ease,background .12s ease}.row-delete:hover{color:var(--neg);background:color-mix(in srgb,var(--neg) 12%,transparent)}.row-delete svg{width:16px;height:16px}.empty{text-align:center;padding:40px 20px;color:var(--text-dim)}.empty-emoji{font-size:2.2rem;margin-bottom:10px}.empty p{font-size:.92rem}.empty-sub{font-size:.82rem;color:var(--text-faint);margin-top:2px}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stat-tile{padding:14px;display:flex;flex-direction:column;gap:3px}.stat-label{font-size:.7rem;font-weight:650;text-transform:uppercase;letter-spacing:.04em;color:var(--text-faint)}.stat-value{font-size:1.4rem;font-weight:800;line-height:1.15;letter-spacing:-.02em}.stat-meta{font-size:.76rem;color:var(--text-dim)}.chart-card{padding:16px;display:flex;flex-direction:column;gap:14px}.chart-head{display:flex;align-items:baseline;justify-content:space-between}.chart-head h3{font-size:.95rem;font-weight:700}.chart-head .hint{font-size:.74rem;color:var(--text-faint)}.cat-bars{display:flex;flex-direction:column;gap:12px}.cat-bar{display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:10px}.cat-bar .ic{font-size:1rem;text-align:center}.cat-bar-body{display:flex;flex-direction:column;gap:5px;min-width:0}.cat-bar-top{display:flex;justify-content:space-between;gap:8px;font-size:.82rem}.cat-bar-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cat-bar-pct{color:var(--text-faint);font-size:.76rem}.cat-bar-track{height:8px;border-radius:var(--r-full);background:var(--surface-3);overflow:hidden}.cat-bar-fill{height:100%;border-radius:var(--r-full);transition:width .5s cubic-bezier(.22,1,.36,1)}.cat-bar-amt{font-weight:700;font-size:.86rem;text-align:right;white-space:nowrap}.bars-chart{width:100%;height:auto;display:block;overflow:visible}.bar-rect{transition:opacity .12s ease;cursor:pointer}.bar-rect:hover{opacity:.75}.axis-label{fill:var(--text-faint);font-size:9px;font-weight:600}.chart-legend{display:flex;flex-wrap:wrap;gap:10px 14px;font-size:.74rem;color:var(--text-dim)}.legend-item{display:inline-flex;align-items:center;gap:6px}.legend-swatch{width:10px;height:10px;border-radius:3px}.mini-bars{display:flex;align-items:flex-end;gap:8px;height:150px}.mb-col{position:relative;flex:1;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;border:none;background:transparent}.mb-track{width:62%;max-width:34px;flex:1;display:flex;align-items:flex-end}.mb-fill{width:100%;border-radius:4px 4px 2px 2px;background:var(--surface-3);transition:height .5s cubic-bezier(.22,1,.36,1)}.mb-col.on .mb-fill{background:linear-gradient(180deg,var(--accent),var(--accent-2))}.mb-x{font-size:.68rem;font-weight:650;color:var(--text-faint)}.mb-col.on .mb-x{color:var(--accent)}.mb-v{font-size:.66rem;font-weight:700;color:var(--text-dim);margin-top:-2px}.mb-tip{position:absolute;bottom:calc(100% - 18px);left:50%;transform:translate(-50%) translateY(4px);padding:5px 9px;border-radius:var(--r-xs);background:var(--surface-3);border:1px solid var(--border-2);box-shadow:var(--shadow-2);font-size:.72rem;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s ease,transform .12s ease}.mb-col:hover .mb-tip,.mb-col:focus-visible .mb-tip{opacity:1;transform:translate(-50%) translateY(0)}.mb-col.on .mb-tip{display:none}.chart-tip{position:absolute;pointer-events:none;transform:translate(-50%,-120%);background:var(--surface-3);border:1px solid var(--border-2);border-radius:var(--r-xs);box-shadow:var(--shadow-2);padding:7px 10px;font-size:.76rem;white-space:nowrap;z-index:5}.chart-tip .tip-amt{font-weight:700}.chart-tip .tip-label{color:var(--text-dim)}.settings{display:flex;flex-direction:column;gap:18px}.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:.78rem;font-weight:650;color:var(--text-dim)}.text-input{width:100%;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-3);color:var(--text);padding:12px 14px;font-size:.92rem;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.text-input:focus{border-color:var(--accent);box-shadow:var(--ring)}.field-hint{font-size:.74rem;color:var(--text-faint)}.settings-card{padding:16px;display:flex;flex-direction:column;gap:14px}.settings-card>.sc-head{display:flex;align-items:center;gap:10px}.sc-head .sc-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent)}.sc-head .sc-icon svg{width:18px;height:18px}.sc-head h3{font-size:.98rem;font-weight:700}.sc-head p{font-size:.76rem;color:var(--text-dim)}.row-between{display:flex;align-items:center;justify-content:space-between;gap:12px}.btn{border:1px solid var(--border-2);background:var(--surface-3);color:var(--text);border-radius:var(--r-sm);padding:11px 16px;font-weight:650;font-size:.9rem;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:transform .1s ease,background .12s ease}.btn svg{width:18px;height:18px;flex:none}.status-line svg{width:14px;height:14px;flex:none}.roadmap .check{width:16px;height:16px;margin-top:2px}.spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.btn:active{transform:scale(.98)}.btn.primary{border-color:transparent;color:var(--accent-ink);background:linear-gradient(150deg,var(--accent),var(--accent-2))}.btn.ghost{background:transparent}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-row{display:flex;gap:10px}.btn-row .btn{flex:1}.toggle{position:relative;width:44px;height:26px;border-radius:var(--r-full);background:var(--surface-3);border:1px solid var(--border-2);transition:background .15s ease;flex:none}.toggle:after{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:var(--text-dim);transition:transform .16s ease,background .16s ease}.toggle.on{background:var(--accent);border-color:transparent}.toggle.on:after{transform:translate(18px);background:#fff}.status-line{font-size:.78rem;color:var(--text-dim);display:flex;align-items:center;gap:7px}.status-line.ok{color:var(--pos)}.status-line.err{color:var(--neg)}.about{font-size:.82rem;color:var(--text-dim);line-height:1.6}.about strong{color:var(--text)}.roadmap{list-style:none;display:flex;flex-direction:column;gap:8px;margin-top:4px}.roadmap li{display:flex;gap:9px;align-items:flex-start;font-size:.82rem}.check{color:var(--pos);flex:none}.toast{position:fixed;left:50%;bottom:calc(var(--nav-h) + 20px + env(safe-area-inset-bottom));transform:translate(-50%);z-index:50;background:var(--surface-3);color:var(--text);border:1px solid var(--border-2);box-shadow:var(--shadow-2);border-radius:var(--r-full);padding:10px 18px;font-size:.85rem;font-weight:600;display:flex;align-items:center;gap:8px;animation:toast-in .24s cubic-bezier(.22,1,.36,1)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,12px)}}@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}@media(min-width:900px){.app{flex-direction:row;max-width:1200px;align-items:stretch}.app-bar,.tab-bar{display:none}.side-nav{display:flex}.app-main{padding:30px 34px 44px}.view-track{display:grid;grid-template-columns:360px minmax(0,1fr);gap:20px;align-items:start}.view-track>.hero{grid-column:1 / -1}.view-track>.smart-add{position:sticky;top:20px;align-self:start}.view-track>.transactions{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:16px 18px 20px;min-height:480px}.view-track>.transactions .empty{margin:auto}.hero-metrics{display:flex;gap:32px;padding-bottom:4px}.hm{display:flex;flex-direction:column;gap:3px}.hm-label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint)}.hm-value{font-size:1.15rem;font-weight:750;line-height:1.15;letter-spacing:-.01em}.view-insights{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}.view-insights>.stat-grid{grid-column:1 / -1;grid-template-columns:repeat(4,1fr)}.view-insights>.empty{grid-column:1 / -1}.view-settings{max-width:720px}.hero-total{font-size:3.2rem}.toast{bottom:28px}}@media(min-width:1280px){.view-insights{grid-template-columns:3fr 2fr}}
