.join-page { min-height: 100svh; }
.join-main {
  flex: 1;
  width: 100%;
  display: grid;
  place-items: center;
  padding: 68px 0 78px;
}
.join-content { width: min(540px, 100%); text-align: center; }
.join-title { margin: 0; font-size: 56px; font-weight: 900; line-height: 1.1; letter-spacing: 0; }
.join-title, .join-success-title { position: relative; width: fit-content; max-width: 100%; margin-inline: auto; cursor: default; }
.join-description { margin-top: 22px; font-size: 15px; line-height: 1.8; color: rgba(249, 250, 251, 0.7); }
.join-form-area { margin-top: 38px; }
.join-form { width: 100%; }
.join-fields { display: grid; grid-template-columns: minmax(0, 1fr) 112px; align-items: end; gap: 12px; perspective: 800px; }
.formkit-field { min-width: 0; text-align: left; }
.join-label { display: block; margin-bottom: 10px; font-size: 11px; line-height: 1; color: rgba(249, 250, 251, 0.6); }
.join-input, .join-submit {
  min-width: 0;
  width: 100%;
  height: 52px;
  margin: 0;
  border: 0;
  border-radius: 0;
  color: var(--text-main);
  font-family: var(--font-family);
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0;
}
.join-input {
  padding: 0 18px;
  background: rgba(249, 250, 251, 0.045);
  box-shadow: inset 0 -1px rgba(249, 250, 251, 0.28);
  outline: none;
  transition: background 0.2s ease-out, box-shadow 0.2s ease-out;
}
.join-input::placeholder { color: rgba(249, 250, 251, 0.4); opacity: 1; }
.join-input:focus { background: rgba(249, 250, 251, 0.065); box-shadow: inset 0 -1px rgba(249, 250, 251, 0.85); }
.join-input:autofill { box-shadow: inset 0 0 0 100px #202123; -webkit-text-fill-color: var(--text-main); }
.join-submit {
  position: relative;
  display: grid;
  place-items: center;
  background: rgba(249, 250, 251, 0.08);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  cursor: pointer;
  transform: translateZ(0);
  transition: background 0.18s ease-out, transform 0.22s ease-out;
}
.join-submit-label { position: relative; }
.join-submit::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse, rgba(255, 255, 255, 0.08), transparent 72%);
  opacity: var(--ui-light, 0);
  pointer-events: none;
}
.join-submit:focus-visible, .join-reset:focus-visible, .join-privacy summary:focus-visible,
.join-privacy a:focus-visible, .formkit-powered-by-convertkit:focus-visible { outline: 1px solid currentColor; outline-offset: 5px; }
.join-submit:disabled { cursor: progress; }
.join-submit[data-active] .join-submit-label { visibility: hidden; }
.join-spinner {
  position: absolute;
  width: 18px;
  height: 18px;
  border: 1px solid rgba(249, 250, 251, 0.25);
  border-top-color: var(--text-main);
  border-radius: 50%;
  display: none;
}
.join-submit[data-active] .join-spinner { display: block; animation: join-spin 0.8s linear infinite; }
@keyframes join-spin { to { transform: rotate(360deg); } }
.formkit-alert { list-style: none; margin: 0 0 20px; padding: 0; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.formkit-alert:empty { display: none; }
.formkit-alert-error { color: #e7a5a5; text-align: left; }
.formkit-alert-success {
  display: grid;
  place-content: center;
  gap: 14px;
  min-height: 73px;
  margin: 0;
  outline: none;
  white-space: pre-line;
}
.join-success-title { margin: 0 auto; font-size: 20px; line-height: 1.5; font-weight: 900; }
.join-success-text { max-width: 380px; margin: auto; color: rgba(249, 250, 251, 0.7); }
.join-reset {
  position: relative;
  display: grid;
  place-items: center;
  justify-self: center;
  min-height: 44px;
  margin: 6px 0 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--text-main);
  font: inherit;
  font-size: 11px;
  line-height: 1.5;
  cursor: pointer;
  transition: transform 0.22s ease-out;
}
.formkit-powered-by-convertkit-container { margin-top: 22px; }
.formkit-powered-by-convertkit {
  display: inline-block;
  width: 133px;
  height: 36px;
  background: url('/assets/kit-built-with.svg') center / contain no-repeat;
  color: var(--text-main);
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-decoration: none;
}
.formkit-powered-by-convertkit:hover { color: var(--text-main); }
.join-fine-print { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 10px 18px; margin-top: 26px; font-size: 11px; line-height: 1.9; color: rgba(249, 250, 251, 0.5); }
.join-privacy[open] { width: 100%; }
.join-privacy summary { display: inline-block; cursor: pointer; list-style: none; font-size: 10px; }
.join-privacy summary::-webkit-details-marker { display: none; }
.join-privacy[open] summary { color: var(--text-main); }
.join-privacy-content { max-width: 460px; margin: 16px auto 0; text-align: left; }
.join-privacy-content p + p { margin-top: 12px; }
.join-privacy-content a { color: inherit; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.join-service-notice, .join-no-script { margin-top: 18px; color: rgba(249, 250, 251, 0.7); font-size: 12px; line-height: 1.8; }
.join-social-nav-layer { margin-top: auto; }
.join-page .social-nav { position: static; transform: none; margin: 0 auto; padding-bottom: 14px; }
.join-footer { flex: 0 0 auto; }
@media (hover: hover) and (pointer: fine) {
  .join-submit:not(:disabled):hover { background: rgba(249, 250, 251, 0.12); transform: translateZ(16px) scale(1.035); }
  .join-reset:hover { transform: translateY(-2px); }
}
@media (hover: none) {
  .join-submit:not(:disabled):active { background: rgba(249, 250, 251, 0.12); transform: scale(1.025); }
}
@media (max-width: 600px) {
  .join-main { padding: 56px 0 60px; }
  .join-content { max-width: 420px; }
  .join-title { font-size: 44px; }
  .join-description { font-size: 14px; margin-top: 20px; }
  .join-form-area { margin-top: 30px; }
  .join-fields { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .join-input { font-size: 16px; }
  .join-fine-print br { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .join-input, .join-submit, .join-reset { transition: none; }
  .join-submit[data-active] .join-spinner { animation: none; }
}