.splash-screen{background:#0f172a;flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;font-family:Montserrat,-apple-system,BlinkMacSystemFont,sans-serif;display:flex;position:fixed;top:0;left:0;overflow:hidden}.splash-bg{z-index:1;width:100%;height:100%;position:absolute;top:0;left:0}.bg-gradient{background:linear-gradient(135deg,#667eea 0%,#764ba2 25%,#f093fb 50%,#f5576c 75%,#4facfe 100%) 0 0/400% 400%;width:100%;height:100%;animation:8s infinite gradientShift}.shape{-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);background:#ffffff1a;border-radius:50%;animation:6s ease-in-out infinite float;position:absolute}.shape-1{width:200px;height:200px;animation-delay:0s;top:10%;left:10%}.shape-2{width:150px;height:150px;animation-delay:2s;top:60%;right:15%}.shape-3{width:100px;height:100px;animation-delay:4s;bottom:20%;left:20%}@keyframes gradientShift{0%,to{background-position:0%}50%{background-position:100%}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.splash-content{z-index:2;opacity:0;flex-direction:column;justify-content:center;align-items:center;height:100%;padding:20px;transition:all 1s cubic-bezier(.25,.46,.45,.94);display:flex;position:relative;transform:translateY(30px)}.splash-content.loaded{opacity:1;transform:translateY(0)}.logo-container{margin-bottom:40px}.logo-wrapper{justify-content:center;align-items:center;display:flex;position:relative}.logo-ring{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff1a;border:2px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:120px;height:120px;animation:2s ease-in-out infinite logoRingPulse;display:flex}.logo-inner{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#fff3,#ffffff1a);border:1px solid #ffffff4d;border-radius:50%;justify-content:center;align-items:center;width:100px;height:100px;display:flex}.app-logo{object-fit:contain;filter:brightness(1.1);width:60px;height:60px;animation:1s ease-out .5s both logoFadeIn}.logo-pulse{background:radial-gradient(circle,#667eea4d 0%,#0000 70%);border-radius:50%;animation:2s ease-in-out infinite logoPulse;position:absolute;inset:-10px}@keyframes logoRingPulse{0%,to{transform:scale(1);box-shadow:0 0 #667eea66}50%{transform:scale(1.05);box-shadow:0 0 0 10px #667eea00}}@keyframes logoFadeIn{0%{opacity:0;transform:scale(.5)rotate(-10deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes logoPulse{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.6;transform:scale(1.1)}}.app-info{text-align:center;margin-bottom:60px}.app-name{background:linear-gradient(45deg,#fff,#e0e7ff);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:8px;font-size:2.5rem;font-weight:700;animation:.8s ease-out .8s both textSlideUp}.app-tagline{color:#ffffffe6;margin-bottom:4px;font-size:1.2rem;font-weight:500;animation:.8s ease-out 1s both textSlideUp}.app-subtitle{color:#ffffffb3;font-size:.9rem;animation:.8s ease-out 1.2s both textSlideUp}@keyframes textSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.loading-section{flex-direction:column;align-items:center;gap:20px;display:flex}.loading-spinner{width:60px;height:60px;position:relative}.spinner-ring{border:3px solid #ffffff1a;border-top-color:#667eea;border-radius:50%;width:100%;height:100%;animation:1.5s linear infinite spin;position:absolute;top:0;left:0}.spinner-ring-secondary{border-top:3px solid #764ba2;animation:1.5s linear .2s infinite reverse spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.progress-container{flex-direction:column;align-items:center;gap:10px;display:flex}.progress-bar{background:#fff3;border-radius:2px;width:200px;height:4px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,#667eea,#764ba2);border-radius:2px;height:100%;transition:width .1s}.loading-text{color:#fffc;font-size:.9rem;font-weight:500}.skip-button{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;cursor:pointer;background:#ffffff1a;border:2px solid #ffffff4d;border-radius:25px;padding:12px 24px;font-size:.9rem;font-weight:600;transition:all .3s;animation:.8s ease-out 1.5s both fadeInUp;position:absolute;bottom:50px;right:30px}.skip-button:hover{background:#fff3;transform:translateY(-2px);box-shadow:0 8px 20px #0003}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (width<=480px){.logo-ring{width:100px;height:100px}.logo-inner{width:80px;height:80px}.app-logo{width:50px;height:50px}.app-name{font-size:2rem}.app-tagline{font-size:1rem}.app-subtitle{font-size:.8rem}.progress-bar{width:150px}.skip-button{padding:10px 20px;font-size:.8rem;bottom:30px;right:20px}}@media (width>=768px){.app-name{font-size:3rem}.app-tagline{font-size:1.4rem}.app-subtitle{font-size:1rem}.logo-ring{width:140px;height:140px}.logo-inner{width:120px;height:120px}.app-logo{width:70px;height:70px}}.login-container{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;font-family:Montserrat,-apple-system,BlinkMacSystemFont,sans-serif;display:flex;position:fixed;top:0;left:0;overflow:hidden}.login-bg{z-index:1;width:100%;height:100%;position:absolute;top:0;left:0}.bg-overlay{background:#0000001a;width:100%;height:100%}.bg-shapes{width:100%;height:100%;position:absolute;top:0;left:0}.bg-shape{-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);background:#ffffff1a;border-radius:50%;animation:8s ease-in-out infinite floatShape;position:absolute}.bg-shape.shape-1{width:300px;height:300px;animation-delay:0s;top:10%;left:10%}.bg-shape.shape-2{width:200px;height:200px;animation-delay:3s;top:60%;right:15%}.bg-shape.shape-3{width:150px;height:150px;animation-delay:6s;bottom:20%;left:20%}@keyframes floatShape{0%,to{opacity:.3;transform:translateY(0)scale(1)}50%{opacity:.6;transform:translateY(-50px)scale(1.1)}}.login-content{z-index:2;flex-direction:column;justify-content:center;align-items:center;width:100%;max-width:400px;min-height:100vh;padding:20px;display:flex;position:relative}.login-header{text-align:center;margin-bottom:40px;animation:.8s ease-out slideDown}.app-icon{margin-bottom:20px}.icon-wrapper{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fff3;border:2px solid #ffffff4d;border-radius:20px;justify-content:center;align-items:center;width:80px;height:80px;margin:0 auto;display:flex;box-shadow:0 8px 32px #0003}.icon-image{object-fit:cover;border-radius:12px;width:50px;height:50px}.app-title{color:#fff;background:linear-gradient(45deg,#fff,#e0e7ff);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:8px;font-size:2rem;font-weight:700}.app-description{color:#fffc;margin:0;font-size:.9rem}@keyframes slideDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.login-form{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff1a;border:1px solid #fff3;border-radius:24px;width:100%;padding:32px 24px;animation:.8s ease-out .3s both formSlideUp;box-shadow:0 20px 60px #0000004d}@keyframes formSlideUp{0%{opacity:0;transform:translateY(50px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.social-section{flex-direction:column;gap:12px;margin-bottom:24px;display:flex}.social-login-btn{cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:12px;padding:14px 20px;font-size:.95rem;font-weight:600;transition:all .3s;display:flex;position:relative;overflow:hidden}.social-login-btn:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.social-login-btn:hover:before{left:100%}.input-wrapper{position:relative}.input-wrapper input{color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:2px solid #fff3;border-radius:12px;outline:none;width:100%;padding:16px 20px;font-size:1rem;transition:all .3s}.input-wrapper input::placeholder{color:#fff9}.input-wrapper input:focus{background:#ffffff26;border-color:#667eea;box-shadow:0 0 20px #667eea4d}.login-footer{text-align:center}.login-footer p{color:#fffc;margin:8px 0;font-size:.9rem}.login-footer a{color:#667eea;font-weight:500;text-decoration:none;transition:color .3s}.login-footer a:hover{color:#764ba2;text-decoration:underline}@media (width<=480px){.login-content{padding:15px}.login-header{margin-bottom:30px}.app-title{font-size:1.8rem}.app-description{font-size:.85rem}.icon-wrapper{width:70px;height:70px}.icon-image{width:40px;height:40px}.login-form{padding:24px 20px}.social-section{gap:10px}.social-login-btn{padding:12px 16px;font-size:.9rem}}@media (width>=768px){.login-container{background:linear-gradient(135deg,#667eea 0%,#764ba2 50%,#f093fb 100%)}.login-content{max-width:450px}.app-title{font-size:2.2rem}.login-form{padding:40px 32px}}.login-container.active .login-content{animation:.8s ease-out contentFadeIn}@keyframes contentFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.main-illustration{border-radius:20px;width:100%;max-width:300px;height:auto;animation:6s ease-in-out infinite float;box-shadow:0 20px 60px #00000080}.floating-elements{pointer-events:none;position:absolute;inset:0}.floating-circle{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #fff3;border-radius:50%;position:absolute}.circle-1{width:60px;height:60px;animation:4s ease-in-out infinite bounce;top:10%;left:10%}.circle-2{width:40px;height:40px;animation:5s ease-in-out infinite reverse bounce;top:60%;right:15%}.circle-3{width:30px;height:30px;animation:6s ease-in-out infinite bounce;bottom:20%;left:20%}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}.illustration-text h1{background:linear-gradient(45deg,#ff6b6b,#4ecdc4,#45b7d1,#96ceb4) 0 0/400% 400%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:10px;font-size:2.5rem;font-weight:700;animation:3s ease-in-out infinite textGradient}@keyframes textGradient{0%,to{background-position:0%}50%{background-position:100%}}.illustration-text p{opacity:.9;margin:0;font-size:1.1rem}.right-panel{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff05;border-left:1px solid #ffffff1a;flex:1;justify-content:center;align-items:center;padding:40px;display:flex}.login-form{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:20px;width:100%;max-width:400px;padding:40px;box-shadow:0 20px 60px #0000004d}.form-header h2{background:linear-gradient(45deg,#667eea,#764ba2);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:8px;font-size:2rem;font-weight:700}.form-header p{color:#ffffffb3;margin-bottom:30px;font-size:1rem}.social-login{flex-direction:column;gap:12px;margin-bottom:30px;display:flex}.social-btn{cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:12px;padding:14px 20px;font-size:1rem;font-weight:500;transition:all .3s;display:flex;position:relative;overflow:hidden}.social-btn:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.social-btn:hover:before{left:100%}.google-btn{color:#fff;background:#ffffff1a;border:1px solid #fff3}.google-btn:hover{background:#fff3;transform:translateY(-2px);box-shadow:0 10px 30px #ffffff1a}.facebook-btn{color:#fff;background:#3b5998cc}.facebook-btn:hover{background:#3b5998;transform:translateY(-2px);box-shadow:0 10px 30px #3b59984d}.social-icon{width:20px;height:20px}.divider{text-align:center;margin:30px 0;position:relative}.divider:before{content:"";background:linear-gradient(90deg,#0000,#ffffff4d,#0000);height:1px;position:absolute;top:50%;left:0;right:0}.divider span{color:#ffffffe6;z-index:1;background:0 0;padding:0 20px;font-size:.9rem;position:relative}.input-group{margin-bottom:25px}.input-group input{color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d;border:2px solid #ffffff1a;border-radius:12px;outline:none;width:100%;padding:16px 20px;font-size:1rem;transition:all .3s}.input-group input::placeholder{color:#ffffff80}.input-group input:focus{background:#ffffff1a;border-color:#667eea;box-shadow:0 0 20px #667eea4d,0 0 40px #667eea1a}.login-btn{color:#fff;cursor:pointer;background:linear-gradient(45deg,#667eea,#764ba2);border:none;border-radius:12px;width:100%;margin-bottom:25px;padding:16px;font-size:1rem;font-weight:600;transition:all .3s;position:relative;overflow:hidden}.login-btn:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.login-btn:hover:before{left:100%}.login-btn:hover{transform:translateY(-2px);box-shadow:0 15px 40px #667eea66}.form-footer{text-align:center}.form-footer p{color:#ffffffb3;margin:8px 0;font-size:.9rem}.form-footer a{color:#667eea;font-weight:500;text-decoration:none;transition:color .3s}.form-footer a:hover{color:#764ba2;text-decoration:underline}@media (width<=768px){.login-container{flex-direction:column}.left-panel{flex:none;height:40vh;min-height:300px}.right-panel{border-top:1px solid #ffffff1a;border-left:none;flex:1;padding:20px}.illustration-wrapper{padding:20px}.illustration-text h1{font-size:2rem}.login-form{padding:30px 20px}.social-login{flex-direction:column}}@media (width<=480px){.illustration-text h1{font-size:1.8rem}.illustration-text p{font-size:1rem}.form-header h2{font-size:1.8rem}.login-form{padding:25px 15px}}.login-container.active .left-panel{animation:.8s ease-out slideInLeft}.login-container.active .right-panel{animation:.8s ease-out slideInRight}@keyframes slideInLeft{0%{opacity:0;transform:translate(-100px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(100px)}to{opacity:1;transform:translate(0)}}.otp-container{justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex;position:relative;overflow:hidden}.otp-container:before{content:"";background:linear-gradient(135deg, var(--color-bg-gradient-start) 0%, var(--color-bg-gradient-end) 100%);z-index:-2;width:100vw;height:100vh;position:fixed;top:0;left:0}.otp-container:after{content:"";z-index:-1;background:radial-gradient(circle at 30% 70%,#ffffff1a 0%,#0000 50%),radial-gradient(circle at 70% 30%,#667eea26 0%,#0000 50%);width:100vw;height:100vh;animation:8s ease-in-out infinite alternate otpFloat;position:fixed;top:0;left:0}@keyframes otpFloat{0%{transform:scale(1)rotate(0)}to{transform:scale(1.05)rotate(1deg)}}.otp-card{border-radius:var(--radius-lg);background:var(--glass-bg);width:100%;max-width:420px;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);text-align:center;color:var(--color-text);box-shadow:var(--shadow-strong);z-index:1;flex-direction:column;align-items:center;padding:40px 30px;animation:.8s ease-out cardSlideUp;display:flex;position:relative}@keyframes cardSlideUp{0%{opacity:0;transform:translateY(50px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.otp-title{font-size:1.6rem;font-weight:var(--font-weight-bold);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:12px}.otp-info{color:var(--color-text-secondary);max-width:280px;margin-bottom:32px;font-size:1rem;line-height:1.5}.otp-box{justify-content:center;gap:12px;margin-bottom:32px;display:flex}.otp-input{text-align:center;width:52px;height:62px;font-size:1.5rem;font-weight:var(--font-weight-semibold);border-radius:var(--radius-md);border:2px solid var(--color-border);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);color:var(--color-text);transition:var(--transition-normal);outline:none}.otp-input:focus{border-color:var(--color-border-focus);box-shadow:var(--shadow-glow);background:#ffffff26;transform:scale(1.08)}.verify-btn{border-radius:var(--radius-pill);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));width:100%;color:var(--color-text);font-size:1rem;font-weight:var(--font-weight-semibold);cursor:pointer;transition:var(--transition-normal);box-shadow:var(--shadow-soft);border:none;margin-bottom:24px;padding:16px 20px;position:relative;overflow:hidden}.verify-btn:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.verify-btn:hover:before{left:100%}.verify-btn:hover{box-shadow:var(--shadow-glow);transform:translateY(-2px)}.verify-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.resend-section{color:var(--color-text-secondary);text-align:center;font-size:.95rem;line-height:1.5}.resend-section span{color:var(--color-text-muted)}.resend-section button{color:var(--color-primary);cursor:pointer;font-size:.95rem;font-weight:var(--font-weight-medium);transition:var(--transition-fast);background:0 0;border:none;margin-left:4px;text-decoration:none}.resend-section button:hover{color:var(--color-secondary);text-decoration:underline}.otp-error{color:#ef4444;text-align:center;margin-top:12px;font-size:.9rem}.otp-success{color:#10b981;text-align:center;margin-top:12px;font-size:.9rem}@media (width<=480px){.otp-container{padding:16px}.otp-card{max-width:100%;padding:32px 24px}.otp-title{font-size:1.4rem}.otp-info{margin-bottom:24px;font-size:.9rem}.otp-box{gap:10px;margin-bottom:24px}.otp-input{width:46px;height:56px;font-size:1.3rem}.verify-btn{padding:14px 18px;font-size:.95rem}}@media (width>=768px){.otp-card{padding:48px 36px}.otp-title{font-size:1.8rem}}.profile-page{background:#000;justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex;position:relative;overflow:hidden}.profile-page:before{content:"";pointer-events:none;background:radial-gradient(circle,#667eea1f 0%,#0000 45%),radial-gradient(circle at 100% 0,#764ba214 0%,#0000 40%);width:220%;height:220%;animation:9s ease-in-out infinite float;position:absolute;top:-30%;left:-30%}.profile-page:after{content:"";pointer-events:none;background:radial-gradient(circle,#f093fb14 0%,#0000 45%);width:180%;height:180%;animation:11s ease-in-out infinite reverse float;position:absolute;bottom:-35%;right:-20%}.profile-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);width:100%;max-width:420px;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--shadow-strong);transition:var(--transition-normal);text-align:center;flex-direction:column;align-items:center;padding:32px 28px;display:flex;position:relative;overflow:hidden}.profile-card:hover{transform:translateY(-4px)}.profile-image{justify-content:center;width:100%;margin-bottom:28px;display:flex}.profile-image img{object-fit:cover;width:130px;height:170px;box-shadow:var(--shadow-soft);transition:var(--transition-normal);border:2px solid #ffffff2e;border-radius:24px}.profile-image img:hover{box-shadow:var(--shadow-strong);transform:scale(1.03)}.profile-content h2{background:linear-gradient(90deg, var(--color-primary) 0%, var(--color-secondary) 100%);-webkit-text-fill-color:transparent;font-size:1.75rem;font-weight:var(--font-weight-semibold);-webkit-background-clip:text;background-clip:text;margin-bottom:10px}.profile-subtitle{color:var(--color-text-secondary);margin-bottom:24px;font-size:.95rem;line-height:1.5}.profile-form{flex-direction:column;gap:15px;width:100%;display:flex}.profile-input-group{text-align:left;flex-direction:column;display:flex}.profile-input-group label{color:#ffffffb3;font-size:.9rem;font-weight:var(--font-weight-medium);margin-bottom:8px}.profile-input-group input,.profile-input-group select{border-radius:var(--radius-md);border:1px solid var(--glass-border);width:100%;color:var(--color-text);transition:var(--transition-normal);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);background:#ffffff14;outline:none;padding:16px 14px;font-size:1rem}.profile-input-group select{color:var(--color-text)}.profile-input-group input::placeholder{color:var(--color-text-muted)}.profile-input-group select option{color:var(--color-text);background:#000000e6}.profile-input-group input:focus,.profile-input-group select:focus{border-color:var(--color-border-focus);box-shadow:var(--shadow-glow);background:#ffffff1f}.profile-btn{border-radius:var(--radius-lg);width:100%;font-weight:var(--font-weight-semibold);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);cursor:pointer;transition:var(--transition-normal);box-shadow:var(--shadow-soft);border:none;padding:16px}.profile-btn:hover{box-shadow:var(--shadow-glow);transform:translateY(-3px)}@media (width<=480px){.profile-page{padding:14px}.profile-card{padding:24px}.profile-image img{width:110px;height:150px}.profile-content h2{font-size:1.45rem}}.profile-page-container{min-height:100vh;color:var(--color-text);font-family:var(--font-main);background:#000;width:100%;max-width:420px;margin:0 auto;padding:20px 20px 100px;position:relative;overflow:hidden}.profile-page-container:before{content:"";pointer-events:none;background:radial-gradient(circle,#667eea14 0%,#0000 50%),radial-gradient(circle at 100% 100%,#764ba214 0%,#0000 50%);width:180%;height:180%;animation:7s ease-in-out infinite float;position:absolute;top:-40%;left:-40%}.profile-page-container:after{content:"";pointer-events:none;background:radial-gradient(circle,#f093fb0f 0%,#0000 50%);width:140%;height:140%;animation:9s ease-in-out infinite reverse float;position:absolute;bottom:-25%;right:-25%}.profile-header{justify-content:space-between;align-items:center;margin-bottom:30px;display:flex}.back-btn,.edit-btn{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);color:var(--color-text);border-radius:var(--radius-md);cursor:pointer;font-size:16px;font-weight:var(--font-weight-medium);transition:var(--transition-normal);box-shadow:var(--shadow-soft);padding:10px 15px}.back-btn:hover,.edit-btn:hover{box-shadow:var(--shadow-soft);background:#fff3;transform:translateY(-1px)}.profile-content{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);transition:var(--transition-normal);padding:20px}.profile-content:hover{box-shadow:var(--shadow-strong);transform:translateY(-2px)}.profile-info{margin-bottom:30px}.info-item{border-bottom:1px solid var(--glass-border);transition:var(--transition-fast);justify-content:space-between;align-items:center;margin-bottom:15px;padding:10px 0;display:flex}.info-item:hover{border-radius:var(--radius-sm);background:#ffffff0d;margin-left:-10px;margin-right:-10px;padding-left:10px;padding-right:10px}.info-item label{font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);flex:0 0 100px}.info-item span{text-align:right;color:var(--color-text);flex:1}.info-item input,.info-item textarea{border:2px solid var(--glass-border);border-radius:var(--radius-sm);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);color:var(--color-text);text-align:right;transition:var(--transition-normal);background:#ffffff1a;outline:none;flex:1;padding:8px 12px}.info-item input:focus,.info-item textarea:focus{border-color:var(--color-border-focus);box-shadow:var(--shadow-glow);background:#ffffff26}.info-item input::placeholder,.info-item textarea::placeholder{color:var(--color-text-muted)}.info-item textarea{resize:vertical;min-height:60px}.save-btn{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);border-radius:var(--radius-lg);cursor:pointer;font-size:16px;font-weight:var(--font-weight-semibold);width:100%;transition:var(--transition-normal);box-shadow:var(--shadow-soft);border:none;margin-bottom:20px;padding:12px 20px}.save-btn:hover{box-shadow:var(--shadow-glow);transform:translateY(-2px)}.refer-box{text-align:center;background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);transition:var(--transition-normal);padding:20px}.refer-box:hover{box-shadow:var(--shadow-strong);transform:translateY(-2px)}.refer-box p{color:var(--color-text-secondary);margin:0 0 10px;font-size:18px}.refer-box h2{letter-spacing:2px;background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;font-size:24px;font-weight:var(--font-weight-bold);-webkit-background-clip:text;background-clip:text;margin:0 0 15px}.copy-btn{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);border-radius:var(--radius-md);cursor:pointer;font-size:16px;font-weight:var(--font-weight-medium);transition:var(--transition-normal);box-shadow:var(--shadow-soft);border:none;padding:10px 15px}body{background:#fff;margin:0;padding:0}.page-container{width:100%;max-width:420px;min-height:100vh;color:var(--color-text);font-family:var(--font-main);box-sizing:border-box;background:#0a0a0a;border:1px solid #00000014;border-radius:30px;margin:40px auto;padding:20px;position:relative;overflow-y:auto;box-shadow:0 20px 60px #00000040}.page-container:after{content:"";pointer-events:none;background:radial-gradient(circle at top,#ffffff0d,#0000 60%);border-radius:30px;position:absolute;inset:0}.page-container:before{display:none}.page-container.with-bottom-nav{padding-bottom:100px}.page-container.centered{justify-content:center;align-items:center;display:flex}@media (width<=480px){.page-container{border-radius:0;max-width:100%;margin:0}}@media (width>=768px){.page-container{max-width:420px}}.page-container:before,.page-container:after,.choice-page:before,.choice-page:after{pointer-events:none}@keyframes slideUp{0%{opacity:0;transform:translate(-50%)translateY(100px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@keyframes popIn{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@media (width<=420px){.bottom-nav-box{width:95%;padding:10px;bottom:15px}.nav-item{gap:3px;padding:6px 10px;font-size:11px}.icon{font-size:18px}}@media (width<=420px){.bottom-nav-box{width:95%;padding:10px;bottom:15px}.nav-item{gap:3px;padding:6px 10px;font-size:11px}.icon{font-size:18px}}.choice-page{color:#fff;background:#000;min-height:100vh;padding:15px;position:relative;overflow:hidden}.choice-page:before{content:"";background:radial-gradient(circle,#667eea1f,#0000 50%);width:220%;height:220%;animation:10s ease-in-out infinite float;position:absolute;top:-60%;left:-60%}.choice-page:after{content:"";background:radial-gradient(circle,#f093fb1a,#0000 50%);width:180%;height:180%;animation:12s ease-in-out infinite reverse float;position:absolute;bottom:-40%;right:-40%}.hero{justify-content:space-between;align-items:center;margin-top:20px;display:flex}.hero-text h1{color:#94a3b8;font-size:26px}.hero-text h2{background:linear-gradient(45deg,#fff,#60a5fa);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:32px;font-weight:700}.hero-sub{color:#94a3b8;font-size:13px}.hero-image img{border-radius:15px;width:140px;transition:all .4s}.hero-image img:hover{transform:scale(1.05)}.quick-actions{gap:12px;margin-top:20px;margin-bottom:22px;display:flex;overflow-x:auto}.premium-scroll::-webkit-scrollbar{display:none}.action-card{cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:18px;flex-direction:column;justify-content:space-between;min-width:140px;height:140px;padding:14px;transition:all .3s;display:flex}.action-card-refer{background:linear-gradient(135deg,#3b82f666,#6366f133)}.action-card-daily{background:linear-gradient(135deg,#03c3ff66,#1872ff33)}.action-icon{font-size:22px}.action-label{font-weight:700}.action-chip{background:#fff3;border-radius:10px;padding:6px;font-size:12px}.cards{flex-wrap:wrap;gap:15px;margin-top:25px;display:flex}.linked-device-card{margin-top:20px}.glass-card{background:#ffffff0a;border-radius:18px;flex:1;min-width:260px;padding:18px}.progress{background:#ffffff1a;border-radius:10px;height:8px;margin-top:10px}.gradient-fill{background:linear-gradient(90deg,#3b82f6,#8b5cf6);height:100%}.premium-empty{text-align:center;background:#ffffff0a;border:1px dashed #fff3;border-radius:20px;margin-top:30px;padding:25px}.add-ro-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#3b82f6,#6366f1);border:none;border-radius:25px;margin-top:12px;padding:12px 20px;transition:all .3s}.add-ro-btn:hover{transform:scale(1.05)}@media (width<=768px){.hero{text-align:center;flex-direction:column;gap:15px}.cards{flex-direction:column}}.container{background:linear-gradient(135deg,#667eea 0%,#764ba2 60%,#1f2a55 100%);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex;position:relative;overflow:hidden}.container:before{content:"";pointer-events:none;background:radial-gradient(circle at 0 0,#ffffff1f,#0000 28%),radial-gradient(circle at 100% 100%,#ffffff14,#0000 25%);position:absolute;inset:0}.box{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);color:#fff;text-align:center;z-index:1;opacity:0;background:#ffffff14;border:1px solid #ffffff24;border-radius:28px;flex-direction:column;align-items:center;width:100%;max-width:420px;padding:36px 30px;animation:.6s forwards popCenter;display:flex;position:relative;overflow:hidden;transform:translateY(40px)scale(.96);box-shadow:0 18px 50px #00000059}.box:before{content:"";pointer-events:none;background:linear-gradient(#ffffff0f,#fff0);position:absolute;inset:0}@keyframes popCenter{to{opacity:1;transform:translateY(0)scale(1)}}.welcome-title{background:linear-gradient(135deg,#fff,#c4d8ff);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:16px;font-size:2rem;font-weight:700;line-height:1.1}.title{margin-bottom:10px;font-size:1.6rem;font-weight:700}.subtitle{color:#ffffffc7;max-width:320px;margin-bottom:30px;font-size:.95rem}.inputBox{width:100%;margin-bottom:26px;position:relative}.inputBox input{color:#fff;background:#ffffff0f;border:1px solid #ffffff29;border-radius:14px;outline:none;width:100%;padding:16px 18px;font-size:1rem;transition:border-color .3s,box-shadow .3s,background .3s}.inputBox input::placeholder{color:#ffffff8c}.inputBox input:focus{background:#ffffff1f;border-color:#6774efe6;box-shadow:0 0 30px #6774ef33}.btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:16px;width:100%;margin-bottom:22px;padding:16px 0;font-size:1rem;font-weight:700;transition:transform .25s,box-shadow .25s}.btn:hover{transform:translateY(-2px);box-shadow:0 16px 32px #667eea52}.links{text-align:center;width:100%}.links p{color:#ffffffb3;margin:5px 0;font-size:.9rem}.links .link{color:#38bdf8;cursor:pointer;font-weight:500;text-decoration:none}.links .link:hover{text-decoration:underline}@media (width<=480px){.container{padding:10px}.box{padding:30px 20px}.welcome-title{font-size:1.5rem}.title{font-size:1.3rem}.subtitle{font-size:.8rem}}.connect-page{color:var(--color-text);font-family:var(--font-main);padding-bottom:24px;animation:.6s ease-out pageSlideIn}@keyframes pageSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.connect-title{font-size:1.4rem;font-weight:var(--font-weight-bold);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:8px}.connect-subtitle{color:var(--color-text-secondary);margin-bottom:20px;font-size:.9rem;line-height:1.5}.connect-card{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);flex-direction:column;gap:20px;padding:24px 20px;animation:.8s ease-out .2s both cardFadeIn;display:flex}@keyframes cardFadeIn{0%{opacity:0;transform:translateY(30px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.connect-qr-placeholder{border-radius:var(--radius-md);border:2px dashed var(--color-border);height:180px;color:var(--color-text-muted);font-size:.9rem;font-weight:var(--font-weight-medium);transition:var(--transition-normal);background:#ffffff0d;justify-content:center;align-items:center;display:flex}.connect-qr-placeholder:hover{border-color:var(--color-primary);background:#667eea1a}.connect-divider{color:var(--color-text-secondary);align-items:center;gap:12px;margin:8px 0;font-size:.85rem;display:flex;position:relative}.connect-divider:before,.connect-divider:after{content:"";background:linear-gradient(90deg, transparent, var(--color-border), transparent);flex:1;height:1px}.connect-label{font-size:.9rem;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);margin-bottom:8px}.connect-input{border-radius:var(--radius-md);border:2px solid var(--color-border);background:var(--glass-bg);width:100%;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);color:var(--color-text);transition:var(--transition-normal);outline:none;padding:16px 18px;font-size:1rem}.connect-input:focus{border-color:var(--color-border-focus);box-shadow:var(--shadow-glow);background:#ffffff26}.connect-input::placeholder{color:var(--color-text-muted)}.connect-btn-primary{border-radius:var(--radius-pill);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));width:100%;color:var(--color-text);font-size:1rem;font-weight:var(--font-weight-semibold);cursor:pointer;transition:var(--transition-normal);box-shadow:var(--shadow-soft);border:none;margin-top:8px;padding:16px 20px;position:relative;overflow:hidden}.connect-btn-primary:hover{box-shadow:var(--shadow-strong);transform:translateY(-2px)}.connect-btn-primary:active{transform:translateY(0)}@media (width<=480px){.connect-page{padding-bottom:20px}.connect-title{font-size:1.2rem}.connect-subtitle{font-size:.85rem}.connect-card{gap:16px;padding:20px 16px}.connect-qr-placeholder{height:160px}.connect-input{padding:14px 16px;font-size:.95rem}.connect-btn-primary{padding:14px 18px;font-size:.95rem}}.connect-btn-primary:hover{transform:scale(1.02)}.overview-page{color:var(--color-text);font-family:var(--font-main);padding:20px 0 32px}.overview-header{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;display:flex}.overview-title{font-size:1.6rem;font-weight:var(--font-weight-bold);margin:0 0 6px}.overview-subtitle{color:var(--color-text-secondary);margin:0;line-height:1.5}.overview-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.overview-card{border-radius:var(--radius-lg);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:var(--shadow-soft);padding:18px}.overview-card-label{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.8px;margin:0 0 8px;font-size:.85rem}.overview-card h2{margin:0 0 6px;font-size:1.2rem}.overview-card-meta{color:var(--color-text-muted);margin:0;font-size:.9rem;line-height:1.5}.overview-empty{border-radius:var(--radius-lg);color:var(--color-text-secondary);background:#ffffff0a;border:1px dashed #fff3;padding:24px}.overview-empty p{margin:0 0 10px;line-height:1.6}@media (width<=768px){.overview-grid{grid-template-columns:1fr}}.topup-page{color:var(--color-text);font-family:var(--font-main);padding-bottom:20px;position:relative;overflow:hidden}.topup-page:before{content:"";pointer-events:none;background:radial-gradient(circle,#667eea14 0%,#0000 50%),radial-gradient(circle at 100% 100%,#764ba214 0%,#0000 50%);width:180%;height:180%;animation:7s ease-in-out infinite float;position:absolute;top:-40%;left:-40%}.topup-page:after{content:"";pointer-events:none;background:radial-gradient(circle,#f093fb0f 0%,#0000 50%);width:140%;height:140%;animation:9s ease-in-out infinite reverse float;position:absolute;bottom:-25%;right:-25%}.topup-title{font-size:1.1rem;font-weight:var(--font-weight-semibold);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:4px}.topup-subtitle{color:var(--color-text-muted);margin-bottom:14px;font-size:.85rem}.topup-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.topup-pack{border-radius:var(--radius-md);border:1px solid var(--glass-border);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);cursor:pointer;transition:var(--transition-normal);box-shadow:var(--shadow-soft);flex-direction:column;align-items:center;gap:4px;padding:10px 6px;display:flex}.topup-pack:hover{border-color:var(--color-border-focus);box-shadow:var(--shadow-glow);transform:translateY(-3px)}.topup-pack.active{border-color:var(--color-border-focus);box-shadow:var(--shadow-glow);background:#667eea33}.topup-litres{font-size:.95rem;font-weight:var(--font-weight-semibold);color:var(--color-text)}.topup-price{color:var(--color-primary);font-size:.75rem}.topup-custom{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);transition:var(--transition-normal);margin-top:18px;padding:14px}.topup-custom:hover{box-shadow:var(--shadow-strong);transform:translateY(-2px)}.topup-custom label{color:var(--color-text-muted);font-size:.8rem}.topup-custom-row{gap:8px;margin-top:8px;display:flex}.topup-custom-row input{border-radius:var(--radius-md);border:2px solid var(--glass-border);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);color:var(--color-text);transition:var(--transition-normal);background:#ffffff14;outline:none;flex:1;padding:10px}.topup-custom-row input:focus{border-color:var(--color-border-focus);box-shadow:var(--shadow-glow);background:#ffffff26}.topup-custom-row input::placeholder{color:#fff;outline:none;font-size:.9rem}.topup-custom-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#4facfe,#00f2fe);border:none;border-radius:14px;padding:10px 14px;font-size:.85rem;transition:all .3s;box-shadow:0 4px 15px #00f2fe4d}.topup-custom-btn:hover{transform:scale(1.05)}.topup-note{color:#9ca3af;margin-top:6px;font-size:.75rem}.usage-page{color:var(--color-text);font-family:var(--font-main);padding-bottom:20px;position:relative;overflow:hidden}.usage-page:before{content:"";pointer-events:none;background:radial-gradient(circle,#667eea17 0%,#0000 50%),radial-gradient(circle at 100% 100%,#764ba217 0%,#0000 50%);width:190%;height:190%;animation:8.5s ease-in-out infinite float;position:absolute;top:-45%;left:-45%}.usage-page:after{content:"";pointer-events:none;background:radial-gradient(circle,#f093fb12 0%,#0000 50%);width:160%;height:160%;animation:11s ease-in-out infinite reverse float;position:absolute;bottom:-35%;right:-35%}.usage-title{font-size:1.1rem;font-weight:var(--font-weight-semibold);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:4px}.usage-subtitle{color:var(--color-text-muted);margin-bottom:14px;font-size:.85rem}.usage-summary-card{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);transition:var(--transition-normal);justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.usage-summary-card:hover{box-shadow:var(--shadow-strong);transform:translateY(-2px)}.usage-summary-label{color:var(--color-text-muted);font-size:.8rem}.usage-summary-value{font-size:1.4rem;font-weight:var(--font-weight-bold);color:var(--color-text)}.usage-summary-meta{color:var(--color-text-muted);font-size:.75rem}.usage-summary-chip{border-radius:var(--radius-pill);color:#22c55e;font-size:.75rem;font-weight:var(--font-weight-medium);background:#22c55e33;border:1px solid #22c55e4d;padding:4px 12px}.usage-chart{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);transition:var(--transition-normal);justify-content:space-between;align-items:flex-end;gap:12px;margin-top:16px;padding:16px;display:flex}.usage-chart:hover{box-shadow:var(--shadow-strong);transform:translateY(-2px)}.usage-bar-col{flex-direction:column;flex:1;align-items:center;gap:6px;display:flex}.usage-bar-inner{border-radius:var(--radius-pill);background:linear-gradient(180deg, var(--color-primary), var(--color-secondary));width:16px;box-shadow:var(--shadow-glow);transition:var(--transition-normal);cursor:pointer}.usage-bar-inner:hover{transform:scale(1.1);box-shadow:0 0 15px #667eea80}.usage-bar-label{color:#9ca3af;font-size:.75rem}.pay-page{color:var(--color-text);font-family:var(--font-main);padding-bottom:20px;position:relative;overflow:hidden}.pay-page:before{content:"";pointer-events:none;background:radial-gradient(circle,#667eea1a 0%,#0000 50%),radial-gradient(circle at 100% 100%,#764ba21a 0%,#0000 50%);width:200%;height:200%;animation:8s ease-in-out infinite float;position:absolute;top:-50%;left:-50%}.pay-page:after{content:"";pointer-events:none;background:radial-gradient(circle,#f093fb14 0%,#0000 50%);width:150%;height:150%;animation:10s ease-in-out infinite reverse float;position:absolute;bottom:-30%;right:-30%}.pay-title{font-size:1.1rem;font-weight:var(--font-weight-semibold);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:4px}.pay-subtitle{color:var(--color-text-muted);margin-bottom:14px;font-size:.85rem}.pay-list{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);transition:var(--transition-normal);overflow:hidden}.pay-list:hover{box-shadow:var(--shadow-strong);transform:translateY(-2px)}.pay-row{border-bottom:1px solid var(--glass-border);transition:var(--transition-fast);justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.pay-row:last-child{border-bottom:none}.pay-row:hover{background:#ffffff0d}.pay-id{font-size:.85rem;font-weight:var(--font-weight-medium);color:var(--color-text)}.pay-date{color:var(--color-text-muted);font-size:.75rem}.pay-right{text-align:right}.pay-amount{font-size:.95rem;font-weight:var(--font-weight-semibold);color:var(--color-text)}.pay-pill{border-radius:var(--radius-pill);font-size:.7rem;font-weight:var(--font-weight-medium);margin-top:3px;padding:3px 10px;display:inline-block}.pay-pill-success{color:#22c55e;background:#22c55e33;border:1px solid #22c55e4d}.pay-pill-failed{color:#ef4444;background:#ef444433;border:1px solid #ef44444d}.wallet-page{color:var(--color-text);font-family:var(--font-main);padding-bottom:20px;position:relative;overflow:hidden}.wallet-page:before{content:"";pointer-events:none;background:radial-gradient(circle,#667eea1a 0%,#0000 50%),radial-gradient(circle at 100% 100%,#764ba21a 0%,#0000 50%);width:200%;height:200%;animation:8s ease-in-out infinite float;position:absolute;top:-50%;left:-50%}.wallet-page:after{content:"";pointer-events:none;background:radial-gradient(circle,#f093fb14 0%,#0000 50%);width:150%;height:150%;animation:10s ease-in-out infinite reverse float;position:absolute;bottom:-30%;right:-30%}.wallet-title{font-size:1.1rem;font-weight:var(--font-weight-semibold);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:4px}.wallet-subtitle{color:var(--color-text-muted);margin-bottom:14px;font-size:.85rem}.wallet-card-main{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);color:var(--color-text);box-shadow:var(--shadow-soft);transition:var(--transition-normal);margin-bottom:14px;padding:18px 16px}.wallet-card-main:hover{box-shadow:var(--shadow-strong);transform:translateY(-2px)}.wallet-balance-label{opacity:.9;color:var(--color-text-secondary);font-size:.8rem}.wallet-balance-amount{font-size:1.8rem;font-weight:var(--font-weight-bold);color:var(--color-text);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-top:2px}.wallet-balance-meta{opacity:.85;color:var(--color-text-muted);margin-top:2px;font-size:.8rem}.wallet-add-row{gap:8px;margin-top:14px;display:flex}.wallet-pill{border-radius:var(--radius-pill);border:1px solid var(--glass-border);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);color:var(--color-text);cursor:pointer;transition:var(--transition-normal);font-size:.8rem;font-weight:var(--font-weight-medium);background:#ffffff26;flex:1;padding:8px}.wallet-pill:hover{box-shadow:var(--shadow-soft);background:#ffffff40;transform:translateY(-1px)}.wallet-btn-primary{border-radius:var(--radius-pill);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));width:30%;color:var(--color-text);font-weight:var(--font-weight-semibold);cursor:pointer;transition:var(--transition-normal);box-shadow:var(--shadow-soft);border:none;margin-top:12px;margin-left:30%;padding:12px;font-size:.9rem}.wallet-btn-primary:hover{box-shadow:var(--shadow-glow);transform:translateY(-2px)}.wallet-info-card{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);transition:var(--transition-normal);padding:16px}.wallet-info-card:hover{box-shadow:var(--shadow-strong);transform:translateY(-2px)}.wallet-info-card h3{margin-bottom:4px;font-size:.95rem}.wallet-info-card p{color:#9ca3af;margin-bottom:12px;font-size:.8rem}.wallet-btn-secondary{color:#4facfe;cursor:pointer;background:#4facfe33;border:none;border-radius:999px;padding:8px 12px;font-size:.8rem;transition:all .3s}.wallet-btn-secondary:hover{background:#4facfe59}@media (width<=420px){.bottom-nav-box{width:95%;padding:10px;bottom:15px}.nav-item{gap:3px;padding:6px 10px;font-size:11px}.icon{font-size:18px}}.product-list-page{color:#fff;background:linear-gradient(#020617 0%,#071028 60%,#08172f 100%);min-height:100vh;padding:15px;animation:.6s ease-out pageSlideIn;position:relative;overflow:hidden}.product-list-page:before{content:"";background:radial-gradient(circle,#3b82f62e,#0000 42%);width:220%;height:220%;animation:10s ease-in-out infinite float;position:absolute;top:-50%;left:-40%}.product-list-page:after{content:"";background:radial-gradient(circle,#0ea5e91f,#0000 45%);width:180%;height:180%;animation:12s ease-in-out infinite reverse float;position:absolute;bottom:-35%;right:-35%}.product-hero{text-align:center;margin-bottom:32px}.product-hero h1{font-size:1.8rem;font-weight:var(--font-weight-bold);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:12px}.product-hero p{color:var(--color-text-secondary);max-width:300px;margin:0 auto;font-size:1rem;line-height:1.6}.product-list{flex-direction:column;gap:20px;display:flex}.product-card{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);transition:var(--transition-normal);padding:20px;animation:.8s ease-out both cardFadeIn;position:relative;overflow:hidden}.product-card:first-child{animation-delay:.1s}.product-card:nth-child(2){animation-delay:.2s}.product-card:nth-child(3){animation-delay:.3s}.product-card:hover{box-shadow:var(--shadow-strong);border-color:var(--color-primary);transform:translateY(-4px)}.product-card.highlighted{border:2px solid var(--color-primary);box-shadow:var(--shadow-glow);background:linear-gradient(135deg,#667eea1a,#764ba21a)}.product-card.highlighted:before{content:"";background:linear-gradient(90deg, var(--color-primary), var(--color-secondary));height:4px;position:absolute;top:0;left:0;right:0}.card-header{justify-content:space-between;align-items:flex-start;margin-bottom:16px;display:flex}.card-title{font-size:1.2rem;font-weight:var(--font-weight-bold);color:var(--color-text);margin:0}.card-badge{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);border-radius:var(--radius-pill);font-size:.75rem;font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.5px;padding:4px 12px}.card-price{font-size:1.4rem;font-weight:var(--font-weight-bold);color:var(--color-accent);margin-bottom:8px}.card-deposit{color:var(--color-text-secondary);margin-bottom:12px;font-size:.9rem}.card-specs{flex-direction:column;gap:6px;margin-bottom:20px;display:flex}.card-spec{color:var(--color-text-secondary);align-items:center;gap:8px;font-size:.9rem;display:flex}.card-spec:before{content:"✓";color:var(--color-primary);font-weight:700}.card-button{border-radius:var(--radius-pill);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));width:100%;color:var(--color-text);font-size:1rem;font-weight:var(--font-weight-semibold);cursor:pointer;transition:var(--transition-normal);border:none;padding:14px 20px;position:relative;overflow:hidden}.card-button:hover{box-shadow:var(--shadow-glow);transform:translateY(-2px)}@media (width<=480px){.top-bar{margin-bottom:20px}.logo-img{width:36px;height:36px}.logo-text{font-size:1.1rem}.profile img{width:38px;height:38px}.product-hero{margin-bottom:24px}.product-hero h1{font-size:1.5rem}.product-hero p{font-size:.9rem}.product-list{gap:16px}.product-card{padding:16px}.card-title{font-size:1.1rem}.card-price{font-size:1.2rem}}.product-card-highlighted{border:1px solid #38bdf8}.product-card-main{justify-content:space-between;align-items:center;display:flex}.product-tag{color:#38bdf8;font-size:12px}.product-limit{opacity:.7;font-size:12px}.product-price{font-size:18px;font-weight:700}.product-price-meta{opacity:.6;font-size:12px}.img-box{border-radius:12px;width:100px;height:130px;overflow:hidden}.img-box img{object-fit:cover;width:100%;height:100%}.product-features{margin:10px 0;padding-left:16px;font-size:12px}.product-btn{color:#fff;background:linear-gradient(135deg,#38bdf8,#6366f1);border:none;border-radius:20px;width:100%;padding:10px;transition:transform .25s,box-shadow .25s;box-shadow:0 10px 18px #38bdf833}.product-btn:hover{transform:translateY(-2px);box-shadow:0 14px 22px #38bdf840}.product-btn.primary{background:linear-gradient(135deg,#38bdf8,#6366f1)}.product-faq{margin-top:20px;font-size:13px}.refer-box button{color:#fff;cursor:pointer;background:#38bdf8;border:none;border-radius:20px;padding:8px 14px}.profile-overlay{z-index:999;background:#0009;justify-content:flex-end;display:flex;position:absolute;inset:0}.profile-panel{background:#0b0f1a;border-radius:20px 0 0 20px;width:85%;max-width:340px;height:100%;padding:20px;animation:.3s forwards slideIn}@keyframes slideIn{0%{transform:translate(100%)}to{transform:translate(0)}}.close-btn{text-align:right;cursor:pointer;margin-bottom:10px;font-size:18px}.profile-info p{margin:6px 0;font-size:14px}.refer-box{text-align:center;background:linear-gradient(135deg,#1c2740,#0b0f1a);border-radius:16px;margin-top:20px;padding:15px}.refer-box h2{letter-spacing:2px;margin:8px 0}.copy-btn{color:#fff;cursor:pointer;background:#38bdf8;border:none;border-radius:20px;margin-top:10px;padding:10px 16px;font-size:14px}.copy-btn:hover{opacity:.9}@keyframes checkoutFloat{0%{transform:scale(1)rotate(0)}to{transform:scale(1.08)rotate(-1deg)}}.header-box{background:var(--glass-bg);width:100%;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);justify-content:space-between;align-items:center;padding:16px 20px;animation:.6s ease-out headerSlideDown;display:flex}@keyframes headerSlideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.back{color:var(--color-text);cursor:pointer;transition:var(--transition-fast);border-radius:50%;padding:8px;font-size:1.2rem}.back:hover{color:var(--color-primary);background:#ffffff1a}.profile{transition:var(--transition-fast);border-radius:50%;justify-content:center;align-items:center;padding:8px;display:flex}.profile:hover{background:#ffffff1a}.profile img{object-fit:cover;cursor:pointer;width:32px;height:32px;transition:var(--transition-fast);border-radius:50%}.profile img:hover{transform:scale(1.1)}.steps{margin:24px 0 20px;padding:0 8px;display:flex}.step-wrapper{flex:1;align-items:center;display:flex}.step{text-align:center;font-size:.75rem;font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.circle{background:var(--glass-bg);width:32px;height:32px;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:2px solid var(--color-border);font-size:.8rem;font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);transition:var(--transition-normal);border-radius:50%;justify-content:center;align-items:center;margin:0 auto 8px;display:flex}.step.active .circle{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);border-color:var(--color-primary);box-shadow:var(--shadow-glow)}.step.done .circle{color:var(--color-text);background:linear-gradient(135deg,#10b981,#34d399);border-color:#10b981}.step-line{background:var(--color-border);flex:1;height:2px;margin:0 8px}.line-done{background:linear-gradient(90deg,#10b981,#34d399)}.card{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);margin-bottom:20px;padding:20px;animation:.8s ease-out both cardFadeIn}.card:first-child{animation-delay:.1s}.card:nth-child(2){animation-delay:.2s}.card:nth-child(3){animation-delay:.3s}.product-row{align-items:center;gap:16px;margin-bottom:16px;display:flex}.product-img{border-radius:var(--radius-md);object-fit:cover;border:2px solid var(--glass-border);width:70px;height:70px;box-shadow:var(--shadow-soft)}.product-details{flex:1}.product-details h3{font-size:1.1rem;font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 4px}.product-details p{color:var(--color-text-secondary);margin:0;font-size:.9rem;line-height:1.4}.price-row{border-bottom:1px solid var(--glass-border);justify-content:space-between;align-items:center;margin:8px 0;padding:8px 0;display:flex}.price-row:last-child{font-size:1.1rem;font-weight:var(--font-weight-bold);border-bottom:none}.total{font-weight:var(--font-weight-bold);color:var(--color-accent)}.divider{background:var(--glass-border);height:1px;margin:16px 0}input,textarea,select{border-radius:var(--radius-md);border:2px solid var(--color-border);background:var(--glass-bg);width:100%;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);color:var(--color-text);transition:var(--transition-normal);outline:none;margin-top:8px;padding:14px 16px;font-size:1rem}.checkout-btn{border-radius:var(--radius-pill);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));width:100%;color:var(--color-text);font-size:1rem;font-weight:var(--font-weight-semibold);cursor:pointer;transition:var(--transition-normal);box-shadow:var(--shadow-soft);border:none;margin-top:20px;padding:16px 20px;position:relative;overflow:hidden}.checkout-btn:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.checkout-btn:hover:before{left:100%}.checkout-btn:hover{box-shadow:var(--shadow-glow);transform:translateY(-2px)}.payment-option{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-normal);margin-top:12px;padding:16px}.payment-option:hover{border-color:var(--color-primary);background:#667eea0d}.upload-content{border:2px dashed var(--color-border);text-align:center;border-radius:var(--radius-md);transition:var(--transition-normal);background:#ffffff05;margin-top:12px;padding:20px}.upload-content:hover{border-color:var(--color-primary);background:#667eea0d}.bottom-nav-box{background:var(--glass-bg);width:90%;max-width:380px;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-pill);box-shadow:var(--shadow-strong);z-index:9999;justify-content:space-around;align-items:center;padding:14px 20px;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.nav-item{text-align:center;font-size:.8rem;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);transition:var(--transition-fast)}.nav-item.active{color:var(--color-primary)}@keyframes overlayFadeIn{0%{opacity:0}to{opacity:1}}@keyframes panelSlideIn{0%{transform:translate(100%)}to{transform:translate(0)}}.refer-box button{border-radius:var(--radius-pill);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);font-size:.9rem;font-weight:var(--font-weight-semibold);cursor:pointer;transition:var(--transition-normal);box-shadow:var(--shadow-soft);border:none;padding:12px 20px}.refer-box button:hover{box-shadow:var(--shadow-glow);transform:translateY(-2px)}.copy-btn{border-radius:var(--radius-pill);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);font-size:.9rem;font-weight:var(--font-weight-semibold);cursor:pointer;transition:var(--transition-normal);box-shadow:var(--shadow-soft);border:none;margin-top:12px;padding:12px 20px}@media (width<=480px){.premium-container{padding:16px}.header-box{padding:14px 16px}.steps{margin:20px 0 16px}.circle{width:28px;height:28px;font-size:.7rem}.card{padding:16px}.product-img{width:60px;height:60px}.bottom-nav-box{width:95%;padding:12px 16px}.profile-panel{width:90%}}.top-bar{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.logo-row{align-items:center;gap:12px;display:flex}.logo-img{object-fit:contain;width:auto;max-width:140px;height:42px;box-shadow:var(--shadow-soft);cursor:pointer;border-radius:14px;transition:transform .3s}.logo-img:hover{transform:scale(1.05)}.logo-text{font-size:1.2rem;font-weight:var(--font-weight-bold);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;cursor:pointer;-webkit-background-clip:text;background-clip:text}.profile{cursor:pointer;transition:transform .3s}.profile:hover{transform:scale(1.1)}.profile img{border:2px solid var(--glass-border);width:44px;height:44px;box-shadow:var(--shadow-soft);object-fit:cover;border-radius:50%}.top-bar{z-index:100;position:relative}.profile{z-index:200;cursor:pointer;position:relative}.bottom-nav-box{z-index:9999;background:#111827;border-radius:25px;justify-content:space-around;align-items:center;width:90%;max-width:380px;padding:12px;animation:.5s ease-out slideUp;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #0006}.nav-item{text-align:center;color:var(--color-text);cursor:pointer;border-radius:12px;flex-direction:column;align-items:center;gap:4px;padding:8px 12px;font-size:12px;transition:all .3s;display:flex}.nav-item:hover{background:#ffffff1a;transform:translateY(-2px)}.icon{justify-content:center;align-items:center;font-size:20px;display:flex}.nav-item.active{color:#f0f8ff;background:linear-gradient(135deg, var(--color-primary), var(--color-secondary))}.nav-item.active .icon{animation:.3s popIn}.nav-item.shop{font-weight:var(--font-weight-semibold)}.nav-item.shop.active{background:linear-gradient(135deg,#38bdf833,#6366f133)}@media (width<=420px){.bottom-nav-box{width:95%;padding:10px;bottom:15px}.nav-item{gap:3px;padding:6px 10px;font-size:11px}.icon{font-size:18px}}.premium-container{color:#fff;min-height:100vh;font-family:var(--font-main);background:var(--color-bg-dark);width:100%;max-width:420px;margin:0 auto;padding:20px 20px 100px;animation:.6s ease-out pageSlideIn;position:relative;overflow-y:auto}.premium-container:before{content:"";z-index:-2;background:radial-gradient(circle,#3b82f62e,#0000 42%);width:220%;height:220%;animation:10s ease-in-out infinite subscriptionFloat;position:fixed;top:-50%;left:-40%}.premium-container:after{content:"";z-index:-1;background:radial-gradient(circle,#0ea5e91f,#0000 45%);width:180%;height:180%;animation:12s ease-in-out infinite reverse subscriptionFloat;position:fixed;bottom:-35%;right:-35%}@keyframes subscriptionFloat{0%{transform:scale(1)rotate(0)}to{transform:scale(1.08)rotate(-1deg)}}.hero{justify-content:space-between;align-items:center;gap:20px;margin-bottom:32px;display:flex}.hero-text h1{font-size:1.2rem;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);margin-bottom:8px}.hero-text h2{font-size:1.8rem;font-weight:var(--font-weight-bold);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0}.hero-image img{border-radius:var(--radius-lg);object-fit:cover;width:140px;height:140px;box-shadow:var(--shadow-strong);border:2px solid var(--glass-border)}.plan-card{border-radius:var(--radius-lg);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:var(--shadow-soft);margin-bottom:32px;padding:24px;animation:.8s ease-out .2s both cardFadeIn}.plan-title{font-size:.9rem;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.plan-card h2{font-size:1.4rem;font-weight:var(--font-weight-bold);color:var(--color-text);margin:8px 0 12px}.price{font-size:1.1rem;font-weight:var(--font-weight-semibold);color:var(--color-accent);margin-bottom:4px}.sub{color:var(--color-text-muted);font-size:.85rem}.progress{background:var(--glass-bg);border-radius:var(--radius-pill);border:1px solid var(--glass-border);height:8px;margin-top:16px;overflow:hidden}.fill{border-radius:var(--radius-pill);background:linear-gradient(90deg, var(--color-primary), var(--color-secondary));height:100%;transition:width .5s}.remaining{font-size:.9rem;font-weight:var(--font-weight-medium);color:var(--color-primary);border-radius:var(--radius-pill);background:#667eea1a;border:1px solid #667eea33;margin-top:12px;padding:6px 12px;display:inline-block}.transaction-section{margin-bottom:32px}.transaction-section h3{font-size:1.3rem;font-weight:var(--font-weight-bold);color:var(--color-text);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:16px}.txn-card{border-radius:var(--radius-lg);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:var(--shadow-soft);transition:var(--transition-normal);justify-content:space-between;align-items:center;margin-bottom:12px;padding:16px 20px;display:flex}.txn-card:hover{box-shadow:var(--shadow-strong);transform:translateY(-2px)}.txn-info{flex:1}.txn-date{font-size:.9rem;font-weight:var(--font-weight-medium);color:var(--color-text);margin-bottom:4px}.txn-status{font-size:.8rem;font-weight:var(--font-weight-medium);border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.5px;padding:4px 8px}.txn-status.success{color:#10b981;background:#10b9811a;border:1px solid #10b98133}.txn-status.failed{color:#ef4444;background:#ef44441a;border:1px solid #ef444433}.txn-amount{font-weight:var(--font-weight-bold);color:var(--color-text);font-size:1rem}.plan-toggle{justify-content:center;gap:12px;margin:20px 0 24px;display:flex}.plan-toggle button{border-radius:var(--radius-pill);border:2px solid var(--color-border);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);color:var(--color-text-secondary);font-size:.9rem;font-weight:var(--font-weight-medium);cursor:pointer;transition:var(--transition-normal);padding:10px 20px}.plan-toggle .active{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);border-color:var(--color-primary);box-shadow:var(--shadow-glow)}.txn-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.txn-type{font-size:.8rem;font-weight:var(--font-weight-semibold);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);border-radius:var(--radius-pill);text-transform:uppercase;letter-spacing:.5px;padding:6px 12px}.profile-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;background:#0009;justify-content:flex-end;animation:.3s ease-out overlayFadeIn;display:flex;position:fixed;inset:0}.profile-panel{background:var(--glass-bg);width:85%;max-width:340px;height:100vh;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg) 0 0 var(--radius-lg);box-shadow:var(--shadow-strong);padding:24px;animation:.4s ease-out panelSlideIn}.close-btn{text-align:right;font-size:1.5rem;font-weight:var(--font-weight-bold);color:var(--color-text);cursor:pointer;transition:var(--transition-fast);margin-bottom:20px}.close-btn:hover{color:var(--color-primary)}.profile-info p{color:var(--color-text-secondary);margin:8px 0;font-size:.95rem;line-height:1.5}.refer-box{border-radius:var(--radius-lg);border:1px solid var(--glass-border);text-align:center;box-shadow:var(--shadow-soft);background:linear-gradient(135deg,#667eea1a,#764ba21a);margin-top:24px;padding:20px}.refer-box h2{font-size:1.2rem;font-weight:var(--font-weight-bold);color:var(--color-text);letter-spacing:1px;margin:12px 0}.refer-box p{color:var(--color-text-secondary);margin-bottom:16px;font-size:.9rem}.copy-btn{border-radius:var(--radius-pill);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);font-size:.9rem;font-weight:var(--font-weight-semibold);cursor:pointer;transition:var(--transition-normal);box-shadow:var(--shadow-soft);border:none;padding:12px 20px}.copy-btn:hover{box-shadow:var(--shadow-glow);transform:translateY(-2px)}@media (width<=480px){.premium-container{padding:16px}.hero{text-align:center;flex-direction:column;gap:24px}.hero-image img{width:120px;height:120px}.plan-card{padding:20px}.bottom-nav-box{width:95%;padding:12px 16px}.profile-panel{width:90%}}.refer-page{color:var(--color-text);font-family:var(--font-main);width:100%;max-width:420px;margin:0 auto;padding-bottom:24px;animation:.6s ease-out pageSlideIn;position:relative;overflow-y:auto}.refer-page:before{content:"";background:linear-gradient(135deg, var(--color-bg-gradient-start) 0%, var(--color-bg-gradient-end) 100%);z-index:-2;width:100vw;height:100vh;position:fixed;top:0;left:0}.refer-page:after{content:"";z-index:-1;background:radial-gradient(circle at 30% 70%,#ffffff1a 0%,#0000 50%),radial-gradient(circle at 70% 30%,#667eea26 0%,#0000 50%);width:100vw;height:100vh;animation:12s ease-in-out infinite alternate referFloat;position:fixed;top:0;left:0}@keyframes referFloat{0%{transform:scale(1)rotate(0)}to{transform:scale(1.1)rotate(2deg)}}.refer-hero{background:linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 50%, var(--color-accent) 100%);border-radius:var(--radius-lg);color:var(--color-text);box-shadow:var(--shadow-strong);margin:0 16px 32px;padding:32px 24px;animation:.8s ease-out heroSlideDown;position:relative;overflow:hidden}@keyframes heroSlideDown{0%{opacity:0;transform:translateY(-30px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.refer-hero:before{content:"";pointer-events:none;background:#ffffff26;border-radius:50%;width:250px;height:250px;animation:6s ease-in-out infinite float;position:absolute;top:-50%;right:-15%}.refer-hero:after{content:"";pointer-events:none;background:#ffffff1a;border-radius:50%;width:180px;height:180px;animation:8s ease-in-out infinite reverse float;position:absolute;bottom:-30%;left:-10%}.refer-hero-content{z-index:1;text-align:center;position:relative}.refer-icon{margin-bottom:16px;font-size:3.5rem;animation:2.5s cubic-bezier(.68,-.55,.265,1.55) infinite bounce;display:inline-block}.refer-title{font-size:1.8rem;font-weight:var(--font-weight-bold);letter-spacing:-.8px;text-shadow:0 2px 8px #0003;margin:0 0 12px}.refer-subtitle{color:#ffffffe6;font-size:1rem;line-height:1.5;font-weight:var(--font-weight-light);margin:0}.refer-card-premium{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);border:1px solid var(--glass-border);transition:var(--transition-normal);margin:0 16px 32px;padding:24px 20px;animation:.8s ease-out .3s both cardFadeIn}.refer-card-premium:hover{border-color:var(--color-primary);box-shadow:var(--shadow-glow);transform:translateY(-2px)}.refer-link-label{color:var(--color-text-secondary);font-size:.8rem;font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}.refer-link-row{border-radius:var(--radius-md);border:1px solid var(--glass-border);transition:var(--transition-normal);background:#0f172a99;justify-content:space-between;align-items:center;gap:12px;padding:16px 18px;display:flex}.refer-link-row:hover{border-color:var(--color-primary);background:#667eea1a}.refer-code{font-size:1.1rem;font-weight:var(--font-weight-bold);color:var(--color-primary);letter-spacing:.5px;font-family:Monaco,Courier New,monospace}.refer-copy-btn{border-radius:var(--radius-md);background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);font-size:.9rem;font-weight:var(--font-weight-semibold);cursor:pointer;transition:var(--transition-normal);box-shadow:var(--shadow-soft);border:none;padding:12px 20px}.refer-copy-btn:hover{box-shadow:var(--shadow-glow);transform:translateY(-2px)}.refer-copy-btn:active{transform:translateY(0)}.refer-small{color:var(--color-text-muted);font-size:.8rem;font-weight:var(--font-weight-normal);text-align:center;margin-top:12px}.refer-steps-section{margin-bottom:32px;padding:0 16px}.refer-steps-title{font-size:1.5rem;font-weight:var(--font-weight-bold);color:var(--color-text);letter-spacing:-.5px;background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:20px}.refer-steps{flex-direction:column;gap:16px;display:flex}.step-item{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-radius:var(--radius-lg);border:1px solid var(--glass-border);transition:var(--transition-normal);gap:18px;padding:20px 18px;animation:.6s ease-out both stepSlideIn;display:flex;position:relative;overflow:hidden}.step-item:first-child{animation-delay:.1s}.step-item:nth-child(2){animation-delay:.2s}.step-item:nth-child(3){animation-delay:.3s}@keyframes stepSlideIn{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}.step-item:before{content:"";background:linear-gradient(90deg, transparent, var(--color-primary), transparent);height:2px;position:absolute;top:0;left:0;right:0}.step-item:hover{border-color:var(--color-primary);box-shadow:var(--shadow-glow);background:#667eea0d;transform:translate(8px)}.step-number{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));width:48px;height:48px;color:var(--color-text);font-weight:var(--font-weight-bold);box-shadow:var(--shadow-soft);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:1.2rem;display:flex}.step-content h4{font-size:1.1rem;font-weight:var(--font-weight-semibold);color:var(--color-text);letter-spacing:-.3px;margin:0 0 8px}.step-content p{color:var(--color-text-secondary);margin:0;font-size:.9rem;line-height:1.4}.step-connector{display:none}.refer-benefits{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-radius:var(--radius-lg);border:1px solid var(--glass-border);box-shadow:var(--shadow-soft);margin:0 16px 20px;padding:24px 20px;animation:.8s ease-out .5s both benefitsFadeIn;position:relative;overflow:hidden}@keyframes benefitsFadeIn{0%{opacity:0;transform:translateY(40px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.refer-benefits:before{content:"";background:radial-gradient(circle,#667eea1a 0%,#0000 70%);border-radius:50%;width:300px;height:300px;position:absolute;top:-100%;right:-50%}.refer-benefits-title{font-size:1.5rem;font-weight:var(--font-weight-bold);color:var(--color-text);letter-spacing:-.5px;z-index:1;background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:20px;position:relative}.benefits-grid{z-index:1;grid-template-columns:1fr 1fr 1fr;gap:16px;display:grid;position:relative}.benefit-item{border-radius:var(--radius-lg);text-align:center;border:1px solid var(--glass-border);transition:var(--transition-normal);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f172a80;padding:20px 16px}.benefit-item:hover{border-color:var(--color-primary);box-shadow:var(--shadow-glow);background:#667eea1a;transform:translateY(-8px)}.benefit-icon{transition:var(--transition-normal);margin-bottom:12px;font-size:2.2rem;display:inline-block}.benefit-item:hover .benefit-icon{transform:scale(1.2)rotate(5deg)}.benefit-item p{font-size:.85rem;font-weight:var(--font-weight-semibold);color:var(--color-text-secondary);margin:0;line-height:1.3}@media (width<=480px){.refer-page{padding-bottom:20px}.refer-hero{margin:0 12px 24px;padding:24px 20px}.refer-icon{font-size:3rem}.refer-title{font-size:1.5rem}.refer-card-premium{margin:0 12px 24px;padding:20px 16px}.refer-steps-section{padding:0 12px}.refer-benefits{margin:0 12px 16px;padding:20px 16px}.benefits-grid{grid-template-columns:1fr 1fr;gap:12px}.benefit-item{padding:16px 12px}.benefit-icon{font-size:2rem}}.public-layout{min-height:100vh;position:relative;overflow:hidden}.public-layout:before{content:"";z-index:-2;background:#000;width:100vw;height:100vh;position:fixed;top:0;left:0}.public-layout:after{content:"";z-index:-1;background:radial-gradient(circle at 20% 70%,#38bdf814 0%,#0000 40%),radial-gradient(circle at 75% 20%,#8b5cf61a 0%,#0000 35%);width:100vw;height:100vh;animation:12s ease-in-out infinite alternate publicFloat;position:fixed;top:0;left:0}@keyframes publicFloat{0%{transform:scale(1)rotate(0)}to{transform:scale(1.08)rotate(-1deg)}}.public-layout-inner{z-index:1;width:100%;min-height:100vh;position:relative}.dashboard-layout{min-height:100vh;color:var(--color-text);background:#000;flex-direction:column;display:flex;position:relative;overflow:hidden}.dashboard-layout:before{content:"";z-index:-1;background:radial-gradient(circle at 30% 70%,#ffffff1a 0%,#0000 50%),radial-gradient(circle at 70% 30%,#667eea26 0%,#0000 50%);width:100vw;height:100vh;animation:10s ease-in-out infinite alternate dashboardFloat;position:fixed;top:0;left:0}@keyframes dashboardFloat{0%{transform:scale(1)rotate(0)}to{transform:scale(1.1)rotate(1deg)}}.dashboard-header{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--glass-border);z-index:10;justify-content:space-between;align-items:center;padding:20px 24px;display:flex;position:relative}.dashboard-header h1{font-size:1.5rem;font-weight:var(--font-weight-bold);background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0}.header-logout{border-radius:var(--radius-pill);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);color:var(--color-text);font-size:.9rem;font-weight:var(--font-weight-medium);transition:var(--transition-normal);padding:8px 16px}.header-logout:hover{box-shadow:var(--shadow-soft);background:#fff3;transform:translateY(-2px)}.dashboard-nav{border-radius:var(--radius-lg);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);scroll-behavior:smooth;scrollbar-width:none;z-index:10;gap:8px;margin:0 16px 16px;padding:12px 16px;display:flex;position:relative;overflow-x:auto}.dashboard-nav::-webkit-scrollbar{display:none}.dashboard-nav a{border-radius:var(--radius-pill);font-size:.85rem;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);white-space:nowrap;transition:var(--transition-normal);flex:none;padding:10px 18px;text-decoration:none;position:relative;overflow:hidden}.dashboard-nav a:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.dashboard-nav a:hover:before{left:100%}.dashboard-nav a.active{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary));color:var(--color-text);box-shadow:var(--shadow-glow);transform:translateY(-2px)}.dashboard-nav a:hover{color:var(--color-text);background:#ffffff1a}.dashboard-main{z-index:5;flex:1;padding:0 16px 20px;position:relative}@media (width<=480px){.dashboard-header{padding:16px 20px}.dashboard-header h1{font-size:1.3rem}.dashboard-nav{margin:0 12px 12px;padding:10px 12px}.dashboard-nav a{padding:8px 14px;font-size:.8rem}.dashboard-main{padding:0 12px 16px}}:root{--color-primary:#38bdf8;--color-secondary:#8b5cf6;--color-accent:#f472b6;--color-bg-gradient-start:#000;--color-bg-gradient-end:#050505;--color-bg-dark:#000;--color-bg-card:#ffffff14;--color-text:#f8fafc;--color-text-secondary:#f8fafcd1;--color-text-muted:#f8fafc99;--color-border:#f8fafc1f;--color-border-focus:#38bdf8;--glass-bg:#ffffff1a;--glass-border:#fff3;--glass-blur:blur(20px);--radius-lg:24px;--radius-md:16px;--radius-sm:12px;--radius-pill:999px;--shadow-soft:0 8px 32px #0003;--shadow-strong:0 20px 60px #0000004d;--shadow-glow:0 0 20px #667eea4d;--font-main:"Inter", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--transition-fast:.2s ease;--transition-normal:.3s ease;--transition-slow:.5s ease}*,:before,:after{box-sizing:border-box}html,body,#root{min-height:100vh;font-family:var(--font-main);margin:0;padding:0;font-size:14px;line-height:1.55}body{color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#000 fixed;overflow-x:hidden}button{font-family:inherit;font-weight:var(--font-weight-medium);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-normal);border:none;position:relative;overflow:hidden}button:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}button:hover:before{left:100%}a{color:var(--color-primary);transition:var(--transition-fast);text-decoration:none}a:hover{color:var(--color-secondary)}input,textarea,select{border:2px solid var(--color-border);border-radius:var(--radius-sm);background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);color:var(--color-text);transition:var(--transition-normal);outline:none;font-family:inherit}input:focus,textarea:focus,select:focus{border-color:var(--color-border-focus);box-shadow:var(--shadow-glow);background:#ffffff26}input::placeholder,textarea::placeholder{color:var(--color-text-muted)}.card,.glass-card{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);transition:var(--transition-normal)}.card:hover,.glass-card:hover{box-shadow:var(--shadow-strong);transform:translateY(-2px)}.glass-effect{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border)}.gradient-text{background:linear-gradient(45deg, var(--color-text), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.gradient-bg{background:linear-gradient(135deg, var(--color-primary), var(--color-secondary))}.animate-float{animation:6s ease-in-out infinite float}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#ffffff1a;border-radius:3px}::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#ffffff80}
