:root{--blue: #1d6fff;--blue-dim: #1558cc;--blue-glow: rgba(29, 111, 255, .18);--bg: #080b10;--surface: #0d1117;--surface2: #111820;--border: rgba(29, 111, 255, .15);--border2: rgba(255,255,255,.06);--text: #e8eaed;--text-muted: #6b7280;--red: #ef4444;--green: #22c55e;--font-mono: "JetBrains Mono", "Fira Code", monospace}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;min-height:100vh;display:flex;flex-direction:column}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 60% at 50% -10%,rgba(29,111,255,.12) 0%,transparent 70%),radial-gradient(ellipse 60% 40% at 80% 80%,rgba(29,111,255,.06) 0%,transparent 60%);pointer-events:none;z-index:0}#app{position:relative;z-index:1;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px}.form{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:36px 32px;width:100%;max-width:400px;box-shadow:0 0 0 1px #1d6fff14,0 8px 32px #00000080,0 0 60px #1d6fff0f}.form-title{font-size:1.35rem;font-weight:700;color:var(--text);text-align:center;margin-bottom:24px;letter-spacing:-.3px}.form-title.centered{font-size:1.35rem;font-weight:700;text-align:center;color:var(--text);margin-bottom:24px;letter-spacing:-.3px;padding-bottom:0}.form-title.centered:after{display:none}.form-title:after{display:none}.input-container{position:relative;margin-bottom:14px;display:flex;align-items:center}.input-container input{width:100%;background:var(--surface2);border:1px solid var(--border2);border-radius:8px;padding:11px 44px 11px 14px;font-size:.9rem;color:var(--text);outline:none;transition:border-color .2s,box-shadow .2s;font-family:inherit}.input-container input::placeholder{color:var(--text-muted)}.input-container input:focus{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-glow);background:var(--surface2)}.email-icon,.password-toggle,.key-icon,.telegram-icon{position:absolute;right:12px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);pointer-events:none;height:100%}.password-toggle{pointer-events:all;cursor:pointer;transition:color .2s}.password-toggle:hover{color:var(--blue)}.email-icon svg,.password-toggle svg,.key-icon svg,.telegram-icon svg{width:18px;height:18px}.submit{width:100%;background:var(--blue);color:#fff;border:none;border-radius:8px;padding:12px;font-size:.9rem;font-weight:600;cursor:pointer;margin-top:8px;transition:background .2s,box-shadow .2s,transform .1s;letter-spacing:.3px}.submit:hover{background:var(--blue-dim);box-shadow:0 4px 16px #1d6fff4d}.submit:active{transform:translateY(1px)}.signup-link{font-size:.82rem;color:var(--text-muted);text-align:center;margin-top:18px}.signup-link a,.forgot-password a{color:var(--blue);text-decoration:none;font-weight:600;transition:color .2s}.signup-link a:hover,.forgot-password a:hover{color:#5b9fff;text-decoration:underline}.forgot-password{text-align:right;margin-bottom:10px}.forgot-password a{font-size:.8rem}.form-header{display:flex;align-items:center;gap:12px;margin-bottom:20px}.header-left{flex-shrink:0}.header-right{flex:1}.back-button{background:var(--surface2);border:1px solid var(--border2);border-radius:7px;color:var(--text-muted);cursor:pointer;padding:7px;display:flex;align-items:center;justify-content:center;transition:color .2s,border-color .2s}.back-button:hover{color:var(--blue);border-color:var(--blue)}.back-button svg{width:20px;height:20px}.otp-message,.reset-message{font-size:.85rem;color:var(--text-muted);text-align:center;margin-bottom:18px;line-height:1.5}#otp-code{letter-spacing:.2rem;text-align:center;font-family:var(--font-mono);font-size:1rem}#otp-code::-webkit-outer-spin-button,#otp-code::-webkit-inner-spin-button{-webkit-appearance:none}#otp-code[type=number]{-moz-appearance:textfield}.text-red-500{color:var(--red)}.text-green-500{color:var(--green)}.text-sm{font-size:.8rem}.m-1{margin:4px 0}.m-2{margin:6px 0}.flex{display:flex}.justify-center{justify-content:center}.name-container{display:flex;gap:12px;width:100%}.name-container .input-container{flex:1;margin-bottom:14px}@media (max-width: 480px){#app{align-items:flex-start;padding:20px 12px}.form{padding:24px 20px;max-width:100%;border-radius:10px;margin-top:16px}.form-title,.form-title.centered{font-size:1.15rem;margin-bottom:18px}.input-container input{padding:10px 40px 10px 12px;font-size:.875rem}.submit{padding:11px;font-size:.875rem}}