.auth-page{position:relative;isolation:isolate;overflow-x:hidden;background:linear-gradient(120deg,rgba(2,35,24,.96),rgba(7,76,51,.88) 55%,rgba(11,92,63,.66)),url('../hero-energy-v2.jpg') center/cover fixed}
.auth-page::before,.auth-page::after{content:"";position:fixed;z-index:-1;border-radius:50%;pointer-events:none}
.auth-page::before{width:430px;height:430px;top:-180px;right:-90px;border:1px solid rgba(125,230,177,.22);box-shadow:0 0 0 55px rgba(125,230,177,.045),0 0 0 110px rgba(125,230,177,.025);animation:login-orbit 9s ease-in-out infinite alternate}
.auth-page::after{width:360px;height:360px;left:-170px;bottom:-180px;background:radial-gradient(circle,rgba(41,190,125,.22),transparent 67%);animation:login-orbit 7s ease-in-out infinite alternate-reverse}
.single-login-shell{position:relative}.single-login-shell::before{content:"";position:absolute;width:125px;height:4px;left:50%;top:-17px;border-radius:99px;background:linear-gradient(90deg,transparent,#72dda8,transparent);transform:translateX(-50%);box-shadow:0 0 18px rgba(114,221,168,.75);animation:login-energy-line 2.5s ease-in-out infinite}
.single-login-card{border:1px solid rgba(178,225,202,.72);border-radius:28px;background:linear-gradient(155deg,rgba(255,255,255,.985),rgba(243,251,247,.96));box-shadow:0 35px 95px rgba(0,26,18,.34),inset 0 1px 0 #fff}
.single-login-card::before{height:6px;background:linear-gradient(90deg,#073e2c,#149664 42%,#62d99f 72%,#0c6b49);background-size:200% 100%;animation:login-gradient 4s linear infinite}
.single-login-card::after{content:"";position:absolute;z-index:0;width:210px;height:210px;right:-115px;top:92px;border-radius:50%;background:radial-gradient(circle,rgba(74,202,137,.12),transparent 68%);pointer-events:none}.single-login-card>*{position:relative;z-index:1}
.single-login-brand{border-bottom-color:#dcece4}.single-login-brand img{filter:drop-shadow(0 7px 11px rgba(8,74,51,.18));transition:transform .35s ease}.single-login-brand>a:hover img{transform:scale(1.06) rotate(-3deg)}.single-login-brand strong{color:#073d2b}.single-login-brand small{color:#638174}.single-login-brand .security-chip{border-color:#c8ead9;color:#08744d;background:#eaf8f1;box-shadow:0 5px 15px rgba(12,116,77,.08)}
.single-login-icon{position:relative;width:64px;height:64px;margin-top:27px;border:1px solid rgba(255,255,255,.45);border-radius:20px;color:#eafff4;background:linear-gradient(145deg,#07553b,#18a86e 62%,#59d497);box-shadow:0 14px 30px rgba(8,112,75,.29),inset 0 1px 0 rgba(255,255,255,.35);font-size:23px;transition:transform .35s ease,border-radius .35s ease}.single-login-icon::after{content:"";position:absolute;inset:-7px;border:1px dashed rgba(21,158,103,.35);border-radius:24px}.single-login-icon:hover{transform:translateY(-3px) scale(1.06);border-radius:50%}.single-login-icon:hover::after{border-radius:50%;animation:login-spin 4s linear infinite}
.single-login-logo{width:92px;height:92px;margin:7px auto 18px;padding:10px;border:1px solid #cce8da;background:radial-gradient(circle,#fff 48%,#e4f6ed);box-shadow:0 14px 32px rgba(8,112,75,.18),inset 0 1px 0 #fff}.single-login-logo img{position:relative;z-index:2;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 7px 8px rgba(7,61,43,.18))}
.auth-heading>span{color:#18a86e}.single-heading h1{color:#073d2b}.single-heading p{color:#617a6f}.single-login-card .auth-form label{color:#153f30}.single-login-card .auth-form input{border-color:#cee2d8;color:#123c2d;background:rgba(249,253,251,.95)}.single-login-card .auth-form input:focus{border-color:#1aac70;box-shadow:0 0 0 4px rgba(26,172,112,.11);background:#fff}.single-login-card .input-icon>i,.single-login-card .password-field button{color:#6f9383}.single-login-card .password-field button:hover{color:#0b8a5b}
.single-login-card .auth-submit{height:54px;border:1px solid rgba(255,255,255,.16);border-radius:12px;background:linear-gradient(120deg,#064a34,#0b8357 52%,#24b878);background-size:180% 100%;box-shadow:0 14px 31px rgba(7,116,76,.28);font-size:12px;transition:transform .24s ease,box-shadow .24s ease,background-position .35s ease}.single-login-card .auth-submit:hover{transform:translateY(-3px);background-position:100% 0;box-shadow:0 19px 39px rgba(7,116,76,.36)}
.single-login-card .login-assurance{color:#728b80}.single-login-card .login-assurance i{color:#16a66c}.single-login-card .auth-switch{border-top-color:#deebe5;color:#688075}.single-login-card .auth-switch a{color:#078657}.single-login-card .auth-switch a:hover{color:#045d3e;text-decoration:underline}.single-back-home{color:#688075}.single-back-home:hover{color:#078657}
@keyframes login-gradient{to{background-position:200% 0}}@keyframes login-spin{to{transform:rotate(360deg)}}@keyframes login-orbit{to{transform:translate(24px,18px) scale(1.06)}}@keyframes login-energy-line{50%{width:220px;opacity:.55}}
@media(max-width:560px){.auth-page{background-attachment:scroll}.single-login-card{border-radius:22px}.single-login-shell::before{display:none}}

.login-bubbles{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.login-bubbles span{--bubble-size:58px;--bubble-left:10%;--bubble-delay:0s;--bubble-duration:15s;position:absolute;width:var(--bubble-size);height:var(--bubble-size);left:var(--bubble-left);bottom:-160px;border:1px solid rgba(190,250,220,.21);border-radius:50%;background:radial-gradient(circle at 32% 25%,rgba(255,255,255,.23),rgba(116,226,171,.085) 43%,rgba(22,130,86,.025) 72%);box-shadow:inset 0 0 22px rgba(220,255,237,.085),0 0 26px rgba(45,198,128,.045);backdrop-filter:blur(.6px);translate:0 0;transition:translate .72s cubic-bezier(.16,.8,.25,1),border-color .4s ease,background .4s ease;will-change:transform,translate;animation:login-bubble-rise var(--bubble-duration) linear var(--bubble-delay) infinite}
.login-bubbles span.is-repelled{border-color:rgba(205,255,230,.34);background:radial-gradient(circle at 32% 25%,rgba(255,255,255,.29),rgba(116,226,171,.11) 43%,rgba(22,130,86,.035) 72%)}
.login-bubbles span::after{content:"";position:absolute;width:21%;height:13%;left:22%;top:17%;border-radius:50%;background:rgba(255,255,255,.3);transform:rotate(-28deg);filter:blur(1px)}
.login-bubbles span:nth-child(1){--bubble-size:42px;--bubble-left:7%;--bubble-delay:-2s;--bubble-duration:13s}
.login-bubbles span:nth-child(2){--bubble-size:86px;--bubble-left:19%;--bubble-delay:-9s;--bubble-duration:19s}
.login-bubbles span:nth-child(3){--bubble-size:31px;--bubble-left:35%;--bubble-delay:-5s;--bubble-duration:12s}
.login-bubbles span:nth-child(4){--bubble-size:68px;--bubble-left:51%;--bubble-delay:-13s;--bubble-duration:17s}
.login-bubbles span:nth-child(5){--bubble-size:112px;--bubble-left:67%;--bubble-delay:-7s;--bubble-duration:22s}
.login-bubbles span:nth-child(6){--bubble-size:38px;--bubble-left:82%;--bubble-delay:-10s;--bubble-duration:14s}
.login-bubbles span:nth-child(7){--bubble-size:73px;--bubble-left:91%;--bubble-delay:-4s;--bubble-duration:18s}
.login-bubbles span:nth-child(8){--bubble-size:25px;--bubble-left:59%;--bubble-delay:-1s;--bubble-duration:11s}
@keyframes login-bubble-rise{0%{transform:translate3d(0,0,0) scale(.72) rotate(0);opacity:0}12%{opacity:.46}45%{transform:translate3d(45px,-52vh,0) scale(1) rotate(90deg)}75%{opacity:.4}100%{transform:translate3d(-35px,-120vh,0) scale(1.14) rotate(180deg);opacity:0}}
@media(prefers-reduced-motion:reduce){.login-bubbles span{animation:none;display:none}}

.login-leaves{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.login-leaves span{--leaf-size:34px;--leaf-left:12%;--leaf-delay:0s;--leaf-duration:19s;position:absolute;width:var(--leaf-size);height:calc(var(--leaf-size)*.58);left:var(--leaf-left);top:-90px;border:1px solid rgba(174,239,204,.18);border-radius:100% 0 100% 0;background:linear-gradient(145deg,rgba(197,247,220,.16),rgba(54,178,117,.055));box-shadow:inset 5px 4px 10px rgba(222,255,237,.04);transform-origin:100% 100%;filter:blur(.15px);translate:0 0;transition:translate .78s cubic-bezier(.16,.8,.25,1),background .4s ease,border-color .4s ease;will-change:transform,translate;animation:leaf-fall var(--leaf-duration) ease-in-out var(--leaf-delay) infinite}
.login-leaves span.is-repelled{border-color:rgba(205,250,226,.3);background:linear-gradient(145deg,rgba(216,255,235,.22),rgba(76,201,139,.075))}
.login-leaves span::before{content:"";position:absolute;width:80%;height:1px;left:9%;top:51%;background:linear-gradient(90deg,transparent,rgba(208,251,228,.25),transparent);transform:rotate(-18deg);transform-origin:center}
.login-leaves span::after{content:"";position:absolute;width:11px;height:1px;right:-8px;bottom:-3px;background:rgba(181,238,208,.18);transform:rotate(37deg);transform-origin:left}
.login-leaves span:nth-child(1){--leaf-size:28px;--leaf-left:5%;--leaf-delay:-4s;--leaf-duration:17s}
.login-leaves span:nth-child(2){--leaf-size:46px;--leaf-left:21%;--leaf-delay:-13s;--leaf-duration:24s}
.login-leaves span:nth-child(3){--leaf-size:23px;--leaf-left:39%;--leaf-delay:-8s;--leaf-duration:16s}
.login-leaves span:nth-child(4){--leaf-size:38px;--leaf-left:56%;--leaf-delay:-17s;--leaf-duration:23s}
.login-leaves span:nth-child(5){--leaf-size:26px;--leaf-left:72%;--leaf-delay:-6s;--leaf-duration:18s}
.login-leaves span:nth-child(6){--leaf-size:50px;--leaf-left:87%;--leaf-delay:-14s;--leaf-duration:26s}
.login-leaves span:nth-child(7){--leaf-size:20px;--leaf-left:96%;--leaf-delay:-2s;--leaf-duration:15s}
@keyframes leaf-fall{0%{transform:translate3d(-20px,-80px,0) rotate(-35deg) scale(.8);opacity:0}12%{opacity:.38}35%{transform:translate3d(55px,34vh,0) rotate(65deg) scale(1)}62%{transform:translate3d(-35px,68vh,0) rotate(145deg) scale(.92);opacity:.3}100%{transform:translate3d(70px,115vh,0) rotate(255deg) scale(.76);opacity:0}}
@media(prefers-reduced-motion:reduce){.login-leaves{display:none}}

/* Registration page — same visual identity as login */
.register-page .auth-shell{border-color:rgba(178,225,202,.72);background:rgba(248,253,250,.97);box-shadow:0 35px 95px rgba(0,26,18,.34),inset 0 1px 0 #fff}
.register-page .register-visual{background:linear-gradient(145deg,rgba(2,45,31,.97),rgba(7,108,72,.86)),url('../hero-energy-v2.jpg') center/cover}
.register-page .auth-visual::before{background:linear-gradient(115deg,transparent 38%,rgba(98,217,159,.15));clip-path:polygon(60% 0,100% 0,100% 100%,22% 100%)}
.register-page .auth-visual::after{border-color:rgba(125,230,177,.22);box-shadow:0 0 0 35px rgba(125,230,177,.045),0 0 0 70px rgba(125,230,177,.025)}
.register-page .auth-brand small,.register-page .auth-visual p{color:#c7ded3}
.register-page .auth-kicker{color:#72dda8}
.register-page .auth-card{background:linear-gradient(155deg,rgba(255,255,255,.99),rgba(241,250,246,.97))}
.register-page .back-home{color:#688075}.register-page .back-home:hover{color:#078657}
.register-page .auth-heading>span{color:#18a86e}.register-page .auth-heading h2{color:#073d2b}.register-page .auth-heading p{color:#617a6f}
.register-page .auth-form label{color:#153f30}.register-page .auth-form label>small{color:#789084}
.register-page .auth-form input{border-color:#cee2d8;color:#123c2d;background:rgba(249,253,251,.96)}
.register-page .auth-form input:focus{border-color:#1aac70;box-shadow:0 0 0 4px rgba(26,172,112,.11);background:#fff}
.register-page .password-field button{color:#6f9383}.register-page .password-field button:hover{color:#0b8a5b}
.register-page .auth-submit{border:1px solid rgba(255,255,255,.16);background:linear-gradient(120deg,#064a34,#0b8357 52%,#24b878);background-size:180% 100%;box-shadow:0 14px 31px rgba(7,116,76,.28)}
.register-page .auth-submit:hover{background-position:100% 0;box-shadow:0 19px 39px rgba(7,116,76,.36)}
.register-page .auth-switch{color:#688075}.register-page .auth-switch a{color:#078657}.register-page .auth-switch a:hover{color:#045d3e;text-decoration:underline}
@media(max-width:760px){.register-page .auth-shell{background:rgba(248,253,250,.98)}.register-page .auth-visual{min-height:290px}}
