/* Closed Alpha entry — scoped to the signed-out BeJiggi experience. */
body.member-experience:has(#auth-view:not(.hidden)) > .member-shell-header,
body.member-experience:has(#auth-view:not(.hidden)) > .member-shell-footer {
  display: none;
}

.alpha-entry {
  position: relative;
  isolation: isolate;
  display: block;
  min-height: 100vh;
  min-height: 100svh;
  overflow: hidden;
  padding: 0;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--ui-color-surface-raised) 76%, var(--ui-color-background)) 0,
    var(--ui-color-background) 34rem
  ) !important;
}

.alpha-entry-shell {
  display: flex;
  flex-direction: column;
  width: min(1240px, 100%);
  min-height: 100vh;
  min-height: 100svh;
  margin: 0 auto;
  padding: clamp(var(--space-md), 4vw, var(--space-xl));
}

.alpha-brandbar,
.alpha-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm);
}

.alpha-brandbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-xs);
}

.alpha-wordmark {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

.alpha-status {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding: var(--space-xs) var(--space-sm);
  border: 1px solid var(--ui-color-border);
  border-radius: var(--ui-radius-pill);
  color: var(--ui-color-muted);
  background: var(--ui-color-surface);
  font-size: var(--ui-font-xs);
  font-weight: 750;
  letter-spacing: var(--ui-letter-label);
  text-transform: uppercase;
}

.alpha-status > span {
  width: var(--space-xs);
  height: var(--space-xs);
  border-radius: 50%;
  background: var(--ui-color-primary);
  box-shadow: 0 0 0 4px var(--ui-color-primary-soft);
}

.alpha-home {
  flex: 1;
}

.alpha-entry .kicker {
  color: var(--bejiggi-accent);
}

.alpha-hero {
  display: grid;
  grid-template-columns: minmax(250px, .72fr) minmax(460px, 1.28fr);
  align-items: center;
  gap: clamp(var(--space-xl), 5vw, var(--space-3xl));
  padding: clamp(var(--space-xl), 5vw, var(--space-2xl)) 0 var(--space-xl);
}

.alpha-intro {
  min-width: 0;
}

.alpha-intro h1 {
  max-width: 12ch;
  margin: var(--space-sm) 0 var(--space-md);
  font-size: clamp(2.7rem, 4.7vw, 4.25rem) !important;
  line-height: 1.04 !important;
  letter-spacing: -.055em !important;
}

.alpha-lead {
  max-width: 48ch;
  margin: 0;
  color: var(--ui-color-muted);
  font-size: var(--type-body-l);
  line-height: 1.6;
}

.alpha-featured {
  min-width: 0;
  margin: 0;
  padding: clamp(var(--space-sm), 2vw, var(--space-md));
  border: 1px solid var(--ui-color-border);
  border-radius: var(--radius-dialog);
  background: var(--ui-color-surface);
  box-shadow: var(--ui-shadow-lg);
}

.alpha-featured-heading,
.alpha-featured figcaption {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-md);
}

.alpha-featured-heading {
  padding: 0 0 var(--space-sm);
}

.alpha-featured-heading .kicker,
.alpha-featured-heading h2 {
  margin: 0;
}

.alpha-featured-heading h2 {
  margin-top: var(--space-xs);
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  letter-spacing: var(--ui-letter-tight);
}

.alpha-featured-heading > span {
  padding: var(--space-xs) var(--space-sm);
  border: 1px solid var(--ui-color-border);
  border-radius: var(--ui-radius-pill);
  color: var(--ui-color-muted);
  font-size: var(--ui-font-xs);
  font-weight: 750;
  letter-spacing: var(--ui-letter-label);
  text-transform: uppercase;
  white-space: nowrap;
}

.alpha-featured img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--ui-radius-md);
  object-fit: contain;
}

.alpha-featured figcaption {
  align-items: flex-start;
  padding-top: var(--space-sm);
  color: var(--ui-color-muted);
  font-size: var(--ui-font-xs);
  line-height: 1.5;
}

.alpha-featured figcaption strong {
  flex: 0 0 auto;
  color: var(--ui-color-text);
}

.alpha-featured figcaption span {
  max-width: 62ch;
  text-align: right;
}

.alpha-featured-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-sm);
}

.alpha-featured-link,
.alpha-featured-link-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: var(--space-xs) var(--space-md);
  border: 1px solid var(--bejiggi-action);
  border-radius: var(--radius-button);
  font-size: var(--ui-font-sm);
  font-weight: 800;
  text-decoration: none;
}

.alpha-featured-link {
  color: var(--bejiggi-on-accent);
  background: var(--bejiggi-action);
}

.alpha-featured-link-secondary {
  color: var(--bejiggi-accent);
  background: transparent;
}

.alpha-featured-link:hover {
  color: var(--bejiggi-on-accent);
  background: var(--bejiggi-action-hover);
  text-decoration: none;
}

.alpha-featured-link-secondary:hover {
  color: var(--bejiggi-accent);
  background: var(--bejiggi-accent-surface);
  text-decoration: none;
}

.alpha-featured-link:focus-visible,
.alpha-featured-link-secondary:focus-visible {
  outline: 3px solid var(--ui-color-focus);
  outline-offset: 3px;
}

.alpha-access-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(340px, .75fr);
  align-items: start;
  gap: clamp(var(--space-xl), 5vw, var(--space-3xl));
  padding: 0 0 var(--space-2xl);
}

.alpha-boundaries {
  min-width: 0;
}

.alpha-principles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-md);
  margin: 0 0 var(--space-lg);
  padding: 0;
  list-style: none;
}

.alpha-principles li {
  position: relative;
  display: grid;
  gap: var(--space-xs);
  min-width: 0;
  padding-left: var(--space-md);
}

.alpha-principles li::before {
  position: absolute;
  top: .45rem;
  left: 0;
  width: var(--space-xs);
  height: var(--space-xs);
  border: 2px solid var(--ui-color-primary);
  border-radius: 50%;
  content: "";
}

.alpha-principles strong {
  color: var(--ui-color-text);
  font-size: var(--ui-font-sm);
}

.alpha-principles span {
  color: var(--ui-color-muted);
  font-size: var(--ui-font-sm);
  line-height: 1.55;
}

.alpha-access-note {
  padding: var(--space-md);
  border-left: 3px solid var(--ui-color-primary);
  border-radius: 0 var(--ui-radius-md) var(--ui-radius-md) 0;
  background: color-mix(in srgb, var(--ui-color-primary-soft) 60%, transparent);
}

.alpha-access-note h2 {
  margin: var(--space-xs) 0;
  font-size: var(--type-title);
  letter-spacing: var(--ui-letter-tight);
}

.alpha-access-note p:last-child {
  margin: 0;
  color: var(--ui-color-muted);
  font-size: var(--ui-font-sm);
}

.alpha-entry .auth-card {
  width: 100%;
  padding: clamp(var(--space-md), 4vw, var(--space-xl)) !important;
  border-color: var(--ui-color-border) !important;
  border-radius: var(--radius-dialog) !important;
  background: color-mix(in srgb, var(--ui-color-surface) 96%, transparent) !important;
  box-shadow: var(--ui-shadow-lg) !important;
}

.alpha-entry .auth-card h2 {
  margin: var(--space-xs) 0 var(--space-sm);
  font-size: clamp(2rem, 4vw, var(--type-h1));
  letter-spacing: var(--ui-letter-tight);
}

.alpha-entry .auth-card .muted {
  margin: 0 0 var(--space-md);
  color: var(--ui-color-muted) !important;
}

.alpha-entry .auth-form {
  gap: var(--space-sm) !important;
}

.alpha-entry .auth-form label {
  margin: 0 0 calc(var(--space-xs) * -1);
  color: var(--ui-color-text) !important;
  font-size: var(--ui-font-sm);
  font-weight: 750;
}

.alpha-entry .auth-form input {
  width: 100%;
  min-width: 0;
  border-color: var(--bejiggi-border);
  color: var(--bejiggi-text);
  background: var(--bejiggi-input);
  caret-color: var(--bejiggi-accent);
}

.alpha-entry .auth-form input:hover {
  border-color: var(--bejiggi-border-strong);
}

.alpha-entry .auth-form input:focus-visible {
  border-color: var(--bejiggi-accent);
  outline: 3px solid var(--bejiggi-focus);
  outline-offset: 3px;
}

.alpha-entry .auth-form input:-webkit-autofill,
.alpha-entry .auth-form input:-webkit-autofill:hover,
.alpha-entry .auth-form input:-webkit-autofill:focus {
  border-color: var(--bejiggi-border-strong);
  -webkit-text-fill-color: var(--bejiggi-text);
  caret-color: var(--bejiggi-text);
  box-shadow: 0 0 0 1000px var(--bejiggi-input) inset;
}

.alpha-entry .primary,
.alpha-entry .secondary,
.alpha-entry .password-row button {
  border-radius: var(--radius-button);
}

.alpha-entry .primary {
  border: 1px solid var(--bejiggi-action);
  color: var(--bejiggi-on-accent);
  background: var(--bejiggi-action);
}

.alpha-entry .primary:hover {
  background: var(--bejiggi-action-hover);
}

.alpha-entry .secondary,
.alpha-entry .password-row button {
  border: 1px solid var(--bejiggi-border-strong);
  color: var(--bejiggi-text);
  background: var(--bejiggi-surface);
}

.alpha-entry .secondary:hover,
.alpha-entry .password-row button:hover {
  border-color: var(--bejiggi-accent);
  color: var(--bejiggi-accent);
  background: var(--bejiggi-accent-surface);
}

.alpha-entry :is(button, input, a):focus-visible {
  outline: 3px solid var(--bejiggi-focus);
  outline-offset: 3px;
}

.alpha-entry .password-row button {
  min-width: 4rem;
}

.alpha-entry #login-button {
  margin-top: var(--space-xs);
}

.alpha-entry .message {
  min-height: 1.5rem;
  margin: var(--space-sm) 0 0;
  color: var(--ui-color-muted);
  font-size: var(--ui-font-sm);
}

.alpha-entry .message.error {
  color: var(--ui-color-danger);
}

.alpha-form-note {
  margin: var(--space-sm) 0 0;
  padding-top: var(--space-sm);
  border-top: 1px solid var(--ui-color-border);
  color: var(--ui-color-muted);
  font-size: var(--ui-font-xs);
  line-height: 1.55;
  text-align: center;
}

.alpha-footer {
  padding-top: var(--space-md);
  border-top: 1px solid var(--ui-color-border);
  color: var(--ui-color-muted);
  font-size: var(--ui-font-xs);
}

.alpha-footer span:first-child {
  color: var(--ui-color-text);
  font-weight: 800;
}

@media (max-width: 880px) {
  .alpha-hero,
  .alpha-access-grid {
    grid-template-columns: 1fr;
    gap: var(--space-xl);
  }

  .alpha-intro h1 {
    max-width: 16ch;
  }

  .alpha-access-grid {
    padding-bottom: var(--space-xl);
  }

  .alpha-entry .auth-card {
    width: min(100%, 560px);
  }
}

@media (max-width: 560px) {
  .alpha-entry-shell {
    padding: var(--space-md);
  }

  .alpha-brandbar {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .alpha-brandbar-actions {
    flex: 1 1 auto;
    flex-wrap: wrap;
  }

  .alpha-status {
    padding-inline: var(--space-xs);
    letter-spacing: .04em;
  }

  .alpha-hero,
  .alpha-access-grid {
    gap: var(--space-lg);
  }

  .alpha-hero {
    padding: var(--space-lg) 0;
  }

  .alpha-intro h1 {
    font-size: clamp(2.35rem, 12vw, 3.25rem) !important;
  }

  .alpha-principles {
    grid-template-columns: 1fr;
    margin-bottom: var(--space-lg);
  }

  .alpha-featured-heading,
  .alpha-featured figcaption {
    align-items: flex-start;
    flex-direction: column;
    gap: var(--space-xs);
  }

  .alpha-featured figcaption span {
    text-align: left;
  }

  .alpha-featured-actions,
  .alpha-featured-actions a {
    width: 100%;
  }

  .alpha-entry .auth-card {
    padding: var(--space-md) !important;
  }

  .alpha-footer {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (prefers-reduced-motion: reduce) {
  .alpha-entry *,
  .alpha-entry *::before,
  .alpha-entry *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

.auth-alternative{display:flex;align-items:center;gap:.75rem;color:var(--ui-color-muted);font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.auth-alternative::before,.auth-alternative::after{content:"";height:1px;flex:1;background:var(--ui-color-border)}
.auth-method-note{margin:-.35rem 0 .15rem;color:var(--ui-color-muted);font-size:.78rem;line-height:1.5}
.auth-reset-button{border-color:transparent!important;background:transparent!important}


.alpha-return-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: var(--space-xs) var(--space-sm);
  border: 1px solid var(--bejiggi-action);
  border-radius: var(--radius-button);
  color: var(--bejiggi-accent);
  font-weight: 800;
  text-decoration: none;
}
.alpha-return-link:hover { background: var(--bejiggi-accent-surface); }
.alpha-featured img { aspect-ratio: 16 / 9; object-fit: cover; }
