.login-page{display:grid;min-height:100vh;place-items:center;overflow:hidden}
.login-shell{position:relative;z-index:2;width:min(100%,520px);padding:28px}
.login-card{position:relative;overflow:hidden;padding:50px 46px 38px;border:1px solid #3f9e68;background:linear-gradient(145deg,#06170edf,#020806f2);box-shadow:inset 0 0 65px #37e77e12,0 28px 90px #000b,0 0 42px #2ae5771f}
.login-card:before{content:"SECURITY PROTOCOL // MARK VII";position:absolute;left:22px;top:18px;color:#3b7b59;font-size:7px;letter-spacing:.22em}
.login-card:after{content:"";position:absolute;right:-62px;top:-62px;width:150px;height:150px;border:1px dashed #28764c;border-radius:50%;box-shadow:0 0 35px #2cda7418;animation:reactor 18s linear infinite}
.login-reactor{position:relative;width:78px;height:78px;margin:5px 0 30px;border:1px solid #5be89a;border-radius:50%;background:repeating-conic-gradient(#66f4a2 0 2deg,transparent 2deg 14deg);box-shadow:0 0 25px #40d78042;animation:reactor 15s linear infinite}
.login-reactor:before{content:"";position:absolute;inset:10px;border:1px dashed #347a52;border-radius:50%}.login-reactor i{position:absolute;inset:22px;border:1px solid #8ff3b8;border-radius:50%;background:#071b10}.login-reactor span{position:absolute;inset:33px;border-radius:50%;background:#8af0b2;box-shadow:0 0 8px #75e8a6}
.login-card h1{font-size:38px}.login-copy{margin:12px 0 28px;color:#8cad9a;line-height:1.6}.login-card form>label{display:block;margin-bottom:8px;color:#75c998;font-size:8px;letter-spacing:.18em}
.password-field{display:grid;grid-template-columns:1fr auto;border:1px solid #2d704b;background:#030b07}.password-field:focus-within{border-color:#72eda8;box-shadow:0 0 18px #38da7a2a}.password-field input{min-width:0;border:0;padding:15px;color:#d9ffe6;background:transparent;font:600 16px/1 ui-monospace,SFMono-Regular,Menlo,monospace;outline:0}.password-field button{border:0;border-left:1px solid #245f40;padding:0 13px;color:#68af86;background:#07170f;font:inherit;font-size:8px;cursor:pointer}
.login-button{width:100%;margin-top:14px;border:1px solid #6ef0a5;padding:15px;color:#031008;background:linear-gradient(90deg,#4bdd8a,#95ffc0);font:700 10px/1 inherit;letter-spacing:.14em;cursor:pointer}.login-button span{float:right}.login-button:hover{filter:brightness(1.1);box-shadow:0 0 24px #46e88c3d}.login-button:disabled{opacity:.55;cursor:wait}.login-message{min-height:20px;margin:14px 0 0;color:#ff9e9e;font-size:12px}.secure-note{display:flex;align-items:flex-start;gap:9px;margin-top:20px;padding-top:18px;border-top:1px solid #17482f}.secure-note span{color:#7cf0a7;text-shadow:0 0 8px #53e991}.secure-note p{margin:0;color:#5f8971;font-size:9px;line-height:1.6}
@media(max-width:560px){.login-shell{padding:16px}.login-card{padding:44px 24px 30px}.login-card h1{font-size:31px}.login-reactor{width:64px;height:64px}.login-reactor i{inset:18px}.login-reactor span{inset:27px}}
@media(prefers-reduced-motion:reduce){.login-card:after,.login-reactor{animation:none}}