/* Early-access form in the closing section, in place of the composer link; v2 tokens keep it on theme. */
.finale#early-access {scroll-margin-top: 40px}
.access-lede {max-width: 480px; margin: -12px auto 24px; color: var(--v-muted); font-size: 17px; line-height: 1.55}
#access-form {width: min(500px, 100%); margin: 0 auto; text-align: left}
#access-form label {position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap}
.access-fields {display: flex; gap: 8px; padding: 6px; border: 1px solid var(--v-line-strong); border-radius: 999px; background: var(--v-card); box-shadow: 0 18px 40px -22px #0c0d1066}
.access-fields:focus-within {border-color: var(--v-blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--v-blue) 22%, transparent)}
.access-fields input {flex: 1; min-width: 0; min-height: 44px; padding: 0 16px; border: 0; border-radius: 999px; background: transparent; color: var(--v-ink); font: 400 17px/1.4 var(--v-sys)}
.access-fields input::placeholder {color: var(--v-muted)}
.access-fields input:focus {outline: none}
.access-fields button {flex: none; min-height: 44px; padding: 0 20px; border: 0; border-radius: 999px; background: var(--v-blue); color: #fff; font: 600 15px/1 LandingSans, var(--v-sys); white-space: nowrap; cursor: pointer}
.access-fields button:hover {filter: brightness(1.08)}
.access-fields button:focus-visible {outline: 2px solid var(--v-ink); outline-offset: 3px}
.access-fields button:disabled {cursor: wait; opacity: .65}
#form-status {min-height: 1.5em; margin: 12px 0 0; color: var(--v-muted); font-size: 14px; line-height: 1.5; text-align: center}
@media (max-width: 480px) {
  .access-lede {font-size: 16px}
  .access-fields {flex-direction: column; border-radius: 22px}
  .access-fields input {min-height: 46px}
}