:root{--navy: #1B2B4B;--navy-light: #243860;--navy-dark: #111E33;--orange: #C8612A;--orange-light: #D4733F;--orange-pale: #FDF0E8;--teal: #2D7D6F;--teal-light: #3A9688;--teal-pale: #E8F4F2;--cream: #FAF0EA;--cream-dark: #F5EDE4;--white: #FFFFFF;--gray-50: #F9F9F7;--gray-100: #F0EEE8;--gray-200: #E2DED6;--gray-300: #C8C4BC;--gray-400: #9E9A93;--gray-500: #75726C;--gray-600: #555250;--gray-700: #3A3836;--color-success: var(--teal);--color-success-pale: var(--teal-pale);--color-warning: #C8A02A;--color-warning-pale: #FDF8E8;--color-danger: #C85A3A;--color-danger-pale: #FDF0EC;--color-info: var(--navy);--text-primary: var(--navy);--text-secondary: var(--gray-500);--text-muted: var(--gray-400);--text-inverse: var(--white);--text-orange: var(--orange);--text-teal: var(--teal);--bg-app: var(--cream);--bg-card: var(--white);--bg-sidebar: var(--navy);--bg-hover: var(--gray-50);--font-sans: "DM Sans", -apple-system, BlinkMacSystemFont, sans-serif;--font-display: "DM Serif Display", Georgia, serif;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--text-5xl: 3rem;--text-6xl: 3.75rem;--text-hero: 5rem;--weight-light: 300;--weight-regular: 400;--weight-medium: 500;--weight-semibold:600;--weight-bold: 700;--leading-tight: 1.2;--leading-snug: 1.375;--leading-normal: 1.5;--leading-relaxed:1.625;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 20px;--radius-full: 9999px;--border-width: 1px;--arrow-col: 56px;--goal-card-min: 200px;--admin-input-w: 360px;--btn-icon-size: 44px;--checkbox-size: 16px;--border-width-md: 1.5px;--border-width-lg: 2px;--border-color: rgba(27, 43, 75, .08);--border-color-strong: rgba(27, 43, 75, .15);--shadow-xs: 0 1px 2px rgba(27, 43, 75, .06);--shadow-sm: 0 1px 4px rgba(27, 43, 75, .08);--shadow-md: 0 4px 12px rgba(27, 43, 75, .1);--shadow-lg: 0 8px 24px rgba(27, 43, 75, .12);--shadow-xl: 0 16px 40px rgba(27, 43, 75, .14);--sidebar-width: 240px;--mobile-nav-height: 64px;--content-max: 1200px;--card-padding: var(--space-6);--transition-fast: .12s ease;--transition-base: .2s ease;--transition-slow: .32s ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--weight-regular);line-height:var(--leading-normal);color:var(--text-primary);background:linear-gradient(145deg,var(--cream) 0%,var(--cream-dark) 100%);min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}img,svg{display:block;max-width:100%}button{font-family:var(--font-sans);cursor:pointer;border:none;background:none}input,select,textarea{font-family:var(--font-sans);font-size:var(--text-base)}a{color:inherit;text-decoration:none}.display{font-family:var(--font-display);font-weight:var(--weight-regular);line-height:var(--leading-tight);color:var(--text-primary)}.hero-number{font-family:var(--font-display);font-size:var(--text-hero);font-weight:var(--weight-regular);line-height:1;color:var(--navy);letter-spacing:-.02em}.hero-copy{font-size:var(--text-lg);font-weight:var(--weight-regular);color:var(--text-secondary);margin-top:var(--space-3);font-style:italic}.section-title{font-size:var(--text-xs);font-weight:var(--weight-semibold);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.card-label{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary)}.card-value{font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--text-primary);line-height:var(--leading-tight)}.app-shell{display:flex;min-height:100vh}.app-sidebar{width:var(--sidebar-width);background:var(--bg-sidebar);position:fixed;top:0;left:0;height:100vh;display:flex;flex-direction:column;z-index:100;flex-shrink:0}.app-main{margin-left:var(--sidebar-width);flex:1;min-height:100vh;background:linear-gradient(145deg,var(--cream) 0%,var(--cream-dark) 100%);padding:var(--space-8)}.card{background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);padding:var(--card-padding);transition:box-shadow var(--transition-base)}.card:hover{box-shadow:var(--shadow-md)}.card-clickable{cursor:pointer}.card-clickable:hover{box-shadow:var(--shadow-md);transform:translateY(-1px);transition:box-shadow var(--transition-base),transform var(--transition-base)}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-5)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--weight-semibold);line-height:1;transition:all var(--transition-fast);white-space:nowrap;letter-spacing:.01em}.btn-primary{background:var(--orange);color:var(--white);box-shadow:0 2px 8px #c8612a4d}.btn-primary:hover{background:var(--orange-light);box-shadow:0 4px 12px #c8612a66;transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{background:var(--gray-300);box-shadow:none;cursor:not-allowed;transform:none}.btn-secondary{background:var(--white);color:var(--navy);border:1.5px solid var(--border-color-strong)}.btn-secondary:hover{background:var(--gray-50);border-color:var(--gray-300)}.btn-ghost{background:transparent;color:var(--text-secondary);padding:var(--space-2) var(--space-3)}.btn-ghost:hover{color:var(--text-primary);background:var(--gray-100)}.btn-teal{background:var(--teal);color:var(--white);box-shadow:0 2px 8px #2d7d6f40}.btn-teal:hover{background:var(--teal-light);box-shadow:0 4px 12px #2d7d6f59;transform:translateY(-1px)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--text-xs)}.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--text-base)}.btn-full{width:100%}.badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-semibold);letter-spacing:.02em;white-space:nowrap}.badge-teal{background:var(--teal-pale);color:var(--teal)}.badge-orange{background:var(--orange-pale);color:var(--orange)}.badge-gray{background:var(--gray-100);color:var(--gray-500)}.badge-red{background:var(--color-danger-pale);color:var(--color-danger)}.badge-amber{background:var(--color-warning-pale);color:var(--color-warning)}.badge-paid{background:var(--teal-pale);color:var(--teal)}.badge-pending{background:var(--gray-100);color:var(--gray-500)}.badge-due-soon{background:var(--orange-pale);color:var(--orange)}.badge-overdue{background:var(--color-danger-pale);color:var(--color-danger)}.form-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-label{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-secondary);letter-spacing:.01em}.form-input{width:100%;padding:var(--space-3) var(--space-4);border:1.5px solid var(--border-color-strong);border-radius:var(--radius-md);font-size:var(--text-base);color:var(--text-primary);background:var(--white);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.form-input:focus{border-color:var(--navy);box-shadow:0 0 0 3px #1b2b4b14}.form-input:disabled{background:var(--gray-50);color:var(--text-muted);cursor:not-allowed}.form-input-error{border-color:var(--color-danger)}.form-input-error:focus{border-color:var(--color-danger);box-shadow:0 0 0 3px #c85a3a1a}.form-error{font-size:var(--text-sm);color:var(--color-danger);display:flex;align-items:center;gap:var(--space-1)}.form-hint{font-size:var(--text-sm);color:var(--text-muted)}.sidebar-brand{padding:var(--space-6) var(--space-6) var(--space-4);border-bottom:1px solid rgba(255,255,255,.08)}.sidebar-brand-name{font-family:var(--font-display);font-size:var(--text-2xl);color:var(--white);letter-spacing:-.01em;font-style:italic}.sidebar-brand-sub{font-size:var(--text-xs);font-weight:var(--weight-semibold);letter-spacing:.12em;text-transform:uppercase;color:var(--orange);margin-top:var(--space-1)}.sidebar-nav{flex:1;padding:var(--space-4) var(--space-3);display:flex;flex-direction:column;gap:var(--space-1)}.nav-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-3);border-radius:var(--radius-md);color:#ffffffa6;font-size:var(--text-sm);font-weight:var(--weight-medium);transition:all var(--transition-fast);cursor:pointer;border-left:2px solid transparent;text-decoration:none}.nav-item:hover{color:var(--white);background:#ffffff12}.nav-item.active{color:var(--white);background:#ffffff1a;border-left-color:var(--orange)}.nav-icon{width:20px;height:20px;flex-shrink:0;opacity:.75}.nav-item.active .nav-icon,.nav-item:hover .nav-icon{opacity:1}.sidebar-footer{padding:var(--space-4) var(--space-6);border-top:1px solid rgba(255,255,255,.08)}.sidebar-guarantee{font-size:var(--text-xs);color:#ffffff59;line-height:var(--leading-relaxed)}.mobile-nav{display:none;position:fixed;bottom:0;left:0;right:0;height:var(--mobile-nav-height);background:var(--white);border-top:1px solid var(--border-color);box-shadow:0 -4px 16px #1b2b4b14;z-index:100;padding:0 var(--space-2)}.mobile-nav-inner{display:flex;align-items:center;justify-content:space-around;height:100%}.mobile-nav-item{display:flex;flex-direction:column;align-items:center;gap:var(--space-1);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);color:var(--gray-400);font-size:10px;font-weight:var(--weight-semibold);letter-spacing:.03em;transition:color var(--transition-fast);cursor:pointer;text-decoration:none;min-width:56px;text-align:center}.mobile-nav-item.active{color:var(--orange)}.mobile-nav-item svg{width:22px;height:22px}.collapsible-list{display:flex;flex-direction:column;gap:var(--space-2)}.collapsible-row{border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--white);overflow:hidden;transition:border-color var(--transition-fast)}.collapsible-row.unknown{border-color:#c8612a4d;background:var(--orange-pale)}.collapsible-row.confirmed{opacity:.6;background:var(--gray-50)}.collapsible-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4);cursor:pointer;gap:var(--space-3)}.collapsible-header:hover{background:#1b2b4b05}.collapsible-merchant{font-weight:var(--weight-semibold);font-size:var(--text-sm);color:var(--text-primary);flex:1}.collapsible-amount{font-weight:var(--weight-bold);font-size:var(--text-sm);color:var(--text-primary);white-space:nowrap}.collapsible-category{font-size:var(--text-xs);color:var(--text-muted);white-space:nowrap}.collapsible-actions{display:flex;gap:var(--space-2);align-items:center}.collapsible-body{padding:0 var(--space-4) var(--space-4);border-top:1px solid var(--border-color)}.collapsible-raw{font-size:var(--text-xs);color:var(--text-muted);font-family:monospace;background:var(--gray-50);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);margin-bottom:var(--space-3);word-break:break-all}.progress-bar{width:100%;height:6px;background:var(--gray-100);border-radius:var(--radius-full);overflow:hidden}.progress-fill{height:100%;border-radius:var(--radius-full);background:var(--teal);transition:width var(--transition-slow)}.progress-fill.warning{background:var(--color-warning)}.progress-fill.danger{background:var(--color-danger)}.coach-card{background:var(--navy);border-radius:var(--radius-lg);padding:var(--space-5) var(--space-6);color:var(--white);display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4)}.coach-text{font-size:var(--text-sm);line-height:var(--leading-relaxed);color:#ffffffe6}.coach-dismiss{color:#ffffff73;font-size:var(--text-xs);white-space:nowrap;margin-top:var(--space-1);cursor:pointer;transition:color var(--transition-fast)}.coach-dismiss:hover{color:#ffffffbf}.onboarding-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,var(--cream) 0%,var(--cream-dark) 100%);padding:var(--space-6)}.onboarding-card{background:var(--white);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);padding:var(--space-12) var(--space-12);width:100%;max-width:520px}.onboarding-brand{font-family:var(--font-display);font-size:var(--text-3xl);color:var(--navy);margin-bottom:var(--space-1);font-style:italic}.onboarding-title{font-size:var(--text-2xl);font-weight:var(--weight-bold);color:var(--navy);line-height:var(--leading-tight);margin-bottom:var(--space-2)}.onboarding-subtitle{font-size:var(--text-base);color:var(--text-secondary);line-height:var(--leading-relaxed);margin-bottom:var(--space-8)}.onboarding-progress{display:flex;gap:var(--space-2);margin-bottom:var(--space-8)}.onboarding-step-dot{height:3px;flex:1;border-radius:var(--radius-full);background:var(--gray-200);transition:background var(--transition-base)}.onboarding-step-dot.complete{background:var(--teal)}.onboarding-step-dot.active{background:var(--orange)}.upload-zone{border:2px dashed var(--border-color-strong);border-radius:var(--radius-lg);padding:var(--space-12) var(--space-8);text-align:center;cursor:pointer;transition:all var(--transition-base);background:var(--gray-50)}.upload-zone:hover,.upload-zone.drag-over{border-color:var(--orange);background:var(--orange-pale)}.upload-zone-icon{width:48px;height:48px;margin:0 auto var(--space-4);color:var(--gray-400)}.upload-zone:hover .upload-zone-icon,.upload-zone.drag-over .upload-zone-icon{color:var(--orange)}.upload-zone-title{font-weight:var(--weight-semibold);color:var(--text-primary);margin-bottom:var(--space-1)}.upload-zone-sub{font-size:var(--text-sm);color:var(--text-muted)}.divider{height:1px;background:var(--border-color);margin:var(--space-6) 0}.spinner{width:20px;height:20px;border:2px solid var(--border-color);border-top-color:var(--orange);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#faf0ead9;display:flex;align-items:center;justify-content:center;z-index:999;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@media (max-width: 768px){.app-sidebar{display:none}.app-main{margin-left:0;padding:var(--space-5) var(--space-4);padding-bottom:calc(var(--mobile-nav-height) + var(--space-4))}.mobile-nav{display:flex}.hero-number{font-size:var(--text-5xl)}.onboarding-card{padding:var(--space-8) var(--space-6);border-radius:var(--radius-lg)}.card-grid{grid-template-columns:1fr}}@media (max-width: 480px){.hero-number{font-size:var(--text-4xl)}.onboarding-card{padding:var(--space-6) var(--space-5)}}@media (max-width: 768px){.grid-3,.grid-2{grid-template-columns:1fr!important}.stat-cards{grid-template-columns:1fr 1fr!important}.donut-row{flex-direction:column!important;align-items:flex-start!important}.budget-hero-number{font-size:var(--text-5xl)!important}.panel-split{flex-direction:column!important}.form-row-2{grid-template-columns:1fr!important}.wizard-bill-row{flex-direction:column!important;gap:var(--space-2)!important;align-items:flex-start!important}.income-source-row{flex-wrap:wrap!important}.bill-actions{flex-direction:column!important;width:100%!important}.table-scroll{overflow-x:auto!important;-webkit-overflow-scrolling:touch}.admin-gen-form{grid-template-columns:1fr!important}.spending-bar-header{flex-direction:column!important;align-items:flex-start!important;gap:2px!important}.upload-btn-row{flex-direction:column!important}.upload-btn-row>*{width:100%!important}.coach-card{padding:var(--space-4)!important}.paid-bill-row{flex-wrap:wrap!important;gap:var(--space-2)!important}}@media (max-width: 480px){.hero-number{font-size:var(--text-4xl)}.onboarding-card{padding:var(--space-6) var(--space-5)}.stat-cards{grid-template-columns:1fr!important}.app-main{padding:var(--space-4) var(--space-3)!important;padding-bottom:calc(var(--mobile-nav-height) + var(--space-3))!important}.budget-hero-number{font-size:var(--text-4xl)!important}.help-widget-panel{width:calc(100vw - 32px)!important;right:16px!important;left:16px!important}}