body{display:flex;align-items:center;justify-content:center;min-height:100vh;margin:0;padding:20px;background:var(--surface)}.card{position:relative;z-index:1;width:100%;max-width:400px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-xl);padding:40px 36px 36px;box-shadow:var(--shadow-xl),inset 0 1px #ffffff0f;animation:fadeUp .5s cubic-bezier(.16,1,.3,1) both;transition:background var(--transition-slow),border-color var(--transition-slow),box-shadow var(--transition-slow)}body.light .card{background:var(--surface-2);border-color:var(--border);box-shadow:var(--shadow-xl),inset 0 1px #ffffff0f}.card:before{content:"";position:absolute;top:0;left:8%;right:8%;height:2.5px;background:linear-gradient(90deg,transparent,var(--primary),var(--primary-light),transparent);border-radius:0 0 4px 4px}.card:after{content:"";position:absolute;inset:-1px;border-radius:inherit;background:linear-gradient(135deg,rgba(37,99,235,.08),transparent 40%,transparent 60%,rgba(99,102,241,.08));pointer-events:none;z-index:-1}.header{text-align:center;margin-bottom:24px}.logo-wrap{width:56px;height:56px;border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--primary-bg),rgba(99,102,241,.12));border:1px solid var(--primary-border);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;box-shadow:0 0 24px var(--primary-bg)}.logo-svg{width:28px;height:28px;color:var(--primary)}.header h1{font-size:18px;font-weight:800;letter-spacing:-.02em;margin-bottom:4px}.header p{color:var(--text-muted);font-size:12px}.divider{height:1px;margin:0 0 22px;background:linear-gradient(90deg,transparent,var(--border),transparent)}.screen{display:none}.screen.active{display:block;animation:fadeUp .35s cubic-bezier(.16,1,.3,1) both}.field{margin-bottom:14px}.field label{display:block;font-size:11px;font-weight:600;color:var(--text-muted);margin-bottom:6px;letter-spacing:.01em}.input-wrap{position:relative}.input-wrap input{width:100%;padding:12px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);font-size:13px;font-family:inherit;outline:none;transition:border-color var(--transition-base),box-shadow var(--transition-base),background var(--transition-base)}.input-wrap input::placeholder{color:var(--text-muted);opacity:.6}.input-wrap input:focus{border-color:var(--primary);background:var(--primary-bg);box-shadow:0 0 0 3px var(--primary-border)}.toggle-pw{position:absolute;left:12px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:var(--text-muted);padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:color var(--transition-fast)}.toggle-pw:hover{color:var(--text-secondary)}.toggle-pw svg{width:18px;height:18px}.error-box{display:none;background:var(--danger-bg);border:1px solid rgba(239,68,68,.2);border-radius:var(--radius-sm);padding:10px 14px;color:var(--danger);font-size:12px;text-align:center;margin-bottom:12px;animation:slideDown .25s ease}.error-box.visible{display:block}.btn{width:100%;padding:12px 20px;border:none;border-radius:var(--radius-md);font-size:13px;font-weight:700;font-family:inherit;cursor:pointer;transition:transform var(--transition-fast),box-shadow var(--transition-fast),opacity var(--transition-fast);display:flex;align-items:center;justify-content:center;gap:6px;margin-top:4px;position:relative}.btn:active{transform:scale(.98)}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;box-shadow:0 4px 16px #2563eb40}.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 24px #2563eb59}.btn-success{background:linear-gradient(135deg,#059669,#10b981);color:#fff;box-shadow:0 4px 16px #05966933}.btn-success:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 24px #0596694d}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none!important}.theme-btn{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 auto 20px;padding:8px 16px;border-radius:var(--radius-full);border:1px solid var(--border);background:var(--surface-3);color:var(--text-secondary);font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;transition:background var(--transition-base),border-color var(--transition-base),color var(--transition-base),transform var(--transition-fast)}.theme-btn:hover{background:var(--surface-hover);border-color:var(--border-hover);transform:translateY(-1px)}.theme-btn svg{width:16px;height:16px}.loading-center{text-align:center;padding:24px 0;color:var(--text-muted);font-size:13px}.loading-spinner{width:24px;height:24px;border:2.5px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .7s linear infinite;margin:0 auto 14px}.setup-notice{background:var(--warning-bg);border:1px solid rgba(245,158,11,.18);border-radius:var(--radius-sm);padding:12px 14px;color:var(--warning);font-size:11.5px;margin-bottom:18px;line-height:1.6}.setup-notice strong{display:block;margin-bottom:3px;font-size:12.5px}.spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;vertical-align:middle;margin-right:5px}