@import"https://fonts.googleapis.com/css2?family=Noto+Sans+Thai+Looped:wght@400;500;700;800&display=swap";:root{--color-paper:oklch(98.5% .006 48);--color-paper-2:oklch(96.5% .009 48);--color-paper-3:oklch(93.5% .012 48);--color-surface:oklch(99.7% .003 48);--color-ink:oklch(20% .012 40);--color-ink-soft:oklch(32% .012 40);--color-muted:oklch(45% .012 40);--color-rule:oklch(88% .008 42);--color-rule-strong:oklch(78% .012 42);--color-accent:oklch(56% .17 30);--color-accent-ink:oklch(20% .012 40);--color-accent-soft:oklch(95% .028 30);--color-income:oklch(45% .12 153);--color-income-soft:oklch(95% .022 153);--color-expense:oklch(56% .17 30);--color-expense-ink:oklch(43% .15 30);--color-expense-soft:oklch(95% .028 30);--color-error:oklch(46% .17 26);--color-focus:oklch(42% .16 30);--color-overlay:oklch(20% .012 40 / .42);--font-display:"Noto Sans Thai Looped", ui-sans-serif, system-ui, sans-serif;--font-body:"Noto Sans Thai Looped", ui-sans-serif, system-ui, sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, monospace;--space-2xs:.25rem;--space-xs:.5rem;--space-sm:.75rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2.5rem;--space-2xl:4rem;--text-xs:.875rem;--text-sm:.9375rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.375rem;--text-2xl:1.75rem;--text-display:clamp(2rem, 5vw + 1rem, 3rem);--line-body:1.55;--line-heading:1.15;--radius-sm:.75rem;--radius-card:1.25rem;--radius-large:1.75rem;--radius-pill:999px;--rule-thin:1px;--shadow-soft:0 8px 24px oklch(20% .012 40 / .07);--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in:cubic-bezier(.7, 0, .84, 0);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--dur-micro:.12s;--dur-short:.22s;--dur-long:.32s;--z-nav:200;--z-modal:400}body,html{min-height:100%;overflow-x:clip}html{scroll-behavior:smooth;scroll-padding-top:6rem}body,html{background:var(--color-paper)}body{margin:0;padding:0 max(var(--space-md),env(safe-area-inset-right)) calc(var(--space-xl) + env(safe-area-inset-bottom)) max(var(--space-md),env(safe-area-inset-left));color:var(--color-ink);font-family:var(--font-body);font-size:var(--text-base);line-height:var(--line-body);-webkit-font-smoothing:antialiased}*{box-sizing:border-box}button,input,select,textarea{color:inherit;font:inherit}a,button,input,select,textarea{-webkit-tap-highlight-color:transparent}a{color:inherit}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}button:disabled{cursor:not-allowed;opacity:.56}.app-shell{width:min(100%,72rem);min-height:100dvh;margin-inline:auto;padding-block:calc(5.75rem + env(safe-area-inset-top)) var(--space-2xl)}.nav-pill{position:fixed;z-index:var(--z-nav);inset:calc(var(--space-sm) + env(safe-area-inset-top)) auto auto 50%;display:flex;width:-moz-max-content;width:max-content;max-width:calc(100% - 2rem);align-items:center;gap:var(--space-lg);padding:var(--space-xs) var(--space-sm);transform:translate(-50%);border:var(--rule-thin) solid var(--color-rule);border-radius:var(--radius-pill);background:color-mix(in oklch,var(--color-surface) 94%,transparent);box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.brand-only,.wordmark{display:inline-flex;align-items:center;gap:var(--space-xs);color:var(--color-ink);font-weight:700;letter-spacing:-.035em;text-decoration:none;white-space:nowrap}.brand-only{margin:0 0 var(--space-lg)}.wordmark-light{color:var(--color-muted);font-weight:500}.balance-icon,.brand-mark,.list-mark,.panel-icon{display:grid;flex:0 0 auto;place-items:center}.brand-mark{width:2rem;height:2rem;border-radius:50%;color:var(--color-accent-ink);background:var(--color-accent-soft)}.nav-links{display:flex;align-items:center;gap:var(--space-md)}.nav-links a{min-height:2.75rem;display:inline-flex;align-items:center;color:var(--color-muted);font-size:var(--text-xs);font-weight:600;text-decoration:none;white-space:nowrap}.nav-links a:focus-visible,.nav-links a:hover{color:var(--color-ink)}.page-toolbar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);margin-block:0 var(--space-lg)}.month-control{display:inline-flex;min-width:0;align-items:center;gap:var(--space-xs)}.month-control strong{min-width:8.5rem;color:var(--color-ink-soft);font-size:var(--text-sm);font-weight:600;text-align:center;white-space:nowrap}.icon-button{display:inline-grid;width:2.75rem;height:2.75rem;flex:0 0 auto;place-items:center;border:var(--rule-thin) solid var(--color-rule);border-radius:50%;color:var(--color-ink-soft);background:var(--color-surface)}.icon-button:hover{color:var(--color-ink);background:var(--color-paper-2)}.dashboard{display:grid;gap:var(--space-xl)}.dashboard-grid{display:grid;min-width:0;gap:var(--space-lg)}.overview-column{display:grid;min-width:0;align-content:start;gap:var(--space-md)}.balance-card{position:relative;overflow:hidden;min-width:0;padding:var(--space-lg);border:var(--rule-thin) solid var(--color-rule);border-radius:var(--radius-large);background:linear-gradient(135deg,var(--color-surface),var(--color-accent-soft))}.balance-card:after{position:absolute;right:-2rem;bottom:-4rem;width:10rem;height:10rem;border:1.25rem solid color-mix(in oklch,var(--color-accent) 10%,transparent);border-radius:50%;content:"";pointer-events:none}.balance-heading{display:flex;min-width:0;align-items:flex-start;justify-content:space-between;gap:var(--space-sm)}.eyebrow{margin:0 0 var(--space-2xs);color:var(--color-muted);font-size:var(--text-xs);font-weight:600}h1,h2,h3,p{margin-top:0}h1,h2,h3{color:var(--color-ink);font-family:var(--font-display);font-style:normal;font-weight:700;line-height:var(--line-heading);letter-spacing:-.015em;overflow-wrap:anywhere;min-width:0}.balance-heading h1{margin:0;font-size:var(--text-xl)}.balance-icon{width:2.75rem;height:2.75rem;border:var(--rule-thin) solid var(--color-rule);border-radius:50%;color:var(--color-accent);background:var(--color-surface)}.balance-value{position:relative;z-index:1;margin:var(--space-lg) 0 var(--space-2xs);font-size:var(--text-display);font-weight:700;line-height:1.05;letter-spacing:-.045em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.balance-caption{position:relative;z-index:1;margin:0;color:var(--color-muted);font-size:var(--text-xs)}.totals-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-sm)}.total-card{min-width:0;padding:var(--space-md);border:var(--rule-thin) solid var(--color-rule);border-radius:var(--radius-card);background:var(--color-surface)}.total-label{display:flex;align-items:center;gap:var(--space-xs);color:var(--color-muted);font-size:var(--text-xs);font-weight:600}.chart-key i,.total-dot{display:inline-block;width:.625rem;height:.625rem;border-radius:50%}.income-dot{background:var(--color-income)}.expense-dot{background:var(--color-expense)}.total-card>p{margin:var(--space-sm) 0 var(--space-2xs);color:var(--color-ink);font-size:clamp(1.125rem,3.6vw,1.5rem);font-weight:700;line-height:var(--line-heading);letter-spacing:-.03em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.total-caption{color:var(--color-muted);font-size:var(--text-xs)}.chart-card,.transactions-section{min-width:0;margin:0;padding:var(--space-lg);border:var(--rule-thin) solid var(--color-rule);border-radius:var(--radius-card);background:var(--color-surface)}.section-heading{display:flex;min-width:0;align-items:center;justify-content:space-between;gap:var(--space-sm)}.section-heading h2{margin:0;font-size:var(--text-lg)}.section-heading p{margin:var(--space-2xs) 0 0}.chart-key,.section-heading p{color:var(--color-muted);font-size:var(--text-xs)}.chart-key{display:flex;flex:0 0 auto;align-items:center;gap:var(--space-2xs);white-space:nowrap}.chart-key i:not(:first-child){margin-inline-start:var(--space-xs)}.daily-chart{display:grid;height:8rem;grid-template-columns:repeat(var(--days),minmax(0,1fr));align-items:end;gap:2px;margin-block:var(--space-lg) var(--space-xs);padding-block-end:var(--space-2xs);border-bottom:var(--rule-thin) solid var(--color-rule-strong)}.chart-day{min-width:0}.bar-pair,.chart-day{display:flex;height:100%;align-items:end;justify-content:center}.bar-pair{width:min(100%,.5rem);gap:1px}.bar{width:45%;min-height:2px;border-radius:4px 4px 0 0}.bar-income{background:var(--color-income)}.bar-expense{background:var(--color-expense)}.chart-axis{display:flex;justify-content:space-between;color:var(--color-muted);font-size:var(--text-xs);font-variant-numeric:tabular-nums}.transactions-section{align-self:start}.transaction-heading{padding-block-end:var(--space-md);border-bottom:var(--rule-thin) solid var(--color-rule)}.list-mark{width:2.5rem;height:2.5rem;border-radius:50%;color:var(--color-accent);background:var(--color-accent-soft)}.transaction-list{display:grid}.transaction-row{display:grid;min-width:0;grid-template-columns:2.75rem minmax(0,1fr) auto;align-items:center;gap:var(--space-sm);padding-block:var(--space-md);border-bottom:var(--rule-thin) solid var(--color-rule)}.transaction-row:last-child{border-bottom:0;padding-block-end:0}.transaction-icon{display:grid;width:2.75rem;height:2.75rem;place-items:center;border-radius:50%}.transaction-icon.is-income{color:var(--color-income);background:var(--color-income-soft)}.transaction-icon.is-expense{color:var(--color-expense-ink);background:var(--color-expense-soft)}.transaction-main{display:grid;min-width:0;gap:var(--space-2xs)}.transaction-main strong{color:var(--color-ink);font-size:var(--text-sm);font-weight:600}.transaction-main span,.transaction-main strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.transaction-main span{color:var(--color-muted);font-size:var(--text-xs)}.transaction-amount{max-width:10rem;font-size:var(--text-xs);font-weight:700;font-variant-numeric:tabular-nums;text-align:end;white-space:nowrap}.amount-income{color:var(--color-income)}.amount-expense{color:var(--color-expense-ink)}.empty-state{display:grid;justify-items:start;gap:var(--space-xs);padding-block:var(--space-xl) var(--space-sm)}.empty-icon{display:grid;width:3rem;height:3rem;place-items:center;margin-block-end:var(--space-xs);border-radius:50%;color:var(--color-muted);background:var(--color-paper-2)}.empty-state h3{margin:0;font-size:var(--text-base)}.empty-state p{margin:0;color:var(--color-muted);font-size:var(--text-sm)}.text-button{display:inline-flex;min-height:2.75rem;align-items:center;gap:var(--space-2xs);margin-block-start:var(--space-xs);padding:0;border:0;color:var(--color-accent);background:transparent;font-weight:700;white-space:nowrap}.footer-line{display:flex;justify-content:space-between;gap:var(--space-sm);padding-block-start:var(--space-md);border-top:var(--rule-thin) solid var(--color-rule);color:var(--color-muted);font-size:var(--text-xs)}.add-button,.primary-button{display:inline-flex;min-height:3rem;align-items:center;justify-content:center;gap:var(--space-xs);border:var(--rule-thin) solid var(--color-accent);border-radius:var(--radius-pill);color:var(--color-accent-ink);background:var(--color-accent);font-weight:700;text-decoration:none;white-space:nowrap;transition:transform var(--dur-micro) var(--ease-out),opacity var(--dur-micro) var(--ease-out)}.add-button{position:fixed;z-index:var(--z-nav);right:max(var(--space-md),env(safe-area-inset-right));bottom:calc(var(--space-md) + env(safe-area-inset-bottom));min-width:8.5rem;box-shadow:var(--shadow-soft)}.add-button,.primary-button{padding-inline:var(--space-md)}.primary-button{width:100%}.add-button:hover,.primary-button:hover:not(:disabled){transform:translateY(-1px)}.add-button:active,.primary-button:active:not(:disabled){transform:translateY(1px)}.auth-panel,.loading-panel,.message-panel{width:min(100%,30rem);margin-inline:auto;padding:var(--space-lg);border:var(--rule-thin) solid var(--color-rule);border-radius:var(--radius-large);background:var(--color-surface)}.auth-panel h1,.message-panel h1{margin-block:var(--space-xs);font-size:var(--text-2xl)}.auth-intro,.message-panel>p:not(.eyebrow):not(.small-note){color:var(--color-muted)}.auth-switch,.kind-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2xs);padding:var(--space-2xs);border-radius:var(--radius-pill);background:var(--color-paper-2)}.auth-switch button,.kind-switch button{min-height:2.75rem;border:0;border-radius:var(--radius-pill);color:var(--color-muted);background:transparent;font-size:var(--text-sm);font-weight:600;white-space:nowrap}.auth-switch button.selected,.kind-switch button.selected{color:var(--color-ink);background:var(--color-surface);box-shadow:var(--shadow-soft)}.auth-form,.entry-form{display:grid;gap:var(--space-xs)}.auth-form{margin-block-start:0}.google-button{display:flex;width:100%;min-height:3rem;align-items:center;justify-content:center;gap:var(--space-sm);margin-block-start:var(--space-md);padding:var(--space-xs) var(--space-sm);border:var(--rule-thin) solid var(--color-rule-strong);border-radius:var(--radius-sm);color:var(--color-ink);background:var(--color-surface);font-weight:600}.google-button:hover:not(:disabled){background:var(--color-paper-2)}.auth-divider{display:flex;align-items:center;gap:var(--space-sm);margin-block:var(--space-md);color:var(--color-muted);font-size:var(--text-xs)}.auth-divider:after,.auth-divider:before{height:1px;flex:1;background:var(--color-rule);content:""}.auth-form label,.entry-form label,.kind-field legend{color:var(--color-ink-soft);font-size:var(--text-sm);font-weight:600}.auth-form input,.date-picker-trigger,.entry-form input,.entry-form select,.entry-form textarea{width:100%;min-width:0;min-height:2.875rem;padding:var(--space-xs) var(--space-sm);border:var(--rule-thin) solid var(--color-rule-strong);border-radius:var(--radius-sm);outline:2px solid transparent;outline-offset:1px;color:var(--color-ink);background:var(--color-surface);font-size:var(--text-base)}.auth-form input:hover,.date-picker-trigger:hover,.entry-form input:hover,.entry-form select:hover,.entry-form textarea:hover{background:var(--color-paper-2)}.auth-form input:focus-visible,.date-picker-trigger:focus-visible,.entry-form input:focus-visible,.entry-form select:focus-visible,.entry-form textarea:focus-visible{outline-color:var(--color-focus)}.entry-form textarea{min-height:5rem;resize:vertical}.date-picker{min-width:0}.date-picker-trigger{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);text-align:start}.date-picker-trigger svg{flex:0 0 auto;color:var(--color-accent)}.calendar-popover{margin-block-start:var(--space-xs);padding:var(--space-sm);border:var(--rule-thin) solid var(--color-rule);border-radius:var(--radius-card);background:var(--color-surface);box-shadow:var(--shadow-soft)}.calendar-heading{display:flex;min-height:2.75rem;align-items:center;justify-content:space-between;margin-block-end:var(--space-xs)}.calendar-heading strong{color:var(--color-ink);font-size:var(--text-sm);font-weight:700}.calendar-day,.calendar-nav{display:grid;min-width:2.75rem;min-height:2.75rem;place-items:center;border:0;border-radius:var(--radius-pill);color:var(--color-ink-soft);background:transparent}.calendar-day:hover:not(.selected),.calendar-nav:hover{background:var(--color-paper-2)}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--space-2xs)}.calendar-weekdays{margin-block-end:var(--space-2xs);color:var(--color-muted);font-size:var(--text-xs);text-align:center}.calendar-weekdays span{display:grid;min-height:2rem;place-items:center}.calendar-day{width:100%;aspect-ratio:1;min-width:0;min-height:2.75rem;padding:0;font-size:var(--text-sm);font-variant-numeric:tabular-nums}.calendar-day.is-empty{visibility:hidden}.calendar-day.today:not(.selected){outline:1px solid var(--color-accent);outline-offset:-2px}.calendar-day.selected{color:var(--color-surface);background:var(--color-accent);font-weight:700}input::-moz-placeholder,textarea::-moz-placeholder{color:var(--color-muted);opacity:1}input::placeholder,textarea::placeholder{color:var(--color-muted);opacity:1}.auth-submit{margin-block-start:var(--space-sm)}.privacy-note,.small-note{margin:var(--space-md) 0 0;color:var(--color-muted);font-size:var(--text-xs)}.form-message,.global-error{margin:var(--space-xs) 0 0;padding:var(--space-sm);border-radius:var(--radius-sm);font-size:var(--text-sm)}.error-message,.global-error{color:var(--color-error);background:var(--color-expense-soft)}.success-message{color:var(--color-income);background:var(--color-income-soft)}.global-error{margin-block-end:var(--space-md)}.panel-icon{width:3rem;height:3rem;margin-block-end:var(--space-lg);border-radius:50%;color:var(--color-accent-ink);background:var(--color-accent-soft)}.key-list{display:grid;gap:var(--space-xs);margin-block:var(--space-md)}.key-list code{overflow-wrap:anywhere;padding:var(--space-xs);border-radius:var(--radius-sm);color:var(--color-ink-soft);background:var(--color-paper-2);font-family:var(--font-mono);font-size:var(--text-xs)}.loading-panel{display:grid;gap:var(--space-md)}.skeleton{border-radius:var(--radius-sm);background:var(--color-paper-2);animation:skeleton-pulse 1.4s var(--ease-in-out) infinite alternate}.skeleton-title{width:55%;height:1.5rem}.skeleton-amount{width:72%;height:3.5rem}.skeleton-card{height:9rem}.inline-loading{margin-block-end:var(--space-sm);color:var(--color-muted);font-size:var(--text-xs)}.is-loading{opacity:.68}.entry-dialog{position:fixed;inset:auto 0 0;width:100%;max-width:none;max-height:min(88dvh,44rem);margin:0;overflow:auto;padding:0;border:0;border-radius:var(--radius-large) var(--radius-large) 0 0;color:var(--color-ink);background:var(--color-paper)}.entry-dialog::backdrop{background:var(--color-overlay)}.entry-dialog[open]{animation:dialog-enter var(--dur-long) var(--ease-out) both}.dialog-content{max-width:38rem;margin-inline:auto;padding:var(--space-lg) var(--space-md) calc(var(--space-lg) + env(safe-area-inset-bottom))}.dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-md);margin-block-end:var(--space-lg)}.dialog-heading h2{margin:0;font-size:var(--text-xl)}.entry-form{gap:var(--space-sm)}.entry-form fieldset{min-width:0;margin:0 0 var(--space-xs);padding:0;border:0}.kind-field legend{margin-block-end:var(--space-xs)}.form-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-sm)}.form-pair>div{display:grid;min-width:0;gap:var(--space-xs)}.optional-label{color:var(--color-muted);font-size:var(--text-xs);font-weight:400}.save-button{margin-block-start:var(--space-xs)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@keyframes dialog-enter{0%{opacity:0;transform:translateY(.75rem)}to{opacity:1;transform:translateY(0)}}@keyframes skeleton-pulse{0%{opacity:.55}to{opacity:1}}@media(min-width:40rem){.app-shell{padding-inline:var(--space-lg);padding-block-start:calc(6.5rem + env(safe-area-inset-top))}.dashboard-grid{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);align-items:start}.dashboard-grid,.overview-column{gap:var(--space-lg)}.balance-card{padding:var(--space-xl)}.total-card{padding:var(--space-lg)}.entry-dialog{inset:0;width:min(calc(100% - 2rem),38rem);max-height:min(84dvh,44rem);margin:auto;border-radius:var(--radius-large)}.dialog-content{padding:var(--space-xl)}}@media(min-width:60rem){.dashboard{gap:var(--space-2xl)}.balance-value{font-size:clamp(2.75rem,3vw,3.75rem)}}@media(hover:hover)and (pointer:fine){.transaction-row:hover .transaction-icon{transform:translateY(-1px)}}@media(prefers-reduced-motion:reduce){*,:after,:before{scroll-behavior:auto!important;animation-duration:.15s!important;animation-iteration-count:1!important;transition-duration:.15s!important}.entry-dialog[open]{animation-name:dialog-fade}}@keyframes dialog-fade{0%{opacity:0}to{opacity:1}}
