:root{--bg-top:#0a0a0c;--bg-bottom:#111114;--glass-bg:#1c1c208c;--glass-border:#ffffff14;--glass-shadow:0 8px 32px #00000073;--fill-1:#ffffff0f;--fill-2:#ffffff1a;--fill-3:#ffffff29;--hairline:#ffffff14;--text-primary:#ffffffeb;--text-secondary:#ebebf599;--text-tertiary:#ebebf54d;--accent-blue:#0a84ff;--accent-green:#30d158;--accent-amber:#ff9f0a;--accent-red:#ff453a;--radius-panel:18px;--radius-card:14px;--radius-input:11px;--ease-spring:cubic-bezier(.32, .72, 0, 1);--dur-fast:.2s;--dur-panel:.28s;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;accent-color:var(--accent-blue)}html,body,#root{height:100%;margin:0}body{color:var(--text-primary);background:linear-gradient(180deg, var(--bg-top) 0%, var(--bg-bottom) 100%);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;background-attachment:fixed;font-family:-apple-system,SF Pro Display,SF Pro Text,system-ui,Inter,sans-serif;overflow:hidden}.app,.canvas-wrap,.panel-shell,.panel-shell *,.panel-shell :before,.panel-shell :after,.panel-reopen,.panel-reopen *,.panel-reopen :before,.panel-reopen :after,.lock,.lock *,.lock :before,.lock :after{box-sizing:border-box}.panel-shell ::selection{background:#0a84ff52}.panel-reopen ::selection{background:#0a84ff52}.app{width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.canvas-wrap{flex:auto;min-width:0;height:100%;position:relative}.canvas-loading{background:#101011;position:absolute;inset:0}.panel-shell{width:372px;height:100%;transition:width var(--dur-panel) var(--ease-spring);flex:none;overflow:hidden}.panel-shell.is-collapsed{width:0}.panel{border-radius:var(--radius-panel);background:var(--glass-bg);-webkit-backdrop-filter:blur(24px)saturate(180%);backdrop-filter:blur(24px)saturate(180%);border:1px solid var(--glass-border);width:340px;height:calc(100% - 32px);box-shadow:var(--glass-shadow);transition:transform var(--dur-panel) var(--ease-spring), opacity var(--dur-panel) var(--ease-spring);flex-direction:column;margin:16px;display:flex;position:relative;overflow:hidden}.panel-shell.is-collapsed .panel{opacity:0;transform:translate(28px)}.panel-header{flex:none;justify-content:space-between;align-items:center;padding:18px 18px 12px;display:flex}.panel-title{letter-spacing:-.01em;color:var(--text-primary);align-items:center;gap:8px;font-size:17px;font-weight:600;display:flex}.panel-title svg{color:var(--accent-blue)}.panel-body{scrollbar-width:thin;scrollbar-color:#ffffff29 transparent;flex-direction:column;flex:auto;gap:16px;padding:4px 18px 18px;display:flex;overflow:hidden auto}.panel-body::-webkit-scrollbar{width:8px}.panel-body::-webkit-scrollbar-thumb{background:#ffffff24;border-radius:4px}.panel-body::-webkit-scrollbar-track{background:0 0}.card{background:var(--fill-1);border:1px solid var(--hairline);border-radius:var(--radius-card);padding:16px}.card-heading{letter-spacing:.05em;text-transform:uppercase;color:var(--text-secondary);margin:0 0 12px;font-size:12px;font-weight:600}.card-label{color:var(--text-secondary);margin-bottom:8px;font-size:13px;display:block}.field{width:100%;font:inherit;color:var(--text-primary);background:var(--fill-2);border:1px solid var(--hairline);border-radius:var(--radius-input);appearance:none;transition:border-color var(--dur-fast) var(--ease-spring), background var(--dur-fast) var(--ease-spring), box-shadow var(--dur-fast) var(--ease-spring);outline:none;padding:10px 12px;font-size:15px}.field::placeholder{color:var(--text-tertiary)}.field:focus{border-color:var(--accent-blue);background:#ffffff1f;box-shadow:0 0 0 3px #0a84ff40}.budget-input-wrap,.amount-wrap,.conv-input{align-items:center;display:flex;position:relative}.budget-symbol,.amount-prefix,.conv-symbol{color:var(--text-secondary);pointer-events:none;font-variant-numeric:tabular-nums;position:absolute;left:12px}.amount-wrap .field,.conv-input .field{padding-left:26px}.budget-input{letter-spacing:-.02em;font-variant-numeric:tabular-nums;padding:12px 14px 12px 34px;font-size:26px;font-weight:600}.budget-input-wrap .budget-symbol{font-size:22px;left:14px}.meter-card{flex-direction:column;align-items:center;gap:18px;display:flex}.meter{width:208px;height:208px;position:relative}.meter-svg{display:block}.meter-track{stroke:#ffffff14}.meter-progress{transition:stroke-dashoffset .6s var(--ease-spring), stroke .4s linear}.meter-center{flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.meter-amount{letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:34px;font-weight:700;line-height:1.05;transition:color .4s linear}.meter-caption{color:var(--text-secondary);margin-top:2px;font-size:13px}.meter-pct{color:var(--text-tertiary);font-variant-numeric:tabular-nums;margin-top:8px;font-size:12px}.totals{grid-template-columns:repeat(3,1fr);gap:8px;width:100%;display:grid}.total{background:var(--fill-1);border-radius:10px;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;display:flex}.total-label{letter-spacing:.03em;text-transform:uppercase;color:var(--text-secondary);font-size:11px}.total-value{color:var(--text-primary);font-variant-numeric:tabular-nums;font-size:15px;font-weight:600}.total-value.negative{color:var(--accent-red)}.add-form{flex-direction:column;gap:10px;display:flex}.kind-toggle{background:var(--fill-1);border-radius:var(--radius-input);gap:6px;padding:4px;display:flex}.kind-btn{font:inherit;color:var(--text-secondary);cursor:pointer;transition:background var(--dur-fast) var(--ease-spring), color var(--dur-fast) var(--ease-spring);background:0 0;border:none;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:6px;padding:8px;font-size:13px;font-weight:500;display:flex}.kind-btn.is-active.expense{color:var(--accent-red);background:#ff453a29}.kind-btn.is-active.income{color:var(--accent-green);background:#30d15829}.add-row{grid-template-columns:1fr 104px 44px;gap:8px;display:grid}.add-row .amount-field{text-align:right}.add-btn{color:#fff;background:var(--accent-blue);border-radius:var(--radius-input);cursor:pointer;transition:filter var(--dur-fast) var(--ease-spring), transform var(--dur-fast) var(--ease-spring), opacity var(--dur-fast) var(--ease-spring);border:none;justify-content:center;align-items:center;display:flex}.add-btn:hover{filter:brightness(1.08)}.add-btn:active{transform:scale(.94)}.add-btn:disabled{opacity:.4;cursor:default}.expense-list{flex-direction:column;margin:14px 0 0;padding:0;list-style:none;display:flex}.list-empty{text-align:center;color:var(--text-tertiary);margin:14px 0 0;padding:10px 0;font-size:13px}.expense-row{border-bottom:1px solid var(--hairline);animation:rowIn .24s var(--ease-spring);transition:opacity var(--dur-fast) var(--ease-spring), transform var(--dur-fast) var(--ease-spring);align-items:center;gap:10px;padding:10px 2px;display:flex;overflow:hidden}.expense-row:last-child{border-bottom:none}.expense-row.is-removing{opacity:0;transform:translate(16px)}@keyframes rowIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.row-dot{border-radius:50%;flex:none;width:8px;height:8px}.row-dot.expense{background:var(--accent-red)}.row-dot.income{background:var(--accent-green)}.row-label{min-width:0;color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;flex:auto;font-size:14px;overflow:hidden}.row-amount{font-variant-numeric:tabular-nums;font-size:14px;font-weight:500}.row-amount.expense{color:var(--text-primary)}.row-amount.income{color:var(--accent-green)}.row-actions{opacity:0;transition:opacity var(--dur-fast) var(--ease-spring);gap:2px;display:flex}.expense-row:hover .row-actions,.expense-row:focus-within .row-actions{opacity:1}.row-edit{grid-template-columns:1fr 84px 30px 30px;align-items:center;gap:6px;width:100%;display:grid}.row-edit .field{padding:7px 9px;font-size:13px}.icon-btn{width:30px;height:30px;color:var(--text-secondary);cursor:pointer;transition:background var(--dur-fast) var(--ease-spring), color var(--dur-fast) var(--ease-spring), transform var(--dur-fast) var(--ease-spring);background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;display:flex}.icon-btn:hover{background:var(--fill-2);color:var(--text-primary)}.icon-btn:active{transform:scale(.92)}.icon-btn.danger:hover{color:var(--accent-red);background:#ff453a29}.icon-btn.confirm{color:var(--accent-green)}.icon-btn:disabled{opacity:.5;cursor:default}.icon-btn.refresh.spinning svg{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.converter{flex-direction:column;gap:12px;display:flex}.conv-pair{grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;display:grid}.cur-select{width:100%;font:inherit;color:var(--text-primary);background-color:var(--fill-2);border:1px solid var(--hairline);border-radius:var(--radius-input);appearance:none;cursor:pointer;transition:border-color var(--dur-fast) var(--ease-spring), background-color var(--dur-fast) var(--ease-spring);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23ebebf599' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;padding:9px 30px 9px 12px;font-size:14px;font-weight:500}.cur-select:focus{border-color:var(--accent-blue);outline:none;box-shadow:0 0 0 3px #0a84ff40}.swap-btn{flex:none}.conv-hint{color:var(--text-tertiary);margin:-4px 0 0;font-size:12px}.conv-io{grid-template-columns:1fr 1fr;align-items:stretch;gap:10px;display:grid}.conv-symbol{top:50%;transform:translateY(-50%)}.conv-result{background:var(--fill-1);border-radius:var(--radius-input);flex-direction:column;justify-content:center;gap:2px;min-width:0;padding:6px 12px;display:flex}.conv-result-label{letter-spacing:.03em;text-transform:uppercase;color:var(--text-secondary);font-size:11px}.conv-result-value{color:var(--text-primary);font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis;font-size:18px;font-weight:600;overflow:hidden}.conv-meta{justify-content:space-between;align-items:center;display:flex}.rate-text{color:var(--text-secondary);font-variant-numeric:tabular-nums;font-size:13px}.conv-status{min-height:15px;color:var(--text-tertiary);margin:-4px 0 0;font-size:12px}.manual-rate{background:var(--fill-1);border-radius:var(--radius-input);flex-direction:column;gap:6px;padding:10px;display:flex}.manual-label{color:var(--text-secondary);font-size:12px}.manual-row{grid-template-columns:1fr auto;gap:8px;display:grid}.pill-btn{font:inherit;color:var(--text-primary);background:var(--fill-2);border-radius:var(--radius-input);cursor:pointer;transition:background var(--dur-fast) var(--ease-spring);border:none;padding:8px 16px;font-size:13px;font-weight:500}.pill-btn:hover{background:var(--fill-3)}.link-btn{font:inherit;color:var(--accent-blue);cursor:pointer;background:0 0;border:none;align-self:flex-start;padding:2px 0;font-size:13px}.add-to-budget{width:100%;font:inherit;color:var(--accent-blue);border-radius:var(--radius-input);cursor:pointer;transition:background var(--dur-fast) var(--ease-spring), transform var(--dur-fast) var(--ease-spring), opacity var(--dur-fast) var(--ease-spring);background:#0a84ff29;border:none;justify-content:center;align-items:center;gap:8px;padding:11px;font-size:14px;font-weight:600;display:flex}.add-to-budget:hover{background:#0a84ff42}.add-to-budget:active{transform:scale(.98)}.add-to-budget:disabled{opacity:.4;cursor:default}.sync-head{letter-spacing:.05em;text-transform:uppercase;color:var(--text-secondary);align-items:center;gap:8px;margin-bottom:12px;font-size:12px;font-weight:600;display:flex}.sync-dot{background:var(--text-tertiary);width:8px;height:8px;transition:background var(--dur-fast) var(--ease-spring);border-radius:50%;margin-left:auto}.sync-dot.is-synced{background:var(--accent-green)}.sync-dot.is-connecting{background:var(--accent-amber)}.sync-dot.is-error{background:var(--accent-red)}.sync-note{color:var(--text-tertiary);margin:0;font-size:12px;line-height:1.45}.sync-join{flex-direction:column;gap:8px;display:flex}.sync-join .field{text-transform:uppercase;letter-spacing:.08em}.sync-join-actions{justify-content:space-between;align-items:center;gap:8px;display:flex}.sync-active{flex-direction:column;gap:10px;display:flex}.sync-code-box{background:var(--fill-1);border-radius:var(--radius-input);flex-direction:column;gap:4px;padding:10px 12px;display:flex}.sync-code-label{letter-spacing:.03em;text-transform:uppercase;color:var(--text-secondary);font-size:11px}.sync-code{letter-spacing:.12em;color:var(--text-primary);font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:20px;font-weight:600}.sync-active .pill-btn,.sync-join .pill-btn{align-self:flex-start}.undo-snack{color:var(--text-primary);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--hairline);opacity:0;pointer-events:none;transition:opacity var(--dur-fast) var(--ease-spring), transform var(--dur-fast) var(--ease-spring);background:#28282ceb;border-radius:12px;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;font-size:13px;display:flex;position:absolute;bottom:16px;left:16px;right:16px;transform:translateY(12px);box-shadow:0 8px 24px #0006}.undo-snack.is-visible{opacity:1;pointer-events:auto;transform:translateY(0)}.undo-text{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.undo-btn{font:inherit;color:var(--accent-blue);cursor:pointer;background:0 0;border:none;flex:none;font-size:13px;font-weight:600}.panel-reopen{z-index:10;width:44px;height:44px;color:var(--text-primary);background:var(--glass-bg);-webkit-backdrop-filter:blur(24px)saturate(180%);backdrop-filter:blur(24px)saturate(180%);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);cursor:pointer;opacity:0;pointer-events:none;transition:opacity var(--dur-panel) var(--ease-spring), transform var(--dur-panel) var(--ease-spring), background var(--dur-fast) var(--ease-spring);border-radius:12px;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;right:20px;transform:translate(12px,-50%)scale(.96)}.panel-reopen.is-visible{opacity:1;pointer-events:auto;transform:translateY(-50%)scale(1)}.panel-reopen:hover{background:#28282cb8}.panel-shell button:focus-visible,.panel-shell .field:focus-visible,.panel-reopen:focus-visible{outline:2px solid var(--accent-blue);outline-offset:2px}@media (prefers-reduced-motion:reduce){.panel-shell,.panel,.panel-shell *,.panel-reopen,.meter-progress,.lock,.lock *{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.lock{z-index:1000;background:linear-gradient(180deg, var(--bg-top) 0%, var(--bg-bottom) 100%);justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.lock-card{border-radius:var(--radius-panel);background:var(--glass-bg);-webkit-backdrop-filter:blur(24px)saturate(180%);backdrop-filter:blur(24px)saturate(180%);border:1px solid var(--glass-border);width:320px;max-width:100%;box-shadow:var(--glass-shadow);flex-direction:column;align-items:center;padding:36px 32px 32px;display:flex}.lock-badge{width:56px;height:56px;color:var(--accent-blue);background:#0a84ff29;border-radius:50%;justify-content:center;align-items:center;margin-bottom:18px;display:flex}.lock-title{letter-spacing:-.02em;color:var(--text-primary);margin:0;font-size:22px;font-weight:600}.lock-sub{color:var(--text-secondary);margin:6px 0 24px;font-size:14px}.lock-dots{gap:18px;margin-bottom:30px;display:flex}.lock-dots.error{animation:lockShake .4s var(--ease-spring)}.lock-dot{width:14px;height:14px;transition:background var(--dur-fast) var(--ease-spring), border-color var(--dur-fast) var(--ease-spring), transform var(--dur-fast) var(--ease-spring);border:1.5px solid #fff6;border-radius:50%}.lock-dot.filled{background:var(--text-primary);border-color:var(--text-primary);transform:scale(1.08)}.lock-dots.error .lock-dot{border-color:var(--accent-red)}.lock-dots.error .lock-dot.filled{background:var(--accent-red)}@keyframes lockShake{0%,to{transform:translate(0)}20%{transform:translate(-9px)}40%{transform:translate(9px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}.lock-pad{grid-template-columns:repeat(3,70px);gap:16px;display:grid}.lock-key{width:70px;height:70px;font:inherit;color:var(--text-primary);background:var(--fill-2);border:1px solid var(--hairline);cursor:pointer;transition:background var(--dur-fast) var(--ease-spring), transform var(--dur-fast) var(--ease-spring);border-radius:50%;justify-content:center;align-items:center;font-size:26px;font-weight:400;display:flex}.lock-key:hover{background:var(--fill-3)}.lock-key:active{background:var(--fill-3);transform:scale(.92)}.lock-key-del{color:var(--text-secondary);background:0 0;border-color:#0000}.lock-key-del:hover{background:var(--fill-1)}.lock-key:focus-visible{outline:2px solid var(--accent-blue);outline-offset:2px}
