/* The Advanced Submit connect page (plan advanced-submit-connect-page-and-live-confirmation). Written in
   ssc.master, not exported from www: the shell's site.css styles the card (.upgrade-key-form), the
   fields (.upgrade-field), the hint and the messages; this adds only what the page has of its own. */
.connect-page{max-width:640px}
.connect-page h1{font-size:clamp(32px,4vw,46px);margin:0 0 16px}
.connect-lede{font-size:18px;color:var(--muted);margin:0 0 24px}
.connect-card{padding:24px 24px 10px}
.connect-account{font-size:16px;margin:0 0 16px}
.connect-status{font-size:17px;margin:0 0 12px}
.connect-status[data-advanced-submit-state="connected"]{font-weight:650;color:var(--green-dark)}
.connect-status[data-advanced-submit-state="lapsed"],.connect-status[data-advanced-submit-state="unknown"],.connect-status[data-advanced-submit-state="ended"]{color:#8a2a14;font-weight:600}
.connect-indicator{display:flex;align-items:center;gap:10px;font-size:16px;color:var(--muted);margin:0 0 12px}
.connect-spinner{width:18px;height:18px;flex:0 0 18px;border:3px solid var(--line);border-top-color:var(--green);border-radius:50%;animation:connect-spin 1s linear infinite}
@keyframes connect-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.connect-spinner{animation:none}}
.connect-again{font-size:15px;color:var(--muted);margin:0 0 14px}
.connect-link{background:none;border:0;padding:0;font:inherit;color:var(--green-dark);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.connect-link:hover{color:#044b44}
.connect-link:focus-visible{outline:3px solid #edb34b;outline-offset:3px}
.connect-resend{margin:8px 0 14px;padding-top:12px}
.connect-resend summary{font-size:15px;margin-bottom:12px}
.connect-indicator[hidden],.connect-again[hidden],.connect-resend[hidden],.connect-page [hidden]{display:none}
@media(max-width:800px){.connect-card{padding:18px 16px 4px}}
