:root{--yellow-primary: #FFD700;--yellow-dim: rgba(255, 215, 0, .3);--green-primary: #4ade80;--green-dim: rgba(74, 222, 128, .1);--bg-dark: #050505;--bg-card: #0a0a0a;--border-color: #222}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--bg-dark);color:#e0e0e0;font-family:JetBrains Mono,monospace;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow-x:hidden}.bg-grid{position:fixed;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:40px 40px;z-index:-1;pointer-events:none;opacity:.5}.login-container{width:100%;max-width:480px;padding:20px}.login-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:8px;overflow:hidden}.login-header{padding:40px 40px 30px;text-align:center;border-bottom:1px solid var(--border-color)}.login-logo{height:60px;margin-bottom:20px}.login-title{font-size:1.5rem;color:var(--yellow-primary);font-weight:500;letter-spacing:2px;margin-bottom:10px}.login-subtitle{font-size:.8rem;color:#666}.error-message{margin:20px 40px 0;padding:15px;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:4px;color:#ef4444;font-size:.85rem;display:flex;align-items:center;gap:10px}.error-icon{width:20px;height:20px;background:#ef4444;color:#000;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.75rem;flex-shrink:0}.success-message{margin:20px 40px 0;padding:15px;background:#4ade801a;border:1px solid rgba(74,222,128,.3);border-radius:4px;color:var(--green-primary);font-size:.85rem;display:flex;align-items:center;gap:10px}.success-icon{width:20px;height:20px;background:var(--green-primary);color:#000;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.75rem;flex-shrink:0}.login-content{padding:30px 40px 40px}.terminal-box{background:#000;border:1px solid var(--border-color);border-radius:6px;margin-bottom:30px;overflow:hidden}.terminal-header{background:#111;padding:10px 15px;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--border-color)}.terminal-dot{width:10px;height:10px;border-radius:50%;background:#333}.terminal-dot:first-child{background:#ff5f56}.terminal-dot:nth-child(2){background:#ffbd2e}.terminal-dot:nth-child(3){background:#27ca3f}.terminal-title{margin-left:auto;font-size:.7rem;color:#666}.terminal-body{padding:15px}.terminal-line{font-size:.8rem;color:#888;margin-bottom:8px;display:flex;gap:10px}.terminal-line:last-child{margin-bottom:0}.terminal-prompt{color:var(--green-primary)}.terminal-blink{color:var(--yellow-primary);animation:blink 1s infinite}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.google-btn{display:flex;align-items:center;justify-content:center;gap:15px;width:100%;padding:16px 24px;background:transparent;border:1px solid var(--yellow-primary);border-radius:4px;color:var(--yellow-primary);font-family:JetBrains Mono,monospace;font-size:.9rem;text-decoration:none;transition:all .2s;cursor:pointer}.google-btn:hover{background:var(--yellow-primary);color:#000}.google-btn:hover .google-icon path{fill:#000}.google-icon{width:20px;height:20px;transition:all .2s}.login-divider{display:flex;align-items:center;margin:25px 0}.login-divider:before,.login-divider:after{content:"";flex:1;height:1px;background:var(--border-color)}.login-divider span{padding:0 15px;font-size:.7rem;color:#444;letter-spacing:1px}.dev-login-form{display:flex;flex-direction:column;gap:12px}.dev-login-form .form-group{margin:0}.dev-login-form .form-input{width:100%;padding:12px 15px;background:#000;border:1px solid var(--border-color);border-radius:4px;color:#fff;font-family:JetBrains Mono,monospace;font-size:.85rem;transition:border-color .2s}.dev-login-form .form-input:focus{outline:none;border-color:var(--green-primary)}.dev-login-form .form-input::placeholder{color:#444}.dev-login-btn{width:100%;padding:14px;background:transparent;border:1px solid var(--green-primary);border-radius:4px;color:var(--green-primary);font-family:JetBrains Mono,monospace;font-size:.85rem;cursor:pointer;transition:all .2s}.dev-login-btn:hover{background:var(--green-primary);color:#000}.login-info{font-size:.75rem;color:#555;text-align:center;line-height:1.6}.login-info a{color:var(--yellow-primary);text-decoration:none}.login-info a:hover{text-decoration:underline}.login-footer{text-align:center;padding:20px;font-size:.75rem;color:#444}.profile-form{display:flex;flex-direction:column;gap:25px}.avatar-upload-section{display:flex;flex-direction:column;align-items:center;gap:15px}.avatar-preview{width:120px;height:120px;border-radius:50%;border:2px dashed var(--border-color);display:flex;align-items:center;justify-content:center;overflow:hidden;background:#000}.avatar-preview img{width:100%;height:100%;object-fit:cover}.avatar-placeholder{font-size:2rem;color:#333}.avatar-upload-btn{padding:10px 20px;background:transparent;border:1px solid var(--border-color);color:#888;font-family:JetBrains Mono,monospace;font-size:.8rem;cursor:pointer;transition:all .2s}.avatar-upload-btn:hover{border-color:var(--yellow-primary);color:var(--yellow-primary)}.avatar-hint{font-size:.7rem;color:#555}.form-group{display:flex;flex-direction:column;gap:8px}.form-label{font-size:.75rem;color:#888;letter-spacing:1px}.profile-form .form-input{padding:14px 16px;background:#000;border:1px solid var(--border-color);border-radius:4px;color:#fff;font-family:JetBrains Mono,monospace;font-size:.95rem}.profile-form .form-input:focus{outline:none;border-color:var(--yellow-primary)}.profile-form .form-input::placeholder{color:#444}.form-hint{font-size:.7rem;color:#555}.submit-btn{padding:16px 24px;background:var(--yellow-primary);border:none;color:#000;font-family:JetBrains Mono,monospace;font-size:.9rem;font-weight:700;cursor:pointer;transition:all .2s}.submit-btn:hover{box-shadow:0 0 30px #ffd70066}.profile-actions{margin-top:20px;text-align:center}.profile-actions .back-link{color:#666;text-decoration:none;font-size:.85rem;transition:color .2s}.profile-actions .back-link:hover{color:var(--yellow-primary)}@media(max-width:520px){.login-container{padding:15px}.login-header{padding:30px 25px 25px}.login-content{padding:25px}.login-title{font-size:1.3rem}}
