/* HAMAVA — cinematic glass login, scoped to login routes only. */
html:has(body.auth-login-cinematic){overflow-x:clip;background:#04110e}
body.auth-login-cinematic {
  --oc-ink:#eafff6;--oc-muted:#a9c7ba;--oc-jade:#16d69a;--oc-line:rgba(185,255,226,.17);
  width:100%;max-width:100vw;min-height:100svh;overflow-x:clip;color:var(--oc-ink);
  background:radial-gradient(ellipse 70% 60% at 12% 12%,rgba(27,199,143,.28),transparent 62%),radial-gradient(ellipse 55% 70% at 91% 88%,rgba(11,117,91,.38),transparent 67%),radial-gradient(circle at 55% 48%,#123e31 0,#071d17 46%,#04110e 100%)!important;
}
body.auth-login-cinematic::before{content:"";position:fixed;inset:-20%;z-index:0;pointer-events:none;opacity:.5;background-image:linear-gradient(rgba(153,255,214,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(153,255,214,.055) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(circle at center,#000 10%,transparent 68%);transform:perspective(600px) rotateX(57deg) translateY(24%);transform-origin:center bottom}
body.auth-login-cinematic::after{content:"";position:fixed;width:min(72vw,980px);aspect-ratio:1;left:50%;top:50%;z-index:0;pointer-events:none;border:1px solid rgba(101,245,190,.12);border-radius:50%;box-shadow:0 0 0 90px rgba(69,229,168,.025),0 0 0 210px rgba(69,229,168,.018),inset 0 0 120px rgba(40,236,163,.05);transform:translate(-50%,-50%);animation:ocHalo 11s ease-in-out infinite alternate}
.auth-login-cinematic .auth-page{position:relative;z-index:2;display:block!important;max-width:none;min-height:100svh;padding:clamp(22px,4vw,58px);background:transparent!important}
.auth-login-cinematic .auth-story{display:none!important}
.auth-login-cinematic .auth-main{position:relative;min-height:calc(100svh - clamp(44px,8vw,116px));display:flex;align-items:center;justify-content:center;padding:34px 18px;overflow:clip}
.auth-login-cinematic .auth-main::before,.auth-login-cinematic .auth-main::after{content:"";position:absolute;pointer-events:none;border-radius:999px;filter:blur(2px)}
.auth-login-cinematic .auth-main::before{width:280px;height:280px;margin:-300px 0 0 -440px;border:1px solid rgba(104,255,197,.23);background:radial-gradient(circle at 35% 30%,rgba(102,255,198,.19),rgba(8,73,56,.06) 55%,transparent 70%);box-shadow:inset 0 0 70px rgba(31,223,151,.08),0 0 80px rgba(31,223,151,.06);animation:ocFloat 9s ease-in-out infinite}
.auth-login-cinematic .auth-main::after{width:150px;height:150px;margin:360px -520px 0 0;border:1px solid rgba(104,255,197,.2);background:radial-gradient(circle at 30% 25%,rgba(83,249,186,.22),transparent 64%);animation:ocFloat 7s ease-in-out -3s infinite reverse}
.auth-login-cinematic .auth-box{position:relative;isolation:isolate;overflow:hidden;width:min(100%,486px);max-width:486px;padding:clamp(28px,4vw,44px);border:1px solid var(--oc-line)!important;border-radius:32px;color:var(--oc-ink);background:linear-gradient(145deg,rgba(18,58,45,.7),rgba(5,24,19,.68))!important;-webkit-backdrop-filter:blur(28px) saturate(145%);backdrop-filter:blur(28px) saturate(145%);box-shadow:0 36px 100px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,255,255,.14),inset 0 -1px 0 rgba(43,235,164,.08)!important;animation:ocEnter .72s cubic-bezier(.2,.85,.25,1) both}
.auth-login-cinematic .auth-box::before{content:"";position:absolute;z-index:-1;inset:0;height:auto;background:radial-gradient(circle at 10% 0,rgba(61,235,169,.2),transparent 34%),linear-gradient(120deg,transparent 10%,rgba(255,255,255,.035) 48%,transparent 70%)}
.auth-login-cinematic .auth-box::after{content:"";position:absolute;z-index:-1;width:170px;height:170px;top:-90px;left:-70px;border-radius:50%;background:rgba(30,229,154,.17);filter:blur(34px)}
.auth-login-cinematic .auth-top{margin-bottom:32px;gap:18px}.auth-login-cinematic .auth-top .brand{display:inline-flex!important;color:#fff}.auth-login-cinematic .auth-top .brand img{width:46px;height:46px;padding:8px;border:1px solid rgba(147,255,214,.2);border-radius:15px;background:rgba(139,255,212,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 10px 28px rgba(0,0,0,.18)}
.auth-login-cinematic .auth-top .brand strong{color:#f1fff9;font-size:17px}.auth-login-cinematic .auth-top .brand small{color:#78dcb7;font-size:8px;letter-spacing:1.5px}
.auth-login-cinematic .auth-top>a:last-child{padding:7px 12px;color:#b9e8d6!important;border:1px solid rgba(150,255,215,.14)!important;border-radius:999px;background:rgba(173,255,224,.055)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.auth-login-cinematic .auth-top>a:last-child:hover{color:#fff!important;border-color:rgba(91,244,186,.38)!important;background:rgba(25,201,135,.18)!important}
.auth-login-cinematic .form-step{display:inline-flex;align-items:center;gap:8px;color:#6fe0b5!important;font-size:11px;font-weight:800;letter-spacing:.04em}.auth-login-cinematic .form-step::before{content:"";width:7px;height:7px;border-radius:50%;background:#35e6a4;box-shadow:0 0 0 5px rgba(53,230,164,.1),0 0 18px #35e6a4;animation:ocPulse 2.2s ease-out infinite}
.auth-login-cinematic .auth-box h1{margin:15px 0 7px;color:#f2fff9!important;font-size:clamp(27px,4vw,34px);line-height:1.45;letter-spacing:-.7px}.auth-login-cinematic .auth-box .intro{margin-bottom:25px;color:var(--oc-muted)!important;font-size:13px}
.auth-login-cinematic .role-tabs{gap:6px;padding:5px;margin-bottom:25px;border:1px solid rgba(183,255,226,.12)!important;border-radius:16px;background:rgba(1,15,11,.28)!important;box-shadow:inset 0 1px 8px rgba(0,0,0,.16)}
.auth-login-cinematic .role-tabs a{padding:10px 5px;border:1px solid transparent;border-radius:11px;color:#8fb3a5!important}.auth-login-cinematic .role-tabs a:hover{color:#dffff2!important;background:rgba(133,255,207,.06)!important}.auth-login-cinematic .role-tabs a.active{color:#ecfff7!important;border-color:rgba(125,255,205,.21);background:linear-gradient(135deg,rgba(34,214,147,.28),rgba(9,100,75,.34))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 8px 24px rgba(0,0,0,.2)!important}
.auth-login-cinematic .auth-box label{color:#c6e2d7!important;font-size:12px}.auth-login-cinematic .auth-box input:not([type=checkbox]):not([type=radio]):not([type=hidden]){min-height:54px;color:#f0fff8!important;caret-color:#36e5a5;border:1px solid rgba(175,255,224,.14)!important;border-radius:15px;background:rgba(1,15,11,.32)!important;box-shadow:inset 0 1px 8px rgba(0,0,0,.18),0 1px 0 rgba(255,255,255,.035)}
.auth-login-cinematic .auth-box input::placeholder{color:#739589}.auth-login-cinematic .auth-box input:focus{border-color:rgba(57,231,166,.7)!important;background:rgba(3,27,20,.55)!important;box-shadow:0 0 0 4px rgba(45,226,158,.1),0 0 30px rgba(32,216,146,.09)!important}.auth-login-cinematic .password-toggle{color:#78dcb7}.auth-login-cinematic .form-meta{color:#86a99b}.auth-login-cinematic .form-meta a{color:#6fe0b5}
.auth-login-cinematic .auth-box .btn.full{position:relative;overflow:hidden;min-height:56px;color:#effff8;border:1px solid rgba(151,255,215,.3);border-radius:16px;background:linear-gradient(135deg,rgba(24,221,150,.78),rgba(4,106,78,.82))!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 1px 0 rgba(255,255,255,.24),inset 0 -8px 22px rgba(0,62,44,.2),0 15px 36px rgba(4,124,88,.3)!important}
.auth-login-cinematic .auth-box .btn.full::before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 28%,rgba(255,255,255,.22) 48%,transparent 68%);transform:translateX(-130%);transition:transform .7s ease}.auth-login-cinematic .auth-box .btn.full:hover{transform:translateY(-2px);border-color:rgba(190,255,230,.52);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 20px 48px rgba(8,174,119,.37)!important}.auth-login-cinematic .auth-box .btn.full:hover::before{transform:translateX(130%)}
.auth-login-cinematic .auth-box .btn.secondary.full{color:#bff3df;background:rgba(113,255,200,.07)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important}.auth-login-cinematic .auth-bottom{color:#9ab9ad!important;border:1px solid rgba(162,255,219,.1)!important;background:rgba(151,255,211,.045)!important}.auth-login-cinematic .auth-bottom a{color:#72e1b6}.auth-login-cinematic .auth-security{color:#688d7f!important;border-color:rgba(175,255,224,.1)!important}.auth-login-cinematic .auth-divider{color:#6f9587}.auth-login-cinematic .auth-divider::before,.auth-login-cinematic .auth-divider::after{background:rgba(177,255,225,.11)}
.auth-login-cinematic .error{color:#ffd9db;background:rgba(151,32,48,.25);border-color:rgba(255,145,158,.22)}.auth-login-cinematic .notice{color:#cffff0;background:rgba(25,148,103,.22);border-color:rgba(104,255,197,.18)}
.auth-login-cinematic .display-open{position:fixed;z-index:20;top:22px;left:22px;min-width:44px;color:#bff3df!important;border-color:rgba(159,255,218,.18)!important;background:rgba(7,35,27,.52)!important;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 12px 30px rgba(0,0,0,.2)}
@keyframes ocEnter{from{opacity:0;transform:translateY(24px) scale(.975)}to{opacity:1;transform:none}}@keyframes ocFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-18px,0)}}@keyframes ocHalo{from{transform:translate(-50%,-50%) scale(.96) rotate(0);opacity:.65}to{transform:translate(-50%,-50%) scale(1.04) rotate(8deg);opacity:1}}@keyframes ocPulse{0%{box-shadow:0 0 0 0 rgba(53,230,164,.42),0 0 14px #35e6a4}75%,100%{box-shadow:0 0 0 9px rgba(53,230,164,0),0 0 18px #35e6a4}}
@media(max-width:620px){.auth-login-cinematic .auth-page{padding:12px}.auth-login-cinematic .auth-main{min-height:calc(100svh - 24px);padding:56px 4px 18px;align-items:center}.auth-login-cinematic .auth-box{padding:28px 21px 23px;border-radius:25px}.auth-login-cinematic .auth-top{align-items:flex-start;margin-bottom:27px}.auth-login-cinematic .auth-top .brand img{width:40px;height:40px}.auth-login-cinematic .auth-top .brand strong{font-size:15px}.auth-login-cinematic .auth-top>a:last-child{font-size:10px;padding:6px 9px}.auth-login-cinematic .auth-main::before{margin:-420px 0 0 -220px}.auth-login-cinematic .auth-main::after{margin:480px -240px 0 0}.auth-login-cinematic .display-open{top:14px;left:14px}}
@media(prefers-reduced-motion:reduce){.auth-login-cinematic *,.auth-login-cinematic *::before,.auth-login-cinematic *::after{animation:none!important;transition-duration:.01ms!important}}

/* b1 — compact, landing-matched, and deliberately lighter on GPU work. */
body.auth-login-cinematic{--oc-ink:#f3f7f5;--oc-muted:#9aa8a2;--oc-jade:#35e3a4;--oc-line:rgba(213,242,229,.13);background:radial-gradient(circle at 18% 8%,rgba(53,227,164,.11),transparent 30%),radial-gradient(circle at 86% 88%,rgba(240,193,120,.055),transparent 25%),#050807!important}
body.auth-login-cinematic::before{inset:0;opacity:.16;background-size:68px 68px;transform:none;mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 82%)}
body.auth-login-cinematic::after{display:none}
.auth-login-cinematic .auth-page{padding:clamp(14px,2.5vw,34px)}
.auth-login-cinematic .auth-main{min-height:calc(100svh - clamp(28px,5vw,68px));padding:18px 12px}
.auth-login-cinematic .auth-main::before{width:220px;height:220px;margin:-290px 0 0 -430px;filter:none;animation:none;border-color:rgba(53,227,164,.13);background:radial-gradient(circle,rgba(53,227,164,.07),transparent 68%);box-shadow:none}
.auth-login-cinematic .auth-main::after{display:none}
.auth-login-cinematic .auth-box{width:min(100%,420px);max-width:420px;padding:28px 30px 24px;border-radius:26px;background:linear-gradient(145deg,rgba(16,22,20,.9),rgba(7,11,9,.88))!important;-webkit-backdrop-filter:blur(16px) saturate(120%);backdrop-filter:blur(16px) saturate(120%);box-shadow:0 24px 70px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.08)!important;animation:ocEnterLite .34s ease-out both}
.auth-login-cinematic .auth-box::before{background:radial-gradient(circle at 8% 0,rgba(53,227,164,.1),transparent 32%)}.auth-login-cinematic .auth-box::after{display:none}
.auth-login-cinematic .auth-top{margin-bottom:22px}.auth-login-cinematic .auth-top .brand img{width:40px;height:40px;border-radius:13px}.auth-login-cinematic .auth-top .brand strong{font-size:16px}.auth-login-cinematic .auth-top>a:last-child{padding:6px 10px}
.auth-login-cinematic .form-step{color:#f0c178!important}.auth-login-cinematic .form-step::before{background:#f0c178;box-shadow:0 0 0 4px rgba(240,193,120,.1);animation:none}
.auth-login-cinematic .auth-box h1{font-size:27px;margin:11px 0 5px}.auth-login-cinematic .auth-box .intro{font-size:12px;line-height:1.85;margin-bottom:18px}
.auth-login-cinematic .role-tabs{margin-bottom:18px}.auth-login-cinematic .role-tabs a{padding:8px 5px}.auth-login-cinematic .role-tabs a.active{border-color:rgba(53,227,164,.3);background:rgba(53,227,164,.12)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important}
.auth-login-cinematic .auth-box .field{margin-bottom:14px}.auth-login-cinematic .auth-box input:not([type=checkbox]):not([type=radio]):not([type=hidden]){min-height:48px;border-radius:13px;background:#0a0f0dcc!important}.auth-login-cinematic .form-meta{margin:7px 0 17px}
.auth-login-cinematic .auth-box .btn.full{min-height:50px;border-color:rgba(53,227,164,.42);border-radius:14px;background:linear-gradient(135deg,rgba(53,227,164,.82),rgba(15,185,150,.66))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 25px rgba(15,185,150,.16)!important}.auth-login-cinematic .auth-box .btn.full:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 13px 30px rgba(15,185,150,.22)!important}
.auth-login-cinematic .auth-bottom{margin-top:17px;padding:10px}.auth-login-cinematic .auth-security{margin-top:18px;padding-top:14px}.auth-login-cinematic .display-open{display:none!important}
@keyframes ocEnterLite{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:620px){.auth-login-cinematic .auth-page{padding:8px}.auth-login-cinematic .auth-main{min-height:calc(100svh - 16px);padding:18px 2px}.auth-login-cinematic .auth-box{padding:23px 20px 19px;border-radius:22px}.auth-login-cinematic .auth-top{margin-bottom:18px}.auth-login-cinematic .auth-box h1{font-size:25px}.auth-login-cinematic .auth-main::before{display:none}}