:root{--g900:#00264d;--g800:#036;--g700:#00518a;--g600:#0079c2;--g500:#009fe0;--g400:#33b8e8;--g300:#7fd2f2;--g200:#a0e1ff;--g100:#d6eefb;--g50:#eff8fe;--gold:#ffd200;--gold-soft:#fff4cc;--amber:#d98a00;--ink:#0a2a45;--ink-2:#4a6a87;--ink-3:#8ba3b8;--line:#e2edf6;--line-2:#eef4f9;--bg:#f4f9fd;--surface:#fff;--surface-2:#f8fbfe;--ok:#12b886;--ok-soft:#e3faf3;--r-xl:26px;--r-lg:20px;--r-md:15px;--r-sm:11px;--sh-1:0 1px 2px #0a2a450a, 0 4px 14px #0a2a450d;--sh-2:0 2px 6px #0a2a450d, 0 12px 32px #0a2a4514;--sh-3:0 4px 12px #0079c21a, 0 20px 48px #00336624;--sh-glow:0 8px 30px #0079c23d;--grad-brand:linear-gradient(135deg, #036 0%, #0079c2 52%, #0cf 100%);--grad-brand-soft:linear-gradient(135deg, #eff8fe 0%, #d6eefb 100%);--grad-gold:linear-gradient(135deg, #0079c2 0%, #0cf 88%, #ffd200 150%);--ease:cubic-bezier(.22, 1, .36, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{color:var(--ink);background:var(--bg);overscroll-behavior:none;-webkit-font-smoothing:antialiased;letter-spacing:-.01em;font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;overflow:hidden}#root{isolation:isolate;position:relative}.app-shell{flex-direction:column;height:100dvh;display:flex;position:relative;overflow:hidden}.app-shell:before{content:"";z-index:-2;animation:mesh 30s var(--ease) infinite alternate;background:radial-gradient(46% 34% at 12% -4%,#00ccff29 0%,#0000 62%),radial-gradient(40% 30% at 104% 6%,#0079c21a 0%,#0000 60%),radial-gradient(60% 44% at 50% 108%,#a0e1ff38 0%,#0000 62%),linear-gradient(#f7fbfe 0%,#eef6fd 100%);position:fixed;inset:-10%}@keyframes mesh{0%{transform:translate(0,0)scale(1)}50%{transform:translate(-1.5%,1%)scale(1.05)}to{transform:translate(1%,-1.5%)scale(1.02)}}.scroll-area{padding:calc(var(--safe-top) + 16px) 18px calc(var(--safe-bottom) + 104px);-webkit-overflow-scrolling:touch;flex:1;overflow:hidden auto}.home-fit{min-height:0;padding:calc(var(--safe-top) + 8px) 14px calc(var(--safe-bottom) + 72px);flex-direction:column;flex:1;gap:clamp(6px,1.2vh,11px);display:flex;overflow:hidden}.home-fit.cal-expanded .actions .action-row.minor,.home-fit.cal-expanded .wallet-card .wallet-chips,.home-fit.cal-expanded .wallet-sub{display:none}.home-fit.cal-expanded .wallet-card{padding:12px 18px}.home-fit.cal-expanded .wallet-amount{margin-top:2px;font-size:clamp(30px,9vw,40px)}.home-fit .wallet-card,.home-fit .actions{flex:none}.home-fit .cal-wrap{flex-direction:column;flex:auto;min-height:0;display:flex}.home-fit .cal-wrap.collapsed{flex:none}.home-fit .cal-body{-webkit-overflow-scrolling:touch;flex:auto;min-height:0;overflow-y:auto}.glass{-webkit-backdrop-filter:blur(18px)saturate(150%);border-radius:var(--r-xl);box-shadow:var(--sh-2);background:#ffffffd1;border:1px solid #ffffffe6}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-1);margin-bottom:16px;padding:20px}.wallet-card{background:var(--grad-brand);box-shadow:var(--sh-3);color:#fff;background-size:150% 150%;border-radius:24px;padding:clamp(13px,2vh,20px) 20px clamp(11px,1.6vh,16px);position:relative;overflow:hidden}.wallet-card:before{content:"";pointer-events:none;background:radial-gradient(80% 90% at 88% 0,#ffffff38 0%,#0000 55%),radial-gradient(60% 60% at 0 120%,#00ccff4d 0%,#0000 60%);position:absolute;inset:0}.wallet-card:after{content:"";pointer-events:none;background:linear-gradient(115deg,#0000 34%,#ffffff42 48%,#0000 60%);animation:7s ease-in-out infinite sheen;position:absolute;inset:0;transform:translate(-130%)}@keyframes sheen{0%,58%{transform:translate(-130%)}78%,to{transform:translate(130%)}}.wallet-card.low{animation:2.6s ease-in-out infinite wallet-pulse}@keyframes wallet-pulse{0%,to{box-shadow:var(--sh-3)}50%{box-shadow:0 8px 40px #d98a006b, var(--sh-3)}}.wallet-head{align-items:center;gap:8px;display:flex;position:relative}.wallet-label{letter-spacing:.16em;text-transform:uppercase;opacity:.82;font-size:12.5px;font-weight:600}.wallet-amount{letter-spacing:-.03em;font-variant-numeric:tabular-nums;align-items:baseline;gap:8px;margin-top:4px;font-size:clamp(36px,11.5vw,50px);font-weight:800;line-height:1;display:flex;position:relative}.wallet-amount .cur{opacity:.82;font-size:clamp(17px,5vw,21px);font-weight:600}.wallet-sub{opacity:.94;align-items:center;gap:7px;margin-top:6px;font-size:13px;display:flex;position:relative}.wallet-sub svg{opacity:.9}.wallet-chips{flex-wrap:wrap;gap:6px;margin-top:10px;display:flex;position:relative}.wallet-chip{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff26;border:1px solid #ffffff47;border-radius:999px;align-items:center;gap:5px;padding:4px 10px;font-size:11.5px;font-weight:600;display:inline-flex}.wallet-chip svg{opacity:.85}.actions{gap:7px;display:grid}.action-row{grid-template-columns:1fr 1fr;gap:7px;display:grid}.btn{border:1px solid var(--line);border-radius:var(--r-md);color:var(--ink);background:var(--surface);box-shadow:var(--sh-1);transition:transform .14s var(--ease-spring), box-shadow .2s, background .2s;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;gap:8px;min-height:44px;padding:12px;font-size:14px;font-weight:650;display:flex}.btn.compact{min-height:44px;padding:11px 12px;font-size:13.5px}.btn.mini{border-radius:12px;gap:5px;min-height:38px;padding:8px;font-size:11.5px}.btn.mini svg{width:15px;height:15px}.btn svg{color:var(--g600);flex:none}.btn:active{transform:scale(.96)}.btn.morning{background:linear-gradient(#fff 0%,#f2f9fe 100%)}.btn.evening{background:linear-gradient(#fff 0%,#eef6fd 100%)}.btn.evening svg{color:var(--g800)}.btn.topup{background:var(--grad-brand);color:#fff;box-shadow:var(--sh-glow);border:none;font-weight:700}.btn.topup svg{color:#fff}.btn.ghost{background:var(--surface-2);box-shadow:none;color:var(--ink-2);font-weight:600}.btn.ghost svg{color:var(--ink-3)}.btn.wide{grid-column:1/-1}.btn:disabled{opacity:.5;box-shadow:none}.seg{background:var(--surface-2);border:1px solid var(--line);border-radius:999px;gap:4px;padding:4px;display:flex}.seg button{color:var(--ink-3);transition:all .28s var(--ease);background:0 0;border:none;border-radius:999px;flex:1;padding:9px 14px;font-size:14px;font-weight:650}.seg button.on{background:var(--surface);color:var(--g600);box-shadow:var(--sh-1)}.cal-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-1);flex-direction:column;margin-bottom:0;padding:0;display:flex;overflow:hidden}.cal-head{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;padding:10px 14px;display:flex}.cal-head .ch-title{color:var(--ink);align-items:center;gap:7px;font-size:14px;font-weight:700;display:flex}.cal-head .ch-title svg{color:var(--g500)}.cal-head .ch-spacer{flex:1}.cal-head .ch-caret{color:var(--ink-3);transition:transform .25s var(--ease);display:flex}.cal-head.open .ch-caret{transform:rotate(180deg)}.cal-body{padding:0 14px 12px;overflow:hidden}.cal-body.hidden{display:none}.week-strip{grid-template-columns:repeat(7,1fr);gap:6px;display:grid}.wday{text-align:center;background:var(--surface);border:1px solid var(--line);transition:all .22s var(--ease);box-shadow:var(--sh-1);border-radius:15px;padding:9px 2px 7px;position:relative}.wday.today{border-color:var(--g400);background:var(--g50);box-shadow:0 0 0 3px #009fe01f}.wday.selected{border-color:var(--g600);animation:day-flash .9s var(--ease);box-shadow:0 0 0 3px #0079c233}@keyframes day-flash{0%{transform:scale(1);box-shadow:0 0 #0079c280}40%{transform:scale(1.06);box-shadow:0 0 0 6px #0079c226}to{transform:scale(1);box-shadow:0 0 0 3px #0079c233}}.wday .wd-name{color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em;font-size:10.5px;font-weight:700}.wday.weekend .wd-name{color:var(--amber)}.wday .wd-num{font-variant-numeric:tabular-nums;color:var(--ink);margin-top:3px;font-size:19px;font-weight:750}.wday.today .wd-num{color:var(--g600)}.wday .dots{justify-content:center;gap:3px;height:8px;margin-top:7px;display:flex}.dot{background:var(--line);border-radius:50%;width:7px;height:7px}.dot.paid{background:var(--g500);box-shadow:0 0 5px #009fe080}.dot.own{background:var(--ok)}.dot.none{border:1.4px solid var(--ink-3);background:0 0}.dot.auto{border:1.4px dashed var(--ink-3);background:0 0}.wday .wd-sum{color:var(--ink-3);font-variant-numeric:tabular-nums;margin-top:3px;font-size:10.5px;font-weight:700}.month-head{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.month-title{text-transform:capitalize;color:var(--ink);font-size:17px;font-weight:750}.month-nav{gap:8px;display:flex}.icon-btn{border:1px solid var(--line);background:var(--surface);width:40px;height:40px;color:var(--g600);box-shadow:var(--sh-1);transition:transform .13s var(--ease-spring), background .2s;border-radius:13px;justify-content:center;align-items:center;display:flex}.icon-btn:active{background:var(--g50);transform:scale(.9)}.month-grid{grid-template-columns:repeat(7,1fr);gap:4px;display:grid}.mg-head{text-align:center;color:var(--ink-3);text-transform:uppercase;letter-spacing:.05em;padding:3px 0;font-size:10px;font-weight:700}.mg-head.wknd{color:var(--amber)}.mcell{aspect-ratio:1/.92;background:var(--surface);border:1px solid var(--line);transition:all .18s var(--ease);box-shadow:var(--sh-1);border-radius:11px;flex-direction:column;align-items:center;padding:3px;display:flex;position:relative;overflow:hidden}.mcell.empty{box-shadow:none;background:0 0;border-color:#0000}.mcell.out{opacity:.4}.mcell.today{border-color:var(--g400);background:var(--g50);box-shadow:0 0 0 3px #009fe01a}.mcell.selected{border-color:var(--g600);box-shadow:0 0 0 3px #0079c238}.mcell .dnum{font-variant-numeric:tabular-nums;color:var(--ink);font-size:13px;font-weight:700}.mcell.today .dnum{color:var(--g600)}.mcell .mdots{gap:3px;margin-top:auto;margin-bottom:2px;display:flex}.mcell .dot{width:6px;height:6px}.mcell .mtop{color:var(--amber);font-size:12px;font-weight:800;line-height:1;position:absolute;top:4px;right:5px}.mcell .msum{color:var(--ink-3);font-variant-numeric:tabular-nums;font-size:8.5px;font-weight:700}.day-sheet-head{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:4px;display:flex}.day-sheet-head h3{margin:0;font-size:19px;font-weight:750}.badge{letter-spacing:.02em;border-radius:999px;padding:4px 10px;font-size:11px;font-weight:700}.badge.today{background:var(--g50);color:var(--g600);border:1px solid var(--g200)}.badge.past{background:var(--surface-2);color:var(--amber);border:1px solid #f2e3b8}.topup-list{flex-direction:column;gap:8px;margin-bottom:10px;display:flex}.topup-item{background:var(--gold-soft);color:var(--ink);border:1px solid #f2e3b8;border-radius:13px;align-items:center;gap:9px;padding:11px 13px;font-size:14px;font-weight:700;display:flex}.topup-item svg:first-child{color:var(--amber)}.topup-item .muted{margin-left:auto;font-size:12px;font-weight:500}.topup-del{color:var(--ink-3);background:0 0;border:none;margin-left:4px;padding:4px;display:flex}.sheet-backdrop{z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0a2a4547;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{background:var(--surface);border-top:1px solid var(--line);width:100%;padding:18px 20px calc(var(--safe-bottom) + 24px);border-radius:30px 30px 0 0;max-height:88dvh;overflow-y:auto;box-shadow:0 -20px 50px #0a2a452e}.sheet-grip{background:var(--line);border-radius:999px;width:44px;height:5px;margin:0 auto 16px}.sheet h3{margin:0 0 4px;font-size:19px;font-weight:750}.sheet .sub{color:var(--ink-3);margin-bottom:18px;font-size:13.5px}.period-block{margin-bottom:18px}.period-title{color:var(--ink-3);text-transform:uppercase;letter-spacing:.1em;align-items:center;gap:7px;margin-bottom:9px;font-size:12px;font-weight:700;display:flex}.period-title svg{color:var(--g500)}.choice-row{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.choice{border:1.5px solid var(--line);background:var(--surface-2);text-align:center;transition:all .18s var(--ease);color:var(--ink-3);border-radius:15px;flex-direction:column;align-items:center;gap:5px;padding:13px 6px;font-size:12px;font-weight:650;display:flex}.choice svg{color:var(--ink-3)}.choice.on{color:var(--ink)}.choice.on.paid{background:var(--g50);border-color:var(--g400)}.choice.on.paid svg{color:var(--g600)}.choice.on.own{background:var(--ok-soft);border-color:var(--ok)}.choice.on.own svg{color:var(--ok)}.choice.on.none{background:var(--surface-2);border-color:var(--ink-3)}.amount-input{background:var(--surface-2);border:1px solid var(--line);width:100%;color:var(--ink);font-variant-numeric:tabular-nums;border-radius:15px;outline:none;margin-top:10px;padding:13px 16px;font-size:20px;font-weight:750;transition:border .2s,box-shadow .2s}.amount-input:focus{border-color:var(--g400);box-shadow:0 0 0 3px #009fe024}.quick-chips{flex-wrap:wrap;gap:7px;margin-top:9px;display:flex}.qchip{border:1px solid var(--line);background:var(--surface);color:var(--ink-2);box-shadow:var(--sh-1);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:650}.qchip:active{transform:scale(.94)}.bottom-nav{padding:8px 10px calc(var(--safe-bottom) + 8px);-webkit-backdrop-filter:blur(22px)saturate(160%);backdrop-filter:blur(22px)saturate(160%);border-top:1px solid var(--line);z-index:40;background:#ffffffe0;display:flex;position:fixed;bottom:0;left:0;right:0}.nav-item{color:var(--ink-3);background:0 0;border:none;flex-direction:column;flex:1;align-items:center;gap:4px;padding:6px 0;font-size:11px;font-weight:650;transition:color .2s;display:flex}.nav-item .ni{transition:transform .2s var(--ease-spring);display:flex}.nav-item.on{color:var(--g600)}.nav-item.on .ni{transform:translateY(-2px)}.toast{left:50%;bottom:calc(var(--safe-bottom) + 96px);background:var(--surface);border:1px solid var(--line);color:var(--ink);z-index:80;box-shadow:var(--sh-3);white-space:nowrap;border-radius:999px;align-items:center;gap:10px;padding:12px 18px;font-size:14px;font-weight:650;display:flex;position:fixed;transform:translate(-50%)}.toast svg{color:var(--g500);flex:none}.confetti-layer{z-index:90;pointer-events:none;position:fixed;inset:0;overflow:hidden}.confetti-piece{border-radius:2px;width:9px;height:14px;position:absolute}.login-wrap{flex-direction:column;justify-content:center;align-items:center;min-height:100dvh;padding:24px;display:flex;position:relative}.login-logo{background:var(--grad-brand);color:#fff;width:100px;height:100px;box-shadow:var(--sh-glow), var(--sh-2);border-radius:30px;justify-content:center;align-items:center;margin-bottom:20px;animation:5s ease-in-out infinite float;display:flex}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-9px)}}.login-title{letter-spacing:-.03em;color:var(--ink);font-size:28px;font-weight:800}.login-sub{color:var(--ink-3);text-align:center;max-width:300px;margin:8px 0 28px;font-size:14.5px}.login-card{width:100%;max-width:380px;padding:24px}.field{margin-bottom:15px;position:relative}.field label{color:var(--ink-3);text-transform:uppercase;letter-spacing:.09em;font-size:12px;font-weight:700}.input-wrap{margin-top:7px;position:relative}.input-wrap .lead-emoji{color:var(--ink-3);pointer-events:none;display:flex;position:absolute;top:50%;left:15px;transform:translateY(-50%)}.field input{background:var(--surface-2);border:1px solid var(--line);width:100%;color:var(--ink);border-radius:15px;outline:none;padding:14px 15px 14px 46px;font-size:16px;transition:border .2s,box-shadow .2s,background .2s}.field input::placeholder{color:var(--ink-3)}.field input:focus{border-color:var(--g400);background:var(--surface);box-shadow:0 0 0 4px #009fe01f}.pw-toggle{color:var(--ink-3);background:0 0;border:none;padding:4px;display:flex;position:absolute;top:50%;right:12px;transform:translateY(-50%)}.login-error{color:var(--amber);min-height:18px;margin:4px 0 12px;font-size:13.5px;font-weight:600}.btn-login{color:#fff;background:var(--grad-brand);width:100%;box-shadow:var(--sh-glow);transition:transform .13s var(--ease-spring), background-position .5s;background-size:170% 170%;border:none;border-radius:16px;justify-content:center;align-items:center;gap:10px;margin-top:6px;padding:16px;font-size:17px;font-weight:750;display:flex}.btn-login:active{transform:scale(.97)}.install-banner{left:16px;right:16px;bottom:calc(var(--safe-bottom) + 90px);z-index:60;background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-3);border-radius:20px;align-items:center;gap:13px;padding:15px 16px;display:flex;position:fixed}.install-banner .ib-ico{background:var(--grad-brand-soft);width:42px;height:42px;color:var(--g600);border-radius:13px;flex:none;justify-content:center;align-items:center;display:flex}.install-banner .ib-text{color:var(--ink-2);flex:1;font-size:13px;line-height:1.4}.install-banner .ib-text b{color:var(--ink);font-size:14.5px;display:block}.install-banner .ib-x{color:var(--ink-3);background:0 0;border:none;padding:4px;display:flex}.page-title{letter-spacing:-.03em;color:var(--ink);align-items:center;gap:10px;margin:6px 0 18px;font-size:25px;font-weight:800;display:flex}.page-title svg{color:var(--g500)}.stat-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.stat-tile{border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-1);padding:17px 16px}.stat-tile .st-head{color:var(--ink-3);align-items:center;gap:7px;margin-bottom:8px;display:flex}.stat-tile .st-head svg{color:var(--g500)}.stat-tile .sv{font-variant-numeric:tabular-nums;color:var(--ink);letter-spacing:-.02em;font-size:27px;font-weight:800}.stat-tile .sl{color:var(--ink-3);margin-top:3px;font-size:12px;font-weight:600}.bar-chart{align-items:flex-end;gap:3px;height:130px;margin-top:18px;display:flex}.bar{background:var(--grad-brand);min-height:3px;transition:height .5s var(--ease);opacity:.9;border-radius:5px 5px 2px 2px;flex:1}.settings-row{border-bottom:1px solid var(--line-2);justify-content:space-between;align-items:center;gap:14px;padding:14px 0;display:flex}.settings-row:last-child{border-bottom:none}.settings-row .lbl{color:var(--ink);font-size:15px;font-weight:650}.settings-row .hint{color:var(--ink-3);margin-top:3px;font-size:12px}.settings-input{background:var(--surface-2);border:1px solid var(--line);color:var(--ink);text-align:right;font-variant-numeric:tabular-nums;border-radius:11px;outline:none;width:108px;padding:10px 13px;font-size:15px;font-weight:650}.settings-input:focus{border-color:var(--g400);box-shadow:0 0 0 3px #009fe01f}.switch{background:var(--line);border:none;border-radius:999px;flex:none;width:50px;height:29px;transition:background .24s;position:relative}.switch.on{background:var(--g500)}.switch:after{content:"";width:23px;height:23px;transition:transform .24s var(--ease-spring);background:#fff;border-radius:50%;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #0a2a4533}.switch.on:after{transform:translate(21px)}.settings-section-title{color:var(--ink);align-items:center;gap:8px;margin-bottom:12px;font-weight:750;display:flex}.settings-section-title svg{color:var(--g500)}.muted{color:var(--ink-3)}.center{text-align:center}.spinner{border:3px solid var(--g100);border-top-color:var(--g500);border-radius:50%;width:24px;height:24px;margin:48px auto;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}
