:root{--ink:#17143f;--muted:#716d91;--purple:#8b5cf6;--lavender:#c4b5fd;--blue:#60a5fa;--ice:#bae6fd;--surface:#ffffffd1;--line:#6f5caa24;--danger:#ef476f;--success:#20bd8d;--shadow:0 18px 55px #5742a421}*{box-sizing:border-box}html{background:#f5f7ff}body{color:var(--ink);background:radial-gradient(circle at 5% 4%,#e9ddff 0,#0000 25%),radial-gradient(circle at 95% 8%,#d9f3ff 0,#0000 24%),#f7f8ff;min-height:100vh;margin:0;font-family:Inter,Noto Sans TC,ui-sans-serif,system-ui,-apple-system,sans-serif}button,input,select,textarea{font:inherit;color:inherit}button,a{transition:all .2s}a{color:inherit;text-decoration:none}button{cursor:pointer}.glass{background:var(--surface);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid #ffffffe6}.landing{min-height:100vh;overflow:hidden}.topbar{justify-content:space-between;align-items:center;max-width:1180px;margin:auto;padding:22px 24px;display:flex}.brand{align-items:center;gap:10px;font-size:22px;font-weight:850;display:flex}.logo{border-radius:14px;place-items:center;width:42px;height:42px;display:grid;overflow:hidden;box-shadow:0 10px 28px #9e8cff66}.logo img{width:42px;height:42px;display:block}.toplinks{color:var(--muted);align-items:center;gap:22px;font-weight:650;display:flex}.btn{border:0;border-radius:14px;padding:12px 19px;font-weight:750}.btn-primary{color:#fff;background:linear-gradient(110deg,#a78bfa,#7c5ff4 48%,#60a5fa);box-shadow:0 10px 25px #8871e866}.btn-ghost{border:1px solid var(--line);background:#fff}.hero{grid-template-columns:1.03fr .97fr;align-items:center;gap:70px;max-width:1180px;margin:56px auto 80px;padding:0 24px;display:grid}.eyebrow{border:1px solid var(--line);color:#7659e8;background:#fff;border-radius:99px;align-items:center;gap:8px;padding:8px 13px;font-size:14px;font-weight:750;display:inline-flex}.hero h1{letter-spacing:-.05em;margin:22px 0;font-size:clamp(44px,6vw,74px);line-height:1.03}.gradient-text{color:#0000;background:linear-gradient(110deg,#7654e8,#a366ed,#289eea);-webkit-background-clip:text;background-clip:text}.hero p{color:var(--muted);max-width:570px;font-size:19px;line-height:1.8}.hero-actions{gap:12px;margin:30px 0;display:flex}.trust{color:var(--muted);gap:22px;font-size:13px;display:flex}.phone{background:#ffffffb8;border:1px solid #a99cff;border-radius:48px;width:340px;height:650px;margin:auto;padding:14px;transform:rotate(2deg);box-shadow:0 36px 80px #7764cf3d}.phone-inner{background:linear-gradient(160deg,#fff 25%,#f1edff 72%,#e2f3ff);border-radius:36px;height:100%;padding:24px 18px;overflow:hidden}.phone-top{justify-content:space-between;align-items:center;font-weight:800;display:flex}.balance{color:#fff;background:linear-gradient(135deg,#a98df9,#7f61ec 55%,#65aaf5);border-radius:22px;margin:24px 0 14px;padding:20px;box-shadow:0 15px 30px #816ae455}.balance small{opacity:.9}.balance strong{margin-top:8px;font-size:34px;display:block}.mini-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.mini{border:1px solid var(--line);text-align:center;background:#fff;border-radius:16px;padding:13px 8px}.mini b{margin-top:5px;font-size:13px;display:block}.phone-list{background:#ffffffc7;border-radius:22px;margin-top:14px;padding:14px}.tx{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:12px 0;display:flex}.tx:last-child{border:0}.tx-icon{background:#f0eaff;border-radius:12px;place-items:center;width:38px;height:38px;display:grid}.tx span{flex:1}.tx small{color:var(--muted);display:block}.expense{color:#ea3860;font-weight:800}.features{max-width:1180px;margin:0 auto 90px;padding:0 24px}.section-title{text-align:center;margin-bottom:36px;font-size:34px}.feature-grid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.feature{border-radius:24px;padding:25px}.feature svg{color:#7c5ce6}.feature h3{margin:14px 0 8px}.feature p{color:var(--muted);margin:0;line-height:1.65}.legal{max-width:800px;margin:60px auto;padding:40px}.legal h1{font-size:40px}.legal p,.legal li{color:#58536f;line-height:1.8}.auth-page{place-items:center;min-height:100vh;padding:24px;display:grid}.auth-card{border-radius:28px;width:min(440px,100%);padding:34px}.auth-card .brand{justify-content:center}.auth-card h1{text-align:center;margin:24px 0 6px}.auth-card>p{text-align:center;color:var(--muted);margin-bottom:26px}.field{gap:7px;margin:14px 0;display:grid}.field label{font-size:13px;font-weight:750}.input{border:1px solid var(--line);background:#fafaff;border-radius:13px;outline:none;width:100%;padding:13px 15px}.input:focus{border-color:#8b6ef2;box-shadow:0 0 0 3px #8b6ef21c}.auth-card .btn{width:100%;margin-top:10px}.form-error{color:#b72248;background:#fff0f4;border-radius:11px;padding:10px 12px;font-size:13px}.form-success{color:#08785b;background:#e9fff8;border-radius:11px;padding:10px 12px;font-size:13px}.auth-foot{text-align:center;color:var(--muted);margin-top:20px;font-size:14px}.auth-foot a{color:#7453e8;font-weight:750}.app-layout{grid-template-columns:245px 1fr;min-height:100vh;display:grid}.sidebar{border-right:1px solid var(--line);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffffbf;flex-direction:column;height:100vh;padding:24px 16px;display:flex;position:sticky;top:0}.sidebar .brand{padding:0 10px 22px}.nav{gap:4px;display:grid}.nav a{color:#635e7d;border-radius:13px;align-items:center;gap:12px;padding:11px 13px;font-size:14px;font-weight:650;display:flex}.nav a:hover,.nav a.active{color:#6e4be5;background:#eeeaff}.sidebar-bottom{margin-top:auto;padding:10px}.user-chip{background:#f5f2ff;border-radius:15px;align-items:center;gap:10px;padding:12px;display:flex}.avatar{color:#fff;background:linear-gradient(135deg,#c6b7ff,#6bb9f4);border-radius:50%;place-items:center;width:36px;height:36px;font-weight:800;display:grid}.user-chip small{color:var(--muted);display:block}.main{min-width:0;padding:32px}.page-head{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.page-head h1{margin:0;font-size:28px}.page-head p{color:var(--muted);margin:6px 0 0}.month-pill{border:1px solid var(--line);background:#fff;border-radius:99px;padding:10px 14px}.stat-grid{grid-template-columns:1.3fr repeat(3,1fr);gap:14px;display:grid}.card{background:#ffffffd9;border:1px solid #ffffffe6;border-radius:22px;padding:20px;box-shadow:0 12px 38px #7160b315}.hero-card{color:#fff;background:linear-gradient(120deg,#ae91fa,#8364ed 52%,#61aaf7);position:relative;overflow:hidden}.hero-card:after{content:"";border:1px solid #fff5;border-radius:50%;width:170px;height:170px;position:absolute;top:-45px;right:-30px}.card-label{color:var(--muted);font-size:13px;font-weight:650}.hero-card .card-label{color:#f2ecff}.stat-value{margin-top:8px;font-size:28px;font-weight:850}.positive{color:var(--success)}.negative{color:var(--danger)}.quick-grid{grid-template-columns:repeat(4,1fr);gap:10px;margin:16px 0;display:grid}.quick{border:1px solid var(--line);background:#fff;border-radius:18px;place-items:center;gap:7px;min-height:86px;font-size:13px;font-weight:750;display:grid}.quick:hover{transform:translateY(-2px);box-shadow:0 9px 24px #7968c323}.quick svg{color:#7957e9}.content-grid{grid-template-columns:1.2fr .8fr;gap:16px;display:grid}.card-head{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.card-head h2{margin:0;font-size:17px}.link{color:#7654e8;font-size:13px;font-weight:750}.transaction-row{border-bottom:1px solid var(--line);align-items:center;gap:12px;padding:13px 2px;display:flex}.transaction-row:last-child{border-bottom:0}.transaction-row .meta{flex:1}.transaction-row b{font-size:14px}.transaction-row small{color:var(--muted);margin-top:4px;display:block}.empty{text-align:center;color:var(--muted);padding:34px 14px}.empty svg{opacity:.55;margin-bottom:8px}.chart-wrap{height:245px}.budget-row{margin:17px 0}.budget-line{justify-content:space-between;margin-bottom:8px;font-size:13px;display:flex}.progress{background:#edeafa;border-radius:99px;height:8px;overflow:hidden}.progress>span{background:linear-gradient(90deg,#a78bfa,#60a5fa);border-radius:99px;height:100%;display:block}.section-grid{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.account-card{min-height:150px}.account-card .account-icon{color:#7452e7;background:#eee9ff;border-radius:14px;place-items:center;width:42px;height:42px;display:grid}.account-card h3{margin:14px 0 4px}.account-card .amount{font-size:24px;font-weight:850}.fab,.mobile-nav{display:none}.modal-backdrop{z-index:20;background:#19132f77;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{background:#fff;border-radius:26px;width:min(520px,100%);max-height:90vh;padding:24px;overflow:auto}.modal-head{justify-content:space-between;align-items:center;display:flex}.modal-head h2{margin:0}.icon-btn{background:#f2effa;border:0;border-radius:12px;place-items:center;width:38px;height:38px;display:grid}.segmented{background:#f2f0f9;border-radius:13px;grid-template-columns:repeat(3,1fr);gap:5px;margin:18px 0;padding:4px;display:grid}.segmented button{background:0 0;border:0;border-radius:10px;padding:10px;font-weight:700}.segmented button.active{color:#7352e8;background:#fff;box-shadow:0 3px 12px #6f5cad20}.amount-input{text-align:center;font-size:30px;font-weight:850}.two-col{grid-template-columns:1fr 1fr;gap:12px;display:grid}.modal-actions{gap:10px;margin-top:20px;display:flex}.modal-actions .btn{flex:1}.status-banner{color:#8a5f00;background:#fff5db;border-radius:14px;margin-bottom:15px;padding:12px 15px;font-size:13px}.skeleton{background:linear-gradient(90deg,#f1eff8,#fafaff,#f1eff8) 0 0/200% 100%;border-radius:12px;height:60px;margin:8px 0;animation:1.4s infinite shimmer}@keyframes shimmer{to{background-position:-200% 0}}@media (max-width:900px){.hero{text-align:center;grid-template-columns:1fr;margin-top:32px}.hero p{margin-inline:auto}.hero-actions,.trust{justify-content:center}.feature-grid{grid-template-columns:1fr}.phone{width:310px;height:600px}.app-layout{display:block}.sidebar{display:none}.main{padding:20px 16px 105px}.page-head{align-items:flex-start}.stat-grid{grid-template-columns:1fr 1fr}.hero-card{grid-column:1/-1}.content-grid,.section-grid{grid-template-columns:1fr}.quick-grid{grid-template-columns:repeat(4,1fr)}.mobile-nav{z-index:10;padding:8px 8px calc(8px + env(safe-area-inset-bottom));border-top:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffea;grid-template-columns:repeat(5,1fr);display:grid;position:fixed;bottom:0;left:0;right:0}.mobile-nav a,.mobile-nav button{color:#625d79;background:0 0;border:0;place-items:center;gap:3px;font-size:10px;display:grid}.mobile-nav .add{color:#fff;background:linear-gradient(135deg,#ae8ff8,#7157eb 60%,#5bb6f6);border-radius:50%;width:52px;height:52px;margin:-27px auto 0;box-shadow:0 8px 20px #8068e875}.toplinks a:not(.btn){display:none}}@media (max-width:520px){.topbar{padding:16px}.hero{gap:35px;margin-bottom:55px;padding:0 18px}.hero h1{font-size:43px}.hero p{font-size:16px}.hero-actions{flex-direction:column}.trust{flex-wrap:wrap;gap:10px}.phone{width:286px;height:565px}.features{padding:0 16px}.stat-grid{grid-template-columns:1fr 1fr}.stat-value{font-size:22px}.quick{min-height:74px}.quick span{font-size:11px}.two-col{grid-template-columns:1fr}.page-head h1{font-size:24px}.page-head p{font-size:13px}.month-pill{font-size:12px}.main{padding-inline:12px}}@media (prefers-color-scheme:dark){:root{--ink:#f2efff;--muted:#aaa5c0;--surface:#1e1c32d9;--line:#cec4ff1f}html,body{background:#12101f}.card,.quick,.phone-list,.mini,.month-pill,.modal,.btn-ghost,.input{color:var(--ink);background:#211e34}.app-layout{background:#12101f}.sidebar,.mobile-nav{background:#1b182bdd}.nav a:hover,.nav a.active{background:#302849}.user-chip{background:#2b2641}.progress{background:#352f50}.segmented{background:#2e2944}.segmented button.active{background:#443b64}.status-banner{color:#ffe2a0;background:#3b321c}}
