*{margin:0;padding:0;box-sizing:border-box}html{overflow-x:hidden;width:100%}html,body{max-width:100vw}body{font-family:'Poppins',sans-serif;background:#FFF;min-height:100vh;display:flex;justify-content:center;align-items:center;padding:20px;position:relative;overflow:hidden;width:100vw}body::before{content:'';position:absolute;width:600px;height:600px;top:-200px;left:-150px;border-radius:50%;background:radial-gradient(ellipse,rgb(240 185 11 / .07) 0%,transparent 70%);z-index:0;pointer-events:none}body::after{content:'';position:absolute;width:500px;height:500px;bottom:-150px;right:-150px;border-radius:50%;background:radial-gradient(ellipse,rgb(240 185 11 / .05) 0%,transparent 70%);z-index:0;pointer-events:none}.container{background:#FFF;border:1.5px solid #E4E3DF;padding:48px 44px;border-radius:16px;box-shadow:0 2px 4px rgb(0 0 0 / .04),0 12px 32px rgb(0 0 0 / .09),0 40px 80px rgb(0 0 0 / .06);width:100%;max-width:430px;max-height:calc(100vh - 40px);overflow-y:auto;position:relative;z-index:1;animation:fadeInUp 0.5s ease both}.container::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:#F0B90B;border-radius:16px 16px 0 0}.container::after{content:'✦';position:absolute;top:14px;right:18px;font-size:14px;color:#F0B90B;opacity:.25;animation:twinkle 3s ease-in-out infinite}@keyframes twinkle{0%,100%{opacity:.25;transform:scale(1) rotate(0deg)}50%{opacity:.5;transform:scale(1.15) rotate(15deg)}}@keyframes fadeInUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.header{text-align:center;margin-bottom:40px;padding-top:15px;position:relative}.logo-row{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:20px}.logo-container{position:relative;display:inline-block;flex-shrink:0}.logo-container::before,.logo-container::after{content:'';position:absolute;width:40px;height:40px;border:2px solid rgb(240 185 11 / .2);border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);animation:pulse-ring 2s ease-out infinite;pointer-events:none}.logo-container::after{animation-delay:1s}@keyframes pulse-ring{0%{width:40px;height:40px;opacity:1}100%{width:140px;height:140px;opacity:0}}.logo{width:100px;height:100px;border-radius:24px;background:radial-gradient(ellipse at 38% 32%,#3d2210 0%,#1c0e06 38%,#060302 70%,#020101 100%);border:4px solid #F0B90B;box-shadow:inset 0 3px 2px rgb(255 240 80 / .4),inset 0 -2px 2px rgb(80 60 0 / .5),inset 2px 0 2px rgb(255 230 60 / .2),inset -2px 0 2px rgb(80 60 0 / .35),0 0 14px rgb(240 185 11 / .35),0 0 30px rgb(240 185 11 / .12),0 8px 24px rgb(0 0 0 / .45),0 4px 10px rgb(0 0 0 / .3);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;margin:0 auto}.logo-orbit{position:absolute;width:78px;height:22px;border-radius:50%;border:2px solid #fff0;background:#fff0;box-shadow:0 0 0 2px rgb(240 185 11 / .92),0 0 8px 2px rgb(240 185 11 / .5),0 0 18px 3px rgb(240 185 11 / .18);transform:rotate(-22deg);z-index:1}.logo-icon{width:50px;height:50px;background:linear-gradient(148deg,#FFF176 0%,#FFE033 18%,#F5D000 40%,#C9A200 62%,#F5D800 80%,#FFF060 100%);clip-path:polygon(50% 3%,91% 27%,91% 73%,50% 97%,9% 73%,9% 27%);display:flex;align-items:center;justify-content:center;position:relative;z-index:2;filter:drop-shadow(0 0 6px rgb(240 185 11 / .5)) drop-shadow(0 0 14px rgb(240 185 11 / .2))}.logo-icon-core{width:25px;height:25px;background:radial-gradient(ellipse at 38% 32%,#241208 0%,#0a0502 60%,#030101 100%);clip-path:polygon(50% 3%,91% 27%,91% 73%,50% 97%,9% 73%,9% 27%)}.logo::before{content:'';position:absolute;top:0;left:-80%;width:55%;height:100%;border-radius:0;background:linear-gradient(105deg,transparent 20%,rgb(255 248 150 / .14) 50%,transparent 80%);pointer-events:none;z-index:3;animation:logo-shine 5s ease-in-out infinite}@keyframes logo-shine{0%,60%{left:-80%;opacity:1}80%{left:130%;opacity:1}81%,100%{left:130%;opacity:0}}.logo::after{display:none}.brand-title{position:relative;display:inline-flex;align-items:center;gap:12px}.brand-title::after{content:'';display:inline-block;width:36px;height:2px;background:linear-gradient(90deg,#F0B90B,transparent);border-radius:2px;box-shadow:0 0 6px rgb(240 185 11 / .4);flex-shrink:0}h1{color:#1E2026;margin:0;font-size:38px;font-weight:900;letter-spacing:5px;text-transform:uppercase;line-height:1;display:inline-block}@keyframes gradient-shift{0%,100%{background-position:0% center}50%{background-position:100% center}}.subtitle{color:#707A8A;font-size:11px;font-weight:600;line-height:2;margin-top:14px;letter-spacing:1px;text-transform:uppercase}.subtitle-highlight{color:#F0B90B;font-weight:800;font-size:13px;letter-spacing:1.5px}.tagline{margin-top:8px;font-size:12.5px;color:#B0B8C4;font-weight:400;font-style:italic;letter-spacing:.2px}.form-wrapper{position:relative}.form-panel{display:none;animation:fadeIn 0.5s cubic-bezier(.4,0,.2,1)}.form-panel.active{display:block}.form-group{margin-bottom:20px}label{display:block;margin-bottom:8px;color:#1E2026;font-weight:700;font-size:11px;letter-spacing:1px;text-transform:uppercase}.input-password-wrapper{position:relative}.input-password-wrapper input{padding-right:44px}.toggle-password{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;padding:4px;color:#C0C6D0;transition:color 0.2s ease;display:flex;align-items:center;justify-content:center;line-height:1}.toggle-password:hover{color:#F0B90B}input[type="text"],input[type="password"]{width:100%;padding:13px 16px;border:1.5px solid #DFE1E6;border-radius:10px;font-size:14px;transition:border-color 0.2s ease,box-shadow 0.2s ease;font-family:'Poppins',sans-serif;background:#F8F8F8;color:#1E2026;font-weight:500}input:focus{outline:none;border-color:#F0B90B;background:#FFF;box-shadow:0 0 0 3px rgb(240 185 11 / .12)}input::placeholder{color:#C0C6D0;font-weight:400;font-style:normal}.btn{width:100%;padding:15px;background:#F0B90B;color:#1E2026;border:none;border-radius:10px;font-size:14px;cursor:pointer;font-weight:800;transition:background 0.2s ease,box-shadow 0.2s ease,transform 0.15s ease;margin-top:10px;font-family:'Poppins',sans-serif;box-shadow:0 4px 16px rgb(240 185 11 / .35);letter-spacing:1.2px;text-transform:uppercase}.btn:hover{background:#F8D12F;box-shadow:0 6px 24px rgb(240 185 11 / .5);transform:translateY(-2px)}.btn:active{background:#D4A017;transform:translateY(0);box-shadow:0 2px 8px rgb(240 185 11 / .3)}.alert{padding:16px 18px;border-radius:12px;margin-bottom:24px;font-size:13px;animation:slideDown 0.5s cubic-bezier(.34,1.56,.64,1);font-weight:500;position:relative;overflow:hidden;box-shadow:0 4px 12px rgb(0 0 0 / .08)}.alert::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px}@keyframes slideDown{from{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.error{background:#FFF1F0;color:#CF1322;border:2px solid #FFCCC7;padding-left:22px}.error::before{background:#CF1322}.success{background:#F0FFF4;color:#237804;border:2px solid #B7EB8F;padding-left:22px}.success::before{background:#52C41A}.switch-mode{text-align:center;margin-top:24px;color:#707A8A;font-size:13.5px;font-weight:400}.switch-mode a{color:#F0B90B;text-decoration:none;font-weight:600;cursor:pointer;transition:color 0.2s ease}.switch-mode a:hover{color:#C9A200}.role-selector{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:10px}.role-option{position:relative}.role-option input[type="radio"]{position:absolute;opacity:0}.role-option label{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px 12px;text-align:center;border:2px solid #E5E5E5;border-radius:12px;cursor:pointer;transition:all 0.3s cubic-bezier(.34,1.56,.64,1);font-weight:600;background:#FAFAFA;min-height:100px;position:relative;overflow:hidden}.role-option label::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgb(240 185 11 / .05) 0%,rgb(240 185 11 / .02) 100%);opacity:0;transition:opacity 0.3s ease}.role-option label .emoji{font-size:32px;margin-bottom:8px;transition:transform 0.4s cubic-bezier(.34,1.56,.64,1);filter:grayscale(.3);position:relative;z-index:1}.role-option label .text{font-size:13px;color:#474D57;font-weight:600;letter-spacing:.3px;position:relative;z-index:1}.role-option input[type="radio"]:checked+label{background:linear-gradient(135deg,#1E1E1E 0%,#2C2C2C 100%);color:#F0B90B;border-color:#F0B90B;box-shadow:0 8px 24px rgb(240 185 11 / .3),inset 0 1px 0 rgb(240 185 11 / .2);transform:scale(1.05)}.role-option input[type="radio"]:checked+label::before{opacity:1}.role-option input[type="radio"]:checked+label .text{color:#F0B90B;text-shadow:0 0 10px rgb(240 185 11 / .3)}.role-option input[type="radio"]:checked+label .emoji{transform:scale(1.2) rotate(5deg);filter:grayscale(0) drop-shadow(0 0 8px rgb(240 185 11 / .4))}.role-option label:hover{border-color:#F0B90B;transform:translateY(-3px);box-shadow:0 6px 20px rgb(240 185 11 / .18)}.role-option label:hover::before{opacity:.5}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.password-strength{height:3px;background:#E5E5E5;border-radius:2px;margin-top:8px;overflow:hidden}.password-strength-bar{height:100%;width:0%;transition:all 0.3s ease;border-radius:2px}.strength-weak{width:33%;background:#CF1322}.strength-medium{width:66%;background:#FA8C16}.strength-strong{width:100%;background:#52C41A}.footer-brand{text-align:center;margin-top:35px;padding-top:28px;border-top:2px solid #F5F5F5;color:#B5B5B5;font-size:11px;font-weight:500;letter-spacing:.8px;position:relative}.footer-brand::before{content:'';position:absolute;top:-2px;left:50%;transform:translateX(-50%);width:80px;height:2px;background:linear-gradient(90deg,transparent,#F0B90B,transparent);box-shadow:0 0 8px rgb(240 185 11 / .5)}.footer-brand .brand-name{color:#1E2026;font-weight:800;font-size:13px;letter-spacing:3px;text-transform:uppercase;display:inline-block}@media (max-width:480px){body{padding:10px}.container{padding:30px 20px;max-width:100%;max-height:calc(100vh - 20px);margin:0;border-radius:12px}h1{font-size:30px!important;letter-spacing:0px!important}.logo{width:80px;height:80px;border-radius:20px}.logo-orbit{width:62px;height:18px}.logo-pulse{width:40px;height:40px}.logo-icon{width:40px;height:40px}.logo-icon-core{width:20px;height:20px}.logo-row{gap:12px}.brand-title::after{width:22px}.header{margin-bottom:28px;padding-top:10px}.subtitle{font-size:10px!important}.subtitle-highlight{font-size:13px!important}.tagline{font-size:11px;margin-top:8px}.role-selector{grid-template-columns:1fr;gap:10px}.role-option label{min-height:85px;padding:14px 10px}.btn{padding:13px;font-size:14px}.form-group{margin-bottom:16px}input[type="text"],input[type="password"]{padding:12px 14px;font-size:14px}}