/* Sign-in and invite pages; the palette and type come from /assets/site.css. */
.gate { min-height: 100svh; display: flex; flex-direction: column; padding: 22px clamp(20px, 4vw, 56px); }
.gate header { display: flex; justify-content: space-between; align-items: center; }
.brand { font-weight: 600; font-size: 17px; color: var(--fg); }
.brand:hover { text-decoration: none; }
.gate main { margin: auto 0; padding: 40px 0; max-width: 520px; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 22px; font-family: var(--mono); font-size: 12px;
  letter-spacing: .14em; text-transform: uppercase; color: var(--fg-2); }
.beacon { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); animation: beacon 2.4s ease-out infinite; }
@keyframes beacon { 0% { box-shadow: 0 0 0 0 rgba(56,209,193,.55); } 70%, 100% { box-shadow: 0 0 0 10px rgba(56,209,193,0); } }
.gate h1 { font-size: clamp(40px, 6vw, 64px); }
.gate main > p { font-size: 17px; margin-top: 18px; }
.gate .btn { margin-top: 28px; font: inherit; font-weight: 500; font-size: 15px; cursor: pointer; }
.gate .btn[disabled] { opacity: .5; cursor: default; transform: none; }
.status { min-height: 1.55em; font-size: 15px; }
.status.error { color: var(--warn); }
.hint { font-size: 14px !important; color: var(--fg-3); }
@media (prefers-reduced-motion: reduce) { .beacon { animation: none; } }