:root{--access-bg:#03050b;--access-panel:rgba(7,13,25,.92);--access-cyan:#32dcff;--access-magenta:#ff3ed1;--access-amber:#ffd95a;--access-text:#edf8ff;--access-muted:#8ca6ba;--access-line:rgba(50,220,255,.24)}
html{color-scheme:dark;background:var(--access-bg)}
body{position:relative;min-height:100vh;padding:96px 20px 42px;overflow-x:hidden;overflow-y:auto;color:var(--access-text);background:radial-gradient(circle at var(--login-pointer-x,82%) var(--login-pointer-y,12%),rgba(255,62,209,.16),transparent 24rem),radial-gradient(circle at 8% 10%,rgba(50,116,255,.2),transparent 34rem),linear-gradient(rgba(50,220,255,.027) 1px,transparent 1px),linear-gradient(90deg,rgba(50,220,255,.027) 1px,transparent 1px),var(--access-bg)!important;background-size:auto,auto,34px 34px,34px 34px,auto!important}
body::before{inset:0!important;width:100%!important;height:100%!important;background:linear-gradient(115deg,transparent 0 45%,rgba(50,220,255,.05) 50%,transparent 55%)!important;background-size:230% 100%!important;filter:none!important;opacity:1!important;animation:accessSweep 10s linear infinite;pointer-events:none}
body::after{inset:0!important;width:100%!important;height:100%!important;z-index:20;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.014) 4px)!important;filter:none!important;opacity:.34!important;pointer-events:none}
@keyframes accessSweep{to{background-position:-230% 0}}
.access-topbar{position:fixed;z-index:15;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;min-height:64px;padding:10px clamp(18px,5vw,72px);border-bottom:1px solid var(--access-line);background:rgba(3,6,14,.86);box-shadow:0 12px 38px rgba(0,0,0,.32);backdrop-filter:blur(18px)}
.access-topbar-brand{display:flex;align-items:center;gap:11px;color:#fff;font-size:11px;font-weight:800;letter-spacing:.12em}
.access-topbar-mark{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--access-cyan);border-radius:8px 1px 8px 1px;color:var(--access-cyan);box-shadow:0 0 17px rgba(50,220,255,.14),inset 0 0 14px rgba(50,220,255,.08)}
.access-topbar-status{display:flex;align-items:center;gap:8px;color:var(--access-cyan);font:700 9px/1 Consolas,monospace;letter-spacing:.16em}
.access-topbar-actions{display:flex;align-items:center;gap:18px}
.access-back{display:inline-flex;align-items:center;min-height:34px;padding:0 12px;border:1px solid rgba(50,220,255,.28);border-radius:6px 1px 6px 1px;color:#b9cfdf;text-decoration:none;font:700 9px/1 Consolas,monospace;letter-spacing:.1em;text-transform:uppercase;background:rgba(50,220,255,.045);transition:.2s ease}
.access-back:hover{border-color:var(--access-magenta);color:#fff;box-shadow:0 0 18px rgba(255,62,209,.14);transform:translateY(-1px)}
.access-topbar-status::before{content:"";width:7px;height:7px;border-radius:50%;background:#31f3a3;box-shadow:0 0 12px #31f3a3;animation:statusPulse 1.8s ease-in-out infinite}
@keyframes statusPulse{50%{opacity:.35;transform:scale(.78)}}
.access-scene{position:fixed;inset:64px 0 0;overflow:hidden;pointer-events:none}
.access-orbit{position:absolute;left:50%;top:50%;width:min(74vw,850px);aspect-ratio:1;border:1px solid rgba(50,220,255,.09);border-radius:50%;transform:translate(-50%,-50%);background:repeating-radial-gradient(circle,transparent 0 58px,rgba(50,220,255,.035) 59px 60px);animation:accessOrbit 32s linear infinite}
.access-orbit::before,.access-orbit::after{content:"";position:absolute;border-radius:50%;border:1px dashed rgba(255,62,209,.11)}
.access-orbit::before{inset:13%}.access-orbit::after{inset:29%;border-color:rgba(255,217,90,.09)}
@keyframes accessOrbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
.access-beam{position:absolute;top:-20%;left:50%;width:1px;height:140%;background:linear-gradient(transparent,rgba(50,220,255,.34),transparent);box-shadow:0 0 22px rgba(50,220,255,.3);transform:rotate(32deg);transform-origin:center;animation:beamScan 7s ease-in-out infinite alternate}
@keyframes beamScan{to{transform:rotate(145deg)}}
.login-box{z-index:5;width:min(100%,470px);padding:34px 38px 30px;border:1px solid var(--access-line);border-radius:14px 2px 14px 2px;background:linear-gradient(145deg,rgba(10,18,33,.94),rgba(4,9,18,.97));box-shadow:0 30px 90px rgba(0,0,0,.48),0 0 50px rgba(50,220,255,.07),inset 0 1px rgba(255,255,255,.035);animation:panelArrival .8s cubic-bezier(.2,.8,.2,1) both}
.login-box::before{content:"AUTH NODE // 03";display:block;width:max-content;margin-bottom:24px;color:var(--access-muted);font:700 9px/1 Consolas,monospace;letter-spacing:.18em}
.login-box::after{content:"";position:absolute;right:-1px;top:-1px;width:86px;height:3px;background:linear-gradient(90deg,var(--access-magenta),var(--access-cyan));box-shadow:0 0 18px rgba(50,220,255,.35)}
@keyframes panelArrival{from{opacity:0;transform:translateY(25px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.logo{margin:0 0 7px;color:#fff;font-size:clamp(27px,7vw,38px);letter-spacing:-.03em;text-shadow:0 0 24px rgba(50,220,255,.2)}
.logo span{color:var(--access-magenta);text-shadow:0 0 18px rgba(255,62,209,.42)}
.subtitle{margin-bottom:29px;color:var(--access-cyan);font:700 10px/1.3 Consolas,monospace;letter-spacing:.2em}
.input-group{position:relative;margin-bottom:17px}.input-group label{margin-bottom:8px;color:#b8cadd;font:700 10px/1.2 Consolas,monospace;letter-spacing:.12em;text-transform:uppercase}
.security-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}
.input-group input,.input-group select{min-height:49px;padding:13px 14px;border:1px solid rgba(140,166,186,.27);border-radius:7px 1px 7px 1px;color:#fff;font-family:'Orbitron',sans-serif;background:rgba(2,7,15,.88);box-shadow:inset 0 0 0 1px rgba(0,0,0,.2)}
.input-group input::placeholder{color:#566a7d}.input-group input:focus,.input-group select:focus{border-color:var(--access-cyan);box-shadow:0 0 0 3px rgba(50,220,255,.09),0 0 20px rgba(50,220,255,.08)}.input-group:focus-within label{color:var(--access-cyan)}
.login-btn{min-height:51px;margin-top:5px;border:1px solid rgba(50,220,255,.7);border-radius:7px 1px 7px 1px;color:#021017;font-size:12px;letter-spacing:.1em;background:linear-gradient(110deg,var(--access-cyan),#83ebff 56%,#baf5ff);box-shadow:0 12px 30px rgba(50,220,255,.14);animation:loginPulse 2.8s ease-in-out infinite}
.login-btn:hover{border-color:var(--access-magenta);box-shadow:0 15px 35px rgba(50,220,255,.2),0 0 28px rgba(255,62,209,.13);transform:translateY(-2px)}.login-btn::before,.login-btn::after{color:var(--access-magenta)}
@keyframes loginPulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.08);box-shadow:0 12px 34px rgba(50,220,255,.24)}}
.error{padding:11px;border:1px solid rgba(255,85,119,.35);border-radius:6px 1px 6px 1px;color:#ff8098;background:rgba(255,85,119,.07)}
.footer{margin-top:22px;color:#62798c;font:700 9px/1.4 Consolas,monospace;letter-spacing:.1em}
@media(max-width:620px){body{align-items:flex-start;padding:98px 12px 24px}.access-topbar{min-height:78px;padding:9px 13px}.access-topbar-brand{font-size:9px}.access-topbar-actions{align-items:flex-end;flex-direction:column;gap:6px}.access-back{min-height:28px;padding:0 8px;font-size:7px}.access-topbar-status{font-size:7px;letter-spacing:.08em}.login-box{width:100%;padding:25px 20px 23px}.login-box::before{margin-bottom:18px}.logo{font-size:27px}.subtitle{margin-bottom:23px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
