@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Noto+Sans+Thai:wght@300;400;500;600;700&display=swap";:root{--primary:#06c;--primary-focus:#0071e3;--primary-on-dark:#2997ff;--ink:#1d1d1f;--text:#1d1d1f;--body:#1d1d1f;--canvas:#fff;--canvas-parchment:#f5f5f7;--surface:#fff;--surface-pearl:#fafafc;--surface-tile-1:#272729;--surface-tile-2:#2a2a2c;--surface-tile-3:#252527;--surface-black:#000;--surface-chip-translucent:#d2d2d7a3;--line:#e0e0e0;--hairline:#e0e0e0;--divider-soft:#f0f0f0;--success:#10a970;--success-glow:#10a9701a;--danger:#e11d48;--danger-glow:#e11d481a;--warning:#f59e0b;--warning-glow:#f59e0b1a;--muted:#7a7a7a;--radius-none:0px;--radius-xs:5px;--radius-sm:8px;--radius-md:11px;--radius-lg:18px;--radius-pill:9999px;--space-xxs:4px;--space-xs:8px;--space-sm:12px;--space-md:17px;--space-lg:24px;--space-xl:32px;--space-xxl:48px;--space-section:80px;--transition:all .2s cubic-bezier(.25, .1, .25, 1);--nav-height:44px;--subnav-height:52px;--bg:#f5f5f7;--sidebar-width:260px}[data-theme=calm-blue]{--primary:#06c;--primary-focus:#0071e3}[data-theme=fresh-green]{--primary:#10a970;--primary-focus:#059669}[data-theme=warm-orange]{--primary:#f97316;--primary-focus:#ea580c}[data-theme=dark-mode]{--canvas:#1d1d1f;--canvas-parchment:#272729;--bg:#1d1d1f;--surface:#272729;--surface-pearl:#2a2a2c;--text:#fff;--body:#fff;--ink:#fff;--line:#333;--hairline:#333;--divider-soft:#333;--primary:#2997ff;--primary-focus:#0071e3;--muted:#ccc;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0}body{letter-spacing:-.374px;color:var(--text);background-color:var(--bg);-webkit-font-smoothing:antialiased;font-family:Inter,Noto Sans Thai,-apple-system,system-ui,sans-serif;font-size:17px;line-height:1.47;transition:background-color .2s,color .2s}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--line);border-radius:var(--radius-pill)}::-webkit-scrollbar-thumb:hover{background:var(--muted)}.app-container{background-color:var(--bg);min-height:100vh;display:flex}.app-main{width:100%;min-height:100vh;transition:var(--transition);flex:1}.content-area{width:100%;min-height:100vh;transition:var(--transition)}@media (width>=769px){.app-main{padding-left:var(--sidebar-width)}.content-area{max-width:1080px;margin:0 auto;padding:40px 60px 60px}.floating-bottom-nav{display:none!important}}@media (width<=768px){.content-area{max-width:100%;padding:24px 20px 110px}}h1,h2,h3,h4,h5,h6{color:var(--ink);letter-spacing:-.015em;font-family:Inter,Noto Sans Thai,-apple-system,system-ui,sans-serif;font-weight:600}.hero-display{letter-spacing:-.28px;font-size:40px;font-weight:600;line-height:1.1}.display-lg{letter-spacing:-.2px;font-size:28px;font-weight:600;line-height:1.15}.welcome-subtitle{color:var(--muted);margin-top:4px;font-size:14px;font-weight:400;line-height:1.43}.card{background-color:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);transition:var(--transition);box-shadow:none;padding:24px;position:relative}.product-shadow{box-shadow:3px 5px 30px #00000038!important}.btn{border-radius:var(--radius-pill);cursor:pointer;transition:var(--transition);border:none;outline:none;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-family:inherit;font-size:14px;font-weight:500;display:inline-flex}.btn:active{transform:scale(.95)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background-color:var(--primary);color:#fff}.btn-primary:hover{background-color:var(--primary-focus)}.btn-secondary{background-color:var(--surface);border:1px solid var(--primary);color:var(--primary)}.btn-secondary:hover{background-color:var(--surface-pearl)}.btn-danger{background-color:var(--danger);color:#fff}.btn-icon-circular{border-radius:var(--radius-full);background-color:var(--surface-chip-translucent);width:44px;height:44px;color:var(--ink);cursor:pointer;border:none;justify-content:center;align-items:center;display:flex}.form-group{flex-direction:column;gap:8px;margin-bottom:20px;display:flex}.form-label{color:var(--ink);font-size:14px;font-weight:600}.form-control{border-radius:var(--radius-sm);border:1px solid var(--line);background-color:var(--canvas);color:var(--text);transition:var(--transition);outline:none;width:100%;padding:12px 18px;font-family:inherit;font-size:15px}.form-control:focus{border-color:var(--primary);box-shadow:0 0 0 2px #0066cc26}.floating-bottom-nav{z-index:1000;-webkit-backdrop-filter:saturate(180%)blur(20px);border:1px solid var(--line);border-radius:var(--radius-pill);background-color:#f5f5f7cc;justify-content:space-around;align-items:center;width:90%;max-width:400px;padding:6px 12px;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 4px 20px #0000000d}[data-theme=dark-mode] .floating-bottom-nav{background-color:#2a2a2ccc}.nav-item-btn{cursor:pointer;color:var(--muted);transition:var(--transition);background:0 0;border:none;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:8px;display:flex}.nav-icon-capsule{border-radius:var(--radius-pill);width:40px;height:40px;transition:var(--transition);justify-content:center;align-items:center;display:flex}.nav-item-btn.active{color:var(--primary)}.nav-item-btn.active .nav-icon-capsule{background-color:var(--surface-chip-translucent)}.nav-item-label{font-size:10px;font-weight:500}dialog{border:1px solid var(--line);border-radius:var(--radius-lg);background-color:var(--surface);outline:none;width:90%;max-width:440px;margin:auto;padding:24px;box-shadow:0 12px 36px #00000026}dialog::backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background-color:#0006}.grid-cols-12{grid-template-columns:repeat(12,1fr);gap:16px;display:grid}.flex-between{justify-content:space-between;align-items:center;display:flex}.flex-align{align-items:center;display:flex}.text-center{text-align:center}.text-right{text-align:right}.text-danger{color:var(--danger)}.text-success{color:var(--success)}.text-muted{color:var(--muted)}@keyframes spin{to{transform:rotate(360deg)}}.welcome-section{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.welcome-label{text-transform:uppercase;color:var(--muted);letter-spacing:.5px;font-size:12px;font-weight:600}.welcome-date{color:var(--ink);letter-spacing:-.2px;font-size:28px;font-weight:600}.profile-avatar-btn{background-color:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:14px;font-weight:600;display:flex}.apple-balance-tile{background-color:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);text-align:center;margin-bottom:20px;padding:32px 24px;position:relative}.balance-lbl{color:var(--muted);margin-bottom:8px;font-size:14px;font-weight:500;display:block}.balance-val-row{justify-content:center;align-items:baseline;gap:6px;display:flex}.balance-big-amount{color:var(--ink);letter-spacing:-.28px;font-family:Inter,sans-serif;font-size:40px;font-weight:600;line-height:1}.balance-unit{color:var(--muted);font-size:17px;font-weight:500}.balance-days-badge{color:var(--primary);background-color:var(--surface-pearl);border-radius:var(--radius-pill);border:1px solid var(--line);margin-top:12px;padding:4px 10px;font-size:12px;font-weight:600;display:inline-block}.twin-cards-row{gap:16px;margin-bottom:24px;display:flex}.twin-card{background-color:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);flex-direction:column;flex:1;gap:6px;padding:20px;display:flex}.twin-card-icon{border-radius:var(--radius-sm);justify-content:center;align-items:center;width:32px;height:32px;margin-bottom:4px;display:flex}.income-card .twin-card-icon{background-color:var(--success-glow);color:var(--success)}.expense-card .twin-card-icon{background-color:var(--danger-glow);color:var(--danger)}.twin-card-lbl{color:var(--muted);font-size:14px;font-weight:500}.twin-card-val{color:var(--ink);letter-spacing:-.2px;font-size:21px;font-weight:600}.section-header-row{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.section-title{letter-spacing:-.2px;color:var(--ink);font-size:21px;font-weight:600}.section-link{color:var(--primary);cursor:pointer;transition:var(--transition);background:0 0;border:none;font-size:14px;font-weight:600}.section-link:hover{color:var(--primary-focus)}.icon-selector-grid button,.category-picker-grid button{transition:var(--transition);border:1px solid var(--line)!important;background-color:var(--canvas)!important}.icon-selector-grid button:hover,.category-picker-grid button:hover{border-color:var(--primary)!important}.transaction-premium-item{background-color:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);justify-content:space-between;align-items:center;margin-bottom:10px;padding:16px;display:flex}.transaction-premium-item:hover{border-color:var(--primary);transform:translate(4px)}.tx-item-left{align-items:center;gap:12px;display:flex}.tx-item-icon-box{border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.tx-item-title{color:var(--ink);font-size:15px;font-weight:600}.tx-item-subtitle{color:var(--muted);font-size:12px}.tx-item-right{text-align:right}.tx-item-amount{letter-spacing:-.2px;font-family:Inter,sans-serif;font-size:16px;font-weight:600}.tx-item-amount.income{color:var(--success)}.tx-item-amount.expense{color:var(--danger)}.tx-item-amount.transfer{color:var(--muted)}.shortcut-card{background-color:var(--surface)!important;border:1px solid var(--line)!important;transition:var(--transition)!important}.shortcut-card:hover{border-color:var(--primary)!important;transform:translateY(-2px)!important}.budget-premium-progress-card{background-color:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);margin-bottom:12px;padding:20px}.budget-progress-header{justify-content:space-between;align-items:flex-start;margin-bottom:12px;display:flex}.budget-progress-cat-name{color:var(--ink);font-size:16px;font-weight:600}.budget-progress-bar-tube{background-color:var(--canvas-parchment);border-radius:var(--radius-pill);border:1px solid var(--line);height:8px;margin-bottom:10px;overflow:hidden}.budget-progress-bar-fill{background-color:var(--primary);border-radius:var(--radius-pill);height:100%;transition:width .3s}.budget-progress-bar-fill.warning{background-color:var(--warning)}.budget-progress-bar-fill.danger{background-color:var(--danger)}.auth-bg-wrapper{background-color:var(--canvas-parchment);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.auth-glass-card{background-color:var(--canvas);border:1px solid var(--line);border-radius:var(--radius-lg);width:100%;max-width:400px;padding:40px 32px}.premium-wallet-card{border-radius:var(--radius-lg);color:#fff;width:100%;height:180px;transition:var(--transition);cursor:pointer;border:1px solid var(--line);flex-direction:column;justify-content:space-between;padding:20px;display:flex;position:relative;box-shadow:3px 5px 30px #00000038}.premium-wallet-card:hover{transform:translateY(-4px)scale(1.01)}.wallet-card-header{justify-content:space-between;align-items:center;display:flex}.wallet-card-type-lbl{text-transform:uppercase;letter-spacing:1px;color:#ffffffb3;font-size:10px;font-weight:600}.wallet-card-chip{background:linear-gradient(135deg,#e0e0e0 0%,#b3b3b3 100%);border-radius:4px;width:32px;height:24px;position:relative}.wallet-card-balance-lbl{color:#fffc;margin-bottom:2px;font-size:11px;display:block}.wallet-card-balance-val{letter-spacing:-.5px;font-family:Inter,sans-serif;font-size:22px;font-weight:600}.wallet-card-footer{justify-content:space-between;align-items:center;display:flex}.wallet-card-name{font-size:14px;font-weight:600}.card-gradient{color:#fff!important;background-color:#1d1d1f!important;border-color:#333!important}.bank-gradient{color:#fff!important;background-color:#06c!important;border-color:#0071e3!important}.cash-gradient{color:#1d1d1f!important;background-color:#fafafc!important;border-color:#e0e0e0!important;box-shadow:3px 5px 30px #0000001f!important}.cash-gradient .wallet-card-type-lbl,.cash-gradient .wallet-card-balance-lbl{color:#1d1d1f99!important}.cash-gradient .wallet-card-balance-val,.cash-gradient .wallet-card-name{color:#1d1d1f!important}.wallets-premium-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;display:grid}.col-span-4-desktop{grid-column:span 4}.col-span-6-desktop{grid-column:span 6}@media (width<=768px){.col-span-4-desktop,.col-span-6-desktop{grid-column:span 12!important}}