.connect-screen{--text-swap-dur:.15s;--text-swap-translate-y:4px;--text-swap-blur:2px;--text-swap-ease:ease-in-out;max-width:640px}.connect-screen .connect-panel{gap:24px;padding:28px;display:grid}.connect-screen .connect-heading{align-items:center;gap:12px;display:flex}.connect-screen .connect-heading h2{font:600 24px/1.25 var(--body-font);margin:0}.connect-screen .connect-heading svg{width:28px;height:28px;color:var(--accent);flex:none}.connect-status{overflow-wrap:anywhere;margin:0}.connect-status[data-error=true]{color:var(--danger)}.connect-screen .connect-code{border-block-start:1px solid var(--border);gap:16px;padding-block-start:24px;display:grid}.connect-screen .connect-code input{caret-color:var(--accent);font-size:16px}.connect-screen .connect-actions{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.connect-screen .connect-actions .button,.connect-screen .connect-actions .link-button{min-height:44px}.connect-screen .connect-help{color:var(--muted);margin:0;font-size:14px}.connect-screen .connect-note{border-block-start:1px solid var(--border);color:var(--muted);padding-block-start:20px;font-size:14px}.connect-screen .connect-progress{align-items:center;gap:10px;display:flex}.connect-screen .connect-spinner{border:2px solid var(--border);border-block-start-color:var(--accent);border-radius:50%;flex:none;width:16px;height:16px;animation:.25s linear infinite connect-spin}@keyframes connect-spin{to{transform:rotate(360deg)}}.connect-screen .t-text-swap{filter:blur();opacity:1;transition:transform var(--text-swap-dur) var(--text-swap-ease), filter var(--text-swap-dur) var(--text-swap-ease), opacity var(--text-swap-dur) var(--text-swap-ease);will-change:transform, filter, opacity;display:inline-block;transform:translateY(0)}.connect-screen .t-text-swap.is-exit{transform:translateY(calc(var(--text-swap-translate-y) * -1));filter:blur(var(--text-swap-blur));opacity:0}.connect-screen .t-text-swap.is-enter-start{transform:translateY(var(--text-swap-translate-y));filter:blur(var(--text-swap-blur));opacity:0;transition:none}.connect-auth .auth-stack{gap:28px;width:min(100%,420px)}.connect-auth .auth-card{gap:20px;max-width:none}.connect-auth .auth-card h1{font:600 28px/1.2 var(--heading-font)}.connect-auth .auth-card p,.connect-auth button,.connect-auth a{overflow-wrap:anywhere}.connect-auth .auth-card .error{color:var(--danger)}.connect-auth .auth-card form{display:grid}.connect-auth .button{text-align:center;min-height:44px;text-decoration:none}.connect-auth .field input{caret-color:var(--accent)}.connect-auth .connect-help{font-size:14px}.connect-auth .auth-brand-name{font-family:var(--heading-font)}.connect-auth .auth-card h2{margin:0;font-size:20px}.connect-screen button:focus-visible,.connect-screen a:focus-visible,.connect-auth button:focus-visible,.connect-auth a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}@media (hover:hover){.connect-screen .button:hover:enabled,.connect-auth .button:hover:enabled{filter:brightness(.94)}.connect-screen .button-quiet:hover:enabled,.connect-auth .button-quiet:hover:enabled{background:var(--wash);filter:none}}@media (max-width:600px){.connect-screen .connect-panel{gap:16px;padding:16px 12px}.connect-screen .connect-code{gap:12px;padding-block-start:16px}.connect-screen .connect-actions{flex-direction:column;align-items:stretch}.connect-screen .connect-status{font-size:16px}.connect-auth{padding:32px 24px}.connect-auth .auth-card p{font-size:16px}}@media (prefers-reduced-motion:reduce){.connect-screen .t-text-swap{transition:none!important}.connect-screen .t-text-swap.is-exit,.connect-screen .t-text-swap.is-enter-start{filter:none;opacity:1;transform:none}.connect-screen .connect-spinner{animation:none}}