/* auth.css — login & register pages */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#040810;--bg2:#070d18;--bg3:#0c1525;
  --g:#00ff88;--g2:#00d4ff;--g3:#7b2fff;
  --border:rgba(0,255,136,.12);--border2:rgba(0,212,255,.1);
  --muted:#2a4a62;--text:#7aafc8;--text2:#c0dce8;--white:#e8f4f8;
  --danger:#ff3b5c;--warn:#f59e0b;--ok:#00ff88;
  --mono:'Space Mono',monospace;--display:'Bebas Neue',sans-serif;--body:'Inter',sans-serif;
}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--text2);font-family:var(--body);overflow-x:hidden;cursor:none;display:flex;flex-direction:column;min-height:100vh}
#bgCanvas{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.45}
body::after{content:'';position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");pointer-events:none;z-index:1;opacity:.3}
#cur{position:fixed;width:8px;height:8px;background:var(--g);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:width .15s,height .15s;box-shadow:0 0 10px var(--g)}
#cur2{position:fixed;width:30px;height:30px;border:1px solid rgba(0,255,136,.35);border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:width .2s,height .2s}
@media(hover:none){#cur,#cur2{display:none}body{cursor:auto}}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:500;display:flex;justify-content:space-between;align-items:center;padding:1.1rem 3rem;background:rgba(4,8,16,.85);backdrop-filter:blur(20px);border-bottom:1px solid rgba(0,255,136,.07)}
.nav-logo{font-family:var(--mono);font-size:.78rem;color:var(--g);letter-spacing:.14em;text-decoration:none}
.nav-logo span{color:var(--g2)}
.nav-back{font-family:var(--mono);font-size:.65rem;color:var(--muted);text-decoration:none;letter-spacing:.1em;transition:color .2s;cursor:none}
.nav-back:hover{color:var(--g)}

/* MAIN */
.auth-main{flex:1;display:flex;align-items:center;justify-content:center;padding:7rem 1.5rem 3rem;position:relative;z-index:2}
.auth-wrap{width:100%;max-width:440px}
.auth-logo{font-family:var(--display);font-size:2.4rem;color:var(--white);letter-spacing:.06em;margin-bottom:.2rem;text-shadow:0 0 30px rgba(0,229,255,.2)}
.auth-logo span{color:var(--g)}
.auth-subtitle{font-family:var(--mono);font-size:.6rem;color:var(--muted);letter-spacing:.2em;margin-bottom:2.2rem}
.auth-card{background:rgba(6,13,26,.9);border:1px solid rgba(0,255,136,.1);border-radius:12px;overflow:hidden;box-shadow:0 0 60px rgba(0,255,136,.04),0 24px 80px rgba(0,0,0,.6)}
.auth-card-bar{height:2px;background:linear-gradient(90deg,var(--g),var(--g2),var(--g3))}
.auth-card-body{padding:2rem}

/* TABS */
.auth-tabs{display:flex;margin-bottom:1.8rem;border-bottom:1px solid rgba(0,255,136,.08)}
.auth-tab{font-family:var(--mono);font-size:.65rem;letter-spacing:.12em;color:var(--muted);padding:.6rem 1.2rem;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .2s;text-decoration:none;display:block}
.auth-tab:hover{color:var(--text2)}
.auth-tab.active{color:var(--g);border-bottom-color:var(--g)}

/* FORM */
.form-group{margin-bottom:1rem}
.form-label{font-family:var(--mono);font-size:.58rem;color:var(--g2);letter-spacing:.18em;display:block;margin-bottom:.4rem}
.form-input{width:100%;background:rgba(0,0,0,.3);border:1px solid rgba(0,255,136,.1);border-radius:6px;padding:.78rem 1rem;font-family:var(--mono);font-size:.72rem;color:var(--white);outline:none;transition:border-color .2s,box-shadow .2s;cursor:text}
.form-input:focus{border-color:rgba(0,255,136,.35);box-shadow:0 0 0 3px rgba(0,255,136,.05)}
.form-input::placeholder{color:var(--muted)}
.form-input.error{border-color:rgba(255,59,92,.4)}
.form-hint{font-family:var(--mono);font-size:.55rem;color:var(--muted);margin-top:.3rem;letter-spacing:.05em}

/* INPUT WITH ICON */
.input-wrap{position:relative}
.input-wrap .form-input{padding-right:2.5rem}
.input-icon{position:absolute;right:.9rem;top:50%;transform:translateY(-50%);font-size:.8rem;cursor:pointer;user-select:none;color:var(--muted);transition:color .2s}
.input-icon:hover{color:var(--g)}

/* PASSWORD STRENGTH */
.pw-strength{margin-top:.5rem}
.pw-bar{display:flex;gap:3px;margin-bottom:.3rem}
.pw-seg{flex:1;height:3px;border-radius:2px;background:rgba(255,255,255,.06);transition:background .3s}
.pw-label{font-family:var(--mono);font-size:.52rem;color:var(--muted);letter-spacing:.1em}

/* ALERT */
.alert{font-family:var(--mono);font-size:.62rem;padding:.65rem .9rem;border-radius:5px;margin-bottom:1rem;display:none;line-height:1.5}
.alert.show{display:block}
.alert-error{background:rgba(255,59,92,.08);border:1px solid rgba(255,59,92,.2);color:var(--danger)}
.alert-success{background:rgba(0,255,136,.06);border:1px solid rgba(0,255,136,.15);color:var(--ok)}
.alert-info{background:rgba(0,212,255,.06);border:1px solid rgba(0,212,255,.15);color:var(--g2)}

/* BUTTONS */
.btn-submit{width:100%;background:var(--g);color:#040810;border:none;border-radius:6px;padding:.88rem;font-family:var(--mono);font-size:.72rem;font-weight:700;letter-spacing:.15em;cursor:pointer;transition:all .2s;margin-top:.3rem;position:relative;overflow:hidden}
.btn-submit::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,var(--g),var(--g2));opacity:0;transition:opacity .2s}
.btn-submit:hover::before{opacity:1}
.btn-submit:hover{transform:translateY(-1px);box-shadow:0 6px 24px rgba(0,255,136,.25)}
.btn-submit span{position:relative;z-index:1}
.btn-submit:disabled{background:rgba(0,255,136,.15);color:rgba(0,255,136,.3);cursor:not-allowed;transform:none}
.btn-submit:disabled::before{display:none}

/* DIVIDER */
.or-divider{display:flex;align-items:center;gap:.8rem;margin:1.2rem 0}
.or-divider::before,.or-divider::after{content:'';flex:1;height:1px;background:rgba(0,255,136,.08)}
.or-divider span{font-family:var(--mono);font-size:.55rem;color:var(--muted);letter-spacing:.15em}

/* DEMO ROLES */
.demo-section{margin-top:.8rem}
.demo-label{font-family:var(--mono);font-size:.55rem;color:var(--muted);letter-spacing:.12em;margin-bottom:.5rem;text-align:center}
.demo-roles{display:flex;gap:.4rem;justify-content:center;flex-wrap:wrap}
.demo-role{font-family:var(--mono);font-size:.58rem;padding:.3rem .7rem;border-radius:4px;cursor:pointer;transition:all .2s;border:1px solid transparent;letter-spacing:.08em}
.dr-admin{background:rgba(124,58,237,.1);color:#a78bfa;border-color:rgba(124,58,237,.25)}
.dr-client{background:rgba(0,212,255,.07);color:var(--g2);border-color:rgba(0,212,255,.2)}
.dr-user{background:rgba(0,255,136,.07);color:var(--g);border-color:rgba(0,255,136,.18)}
.demo-role:hover{filter:brightness(1.3);transform:translateY(-1px)}
.demo-hint{font-family:var(--mono);font-size:.55rem;color:var(--muted);text-align:center;margin-top:.6rem;line-height:1.6}
.demo-hint strong{color:var(--text2)}

/* CHECKLIST */
.req-list{list-style:none;display:flex;flex-direction:column;gap:.25rem;margin-top:.4rem}
.req-item{font-family:var(--mono);font-size:.58rem;color:var(--muted);display:flex;align-items:center;gap:.5rem;letter-spacing:.05em;transition:color .2s}
.req-item.met{color:var(--ok)}
.req-icon{font-size:.65rem;width:12px;text-align:center}

/* FOOTER */
.auth-footer{position:relative;z-index:2;text-align:center;padding:1.5rem;font-family:var(--mono);font-size:.6rem;color:var(--muted)}
.auth-footer a{color:var(--g2);text-decoration:none}

/* LOADING SPINNER */
.spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(4,8,16,.3);border-top-color:#040810;border-radius:50%;animation:spin .6s linear infinite;vertical-align:middle;margin-right:.4rem}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.auth-wrap{animation:fadeUp .5s ease forwards}