.demo-app{--demo-bg:#050505;--demo-gradient-top:#141414;--demo-card:#111111c7;--demo-card-border:#ffffff1a;--demo-text:#fafafa;--demo-text-dim:#a1a1aa;--demo-blue:#188ce5;--demo-tab-bg:#0a0a0ad1;--demo-tab-border:#ffffff1a;--demo-positive:#22c55e;--demo-negative:#ef4444;width:100%;height:100%;color:var(--demo-text);background:var(--demo-bg);text-align:left;font-family:Inter Variable,Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;position:relative;overflow:hidden;container-type:inline-size}.demo-app .demo-canvas{background:linear-gradient(180deg, #14141429, transparent 26%), var(--demo-bg);width:393px;height:852px;transform:scale(calc(100cqw / 393px));transform-origin:0 0;position:relative;overflow:hidden}.demo-app button{color:inherit;font:inherit;background:0 0;border:0;margin:0;padding:0}.demo-app button:focus-visible{outline:2px solid var(--demo-blue);outline-offset:2px}.demo-app svg{fill:currentColor;display:block}.demo-app .demo-status{z-index:5;width:100%;height:66px;color:var(--demo-text);font-variant-numeric:tabular-nums;font-size:15px;position:absolute;top:0;left:0}.demo-app .demo-status__time{letter-spacing:-.02em;font-weight:650;position:absolute;top:19px;left:46px}.demo-app .demo-status__silent{color:#fafafae0;width:15px;height:15px;position:absolute;top:20px;left:93px}.demo-app .demo-status__island{background:#000;border-radius:999px;justify-content:center;align-items:center;gap:7px;width:112px;height:27px;display:flex;position:absolute;top:13px;left:50%;transform:translate(-50%)}.demo-app .demo-status__island img{width:14px;height:14px}.demo-app .demo-status__island span{letter-spacing:.15em;font-size:8.5px;font-weight:560}.demo-app .demo-status__signals{align-items:center;gap:9px;display:flex;position:absolute;top:20px;right:24px}.demo-app .demo-cellular{align-items:flex-end;gap:2px;height:12px;display:flex}.demo-app .demo-cellular i{background:currentColor;border-radius:1px;width:3px;display:block}.demo-app .demo-cellular i:first-child{height:5px}.demo-app .demo-cellular i:nth-child(2){height:8px}.demo-app .demo-cellular i:nth-child(3){height:10px}.demo-app .demo-cellular i:nth-child(4){height:13px}.demo-app .demo-wifi{border-top:3px solid;border-radius:50% 50% 0 0;width:17px;height:12px;transform:translateY(2px)}.demo-app .demo-wifi:after{content:"";background:currentColor;border-radius:50%;width:5px;height:5px;margin:3px auto 0;display:block}.demo-app .demo-battery{color:#fff;text-align:center;border:1.5px solid #fafafa9e;border-radius:4px;width:29px;height:16px;font-size:10px;font-weight:760;line-height:14px;position:relative}.demo-app .demo-battery:after{content:"";background:#fafafa9e;border-radius:0 1px 1px 0;width:2px;height:4px;position:absolute;top:3px;right:-3px}.demo-app .demo-battery i{z-index:-1;background:#31cf65;border-radius:3px;position:absolute;inset:0}.demo-app .demo-battery b{font:inherit}.demo-app .demo-header{z-index:4;background:linear-gradient(180deg, var(--demo-bg) 0 76%, #050505eb 88%, transparent);width:100%;height:142px;padding:8px 14px 0;position:absolute;top:65px;left:0;overflow:hidden}.demo-app .demo-wave{width:100%;height:154px;position:absolute;top:0;left:0;overflow:visible}.demo-app .demo-wave path{fill:none;stroke:var(--demo-blue);stroke-width:.82px;opacity:.58;vector-effect:non-scaling-stroke;transform-origin:50%;will-change:transform, opacity;animation:4.8s cubic-bezier(.45,0,.55,1) infinite alternate demo-wave-flow}.demo-app .demo-wave path:nth-child(-n+3){stroke:#fafafa42;opacity:.42}.demo-app .demo-wave path:nth-child(2n){animation-duration:5.8s;animation-direction:alternate-reverse}.demo-app .demo-wave path:nth-child(2){animation-delay:-1.6s}.demo-app .demo-wave path:nth-child(3){animation-duration:6.4s;animation-delay:-3.1s}.demo-app .demo-wave path:nth-child(4){animation-delay:-2.4s}.demo-app .demo-wave path:nth-child(5){animation-duration:5.4s;animation-delay:-4.2s}.demo-app .demo-wave path:nth-child(6){animation-duration:6.8s;animation-delay:-.9s}.demo-app .demo-wave path:nth-child(7){animation-duration:5.9s;animation-delay:-3.7s}.demo-app .demo-eyebrow,.demo-app .demo-balance{margin:0;position:relative}.demo-app .demo-eyebrow{color:var(--demo-text-dim);letter-spacing:.2em;font-size:11px;font-weight:560}.demo-app .demo-balance{letter-spacing:-.055em;white-space:nowrap;word-spacing:.16em;margin-top:4px;font-size:41px;font-weight:800;line-height:1.04}.demo-app .demo-header__controls{justify-content:space-between;align-items:center;margin-top:27px;padding:0 2px 0 9px;display:flex;position:relative}.demo-app .demo-filter-controls{align-items:center;gap:18px;display:flex}.demo-app .demo-filter-controls button{width:22px;height:22px;color:var(--demo-text-dim);cursor:pointer;place-items:center;transition:color .16s,transform .16s;display:grid}.demo-app .demo-filter-controls svg{width:16px;height:16px}.demo-app .demo-filter-controls button[aria-expanded=true],.demo-app .demo-filter-controls button.is-active{color:var(--demo-text);transform:scale(1.05)}.demo-app .demo-filter-controls button:focus-visible,.demo-app .demo-filter-popover button:focus-visible{outline:none}.demo-app .demo-filter-controls button:focus-visible{color:var(--demo-text);filter:drop-shadow(0 0 5px #ffffff42)}.demo-app .demo-scenario{color:var(--demo-blue);letter-spacing:.18em;text-transform:uppercase;cursor:pointer;font-size:11px;font-weight:680}.demo-app .demo-feed{z-index:2;overscroll-behavior:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:24px 13px 116px;position:absolute;inset:202px 0 0;overflow:hidden auto}.demo-app .demo-feed::-webkit-scrollbar{display:none}.demo-app .demo-period{margin-bottom:14px;position:relative}.demo-app .demo-period__collapsed{height:61px;position:relative}.demo-app .demo-stack-edge,.demo-app .demo-stack-card{border:1px solid var(--demo-card-border);background:var(--demo-card);border-radius:22px;position:absolute;left:0}.demo-app .demo-stack-edge{pointer-events:none;height:52px}.demo-app .demo-stack-edge--back{z-index:0;opacity:.34;top:9px;left:12px;right:12px}.demo-app .demo-stack-edge--middle{z-index:1;opacity:.62;top:5px;left:6px;right:6px}.demo-app .demo-stack-card{z-index:2;cursor:pointer;text-align:left;grid-template-columns:1.28fr .9fr 1.12fr 18px;align-items:center;width:100%;height:52px;padding:0 13px 0 14px;display:grid;top:0;box-shadow:inset 0 1px #ffffff04}.demo-app .demo-stack-card__identity{flex-direction:column;gap:2px;min-width:0;display:flex}.demo-app .demo-stack-card__identity strong,.demo-app .demo-stack-card__balance,.demo-app .demo-stack-card__delta strong{letter-spacing:-.01em;white-space:nowrap;font-size:12px;font-weight:650}.demo-app .demo-stack-card__identity small{color:var(--demo-text-dim);text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:430;overflow:hidden}.demo-app .demo-stack-card__balance{justify-self:center}.demo-app .demo-stack-card__delta{justify-self:end;align-items:center;gap:6px;min-width:0;display:flex}.demo-app .demo-stack-card__delta b,.demo-app .demo-transaction__amount b{font-size:15px;font-weight:800;line-height:1}.demo-app .is-positive{color:var(--demo-positive)}.demo-app .is-negative{color:var(--demo-negative)}.demo-app .demo-chevron{width:17px;height:17px;color:var(--demo-text-dim)}.demo-app .demo-period__expanded{padding:1px 0 4px}.demo-app .demo-period-heading{cursor:pointer;text-align:left;grid-template-columns:1fr 1fr 17px;align-items:center;width:100%;min-height:56px;padding:0 14px;display:grid}.demo-app .demo-period-heading strong{white-space:nowrap;font-size:13px;font-weight:650}.demo-app .demo-period-heading strong:nth-child(2){justify-self:center}.demo-app .demo-transactions{gap:8px;display:grid}.demo-app .demo-transaction{border:1px solid var(--demo-card-border);background:var(--demo-card);cursor:pointer;text-align:left;border-radius:22px;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;min-height:61px;padding:8px 14px 8px 13px;display:grid}.demo-app .demo-transaction__icon{width:28px;height:28px;color:var(--demo-text-dim);background:#ffffff14;border-radius:50%;place-items:center;display:grid}.demo-app .demo-transaction__icon svg{width:17px;height:17px}.demo-app .demo-transaction__copy{flex-direction:column;gap:2px;min-width:0;display:flex}.demo-app .demo-transaction__copy strong{text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:650;overflow:hidden}.demo-app .demo-transaction__copy small{color:var(--demo-text-dim);text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:420;overflow:hidden}.demo-app .demo-transaction__amount{font-variant-numeric:tabular-nums;white-space:nowrap;align-items:center;gap:6px;display:flex}.demo-app .demo-transaction__amount strong{color:var(--demo-text);font-size:13px;font-weight:650}.demo-app .demo-now{height:36px;color:var(--demo-text-dim);letter-spacing:.2em;align-items:center;gap:10px;margin:0 1px 14px;font-size:10px;font-weight:600;display:flex}.demo-app .demo-now:before,.demo-app .demo-now:after{background:var(--demo-card-border);content:"";flex:1;height:1px}.demo-app .demo-bottom-chrome{z-index:7;gap:8px;height:75px;padding:15px 20px 4px;display:flex;position:absolute;bottom:0;left:0;right:0}.demo-app .demo-native-tabbar-capture{z-index:-1;object-fit:fill;pointer-events:none;width:100%;height:100%;display:block;position:absolute;inset:0}.demo-app .demo-tabbar{flex:1;grid-template-columns:repeat(3,1fr);align-items:center;min-width:0;display:grid}.demo-app .demo-tabbar button{cursor:pointer;border-radius:999px;place-items:center;height:48px;display:grid}.demo-app .demo-tabbar button.is-active{background:0 0}.demo-app .demo-fab{cursor:pointer;background:0 0;border-radius:50%;flex:0 0 56px;width:56px}.demo-app .demo-filter-popover,.demo-app .demo-scenario-popover{z-index:16;backdrop-filter:blur(24px);background:#19191bf0;border:1px solid #ffffff24;border-radius:18px;position:absolute;top:186px;overflow:hidden;box-shadow:0 18px 36px #0000007a}.demo-app .demo-filter-popover{backdrop-filter:blur(34px)saturate(165%);transform-origin:18px -8px;background:#2a2a2dd1;border-color:#ffffff1f;border-radius:19px;width:238px;padding:6px;animation:.15s cubic-bezier(.2,.8,.2,1) demo-native-menu-in;left:18px;box-shadow:0 22px 50px #00000094,inset 0 .5px #ffffff17}.demo-app .demo-filter-popover[data-demo-open-group=spending]{transform-origin:24px 35px;background:#19191beb;border-radius:27px;width:223px;padding:6px;top:148px;left:63px}.demo-app .demo-filter-popover[data-demo-open-group=accounts],.demo-app .demo-filter-popover[data-demo-open-group=income]{background:#19191beb;border-radius:27px;width:223px;padding:6px;top:148px}.demo-app .demo-filter-popover[data-demo-open-group=income]{width:223px;padding:6px;top:147px;left:105px}.demo-app .demo-filter-popover button{color:#fafafaeb;cursor:pointer;text-align:left;border-radius:12px;justify-content:space-between;align-items:center;width:100%;min-height:43px;padding:0 9px 0 13px;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Inter Variable,sans-serif;font-size:13px;font-weight:430;transition:background-color 90ms;display:flex;box-shadow:inset 0 -.5px #ffffff1c}.demo-app .demo-filter-popover button:last-child{box-shadow:none}.demo-app .demo-filter-popover button:hover,.demo-app .demo-filter-popover button:focus-visible{color:var(--demo-text);background:#ffffff16}.demo-app .demo-native-menu__symbol{color:#ebebf5a8;flex:0 0 22px;place-items:center;width:22px;height:22px;display:grid;position:relative}.demo-app .demo-native-menu__symbol svg{width:18px;height:18px}.demo-app .demo-native-menu__check{color:#0a84ff;display:none}.demo-app .demo-filter-popover button.is-selected .demo-native-menu__base{display:none}.demo-app .demo-filter-popover button.is-selected .demo-native-menu__check{display:block}.demo-app .demo-filter-popover[data-demo-open-group=spending] button{min-height:37.5px;box-shadow:none;border-radius:10px;justify-content:flex-start;gap:11px;padding:0 11px;font-size:15px;font-weight:420}.demo-app .demo-filter-popover[data-demo-open-group=accounts] button,.demo-app .demo-filter-popover[data-demo-open-group=income] button{min-height:38px;box-shadow:none;border-radius:10px;justify-content:flex-start;gap:11px;padding:0 11px;font-size:15px;font-weight:420}.demo-app .demo-filter-popover[data-demo-open-group=accounts] button{min-height:40px}.demo-app .demo-filter-popover[data-demo-open-group=accounts] button:hover,.demo-app .demo-filter-popover[data-demo-open-group=income] button:hover{background:0 0}.demo-app .demo-filter-popover[data-demo-open-group=accounts] .demo-native-menu__symbol,.demo-app .demo-filter-popover[data-demo-open-group=income] .demo-native-menu__symbol{color:#63bcff;flex-basis:23px;order:-1;width:23px}.demo-app .demo-filter-popover[data-demo-open-group=accounts] .demo-native-menu__base,.demo-app .demo-filter-popover[data-demo-open-group=income] .demo-native-menu__base{display:none}.demo-app .demo-filter-popover[data-demo-open-group=accounts] .demo-native-menu__check,.demo-app .demo-filter-popover[data-demo-open-group=income] .demo-native-menu__check{color:#63bcff;width:19px;height:19px}.demo-app .demo-filter-popover[data-demo-open-group=spending] button:hover{background:0 0}.demo-app .demo-filter-popover[data-demo-open-group=spending] .demo-native-menu__symbol{color:#63bcff;flex-basis:23px;order:-1;width:23px}.demo-app .demo-filter-popover[data-demo-open-group=spending] .demo-native-menu__base{display:none}.demo-app .demo-filter-popover[data-demo-open-group=spending] .demo-native-menu__check{color:#63bcff;width:19px;height:19px}.demo-app .demo-scenario-popover{grid-template-columns:10px 1fr;gap:10px;width:220px;padding:14px;display:grid;right:15px}.demo-app .demo-scenario-popover__dot{background:var(--demo-blue);border-radius:50%;width:9px;height:9px;margin-top:3px;box-shadow:0 0 16px #188ce5e0}.demo-app .demo-scenario-popover strong{font-size:12px}.demo-app .demo-scenario-popover p{color:var(--demo-text-dim);margin:4px 0 0;font-size:10px;line-height:1.45}.demo-app .demo-sheet-backdrop{z-index:20;cursor:pointer;background:#0000007a;width:100%;height:100%;position:absolute;inset:0}.demo-app .demo-sheet{z-index:21;backdrop-filter:blur(30px);background:#141416fa;border:1px solid #ffffff21;border-radius:30px;min-height:384px;padding:24px 18px 18px;position:absolute;bottom:8px;left:8px;right:8px;box-shadow:0 -20px 50px #0009}.demo-app .demo-sheet__grabber{background:#fafafa3d;border-radius:999px;width:34px;height:4px;position:absolute;top:8px;left:50%;transform:translate(-50%)}.demo-app .demo-sheet__heading{justify-content:space-between;align-items:center;font-size:18px;display:flex}.demo-app .demo-sheet__heading>button{width:30px;height:30px;color:var(--demo-text-dim);cursor:pointer;background:#ffffff14;border-radius:50%;place-items:center;font-size:21px;display:grid}.demo-app .demo-mode-switch{background:#ffffff12;border-radius:999px;grid-template-columns:1fr 1fr;gap:3px;margin-top:18px;padding:3px;display:grid}.demo-app .demo-mode-switch button{height:34px;color:var(--demo-text-dim);cursor:pointer;border-radius:999px;font-size:12px;font-weight:620}.demo-app .demo-mode-switch button.is-selected{color:var(--demo-text);background:#ffffff24}.demo-app .demo-sheet__amount{letter-spacing:-.04em;text-align:center;margin:22px 0;font-size:30px;font-weight:820}.demo-app .demo-sheet__rows{background:#ffffff09;border:1px solid #ffffff1a;border-radius:18px;overflow:hidden}.demo-app .demo-sheet__rows button{cursor:pointer;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;width:100%;height:43px;padding:0 13px;font-size:12px;display:flex}.demo-app .demo-sheet__rows button:last-child{border-bottom:0}.demo-app .demo-sheet__rows span,.demo-app .demo-sheet__detail{color:var(--demo-text-dim)}.demo-app .demo-sheet__primary,.demo-app .demo-sheet__secondary{cursor:pointer;border-radius:999px;width:100%;height:44px;margin-top:16px;font-size:13px;font-weight:680}.demo-app .demo-sheet__primary{color:#fff;background:#1878ff}.demo-app .demo-sheet__secondary{background:#ffffff1a}.demo-app .demo-sheet__detail{text-align:center;margin:-10px 0 70px;font-size:13px}.demo-app .demo-toast{z-index:30;color:var(--demo-text);white-space:nowrap;background:#1c1c1ef0;border:1px solid #ffffff1f;border-radius:999px;padding:9px 15px;font-size:11px;font-weight:620;position:absolute;bottom:94px;right:50%;transform:translate(50%);box-shadow:0 12px 30px #00000073}.demo-app .demo-reference-screen{z-index:25;background:#000;animation:.18s cubic-bezier(.2,.8,.2,1) demo-reference-in;position:absolute;inset:0;overflow:hidden}.demo-app .demo-reference-screen>img{object-fit:cover;width:100%;height:100%;display:block}.demo-app .demo-reference-controls,.demo-app .demo-reference-keypad{pointer-events:none;position:absolute;inset:0}.demo-app .demo-reference-controls button{pointer-events:auto}.demo-app .demo-hotspot,.demo-app .demo-reference-keypad button{cursor:pointer;background:0 0;border-radius:20px;position:absolute}.demo-app .demo-hotspot:focus-visible,.demo-app .demo-reference-keypad button:focus-visible{outline-offset:-3px;outline:2px solid #63bcffe6}.demo-app .demo-hotspot--assistant{height:6.9%;bottom:1.8%;left:5%;right:69%}.demo-app .demo-hotspot--home{height:6.9%;bottom:1.8%;left:31%;right:45%}.demo-app .demo-hotspot--settings{height:6.9%;bottom:1.8%;left:55%;right:21%}.demo-app .demo-hotspot--add{border-radius:50%;height:6.9%;bottom:1.8%;left:80.5%;right:4.5%}.demo-app .demo-hotspot--screen-action{inset:25% 5% 13%}.demo-app .demo-hotspot--close{border-radius:50%;width:13%;height:7%;top:8.6%;right:5.5%}.demo-app .demo-hotspot--spending,.demo-app .demo-hotspot--income,.demo-app .demo-hotspot--split{height:5.2%;top:17.1%}.demo-app .demo-hotspot--spending{left:4.5%;right:65%}.demo-app .demo-hotspot--income{left:35%;right:35%}.demo-app .demo-hotspot--split{left:65%;right:4.5%}.demo-app .demo-reference-keypad{grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(3,1fr);gap:2.6% 3%;display:grid;inset:60.2% 4.6% 9.5%}.demo-app .demo-reference-keypad button{width:100%;height:100%;position:relative}.demo-app .demo-hotspot--save{height:6.7%;bottom:1.8%;left:36.5%;right:4.7%}.demo-app .demo-reference-amount{z-index:2;color:#fafafa;letter-spacing:-.03em;text-align:center;background:#000;min-height:58px;padding:8px;font-size:28px;font-weight:650;display:block;position:absolute;top:36.5%;left:25%;right:25%}.demo-app [hidden]{display:none!important}@keyframes demo-native-menu-in{0%{opacity:0;transform:scale(.96)translateY(-4px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes demo-wave-flow{0%{opacity:.44;transform:translate(-11px,-3px)scaleY(.94)}to{opacity:.72;transform:translate(11px,4px)scaleY(1.07)}}@keyframes demo-reference-in{0%{opacity:0;transform:scale(.992)}to{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion:reduce){.demo-app *,.demo-app :before,.demo-app :after{transition:none!important;animation:none!important}}
