@font-face{font-family:Century;src:url("/css/fonts/century_gothics/CenturyGothic.woff2") format("woff2");font-display:swap}
:root{--bg:#061522;--panel:#091b29;--ink:#eaf7fd;--muted:#8ea8ba;--cyan:#67d4f7;--line:rgba(146,205,231,.18)}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:Century,Arial,sans-serif}
button,input{font:inherit}.auth-page{min-height:100vh;display:grid;grid-template-columns:minmax(390px,46%) 1fr}
.auth-visual{position:relative;min-height:100vh;padding:42px clamp(30px,5vw,76px);display:flex;flex-direction:column;overflow:hidden;background:linear-gradient(180deg,rgba(4,19,32,.2),rgba(4,19,32,.85)),linear-gradient(90deg,rgba(4,19,32,.35),transparent),url("/img/wifi/mesh-hero.png") 62% center/cover}
.auth-visual:after{content:"";position:absolute;inset:0;border-right:1px solid rgba(153,215,239,.19);pointer-events:none}
.brand{position:relative;z-index:2;display:flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none}.brand strong{font-size:22px;letter-spacing:-1px}.brand small{font-size:8px;letter-spacing:2px;color:#87d5f0;border:1px solid rgba(135,213,240,.5);padding:4px 5px;border-radius:3px}.brand-signal{position:relative;width:25px;height:25px}.brand-signal i{position:absolute;inset:2px;border:1.5px solid var(--cyan);border-radius:50%}.brand-signal i:nth-child(2){inset:7px}.brand-signal i:nth-child(3){inset:11px;background:var(--cyan)}
.visual-copy{position:relative;z-index:2;margin:auto 0 10vh;max-width:590px}.visual-label{display:flex;align-items:center;gap:10px;color:#b1d7e5;text-transform:uppercase;letter-spacing:2.2px;font-size:9px}.visual-label i{width:25px;height:1px;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}.visual-copy h1{font-weight:400;font-size:clamp(54px,5vw,86px);line-height:1.02;letter-spacing:-.06em;margin:25px 0}.visual-copy h1 em{font-style:normal;color:#7acde9}.visual-copy p{max-width:500px;color:#a9bfcd;font-size:14px;line-height:1.75}
.network-state{position:relative;z-index:2;display:flex;align-items:center;gap:11px;padding-top:22px;border-top:1px solid rgba(255,255,255,.16);font-size:9px;letter-spacing:1px;text-transform:uppercase;color:#9eb4c2}.network-state i{width:6px;height:6px;border-radius:50%;background:#67dcff;box-shadow:0 0 10px #67dcff}.network-state b{margin-left:auto;color:#64ccec}
.auth-panel{min-height:100vh;background:radial-gradient(circle at 80% 15%,rgba(31,104,140,.13),transparent 28%),var(--panel);display:flex;flex-direction:column}.mobile-brand{display:none}.auth-wrap{width:min(500px,calc(100% - 48px));margin:auto;padding:55px 0}.auth-heading>span{color:#63ccee;text-transform:uppercase;letter-spacing:2px;font-size:8px}.auth-heading h2{font-size:clamp(36px,3.5vw,54px);font-weight:400;letter-spacing:-.05em;margin:13px 0 12px}.auth-heading p{color:var(--muted);font-size:12px;line-height:1.65;margin:0;max-width:450px}
.lock-shell{position:relative;width:300px;height:300px;margin:31px auto 0;border:1px solid var(--line);background:rgba(4,16,27,.3);box-shadow:inset 0 0 60px rgba(42,139,178,.05)}#lockCanvas{display:block;width:300px;height:300px;max-width:100%;touch-action:none;cursor:crosshair}.lock-progress{position:absolute;left:0;right:0;bottom:-1px;height:3px;background:rgba(255,255,255,.06)}.lock-progress i{display:block;width:0;height:100%;background:var(--cyan);box-shadow:0 0 9px var(--cyan);transition:width .2s}.lock-progress span{position:absolute;right:8px;bottom:9px;color:#567488;font-size:8px;letter-spacing:1px}
#btnReset{display:block;margin:12px auto 27px;border:0;background:none;color:#6ebbd8;font-size:9px;text-transform:uppercase;letter-spacing:1px;cursor:pointer;padding:7px}#btnReset:hover{color:#fff}
.phrase-field{margin-top:18px}.phrase-field label{display:block;color:#bbd1dd;font-size:10px;text-transform:uppercase;letter-spacing:1px;margin-bottom:9px}.phrase-field>div{display:flex;border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:3px}.phrase-field>div:focus-within{border-color:#66cfee;box-shadow:0 0 0 3px rgba(72,187,225,.08)}#phrase,#loginPhone{min-width:0;flex:1;background:none;border:0;outline:0;color:#fff;padding:16px;font-size:14px}#phrase::placeholder,#loginPhone::placeholder{color:#536d7e}#togglePhrase{border:0;background:none;color:#6d9caf;font-size:9px;text-transform:uppercase;cursor:pointer;padding:0 15px}.phrase-field small{display:block;color:#607c8d;font-size:8px;letter-spacing:.6px;margin-top:8px}
#error{min-height:31px;color:#ff9f9f;font-size:10px;padding:10px 0 6px}#btnLogin{width:100%;display:flex;align-items:center;justify-content:space-between;border:0;border-radius:3px;background:#d3f3fe;color:#071522;padding:17px 20px;font-size:12px;cursor:pointer;transition:.2s}#btnLogin:hover{background:#fff}#btnLogin:disabled{opacity:.55;cursor:wait}#btnLogin span{font-size:17px}.privacy-note{display:flex;align-items:flex-start;gap:8px;color:#657f90;font-size:8px;line-height:1.55;margin:13px 2px 0}.privacy-note i{font-style:normal;color:#65caeb}
.auth-panel footer{padding:24px 5vw;display:flex;justify-content:space-between;border-top:1px solid var(--line);color:#587284;font-size:8px;text-transform:uppercase;letter-spacing:1px}.auth-panel footer a{color:#71bad6;text-decoration:none}
@media(max-width:900px){.auth-page{display:block}.auth-visual{display:none}.auth-panel{min-height:100svh}.mobile-brand{display:block;padding:24px;border-bottom:1px solid var(--line)}.auth-wrap{padding:42px 0}.auth-panel footer{padding:22px 24px}}
@media(max-width:440px){.auth-wrap{width:calc(100% - 32px);padding:32px 0}.auth-heading h2{font-size:38px}.lock-shell,#lockCanvas{width:270px;height:270px}.lock-shell{margin-top:24px}.auth-panel footer{flex-direction:column;gap:10px}}
@media(prefers-reduced-motion:reduce){.lock-progress i{transition:none}}