*{margin:0;padding:0;box-sizing:border-box}body{overflow:hidden;background:#000}canvas{position:fixed;top:0;left:0}.auth-container{position:fixed;top:65%;left:50%;transform:translate(-50%,-50%);width:300px;padding:20px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:10px;color:#fff;z-index:100;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);opacity:.7;transition:opacity .15s ease}.auth-form{display:none;opacity:0;transform:translateY(20px);transition:opacity .3s,transform .3s}.auth-form.active{display:block;opacity:.7;transform:translateY(0)}.auth-form h2{text-align:center;margin-bottom:20px;color:#fff}.auth-input{width:100%;padding:10px;margin:10px 0;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:5px;color:#fff;font-size:16px}.auth-input::placeholder{color:#ffffff80}.auth-button{width:100%;padding:10px;margin:10px 0;background:rgba(255,255,255,.2);border:none;border-radius:5px;color:#fff;font-size:16px;cursor:pointer;transition:background .3s}.auth-button:hover{background:rgba(255,255,255,.3)}.switch-text{text-align:center;margin-top:10px;color:#ffffffb3}.switch-button{background:none;border:none;color:#ffffffb3;cursor:pointer;text-decoration:underline;padding:0 5px}.text-input{position:fixed;top:20px;left:50%;transform:translate(-50%);padding:10px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:5px;color:#fff;font-size:16px;width:300px;z-index:100}.text-input::placeholder{color:#ffffff80}
