:root{--r-sm: 14px;--r: 20px;--r-lg: 28px;--grad: linear-gradient(120deg, #f5515f 0%, #f9a45c 100%);--grad-rainbow: linear-gradient(90deg, #3bd6c6, #5ad469, #f7d34e, #f9a45c, #f5515f);--green: #58c267;--red: #f15a5a;--ease: cubic-bezier(.22,1,.36,1)}[data-theme=light]{--bg: #e8edf3;--bg2: #eef2f7;--text: #2a3650;--text-mid: #5c6b85;--text-dim: #9aa7bd;--sd: #c5cdda;--sl: #ffffff;--line: #d6dde8;--chip: #e8edf3;--track: #d3dae6}[data-theme=dark]{--bg: #23272c;--bg2: #282d33;--text: #f0f3f7;--text-mid: #b7c0cc;--text-dim: #79838f;--sd: #191c20;--sl: #2e343b;--line: #31373e;--chip: #23272c;--track: #1c2024}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{font-family:Urbanist,system-ui,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;overscroll-behavior:none}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}input{font-family:inherit}.app-shell{min-height:100dvh;display:flex;align-items:center;justify-content:center;background:radial-gradient(120% 80% at 50% -10%,var(--bg2),var(--bg) 60%);transition:background .5s var(--ease)}.phone{position:relative;width:100%;max-width:420px;height:100dvh;max-height:100dvh;background:var(--bg);overflow:hidden;display:flex;flex-direction:column;transition:background .5s var(--ease)}@media (min-width: 480px){.app-shell{padding:22px}.phone{height:min(880px,96dvh);border-radius:42px;box-shadow:24px 24px 60px #0000002e,-10px -10px 40px #ffffff0a;border:1px solid var(--line)}}.screen{flex:1;overflow-y:auto;overflow-x:hidden;padding:22px 22px 110px;-webkit-overflow-scrolling:touch}.screen::-webkit-scrollbar{width:0}.neu{background:var(--bg);box-shadow:6px 6px 13px var(--sd),-6px -6px 13px var(--sl)}.neu-in{background:var(--bg);box-shadow:inset 5px 5px 11px var(--sd),inset -5px -5px 11px var(--sl)}.neu-flat{background:var(--bg);box-shadow:3px 3px 7px var(--sd),-3px -3px 7px var(--sl)}.icon-btn{width:48px;height:48px;border-radius:var(--r-sm);display:grid;place-items:center;color:var(--text-mid);background:var(--bg);box-shadow:5px 5px 11px var(--sd),-5px -5px 11px var(--sl);transition:box-shadow .15s var(--ease),transform .15s var(--ease);flex-shrink:0}.icon-btn:active{box-shadow:inset 4px 4px 9px var(--sd),inset -4px -4px 9px var(--sl);transform:scale(.97)}.h1{font-size:30px;font-weight:800;letter-spacing:-.5px}.muted{color:var(--text-dim)}.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.credit-card{border-radius:var(--r-lg);padding:26px 24px;color:#fff;position:relative;overflow:hidden;background:linear-gradient(135deg,#2b3340,#1b2029);box-shadow:10px 14px 30px #14192359,inset 0 1px #ffffff14}.credit-card.light-card{background:linear-gradient(135deg,#f4f7fb,#dde4ee);color:#2a3650;box-shadow:12px 14px 28px var(--sd),-10px -10px 24px var(--sl)}.seg{display:flex;gap:10px}.pill{padding:13px 22px;border-radius:var(--r-sm);font-weight:700;font-size:14px;color:var(--text-dim);background:var(--bg);box-shadow:4px 4px 9px var(--sd),-4px -4px 9px var(--sl);white-space:nowrap;transition:all .2s var(--ease)}.pill.active{color:var(--text);box-shadow:inset 4px 4px 9px var(--sd),inset -4px -4px 9px var(--sl)}.btn-row{width:100%;display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-radius:var(--r);font-weight:700;color:var(--text);background:var(--bg);box-shadow:6px 6px 13px var(--sd),-6px -6px 13px var(--sl);transition:box-shadow .15s var(--ease),transform .12s var(--ease)}.btn-row:active{box-shadow:inset 5px 5px 11px var(--sd),inset -5px -5px 11px var(--sl);transform:scale(.99)}.btn-grad{width:100%;padding:18px;border-radius:var(--r);font-weight:800;font-size:16px;color:#fff;background:var(--grad);box-shadow:0 12px 24px #f5515f52;transition:transform .12s var(--ease),box-shadow .2s var(--ease)}.btn-grad:active{transform:scale(.98);box-shadow:0 6px 14px #f5515f4d}.switch{width:58px;height:32px;border-radius:20px;position:relative;flex-shrink:0;background:var(--bg);box-shadow:inset 4px 4px 8px var(--sd),inset -4px -4px 8px var(--sl);transition:background .3s}.switch.on{background:var(--grad);box-shadow:inset 2px 2px 5px #b4283266}.knob{position:absolute;top:4px;left:4px;width:24px;height:24px;border-radius:50%;background:var(--bg2);box-shadow:2px 2px 5px #00000040}.notif-row{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:var(--r);background:var(--bg);box-shadow:5px 5px 11px var(--sd),-5px -5px 11px var(--sl)}.bottom-nav{position:absolute;left:0;right:0;bottom:0;padding:14px 26px calc(14px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;background:linear-gradient(0deg,var(--bg) 70%,transparent)}.nav-btn{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;color:var(--text-dim);position:relative;transition:color .2s,box-shadow .2s,transform .2s}.nav-btn.active{color:var(--text);background:var(--bg);box-shadow:5px 5px 11px var(--sd),-5px -5px 11px var(--sl)}.nav-badge{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--grad);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center}.field{width:100%;padding:16px 18px;border-radius:var(--r);background:var(--bg);color:var(--text);font-size:16px;font-weight:600;outline:none;box-shadow:inset 5px 5px 11px var(--sd),inset -5px -5px 11px var(--sl)}.field::placeholder{color:var(--text-dim)}.pin-box{width:64px;height:70px;border-radius:var(--r);display:grid;place-items:center;background:var(--bg);box-shadow:5px 5px 11px var(--sd),-5px -5px 11px var(--sl)}.pin-box.filled{box-shadow:inset 5px 5px 11px var(--sd),inset -5px -5px 11px var(--sl)}.key{height:64px;border-radius:var(--r);display:grid;place-items:center;font-size:24px;font-weight:700;color:var(--text);background:var(--bg);box-shadow:5px 5px 11px var(--sd),-5px -5px 11px var(--sl);transition:box-shadow .1s var(--ease),transform .1s}.key:active{box-shadow:inset 5px 5px 11px var(--sd),inset -5px -5px 11px var(--sl);transform:scale(.97)}.goal-card{padding:18px;border-radius:var(--r);background:var(--bg);box-shadow:6px 6px 13px var(--sd),-6px -6px 13px var(--sl)}.divider{height:1px;background:var(--line);margin:4px 0}@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}