:root{--ink:#172b26;--muted:#71807b;--line:#e6ece8;--paper:#f6f8f6;--white:#fff;--green:#1e614f;--green-deep:#123e33;--mint:#dcefe7;--lime:#b7de68;--coral:#ff917f;--shadow:0 14px 38px rgba(20,54,43,.08);--radius:18px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:15px 'DM Sans',sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer;border:0}h1,h2,h3,h4,p{margin:0}.brand{display:flex;align-items:center;gap:10px;font:700 20px 'Space Grotesk',sans-serif;letter-spacing:-.5px}.brand-mark{display:grid;place-items:center;width:31px;height:31px;border-radius:10px;background:var(--lime);color:var(--green-deep);font-weight:700}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:10px;padding:11px 17px;font-weight:600;transition:transform .2s,box-shadow .2s,background .2s}.button:hover{transform:translateY(-2px)}.button-primary{background:var(--green);color:white;box-shadow:0 8px 16px rgba(30,97,79,.16)}.button-primary:hover{background:var(--green-deep);box-shadow:0 10px 20px rgba(30,97,79,.22)}.button-ghost{background:transparent;color:var(--green)}.button-soft{background:var(--mint);color:var(--green)}.button-danger{background:#fff0ee;color:#cb5b4d}.button-large{padding:15px 22px}.button-full{width:100%}.eyebrow{display:inline-flex;align-items:center;gap:7px;color:var(--green);font-size:11px;font-weight:700;letter-spacing:1.3px}.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:var(--coral)}.text-link,.muted-link{color:var(--green);font-weight:600}.muted-link{font-size:13px;color:var(--muted);font-weight:500}.landing-page{min-height:100vh;background:#f5f8f3;overflow:hidden}.landing-shell{position:relative;min-height:100vh;max-width:1300px;margin:auto;padding:32px 7vw}.landing-nav{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:2}.nav-actions{display:flex;align-items:center;gap:8px}.landing-hero{position:relative;z-index:1;width:58%;padding:18vh 0 0}.landing-hero h1{font:600 clamp(3.5rem,7vw,6.7rem)/.96 'Space Grotesk',sans-serif;letter-spacing:-5px;margin:24px 0;color:var(--green-deep)}.landing-hero h1 em,.auth-aside h1 em{font-style:normal;color:#7ba64b}.landing-hero p{max-width:490px;color:var(--muted);font-size:18px;line-height:1.6}.hero-actions{display:flex;align-items:center;gap:26px;margin-top:35px}.trust-row{display:flex;gap:12px;color:#91a19b;font-size:12px;margin-top:65px}.landing-preview{position:absolute;right:7vw;top:24%;width:min(400px,34vw);padding:26px;background:var(--green-deep);border-radius:26px;color:#fff;box-shadow:20px 35px 70px rgba(18,62,51,.2);transform:rotate(4deg);animation:float 7s ease-in-out infinite}.preview-top,.preview-footer{display:flex;justify-content:space-between;align-items:center}.status-pill{font-size:11px;background:rgba(255,255,255,.1);padding:7px 10px;border-radius:20px;color:#d7e9df}.status-pill span{display:inline-block;width:6px;height:6px;background:var(--lime);border-radius:50%;margin-right:5px}.preview-dots{letter-spacing:2px;color:#96b3a8}.preview-balance{padding:54px 0 20px}.preview-balance span,.preview-footer span{display:block;color:#9ab3a9;font-size:12px}.preview-balance strong{display:block;font:600 37px 'Space Grotesk';margin:8px 0}.preview-balance small{color:var(--lime)}.preview-chart{height:130px;display:flex;align-items:end;gap:8px;border-bottom:1px solid rgba(255,255,255,.16);padding:0 2px}.preview-chart span{flex:1;background:linear-gradient(180deg,var(--lime),#638f5b);border-radius:4px 4px 0 0;opacity:.8}.preview-footer{padding-top:18px}.preview-footer b{color:#d9efe3;font-size:13px}.landing-orbit{position:absolute;border:1px solid rgba(116,161,112,.24);border-radius:50%;pointer-events:none}.orbit-one{width:620px;height:620px;right:-240px;top:-130px}.orbit-two{width:920px;height:920px;right:-390px;top:-280px}.auth-page{min-height:100vh;background:var(--paper)}.auth-layout{display:grid;grid-template-columns:46% 54%;min-height:100vh}.auth-aside{position:relative;padding:42px 9%;background:var(--green-deep);color:white;overflow:hidden}.auth-aside:after{content:'';position:absolute;width:600px;height:600px;border:1px solid rgba(183,222,104,.22);border-radius:50%;right:-290px;bottom:-190px;box-shadow:0 0 0 90px rgba(183,222,104,.035),0 0 0 180px rgba(183,222,104,.025)}.auth-aside .brand{position:relative;z-index:1}.auth-aside .brand-mark{background:var(--lime)}.auth-aside-copy{position:relative;z-index:1;padding-top:18vh;max-width:430px}.auth-aside-copy .eyebrow{color:#c9e8bd}.auth-aside h1{font:600 clamp(3rem,5vw,5.3rem)/1 'Space Grotesk';letter-spacing:-3px;margin:22px 0}.auth-aside p{color:#a8c3b7;font-size:17px;line-height:1.6}.auth-quote{position:absolute;bottom:45px;color:#dcebe4;font-size:14px;z-index:1}.auth-quote small{display:block;color:#8ca79c;margin-top:10px}.auth-card-wrap{display:grid;place-items:center;padding:28px}.auth-card{width:min(100%,440px)}.mobile-brand{display:none}.form-heading{margin-bottom:18px}.form-heading h2{font:600 34px 'Space Grotesk';letter-spacing:-1.5px;margin:9px 0}.form-heading p{color:var(--muted)}.auth-card label{display:block;color:#51635d;font-size:13px;font-weight:600;margin-bottom:11px}.auth-card input,.field-control{display:block;width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:11px 14px;margin-top:6px;color:var(--ink);outline:none;transition:border .2s,box-shadow .2s}.auth-card input:focus,.field-control:focus{border-color:#8cb79b;box-shadow:0 0 0 4px rgba(140,183,155,.13)}.input-with-action{position:relative}.input-with-action input{padding-right:45px}.input-action{position:absolute;right:4px;top:11px;color:var(--muted);background:transparent;padding:8px}.form-row{display:flex;justify-content:space-between;align-items:center;margin:2px 0 14px}.checkbox-label{display:flex!important;align-items:center;gap:8px;color:var(--muted)!important;font-weight:500!important;margin:0!important}.checkbox-label input{width:16px!important;height:16px;margin:0!important;accent-color:var(--green)}.auth-switch{text-align:center;color:var(--muted);margin:14px 0 0;font-size:13px}.auth-switch a{color:var(--green);font-weight:700}.demo-note{display:block;color:#a0ada8;text-align:center;font-size:11px;line-height:1.5;margin-top:22px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.terms-label{margin:2px 0 14px!important}.terms-label a{color:var(--green);text-decoration:underline}.app-page{background:var(--paper)}.app-shell{display:flex;min-height:100vh}.sidebar{position:fixed;z-index:5;left:0;top:0;bottom:0;width:258px;background:#fff;border-right:1px solid var(--line);padding:28px 16px;display:flex;flex-direction:column}.sidebar .brand{padding:0 13px 28px}.sidebar-nav{overflow-y:auto}.nav-label{font-size:10px;color:#9ba9a4;letter-spacing:1.2px;font-weight:700;padding:19px 13px 8px}.nav-link{display:flex;align-items:center;gap:11px;padding:10px 13px;color:#73817c;border-radius:9px;font-size:13px;margin:2px 0;transition:.2s}.nav-link:hover{background:#f1f6f2;color:var(--green)}.nav-link.active{background:#e9f4ee;color:var(--green);font-weight:700}.nav-link i{width:17px;height:17px}.sidebar-user{margin-top:auto;border-top:1px solid var(--line);padding:18px 8px 0;display:flex;align-items:center;gap:10px}.avatar{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;background:#dbeee3;color:var(--green);font-weight:700;font-size:13px;flex:none}.sidebar-user strong{display:block;font-size:12px}.sidebar-user small{display:block;color:#9ba9a4;font-size:10px;margin-top:3px;max-width:125px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.logout-button{margin-left:auto;color:#aab5b0;background:transparent}.main-content{margin-left:258px;width:calc(100% - 258px);padding:28px 4.5vw 60px}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:38px}.breadcrumbs{color:#a1ada8;font-size:12px}.topbar-actions{display:flex;align-items:center;gap:16px}.icon-button{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:#fff;color:var(--muted);border:1px solid var(--line);position:relative}.notification-badge{position:absolute;right:-2px;top:-3px;background:var(--coral);color:white;border:2px solid var(--paper);width:14px;height:14px;display:grid;place-items:center;border-radius:50%;font-size:8px}.profile-summary{display:flex;align-items:center;gap:9px}.profile-summary strong{display:block;font-size:12px}.profile-summary small{display:block;color:var(--muted);font-size:10px;margin-top:2px}.mobile-menu-trigger{display:none}.page-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:25px}.page-heading h1{font:600 31px 'Space Grotesk';letter-spacing:-1.3px}.page-heading p{color:var(--muted);margin-top:8px}.balance-banner{display:flex;justify-content:space-between;align-items:center;background:var(--green-deep);border-radius:var(--radius);padding:27px 32px;color:white;margin-bottom:23px;overflow:hidden;position:relative}.balance-banner:after{content:'';position:absolute;width:280px;height:280px;border:1px solid rgba(183,222,104,.2);border-radius:50%;right:-100px;top:-130px;box-shadow:0 0 0 40px rgba(183,222,104,.03)}.balance-banner>div{position:relative;z-index:1}.balance-label{font-size:12px;color:#a3bfb1}.balance-value{font:600 33px 'Space Grotesk';display:block;margin:8px 0}.balance-meta{font-size:12px;color:#a8d188}.banner-actions{display:flex;gap:9px;position:relative;z-index:1}.banner-actions .button-soft{background:var(--lime);color:var(--green-deep)}.banner-actions .button-ghost{color:#d7e7df;border:1px solid rgba(255,255,255,.15)}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:30px}.summary-card,.content-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px}.summary-card{position:relative}.summary-icon{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:#edf6ef;color:var(--green);margin-bottom:22px}.summary-card:nth-child(2) .summary-icon{background:#fff3df;color:#b9822e}.summary-card:nth-child(3) .summary-icon{background:#fff0ee;color:#d57366}.summary-card:nth-child(4) .summary-icon{background:#eef0fb;color:#6a70b0}.summary-card h3{font-size:12px;color:var(--muted);font-weight:500}.summary-card strong{display:block;font:600 22px 'Space Grotesk';margin:7px 0}.summary-card small{color:#96a49e;font-size:11px}.dashboard-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:18px}.card-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:21px}.card-heading h2{font:600 17px 'Space Grotesk'}.card-heading a{font-size:12px;color:var(--green);font-weight:700}.timeline{display:flex;gap:0;overflow-x:auto;padding-bottom:5px}.timeline-item{min-width:112px;position:relative;padding-top:16px}.timeline-item:before{content:'';height:1px;background:#dfe8e2;position:absolute;left:0;right:0;top:5px}.timeline-item:first-child:before{left:50%}.timeline-item:last-child:before{right:50%}.timeline-dot{width:11px;height:11px;border-radius:50%;background:var(--lime);border:3px solid #eef7e9;position:absolute;top:0;left:calc(50% - 5px);z-index:1}.timeline-item time,.timeline-item strong{display:block;text-align:center}.timeline-item time{font-size:11px;color:var(--muted)}.timeline-item strong{font-size:13px;margin-top:8px}.mini-list{display:grid;gap:14px}.mini-row{display:flex;align-items:center;gap:11px}.mini-row .row-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:#edf6ef;color:var(--green)}.mini-row div:nth-child(2){flex:1}.mini-row strong{display:block;font-size:12px}.mini-row small{color:var(--muted);font-size:11px}.mini-row>b{font-size:12px}.page-columns{display:grid;grid-template-columns:1.4fr 1fr;gap:18px}.stack{display:grid;gap:14px}.data-list{display:grid;gap:10px}.data-row{display:flex;align-items:center;gap:13px;padding:13px 0;border-bottom:1px solid #edf1ee}.data-row:last-child{border-bottom:0}.data-row .grow{flex:1}.data-row strong{font-size:13px;display:block}.data-row small{font-size:11px;color:var(--muted);display:block;margin-top:4px}.amount-positive{color:#4f9866}.amount-negative{color:#ce6b5d}.status{display:inline-flex;padding:5px 9px;border-radius:20px;font-size:10px;font-weight:700}.status-active{background:#e8f5e9;color:#4f9866}.status-done{background:#edf2f0;color:#77847f}.status-pending{background:#fff4df;color:#b78435}.package-list{display:grid;gap:14px}.package-card{display:grid;grid-template-columns:150px 1fr auto;gap:20px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px}.car-art{height:108px;border-radius:13px;background:linear-gradient(145deg,#e9f3ed,#c5ddd0);display:grid;place-items:center;font-size:42px}.package-card h3{font:600 18px 'Space Grotesk';margin-bottom:9px}.package-card p{font-size:12px;color:var(--muted);margin-bottom:14px}.package-metrics{display:flex;gap:27px}.package-metrics span{display:block;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}.package-metrics b{display:block;font-size:13px;margin-top:4px}.package-card .button{white-space:nowrap}.filter-tabs{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:19px}.filter-tabs button{padding:8px 13px;background:#fff;border:1px solid var(--line);border-radius:8px;color:var(--muted);font-size:12px}.filter-tabs button.active{background:var(--green);color:#fff;border-color:var(--green)}.referral-code{display:flex;align-items:center;justify-content:space-between;background:#edf6ef;border:1px dashed #9bc6a8;padding:17px;border-radius:12px;margin:16px 0}.referral-code strong{font:600 22px 'Space Grotesk';letter-spacing:1px}.referral-actions{display:flex;gap:8px}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.metric-box{padding:15px;background:#f7faf7;border-radius:11px}.metric-box small{display:block;color:var(--muted);font-size:11px}.metric-box strong{display:block;font:600 21px 'Space Grotesk';margin-top:6px}.switch-row{display:flex;align-items:center;gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}.switch-row:last-child{border-bottom:0}.switch-icon{display:grid;place-items:center;width:35px;height:35px;border-radius:10px;background:#edf6ef;color:var(--green)}.switch-copy{flex:1}.switch-copy strong{display:block;font-size:13px}.switch-copy p{color:var(--muted);font-size:11px;margin-top:4px}.switch{width:39px;height:22px;background:#d8e0dc;border-radius:20px;padding:3px;transition:.2s}.switch:after{content:'';display:block;width:16px;height:16px;background:#fff;border-radius:50%;transition:.2s}.switch.on{background:var(--green)}.switch.on:after{transform:translateX(17px)}.modal-backdrop,.drawer-backdrop{position:fixed;inset:0;background:rgba(9,37,29,.46);z-index:20;display:grid;place-items:center;opacity:0;pointer-events:none;transition:.25s}.modal-backdrop.open,.drawer-backdrop.open{opacity:1;pointer-events:auto}.modal{width:min(510px,calc(100% - 28px));background:#fff;border-radius:20px;padding:25px;transform:translateY(15px);transition:.25s;max-height:90vh;overflow:auto}.modal-backdrop.open .modal{transform:translateY(0)}.modal-header{display:flex;justify-content:space-between;align-items:start;margin-bottom:20px}.modal h2{font:600 22px 'Space Grotesk'}.modal-close{background:#f3f6f3;color:var(--muted);border-radius:8px;width:30px;height:30px}.modal-actions{display:flex;justify-content:end;gap:9px;margin-top:23px}.modal-summary{display:grid;grid-template-columns:100px 1fr;gap:16px;align-items:center;background:#f7faf7;padding:13px;border-radius:12px}.modal-summary .car-art{height:80px}.drawer{position:absolute;right:0;top:0;bottom:0;width:min(350px,88vw);background:#fff;padding:24px;transform:translateX(100%);transition:.3s;overflow:auto}.drawer-backdrop.open .drawer{transform:translateX(0)}.drawer-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.drawer h3{font:600 20px 'Space Grotesk'}.drawer-section{font-size:10px;font-weight:700;color:#a1ada8;letter-spacing:1px;margin:20px 0 8px}.drawer-link{display:block;padding:11px 0;border-bottom:1px solid #f0f3f0;font-size:13px}#toast-root{position:fixed;top:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:10px;align-items:flex-end;pointer-events:none}.toast{pointer-events:auto;background:var(--green-deep);color:#fff;border-radius:12px;padding:12px 16px;box-shadow:0 12px 35px rgba(0,0,0,0.25);font-size:13px;font-weight:500;display:flex;align-items:center;gap:10px;min-width:280px;max-width:420px;animation:toast-in .35s cubic-bezier(0.16,1,0.3,1) both;border:1px solid rgba(255,255,255,0.15)}.toast.closing{animation:toast-out .35s ease forwards}.toast.error{background:#8a2820;border-color:rgba(255,100,100,0.3)}.toast-icon{display:grid;place-items:center;width:20px;height:20px;flex-shrink:0}.toast-content{flex:1;line-height:1.4}.toast-close{background:transparent;border:0;color:rgba(255,255,255,0.7);cursor:pointer;font-size:18px;padding:2px 6px;margin-left:6px;line-height:1;border-radius:6px;transition:.2s}.toast-close:hover{background:rgba(255,255,255,0.2);color:#fff}.success-dialog{text-align:center;padding:10px 6px}.success-icon-wrap{width:70px;height:70px;border-radius:50%;background:#eaf8ed;color:var(--green);display:grid;place-items:center;margin:0 auto 18px;box-shadow:0 10px 25px rgba(34,197,94,0.2);animation:collect-pop .5s ease}.success-icon-wrap i{width:36px;height:36px}.success-dialog h2{font:600 24px 'Space Grotesk';margin-bottom:10px;color:var(--green-deep)}.success-desc{color:var(--muted);font-size:14px;line-height:1.6;margin-bottom:20px}.collection-timer-badge{display:inline-flex;align-items:center;gap:8px;background:#f3f7f4;border:1px solid #dce8df;padding:10px 16px;border-radius:12px;font-size:13px;color:var(--green);margin-bottom:24px;font-weight:600}.collection-timer-badge i{width:18px;height:18px}@keyframes toast-out{from{opacity:1;transform:translateX(0) scale(1)}to{opacity:0;transform:translateX(60px) scale(0.9)}}.bottom-nav{display:none}.empty-state{text-align:center;padding:35px;color:var(--muted)}.empty-state strong{display:block;color:var(--ink);margin:10px 0 5px}.form-note{color:var(--muted);font-size:12px;line-height:1.5}.qr-box{display:grid;place-items:center;width:170px;height:170px;margin:18px auto;background:repeating-conic-gradient(#193c32 0 25%,#fff 0 50%) 50%/17px 17px;border:9px solid white;box-shadow:0 0 0 1px #dce4df}.copy-field{display:flex;background:#f5f8f5;border:1px solid var(--line);border-radius:9px;overflow:hidden;margin-top:8px}.copy-field input{border:0;background:transparent;flex:1;padding:11px;font-size:12px}.copy-field button{background:transparent;color:var(--green);padding:0 12px;font-weight:700;font-size:12px}.profile-header{display:flex;align-items:center;gap:18px;padding-bottom:21px;border-bottom:1px solid var(--line);margin-bottom:4px}.profile-avatar{width:70px;height:70px;border-radius:20px;display:grid;place-items:center;background:#dbeee3;color:var(--green);font:700 25px 'Space Grotesk'}.profile-header h2{font:600 22px 'Space Grotesk'}.profile-header p{color:var(--muted);font-size:12px;margin-top:4px}@keyframes float{50%{transform:rotate(1deg) translateY(-12px)}}@keyframes toast-in{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:none}}@media(max-width:1000px){.landing-hero{width:60%}.landing-preview{right:4vw;width:35vw}.summary-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid,.page-columns{grid-template-columns:1fr}.package-card{grid-template-columns:120px 1fr auto}.main-content{padding-left:3vw;padding-right:3vw}}@media(max-width:740px){.landing-shell{padding:23px 22px}.landing-hero{width:100%;padding-top:15vh}.landing-hero h1{font-size:3.8rem;letter-spacing:-3px}.landing-hero p{font-size:16px}.landing-preview{position:relative;right:auto;top:auto;width:100%;margin-top:65px;transform:rotate(2deg)}.trust-row{margin-top:35px;flex-wrap:wrap}.orbit-one,.orbit-two{right:-400px}.auth-layout{display:block}.auth-aside{display:none}.auth-card-wrap{min-height:100vh;padding:20px 18px;align-items:start}.mobile-brand{display:flex;margin-bottom:26px}.form-heading h2{font-size:30px}.form-grid{display:block}.app-shell{display:block}.sidebar{display:none}.main-content{margin-left:0;width:100%;padding:20px 16px 95px}.topbar{margin-bottom:28px}.breadcrumbs{display:none}.topbar-actions{gap:9px}.profile-summary>div{display:none}.mobile-menu-trigger{display:grid}.page-heading{align-items:start;gap:15px;flex-direction:column}.page-heading h1{font-size:28px}.balance-banner{display:block;padding:24px}.banner-actions{margin-top:21px}.summary-grid{gap:9px}.summary-card{padding:15px}.summary-icon{margin-bottom:17px}.summary-card strong{font-size:19px}.summary-card small{font-size:10px}.bottom-nav{position:fixed;display:flex;z-index:10;bottom:0;left:0;right:0;height:70px;background:rgba(255,255,255,.95);border-top:1px solid var(--line);justify-content:space-around;align-items:end;padding-bottom:10px}.bottom-nav a{display:grid;place-items:center;gap:3px;color:#87958f;font-size:9px;min-width:54px}.bottom-nav a.active{color:var(--green);font-weight:700}.bottom-nav i{width:18px;height:18px}.bottom-pix{position:relative;top:-18px;background:var(--green);color:white!important;border-radius:50%;width:52px;height:52px;box-shadow:0 7px 17px rgba(30,97,79,.3);animation:pulse 2.4s infinite}.bottom-pix i{width:20px;height:20px}.bottom-pix small{position:absolute;top:56px;color:var(--green);font-size:9px;font-weight:700}.package-card{grid-template-columns:84px 1fr;gap:13px;padding:11px}.car-art{height:84px;font-size:32px}.package-card .button{grid-column:2;justify-self:start}.package-card h3{font-size:16px}.package-metrics{gap:14px}.package-metrics b{font-size:12px}.metric-grid{grid-template-columns:1fr 1fr}.referral-code{align-items:start;gap:10px;flex-direction:column}.data-row{gap:8px}.modal{padding:20px}.toast{left:16px;right:16px;bottom:84px;text-align:center}.profile-summary{display:none}}@keyframes pulse{50%{transform:translateY(-18px) scale(1.05)}}.button.is-loading{pointer-events:none}.btn-spinner{width:15px;height:15px;border-radius:50%;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;animation:button-spin .6s linear infinite;flex-shrink:0}.button-ghost .btn-spinner,.button-soft .btn-spinner{border-color:rgba(30,97,79,.25);border-top-color:var(--green)}@keyframes button-spin{to{transform:rotate(360deg)}}.page-loading{display:flex;align-items:center;justify-content:center;gap:10px;min-height:220px;color:var(--muted);font-size:13px}.page-spinner{width:22px;height:22px;border-radius:50%;border:3px solid var(--mint);border-top-color:var(--green);animation:button-spin .7s linear infinite;flex-shrink:0}.timeline-item.current .timeline-dot{background:var(--green);box-shadow:0 0 0 0 rgba(30,97,79,.4);animation:timeline-pulse 1.6s ease-in-out infinite}@keyframes timeline-pulse{0%{box-shadow:0 0 0 0 rgba(30,97,79,.4)}70%{box-shadow:0 0 0 8px rgba(30,97,79,0)}100%{box-shadow:0 0 0 0 rgba(30,97,79,0)}}.timeline-item.collected .timeline-dot{background:var(--lime);animation:collect-pop .45s ease}@keyframes collect-pop{0%{transform:scale(.5)}55%{transform:scale(1.3)}100%{transform:scale(1)}}.timeline-item.collected strong{display:inline-flex;align-items:center;gap:4px}.timeline-item.collected strong i{width:13px;height:13px}.timeline-collect{padding:6px 10px;font-size:12px;margin-top:2px}.investment-collect{margin-top:14px;width:100%;justify-content:center}.investment-collect.collected{display:flex;align-items:center;gap:7px;background:var(--mint);color:var(--green);border-radius:10px;padding:10px;font-size:13px;font-weight:600;animation:collect-pop .45s ease}.investment-collect.collected i{width:16px;height:16px}

/* =========================================
   NOTIFICATION LIST STYLES
   ========================================= */
.notif-list { display: grid; gap: 0; }
.notif-item {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  transition: background 0.15s;
  position: relative;
}
.notif-item:last-child { border-bottom: 0; }
.notif-item:hover { background: var(--paper); margin: 0 -20px; padding: 14px 20px; }
.notif-icon {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: var(--mint);
  color: var(--green);
  flex: none;
}
.notif-icon i { width: 18px; height: 18px; }
.notif-icon-deposit { background: #e8f5e9; color: #4f9866; }
.notif-icon-withdraw,.notif-icon-saque { background: #fff0ee; color: #d57366; }
.notif-icon-investment,.notif-icon-investimento { background: #eef0fb; color: #6a70b0; }
.notif-icon-daily_return,.notif-icon-rendimento,.notif-icon-coleta { background: #fff8e1; color: #b9822e; }
.notif-icon-referral,.notif-icon-indicacao { background: #e8f5e9; color: #4f9866; }
.notif-icon-bonus { background: #fff3df; color: #b9822e; }
.notif-icon-admin,.notif-icon-alert { background: #fff0ee; color: #ce6b5d; }
.notif-body { flex: 1; min-width: 0; }
.notif-body strong { display: block; font-size: 13px; margin-bottom: 3px; }
.notif-item.notif-unread .notif-body strong { font-weight: 700; }
.notif-body p { color: var(--muted); font-size: 12px; line-height: 1.4; margin: 0 0 4px; }
.notif-body time { font-size: 11px; color: var(--muted); }
.notif-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--coral); flex: none; align-self: center; }
.notif-count-badge {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--coral); color: white;
  font-size: 11px; font-weight: 700;
  border-radius: 10px; padding: 2px 7px;
  margin-left: 8px; vertical-align: middle;
}

/* =========================================
   RECEIVABLES GRID (30 days)
   ========================================= */
.receivables-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 10px; margin-top: 18px; }
.day-card {
  background: #fff; border: 1px solid var(--line);
  border-radius: 13px; padding: 12px 8px;
  text-align: center; transition: transform .2s, box-shadow .2s;
  position: relative; overflow: hidden;
}
.day-card:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,.08); }
.day-card .day-label { font-size: 10px; color: var(--muted); display: block; }
.day-card .day-value { font: 600 14px 'Space Grotesk'; display: block; margin: 5px 0; }
.day-card.day-collected { background: var(--mint); border-color: #9bc6a8; }
.day-card.day-collected .day-value { color: var(--green); }
.day-card.day-current { background: var(--green); color: white; border-color: var(--green); animation: day-pulse 2s infinite; }
.day-card.day-current .day-label,.day-card.day-current .day-value { color: white; }
.day-card.day-empty { opacity: .4; }
.day-card .day-status { font-size: 9px; color: var(--muted); display: block; margin-top: 3px; }
.day-card.day-collected .day-status { color: var(--green); }
.day-card.day-current .day-status { color: rgba(255,255,255,.8); }
@keyframes day-pulse { 0%,100%{box-shadow:0 0 0 0 rgba(30,97,79,.4)} 50%{box-shadow:0 0 0 6px rgba(30,97,79,0)} }
@media(max-width:600px){ .receivables-grid{grid-template-columns:repeat(4,1fr);gap:7px} .day-card{padding:9px 5px} .day-card .day-value{font-size:12px} }
@media(max-width:380px){ .receivables-grid{grid-template-columns:repeat(3,1fr)} }

/* =========================================
   THEME TOGGLE
   ========================================= */
.theme-toggle { transition: color .2s, background .2s; }
.theme-toggle[data-theme="light"] { display: none; }
body.dark-mode .theme-toggle[data-theme="light"] { display: grid; }
body.dark-mode .theme-toggle[data-theme="dark"] { display: none; }

/* =========================================
   FIELD OPTIONAL LABEL
   ========================================= */
.field-optional { font-size: 11px; color: var(--muted); font-weight: 400; margin-left: 4px; }

/* =========================================
   DEPOSIT / WITHDRAW LOADING STATES
   ========================================= */
.pix-generating { text-align: center; padding: 30px 20px; }
.pix-generating-icon { width: 64px; height: 64px; border-radius: 50%; background: var(--mint); display: grid; place-items: center; margin: 0 auto 16px; }
.pix-generating-icon i { width: 28px; height: 28px; color: var(--green); animation: button-spin 1s linear infinite; }
.withdraw-steps { display: flex; flex-direction: column; gap: 10px; padding: 10px 0; }
.withdraw-step { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 10px; background: #f7faf7; }
.withdraw-step.active { background: var(--mint); }
.withdraw-step.done { background: #eaf5ec; }
.withdraw-step-icon { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: #fff; flex: none; color: var(--muted); }
.withdraw-step.active .withdraw-step-icon { background: var(--green); color: white; }
.withdraw-step.done .withdraw-step-icon { background: var(--lime); color: var(--green-deep); }
.withdraw-step-label { font-size: 13px; font-weight: 500; }

/* =========================================
   REFERRAL IMPROVEMENTS
   ========================================= */
.referral-link-box { background: #f5f8f5; border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; display: flex; align-items: center; gap: 10px; margin: 10px 0; }
.referral-link-box span { flex: 1; font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.referral-link-box button { flex: none; font-size: 12px; color: var(--green); font-weight: 700; background: transparent; }
.referral-share-buttons { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.how-it-works-steps { display: grid; gap: 12px; margin-top: 10px; }
.hiw-step { display: flex; align-items: flex-start; gap: 12px; }
.hiw-step-num { width: 28px; height: 28px; border-radius: 50%; background: var(--mint); color: var(--green); display: grid; place-items: center; font-weight: 700; font-size: 12px; flex: none; }
.hiw-step-body strong { display: block; font-size: 13px; }
.hiw-step-body p { color: var(--muted); font-size: 12px; margin: 2px 0 0; }
