:root{--ink:#172320;--muted:#78817e;--line:#e9ece9;--green:#0c6b50;--navy:#193a35}*{box-sizing:border-box}body{margin:0;background:#f5f6f4;color:var(--ink);font:14px 'DM Sans',sans-serif}.app-shell{min-height:100vh;display:flex}.rail{width:225px;background:#fff;border-right:1px solid var(--line);padding:30px 18px;display:flex;flex-direction:column;flex-shrink:0}.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font:800 19px Manrope;margin:0 8px 58px}.brand-mark{display:grid;place-items:center;width:30px;height:30px;background:var(--green);color:white;border-radius:10px;font:bold 15px Manrope}.rail-label,.menu-caption,.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.1px;color:#9ca5a0}.rail-label{padding:0 12px 14px}.rail-item{display:flex;align-items:center;gap:13px;border:0;background:none;color:#737d78;text-align:left;padding:12px 13px;margin:2px 0;border-radius:10px;cursor:pointer;font:600 13px 'DM Sans'}.rail-item.active{background:#eaf5ef;color:var(--green)}.rail-item span{font-size:18px}.rail-bottom{margin-top:auto;border-top:1px solid var(--line);padding:20px 2px 0;display:flex;align-items:center;gap:10px}.avatar,.top-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#f2d9c7;color:#70503b;font-weight:700;font-size:11px}.rail-bottom b{font-size:12px;display:block}.rail-bottom small{font-size:10px;color:var(--muted);display:block;margin-top:3px}.dots{margin-left:auto;color:#aab1ad}.main-area{min-width:0;flex:1}.topbar{height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 46px}.breadcrumb{display:flex;gap:12px;color:#9aa39e;font-size:12px}.breadcrumb i{font-style:normal}.breadcrumb b{color:#43504a}.top-actions{display:flex;align-items:center;gap:22px}.icon-button{position:relative;border:0;background:transparent;color:#68736e;font-size:21px;cursor:pointer}.notification em{position:absolute;width:6px;height:6px;background:#e78d67;border:1px solid white;border-radius:50%;right:3px;top:3px}.top-avatar{background:#dcebe4;color:#27644d}.content-wrap{max-width:1440px;margin:auto;padding:38px 46px 70px}.page-heading{display:flex;justify-content:space-between;align-items:end;margin:0 0 27px}.eyebrow{margin-bottom:10px;color:#6d9b81}.page-heading h1{font:800 30px Manrope;letter-spacing:-1.25px;margin:0}.page-heading p{color:var(--muted);margin:7px 0 0;font-size:13px}.heading-actions{display:flex;gap:10px}.button{border:1px solid var(--line);padding:11px 15px;background:#fff;border-radius:9px;font:600 12px 'DM Sans';cursor:pointer;color:#34433c}.button.primary{background:var(--green);color:white;border-color:var(--green)}.layout-grid{display:grid;grid-template-columns:minmax(0,1fr) 218px;gap:26px;align-items:start}.section-menu{background:#fff;border:1px solid var(--line);border-radius:13px;padding:19px 12px;position:sticky;top:22px}.menu-caption{padding:2px 10px 12px}.section-menu nav{display:grid;gap:3px}.menu-link{width:100%;border:0;background:none;display:flex;align-items:center;gap:11px;text-align:left;padding:11px 10px;border-radius:8px;color:#69736e;cursor:pointer;font:500 12px 'DM Sans'}.menu-link.active{background:#edf5f0;color:var(--green);font-weight:700}.help-card{margin:29px 5px 1px;padding:15px 12px;background:#f7f8f5;border:1px solid #edf0eb;border-radius:10px}.help-icon{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:#e4f0e6;color:var(--green);margin-bottom:12px}.help-card b{font:700 12px Manrope}.help-card p{font-size:10px;line-height:1.55;color:var(--muted)}.help-card button,.text-link{color:var(--green);border:0;background:none;font:700 11px 'DM Sans';cursor:pointer}.mobile-brand,.bottom-tabs{display:none}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:17px}.stat-card,.panel,.account-card,.merchant-card{background:#fff;border:1px solid var(--line);border-radius:12px}.stat-card{padding:18px 19px;min-height:119px}.stat-top{display:flex;justify-content:space-between;align-items:center;color:#7d8882;font-size:11px}.stat-icon{width:28px;height:28px;background:#eff6f0;color:var(--green);border-radius:8px;display:grid;place-items:center}.stat-value{font:800 23px Manrope;margin:12px 0 3px}.stat-note{color:#89938e;font-size:10px}.balance-hero{background:var(--navy);color:#fff;border-radius:14px;padding:23px 25px;position:relative;overflow:hidden;margin-bottom:17px}.balance-hero:after{content:'';position:absolute;width:210px;height:210px;border:1px solid #ffffff16;border-radius:50%;right:8%;top:-120px;box-shadow:0 0 0 25px #ffffff08,0 0 0 52px #ffffff05}.balance-hero .stat-top{color:#c3d3cb}.balance-amount{font:800 29px Manrope;margin:11px 0 5px;letter-spacing:-1px}.hero-sub{font-size:11px;color:#bfcec6}.hero-tag{position:absolute;right:25px;bottom:23px;padding:7px 10px;border-radius:20px;background:#ffffff14;font-size:10px;color:#d9eadf}.panel{padding:19px 20px;margin-bottom:16px}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.panel-head h2{font:700 14px Manrope;margin:0}.panel-head p{font-size:10px;color:var(--muted);margin:5px 0 0}.chart-wrap{height:140px;position:relative;border-bottom:1px solid var(--line);background:repeating-linear-gradient(to bottom,transparent 0,transparent 34px,#f0f2ef 35px)}.chart-wrap svg{width:100%;height:100%}.chart-labels{display:flex;justify-content:space-between;color:#a4aca7;font-size:9px;padding-top:10px}.state-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.state-card{display:flex;align-items:center;gap:14px}.donut{width:82px;height:82px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#0d7053 0 67%,#a5d4ae 67% 87%,#f1c08e 87% 100%);position:relative;flex-shrink:0}.donut:after{content:'';position:absolute;background:#fff;width:57px;height:57px;border-radius:50%}.donut b{z-index:1;font:700 16px Manrope}.legend{display:grid;gap:9px;font-size:10px;color:#758078}.legend span{display:flex;align-items:center;gap:7px}.legend i{width:7px;height:7px;border-radius:50%;background:var(--green)}.legend span:nth-child(2) i{background:#a5d4ae}.legend span:nth-child(3) i{background:#f1c08e}.account-list{margin-top:20px}.account-card{padding:17px 18px;margin-bottom:10px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}.account-main{display:flex;align-items:center;gap:13px;min-width:0}.bank-mark{width:40px;height:40px;flex-shrink:0;border-radius:12px;display:grid;place-items:center;font:800 14px Manrope;color:#fff;background:#124f42}.bank-mark.blue{background:#4668a8}.bank-mark.gold{background:#bc8a34}.bank-mark.purple{background:#765a9e}.account-title{font-weight:700;font-size:12px}.account-sub{color:#8e9892;font-size:10px;margin-top:4px}.account-number{color:#6c7971;font-size:10px;letter-spacing:.6px;margin-top:4px}.account-side{display:flex;align-items:center;gap:18px}.account-balance{text-align:right;font:700 13px Manrope}.account-balance small{display:block;color:#929c96;font:400 9px 'DM Sans';margin-top:4px}.more-btn{border:0;background:none;color:#9ba49e;font-size:20px;cursor:pointer}.menu-anchor{position:relative}.card-menu{position:absolute;right:12px;top:40px;background:white;border:1px solid var(--line);box-shadow:0 12px 35px #203d3110;border-radius:9px;padding:5px;width:175px;z-index:5}.card-menu button{display:block;width:100%;border:0;background:white;text-align:left;padding:9px;font:500 11px 'DM Sans';color:#526058;cursor:pointer}.section-title{font:700 14px Manrope;margin:0 0 13px}.row-labels{display:grid;grid-template-columns:1fr auto;padding:0 18px 8px;color:#9aa39e;font-size:9px;text-transform:uppercase}.status-pill{font-size:9px;color:#38825e;background:#e9f5ed;padding:5px 8px;border-radius:20px}.list-row{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-top:1px solid #f0f1ef}.row-left{display:flex;align-items:center;gap:10px}.tiny-icon{width:32px;height:32px;background:#eff5f0;border-radius:9px;display:grid;place-items:center;color:var(--green)}.row-left b{font-size:11px;display:block}.row-left small{color:#909a94;font-size:9px;display:block;margin-top:3px}.row-right{text-align:right;font:700 11px Manrope}.row-right small{display:block;margin-top:4px}.beneficiary{grid-template-columns:1fr auto auto}.delete-btn{border:1px solid #f0dfdc;background:white;color:#bd6358;border-radius:7px;padding:7px 10px;font:600 10px 'DM Sans';cursor:pointer}.merchant-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.merchant-card{padding:16px;text-align:left;cursor:pointer;transition:.15s;min-height:137px}.merchant-card:hover{border-color:#9ccab1;transform:translateY(-2px)}.merchant-logo{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font:800 13px Manrope;background:#e7f2e9;color:#28774f;margin-bottom:15px}.merchant-logo.orange{background:#fff0e4;color:#cd7540}.merchant-logo.blue{background:#e8eef8;color:#476ba5}.merchant-logo.pink{background:#f9eaf0;color:#b5507b}.merchant-card b{display:block;font-size:12px}.merchant-card small{display:block;margin-top:5px;color:#89938d;font-size:10px}.bill-summary{background:#f1f6f1;border-radius:10px;padding:14px;display:flex;justify-content:space-between;align-items:center;margin-top:16px;color:#718077;font-size:11px}.bill-summary b{color:var(--ink);font:700 13px Manrope}.item-row{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-top:1px solid #f0f1ef}.item-info{display:flex;align-items:center;gap:11px}.item-info b{font-size:11px;display:block}.item-info small{font-size:9px;color:#919a95;display:block;margin-top:4px}.qty{display:flex;align-items:center;gap:10px}.qty button{width:25px;height:25px;border:1px solid var(--line);background:white;border-radius:7px;cursor:pointer}.qty b{min-width:13px;text-align:center;font-size:11px}.checkout-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}.pay-option{border:1px solid var(--line);border-radius:9px;padding:14px;display:flex;align-items:center;gap:11px;margin-bottom:9px;cursor:pointer}.pay-option.selected{border-color:#5b9b7a;background:#f6fbf7}.pay-option input{accent-color:var(--green)}.pay-option b{font-size:11px;display:block}.pay-option small{font-size:9px;color:#8e9892;display:block;margin-top:4px}.form-field{margin-top:13px}.form-field label{display:block;font-size:10px;font-weight:700;color:#526058;margin:0 0 6px}.form-field input,.form-field select,.card-fields input{width:100%;border:1px solid var(--line);border-radius:8px;padding:11px 12px;font:11px 'DM Sans';outline:none;background:white}.card-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:9px 0}.card-fields input:first-child{grid-column:1/-1}.full-button{width:100%;border:0;border-radius:9px;background:var(--green);color:white;padding:13px;font:700 12px 'DM Sans';cursor:pointer;margin-top:13px}.summary-line{display:flex;justify-content:space-between;padding:10px 0;color:#7d8981;font-size:11px}.summary-line.total{border-top:1px solid var(--line);margin-top:5px;padding-top:15px;color:var(--ink);font-weight:700}.empty-state{text-align:center;padding:40px 20px;color:#87918b}.empty-state b{display:block;color:var(--ink);margin:10px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:#1d3029;color:white;padding:12px 17px;border-radius:9px;opacity:0;pointer-events:none;transition:.25s;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{border:0;padding:0;border-radius:14px;width:min(430px,calc(100% - 30px));box-shadow:0 20px 80px #10251c40}dialog::backdrop{background:#10251c70;backdrop-filter:blur(3px)}.modal-card{padding:27px;position:relative}.modal-close{position:absolute;right:15px;top:12px;border:0;background:none;font-size:23px;color:#87918b;cursor:pointer}.modal-card h2{font:800 19px Manrope;margin:0 25px 8px 0}.modal-card p{color:#78837c;font-size:12px;line-height:1.5}.form-actions{display:flex;gap:8px;margin-top:18px}.form-actions .button{flex:1}.bill-progress{height:5px;background:#edf0ed;border-radius:5px;margin:14px 0 20px}.bill-progress i{display:block;background:var(--green);height:100%;width:66%;border-radius:5px}
@media(max-width:1000px){.rail{width:195px}.topbar{padding:0 28px}.content-wrap{padding:30px 28px 60px}.layout-grid{grid-template-columns:minmax(0,1fr) 195px;gap:17px}.merchant-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:740px){body{background:#f7f8f6}.rail{display:none}.topbar{height:56px;padding:0 18px}.breadcrumb{font-size:11px}.top-actions{gap:13px}.top-avatar{width:29px;height:29px}.content-wrap{padding:20px 16px 92px}.mobile-brand{display:flex;align-items:center;gap:9px;font:800 17px Manrope;margin-bottom:22px}.mobile-brand .brand-mark{width:27px;height:27px}.mobile-brand .icon-button{margin-left:auto}.page-heading{align-items:flex-start;margin-bottom:18px}.page-heading h1{font-size:25px}.page-heading p{font-size:11px;max-width:230px;line-height:1.5}.eyebrow{font-size:9px}.heading-actions{display:flex;flex-direction:column;gap:6px}.heading-actions .button{padding:8px 9px;font-size:10px;white-space:nowrap}.heading-actions .secondary{display:none}.layout-grid{display:block}.section-menu{display:none}.bottom-tabs{display:flex;position:fixed;z-index:10;bottom:0;left:0;right:0;height:65px;background:#fff;border-top:1px solid var(--line);justify-content:space-around;padding-bottom:env(safe-area-inset-bottom)}.bottom-tabs button{flex:1;border:0;background:white;color:#89938d;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font:500 9px 'DM Sans';cursor:pointer}.bottom-tabs button span{font-size:19px}.bottom-tabs button.selected{color:var(--green);font-weight:700}.stats-grid{grid-template-columns:1fr 1fr;gap:9px}.stats-grid .stat-card:first-child{grid-column:1/-1;min-height:106px}.stat-card{padding:15px;min-height:100px}.stat-value{font-size:20px}.balance-hero{padding:20px}.balance-amount{font-size:26px}.hero-tag{right:18px;bottom:20px;font-size:9px}.panel{padding:16px}.state-grid{grid-template-columns:1fr}.chart-wrap{height:120px}.account-card{padding:14px;gap:8px}.account-main{gap:10px}.bank-mark{width:35px;height:35px}.account-title{font-size:11px}.account-number{font-size:9px}.account-side{gap:6px}.account-balance{font-size:11px}.row-labels{padding:0 13px 8px}.merchant-grid{grid-template-columns:repeat(2,1fr);gap:9px}.merchant-card{min-height:122px;padding:13px}.merchant-logo{width:35px;height:35px;margin-bottom:12px}.checkout-layout{grid-template-columns:1fr}.beneficiary{gap:8px;grid-template-columns:minmax(0,1fr) auto}.topbar .icon-button:first-child{display:none}}
@media(max-width:370px){.content-wrap{padding-left:12px;padding-right:12px}.heading-actions .button{font-size:9px}.page-heading h1{font-size:22px}.account-side{gap:2px}.account-balance{font-size:10px}}
.item-amount{display:block;width:min(190px,48vw);border:1px solid var(--line);border-radius:7px;padding:7px 9px;margin-top:8px;font:10px 'DM Sans'}
.consolidation-row{display:grid;grid-template-columns:22px minmax(0,1fr) minmax(130px,190px);gap:12px;align-items:center;padding:14px 0;border-top:1px solid #f0f1ef;cursor:pointer}.consolidation-check input{accent-color:var(--green);width:16px;height:16px}.consolidation-info b{font-size:11px;display:block}.consolidation-info small,.consolidation-amount small{display:block;color:#909a94;font-size:9px;margin-top:5px}.consolidation-amount input{width:100%;border:1px solid var(--line);border-radius:7px;padding:9px;font:11px 'DM Sans'}.consolidation-amount input:disabled{background:#f6f7f5;color:#aab2ad}.consolidation-note{font-size:10px;color:#929c96;line-height:1.5;margin:12px 0 0}
@media(max-width:740px){.consolidation-row{grid-template-columns:20px minmax(0,1fr);gap:9px}.consolidation-amount{grid-column:2}.consolidation-amount small{margin:0 0 5px}.consolidation-amount input{max-width:230px}}
.app-shell[hidden],.login-screen[hidden]{display:none!important}.login-screen{min-height:100vh;background:#fff;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(400px,.95fr);font-family:'DM Sans',sans-serif}.login-art{min-height:100vh;background:#153e34;color:#fff;padding:34px clamp(32px,6vw,90px) 27px;display:flex;flex-direction:column;position:relative;overflow:hidden}.login-art:before,.login-art:after{content:'';position:absolute;border:1px solid #ffffff10;border-radius:50%;pointer-events:none}.login-art:before{width:620px;height:620px;right:-310px;top:15%}.login-art:after{width:440px;height:440px;right:-220px;top:25%}.login-art .brand{color:white;margin:0;z-index:1}.login-art .brand-mark,.login-mobile-brand .brand-mark{background:#c9ed82;color:#183d34}.login-art-copy{position:relative;z-index:1;margin:auto 0;max-width:570px;padding:55px 0 42px}.login-pill{display:inline-flex;align-items:center;gap:8px;color:#c5e7d0;border:1px solid #ffffff29;background:#ffffff0b;border-radius:30px;padding:8px 12px;font-size:9px;letter-spacing:1px;font-weight:700}.login-pill span{width:6px;height:6px;border-radius:50%;background:#c5ed81}.login-art-copy h1{font:800 clamp(38px,5vw,62px)/1.08 Manrope,sans-serif;letter-spacing:-2.6px;margin:22px 0 15px}.login-art-copy>p{color:#c2d4cb;max-width:380px;font-size:13px;line-height:1.7;margin:0}.login-visual{height:216px;max-width:470px;position:relative;margin-top:44px}.visual-orbit{position:absolute;border:1px solid #ffffff18;border-radius:50%}.orbit-one{width:270px;height:270px;top:-9px;left:84px}.orbit-two{width:340px;height:340px;top:-45px;left:49px}.visual-card{position:absolute;left:6px;top:14px;width:min(380px,90%);height:166px;padding:21px 22px;border-radius:14px;background:linear-gradient(120deg,#ffffff20,#ffffff0a);border:1px solid #ffffff38;box-shadow:0 18px 42px #071e1838;backdrop-filter:blur(12px)}.visual-card>span{font-size:8px;letter-spacing:1px;color:#c0d4c9}.visual-card>b{display:block;font:700 24px Manrope;margin:9px 0 5px}.visual-card>b span{font-size:13px;color:#b3c9be}.visual-card small{font-size:9px;color:#c2d4cb}.visual-bars{height:39px;display:flex;align-items:end;gap:6px;position:absolute;bottom:14px;right:20px}.visual-bars i{width:7px;border-radius:4px 4px 1px 1px;background:#bce78a;opacity:.78}.visual-bars i:nth-child(3n){height:21px}.visual-bars i:nth-child(3n+1){height:32px}.visual-bars i:nth-child(3n+2){height:26px}.float-badge{position:absolute;right:0;bottom:12px;padding:11px 14px;border-radius:10px;background:#c9ed82;color:#244333;font-size:10px;font-weight:700;box-shadow:0 8px 20px #06191230}.login-art-footer{display:flex;justify-content:space-between;color:#a7c0b4;font-size:9px;position:relative;z-index:1}.login-form-side{display:grid;place-items:center;padding:44px 30px}.login-form{width:min(100%,385px)}.login-mobile-brand{display:none}.login-eyebrow{font-size:9px;letter-spacing:1.3px;color:#438364;font-weight:700;margin-bottom:12px}.login-form h2{font:800 26px Manrope;letter-spacing:-.8px;margin:0}.login-intro{color:#89938d;font-size:12px;margin:8px 0 29px}.login-form>label,.password-label label{display:block;color:#45534b;font-size:10px;font-weight:700;margin-bottom:7px}.login-form>input,.password-wrap input{width:100%;height:45px;padding:0 13px;border:1px solid #e5eae6;border-radius:8px;outline:0;font:12px 'DM Sans';color:#24362d;background:#fff}.login-form>input:focus,.password-wrap input:focus{border-color:#5c9e78;box-shadow:0 0 0 3px #e8f3ec}.password-label{display:flex;justify-content:space-between;align-items:center;margin:19px 0 7px}.password-label label{margin:0}.password-label button,.login-signup button{border:0;background:none;padding:0;color:#24704f;font:600 10px 'DM Sans';cursor:pointer}.password-wrap{position:relative}.password-wrap input{padding-right:43px}.password-wrap button{position:absolute;right:11px;top:50%;transform:translateY(-50%);border:0;background:none;color:#87948b;cursor:pointer}.login-submit{width:100%;border:0;background:#0d6b4e;color:#fff;height:46px;border-radius:8px;margin-top:19px;font:700 12px 'DM Sans';cursor:pointer;box-shadow:0 5px 12px #0d6b4e20}.login-submit span{float:right;margin-right:8px;font-size:15px}.login-divider{display:flex;align-items:center;gap:12px;color:#a2aaa5;font-size:9px;margin:22px 0}.login-divider span{height:1px;background:#edf0ed;flex:1}.biometric-button{width:100%;height:43px;border:1px solid #e5eae6;border-radius:8px;background:white;color:#394840;font:600 11px 'DM Sans';cursor:pointer}.biometric-button span{margin-right:8px;color:#347554}.login-signup{text-align:center;color:#89938d;font-size:10px;margin-top:22px}.login-security{text-align:center;color:#a2aaa5;font-size:9px;margin-top:43px}.login-error{font-size:10px;color:#b7554a;min-height:12px;margin-top:7px;line-height:1.4}
@media(max-width:850px){.login-screen{grid-template-columns:1fr}.login-art{display:none}.login-form-side{min-height:100vh;padding:30px 24px}.login-form{max-width:400px}.login-mobile-brand{display:flex;align-items:center;gap:9px;font:800 17px Manrope;letter-spacing:-.5px;margin-bottom:50px}.login-mobile-brand .brand-mark{width:29px;height:29px}.login-security{margin-top:36px}}
@media(max-width:430px){.login-form-side{padding:24px 22px}.login-mobile-brand{margin-bottom:42px}.login-form h2{font-size:24px}.login-security{margin-top:28px}}
.logout-button{border:1px solid #e8ece9;border-radius:8px;padding:8px 10px;background:#fff;color:#56635c;font:600 10px 'DM Sans';cursor:pointer;white-space:nowrap}.logout-button span{color:#829087;margin-left:5px}
