:root{--bg:#f7f8f7;--bg-page:#f4f5f4;--ink:#0a0a0b;--ink-soft:#1f1f22;--ink-muted:#5b5b62;--ink-faint:#8c8c92;--ink-faintest:#c7c7cc;--line:#0a0a0b0f;--line-strong:#0a0a0b1a;--bg-subtle:#0a0a0b08;--bg-subtle-hover:#0a0a0b0d;--surface-bg:#fff;--surface-bg-soft:#f4f5f4;--surface-bg-glass:#ffffffb3;--accent-color:#cf5;--accent-hover:#b8f048;--accent-bright:#d4ff66;--accent-fg:#0a0a0b;--accent-bg:#ccff551f;--accent-bg-strong:#ccff5538;--accent-ring:#ccff558c;--accent-readable:#4d7c0f;--cta-bg:#cf5;--cta-fg:#0a0a0b;--cta-shadow:0 1px 2px #0a0a0b0f, 0 6px 18px -6px #a0c82866, inset 0 1px 0 #fff6;--cta-shadow-hover:0 2px 4px #0a0a0b14, 0 14px 32px -8px #a0c8288c, inset 0 1px 0 #ffffff80;--success:#047857;--success-bg:#10b9811a;--warning:#92400e;--warning-bg:#f59e0b1f;--danger:#b91c1c;--danger-bg:#ef444414;--shadow-card:0 0 0 .5px #1418280a, 0 1px 2px #1418280a, 0 4px 8px -4px #1418280f, 0 24px 56px -16px #1418281a;--shadow-card-hover:0 0 0 .5px #1418280f, 0 2px 4px #1418280f, 0 8px 16px -6px #1418281a, 0 36px 80px -20px #14182833;--shadow-soft:0 1px 2px #1418280a, 0 8px 18px -8px #1418281a;--ease-out-expo:cubic-bezier(.16, 1, .3, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--radius:1.25rem}html.dark{--bg:#0a0a0b;--bg-page:#0e0f12;--ink:#f5f5f5;--ink-soft:#e5e7eb;--ink-muted:#9ca3af;--ink-faint:#6b7280;--ink-faintest:#4b5563;--line:#ffffff0f;--line-strong:#ffffff1a;--bg-subtle:#ffffff0a;--bg-subtle-hover:#ffffff12;--surface-bg:#16181d;--surface-bg-soft:#1c1f25;--surface-bg-glass:#1c1f25b3;--accent-bg:#ccff551a;--accent-bg-strong:#ccff552e;--accent-readable:#cf5;--cta-bg:#fff;--cta-fg:#0a0a0b;--cta-shadow:0 1px 2px #0006, 0 12px 32px -8px #000000a6, inset 0 1px 0 #0000000a;--cta-shadow-hover:0 2px 4px #00000073, 0 18px 48px -10px #000c, inset 0 1px 0 #0000000a;--success:#34d399;--success-bg:#10b98124;--warning:#fbbf24;--warning-bg:#f59e0b24;--danger:#f87171;--danger-bg:#ef444424;--shadow-card:0 0 0 .5px #ffffff0a, 0 1px 2px #00000073, 0 8px 18px -8px #0000008c, 0 32px 72px -20px #000000bf;--shadow-card-hover:0 0 0 .5px #ffffff0f, 0 2px 4px #0000008c, 0 16px 32px -10px #000000a6, 0 48px 96px -24px #000000f2;--shadow-soft:0 1px 2px #0006, 0 8px 18px -8px #0000008c}*{box-sizing:border-box}html{scroll-behavior:smooth;font-size:17px}body{background:var(--bg-page);min-height:100vh;color:var(--ink);font-feature-settings:"ss01", "cv11", "calt" 1;letter-spacing:-.012em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:Geist,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Helvetica Neue,sans-serif}::selection{background:var(--accent-bg-strong);color:var(--ink)}.num,.tabular{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}.mono{font-family:Geist Mono,ui-monospace,SFMono-Regular,Menlo,monospace}h1,h2,h3{letter-spacing:-.028em;color:var(--ink);margin:0;font-weight:600}.label{text-transform:uppercase;letter-spacing:.14em;color:var(--ink-muted);font-size:10.5px;font-weight:600}.card{background:var(--surface-bg);box-shadow:var(--shadow-card);transition:box-shadow .55s var(--ease-out-expo), transform .55s var(--ease-out-expo);border-radius:28px}.card-hover:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-3px)}.pill{letter-spacing:-.012em;cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent;transition:transform .25s var(--ease-out-expo), background-color .18s ease, box-shadow .25s ease, color .18s ease, border-color .18s ease, filter .18s ease;border:1px solid #0000;border-radius:9999px;justify-content:center;align-items:center;gap:8px;font-weight:600;display:inline-flex}.pill:active{transform:scale(.96)}.pill-cta{background:var(--cta-bg);color:var(--cta-fg);box-shadow:var(--cta-shadow);padding:11px 20px;font-size:14px}@media (hover:hover){.pill-cta:hover{box-shadow:var(--cta-shadow-hover);filter:brightness(1.02);transform:translateY(-1px)}}.pill-ghost{background:var(--bg-subtle);color:var(--ink-soft);border-color:var(--line);padding:11px 18px;font-size:14px}.pill-ghost:hover{background:var(--bg-subtle-hover);color:var(--ink)}.pill-sm{padding:8px 14px;font-size:13px}.icon-btn{border:1px solid var(--line-strong);width:38px;height:38px;color:var(--ink-muted);cursor:pointer;background:0 0;border-radius:9999px;place-items:center;transition:all .18s;display:grid}.icon-btn:hover{background:var(--bg-subtle);color:var(--ink);border-color:var(--ink-faint)}.icon-btn:active{transform:scale(.94)}.icon-btn.danger:hover{background:var(--danger-bg);color:var(--danger);border-color:#0000}.field-label{color:var(--ink-muted);letter-spacing:-.006em;margin-bottom:6px;font-size:12px;font-weight:600;display:block}.field{background:var(--surface-bg);border:1px solid var(--line-strong);color:var(--ink);border-radius:12px;outline:none;width:100%;padding:11px 14px;font-family:inherit;font-size:14px;transition:border-color .2s,box-shadow .2s}.field:focus{border-color:var(--accent-ring);box-shadow:0 0 0 3px var(--accent-bg)}.field::placeholder{color:var(--ink-faint)}.badge{letter-spacing:.01em;font-variant-numeric:tabular-nums;white-space:nowrap;border-radius:9999px;align-items:center;gap:5px;padding:4px 10px;font-size:11px;font-weight:600;display:inline-flex}.badge-success{background:var(--success-bg);color:var(--success)}.badge-warning{background:var(--warning-bg);color:var(--warning)}.badge-accent{background:var(--accent-bg-strong);color:var(--accent-readable)}.badge-neutral{background:var(--bg-subtle);color:var(--ink-muted)}.progress-track{background:var(--bg-subtle);border-radius:9999px;height:7px;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--accent-color), var(--accent-bright));height:100%;transition:width .7s var(--ease-out-expo);border-radius:9999px}html.dark .progress-fill{box-shadow:0 0 12px -2px #ccff5580}.progress-fill.done{background:linear-gradient(90deg, var(--success), var(--success))}@keyframes riseIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes popIn{0%{opacity:0;transform:scale(.96)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}.rise{animation:riseIn .5s var(--ease-out-expo) both}::-webkit-scrollbar{width:11px;height:11px}::-webkit-scrollbar-thumb{background:var(--ink-faintest);border:3px solid var(--bg-page);border-radius:9999px}::-webkit-scrollbar-thumb:hover{background:var(--ink-faint)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}.app{flex-direction:column;max-width:1180px;min-height:100vh;margin:0 auto;padding:28px 24px 64px;display:flex}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:32px;display:flex}.brand{align-items:center;gap:13px;display:flex}.brand-mark{background:var(--ink);width:46px;height:46px;color:var(--accent-color);box-shadow:var(--shadow-soft);border-radius:15px;place-items:center;display:grid}html.dark .brand-mark{background:var(--surface-bg)}.brand-text h1{letter-spacing:-.03em;font-size:23px;line-height:1.1}.brand-sub{color:var(--ink-faint);letter-spacing:-.004em;font-size:12.5px}.topbar-actions{align-items:center;gap:9px;display:flex}.add-btn{padding-left:16px;padding-right:18px}.content{flex-direction:column;flex:1;gap:22px;display:flex}.foot{text-align:center;color:var(--ink-faint);flex-direction:column;align-items:center;gap:5px;margin-top:28px;font-size:12px;display:flex}.foot-user{color:var(--ink-muted);align-items:center;gap:10px;font-weight:500;display:inline-flex}.logout-link{color:var(--ink-faint);cursor:pointer;font:inherit;text-underline-offset:2px;background:0 0;border:none;padding:0;text-decoration:underline}.logout-link:hover{color:var(--danger)}.state-card{text-align:center;color:var(--ink-muted);padding:40px 28px;font-size:14px}.state-card.error{color:var(--danger)}.boot{place-items:center;min-height:100vh;display:grid}.boot-mark{background:var(--ink);width:56px;height:56px;color:var(--accent-color);box-shadow:var(--shadow-soft);animation:pulse-boot 1.1s var(--ease-out-expo) infinite;border-radius:18px;place-items:center;display:grid}@keyframes pulse-boot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.06)}}.login-wrap{place-items:center;min-height:100vh;padding:24px;display:grid}.login-card{text-align:center;flex-direction:column;align-items:center;width:100%;max-width:380px;padding:36px 32px 28px;display:flex}.login-mark{background:var(--ink);width:60px;height:60px;color:var(--accent-color);box-shadow:var(--shadow-soft);border-radius:20px;place-items:center;display:grid}html.dark .login-mark{background:var(--surface-bg-soft)}.login-title{letter-spacing:-.03em;margin-top:16px;font-size:26px}.login-sub{color:var(--ink-muted);margin:6px 0 22px;font-size:13.5px;line-height:1.5}.login-form{text-align:left;flex-direction:column;gap:14px;width:100%;display:flex}.login-submit{width:100%;margin-top:4px;padding-top:12px;padding-bottom:12px}.login-submit:disabled{opacity:.6;cursor:default}.login-switch{color:var(--ink-muted);cursor:pointer;font:inherit;text-underline-offset:2px;background:0 0;border:none;margin-top:18px;font-size:13px;text-decoration:underline}.login-switch:hover{color:var(--ink)}.login-msg{border-radius:10px;padding:9px 12px;font-size:12.5px;line-height:1.4}.login-msg.error{background:var(--danger-bg);color:var(--danger)}.login-msg.info{background:var(--accent-bg);color:var(--accent-readable)}.summary-grid{grid-template-columns:repeat(4,1fr);gap:14px;display:grid}.summary-card{animation:riseIn .55s var(--ease-out-expo) both;border-radius:24px;flex-direction:column;gap:9px;padding:22px 22px 20px;display:flex}.summary-card.accent{background:var(--ink);color:#fff;box-shadow:var(--shadow-card)}.summary-card.accent .label{color:#fff9}.summary-card.accent .summary-value{color:var(--accent-color)}.summary-card.accent .summary-sub{color:#ffffff8c}.summary-value{letter-spacing:-.03em;font-size:27px;font-weight:600;line-height:1}.summary-sub{color:var(--ink-faint);font-size:12.5px}.summary-progress{flex-direction:column;gap:7px;display:flex}.table-card{animation:riseIn .55s .1s var(--ease-out-expo) both;padding:6px;overflow:hidden}.table-wrap{width:100%}.loan-table{border-collapse:collapse;width:100%;font-size:14px}.loan-table thead th{text-align:left;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-faint);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;padding:14px 16px;font-size:11px;font-weight:600;transition:color .15s}.loan-table thead th:hover{color:var(--ink-muted)}.th-inner{align-items:center;gap:5px;display:inline-flex}.sort-ind{opacity:.35;font-size:11px}.sort-ind.on{opacity:1;color:var(--accent-readable)}.ta-right{text-align:right!important}.ta-right .th-inner{flex-direction:row-reverse}.col-actions{width:1%}.loan-table tbody tr{border-top:1px solid var(--line);transition:background-color .15s}.loan-table tbody tr:hover{background:var(--bg-subtle)}.loan-table td{vertical-align:middle;padding:15px 16px}.loan-table tbody tr.paid-off{opacity:.62}.cell-name{color:var(--ink);letter-spacing:-.01em;font-weight:600}.cell-sub{color:var(--ink-faint);margin-top:2px;font-size:12px}.cell-bank{color:var(--ink-soft)}.cell-strong{color:var(--ink);font-weight:600}.cell-dates{color:var(--ink-soft);white-space:nowrap;align-items:center;gap:7px;font-size:13px;display:inline-flex}.cell-dates .arrow{color:var(--ink-faintest)}.progress-cell{flex-direction:column;gap:6px;min-width:168px;display:flex}.progress-label{color:var(--ink-muted);font-size:12px;font-weight:500}.progress-left{color:var(--ink-faint)}.row-actions{justify-content:flex-end;gap:6px;display:inline-flex}.icon-btn svg{display:block}.mobile-list{flex-direction:column;display:none}.mobile-row{border-top:1px solid var(--line);flex-direction:column;gap:14px;padding:18px 16px;display:flex}.mobile-row:first-child{border-top:none}.mobile-row.paid-off{opacity:.62}.mobile-top{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.mobile-actions{gap:6px;display:flex}.mobile-meta{grid-template-columns:1fr 1fr;gap:14px 12px;display:grid}.mobile-meta>div{flex-direction:column;gap:3px;display:flex}.mobile-meta>div:last-child{grid-column:span 2}.mobile-k{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-faint);font-size:11px;font-weight:600}.empty{text-align:center;flex-direction:column;align-items:center;gap:14px;padding:56px 32px;display:flex}.empty-mark{background:var(--accent-bg);width:72px;height:72px;color:var(--accent-readable);border-radius:24px;place-items:center;margin-bottom:4px;display:grid}.empty h2{font-size:22px}.empty p{max-width:440px;color:var(--ink-muted);margin:0;font-size:14.5px;line-height:1.55}.empty-actions{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:10px;display:flex}.overlay{-webkit-backdrop-filter:blur(6px);z-index:50;background:#0a0a0b6b;justify-content:center;align-items:flex-start;padding:40px 20px;animation:.2s both fadeIn;display:flex;position:fixed;inset:0;overflow-y:auto}.modal{width:100%;max-width:560px;margin:auto;padding:0}.modal-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:22px 24px 16px;display:flex}.modal-head h2{font-size:19px}.modal-body{flex-direction:column;gap:20px;padding:22px 24px 24px;display:flex}.form-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}.span-2{grid-column:span 2}.opt{color:var(--ink-faintest);text-transform:none;letter-spacing:0;font-weight:500}.modal-foot{justify-content:flex-end;gap:10px;display:flex}.pill-danger{background:var(--danger);color:#fff;padding:11px 18px;font-size:14px}.pill-danger:hover{filter:brightness(1.06)}.preview{background:var(--bg-subtle);border:1px solid var(--line);border-radius:16px;flex-direction:column;gap:12px;padding:16px 18px;display:flex}.preview-grid{grid-template-columns:1fr 1fr;gap:14px;display:grid}.preview-grid>div{flex-direction:column;gap:3px;display:flex}.preview-k{color:var(--ink-faint);font-size:12px}.preview-v{color:var(--ink);letter-spacing:-.01em;font-size:15px;font-weight:600}.confirm{flex-direction:column;gap:12px;max-width:420px;padding:26px;display:flex}.confirm h2{font-size:19px}.confirm-text{color:var(--ink-muted);margin:0 0 8px;font-size:14px;line-height:1.5}@media (width<=880px){.summary-grid{grid-template-columns:1fr 1fr}.table-wrap{display:none}.mobile-list{display:flex}.table-card{padding:4px 6px}}@media (width<=560px){.app{padding:20px 16px 48px}.add-label{display:none}.add-btn{padding-left:14px;padding-right:14px}.summary-grid,.form-grid{grid-template-columns:1fr}.span-2{grid-column:span 1}.preview-grid{grid-template-columns:1fr}.brand-sub{display:none}}