:root{--bg-primary:#1a1a2e;--bg-card:#16213e;--bg-input:#0f3460;--text-primary:#e8e8e8;--text-secondary:#a0a0b0;--accent:#0ea5e9;--accent-hover:#38bdf8;--error:#f87171;--success:#34d399;--radius:12px;--shadow:0 8px 32px #0000004d}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;justify-content:center;align-items:center;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;display:flex}#app{justify-content:center;align-items:center;width:100%;padding:24px;display:flex}.card{background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow);width:100%;max-width:420px;padding:40px 36px;position:relative}.logo-area{justify-content:center;align-items:center;margin-bottom:24px;display:flex}.logo-img{object-fit:contain;border-radius:12px;width:auto;height:56px}.card h1{text-align:center;color:var(--text-primary);margin-bottom:8px;font-size:1.5rem;font-weight:600}.card .subtitle{color:var(--text-secondary);text-align:center;margin-bottom:28px;font-size:.9rem;line-height:1.5}.form-group{margin-bottom:20px}.form-group label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;font-size:.8rem;font-weight:500;display:block}.form-group input[type=email]{background:var(--bg-input);width:100%;color:var(--text-primary);border:2px solid #0000;border-radius:8px;outline:none;padding:12px 16px;font-family:inherit;font-size:1rem;transition:border-color .2s}.form-group input[type=email]:focus{border-color:var(--accent)}.form-group input[type=email]::placeholder{color:var(--text-secondary);opacity:.6}.btn-primary{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;padding:12px 24px;font-family:inherit;font-size:1rem;font-weight:500;transition:background .2s,opacity .2s;display:flex}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:18px;height:18px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.error-message{color:var(--error);text-align:center;background:#f871711a;border:1px solid #f871714d;border-radius:8px;margin-bottom:16px;padding:10px 14px;font-size:.875rem}.hint{color:var(--text-secondary);text-align:center;opacity:.7;margin-top:20px;font-size:.78rem;line-height:1.5}.otp-container{justify-content:center;gap:8px;margin-bottom:24px;display:flex}.otp-digit{background:var(--bg-input);width:48px;height:56px;color:var(--text-primary);text-align:center;caret-color:var(--accent);border:2px solid #0000;border-radius:8px;outline:none;font-family:SF Mono,Fira Code,Cascadia Code,monospace;font-size:24px;transition:border-color .2s}.otp-digit:focus{border-color:var(--accent)}.otp-digit::placeholder{color:var(--text-secondary);opacity:.3}.timer{text-align:center;color:var(--text-secondary);margin-bottom:20px;font-size:.85rem}.timer.expired{color:var(--error)}.link-button{color:var(--accent);cursor:pointer;background:0 0;border:none;padding:0;font-family:inherit;font-size:.85rem;transition:color .2s}.link-button:hover{color:var(--accent-hover);text-decoration:underline}.link-button:disabled{color:var(--text-secondary);opacity:.5;cursor:not-allowed}.card-footer{text-align:center;flex-direction:column;align-items:center;gap:12px;margin-top:20px;display:flex}.connected-message{text-align:center;padding:20px 0}.connected-message h1{color:var(--success);margin-bottom:8px}.connected-message .subtitle{margin-bottom:0}.redirect-message{text-align:center;padding:20px 0}.redirect-message p{color:var(--success);margin-bottom:12px;font-size:1.1rem;font-weight:500}.redirect-message .spinner{border-color:#34d3994d;border-top-color:var(--success);width:24px;height:24px;margin:0 auto}.screen-enter{animation:.25s ease-out screenIn}@keyframes screenIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}