/* Member access uses the same photographic shell and quiet dark surfaces as Join. */
html body.public-site-v3.access-rotator-page:not(.public-entry-page):not(#legacy-public) > :is(.topbar, .site-footer, .theme-toggle, .install-app-button, .help-button) { display: none !important; }
html body.access-rotator-page { width: 100% !important; max-width: 100% !important; overflow-x: hidden; overflow-y: auto; }
html body.access-rotator-page > main { width: 100% !important; max-width: none !important; min-height: 100svh !important; margin: 0 !important; padding: 0 !important; }
.access-rotator { box-sizing: border-box; width: 100%; min-height: 100svh; }
.access-rotator .landing-scrim { background: linear-gradient(180deg, rgba(0,0,0,.54), rgba(0,0,0,.58) 45%, rgba(0,0,0,.75)); }
.access-entry {
  align-self: center;
  justify-self: center;
  width: min(100%, 800px);
  margin: 32px 0 48px;
  padding: clamp(28px, 4vw, 44px);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 16px;
  background: rgba(12,12,12,.92);
  color: #f7f6f2;
  box-shadow: 0 24px 64px rgba(0,0,0,.25);
  font-family: "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif;
}
.access-entry-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.access-entry h1 {
  margin: 0;
  color: #f7f6f2 !important;
  font: 650 clamp(34px, 4vw, 44px)/1.1 "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif !important;
  letter-spacing: -.035em !important;
}
.access-entry-heading > a { color: #d2cfca !important; font-size: 13px; text-decoration: underline; text-underline-offset: 5px; white-space: nowrap; }
.access-entry-heading > a:hover { color: #fff !important; }
.access-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0; margin-top: 28px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,.2); }
.access-entry .access-form { min-width: 0; margin: 0; padding: 0 28px 0 0; border: 0; border-radius: 0 !important; background: transparent; }
.access-entry .access-form + .access-form { padding: 0 0 0 28px; border-left: 1px solid rgba(255,255,255,.2); }
.access-entry .access-form h2 { margin: 0; color: #f7f6f2 !important; font: 650 25px/1.15 "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif !important; letter-spacing: -.025em !important; }
.access-entry .access-form p { max-width: 32ch; margin: 8px 0 20px; color: #c6c3be !important; font: 450 14px/1.45 "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif !important; }
.access-entry .access-form label { display: grid; gap: 7px; margin-top: 14px; color: #e5e2dd !important; font: 600 13px/1.3 "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif !important; }
.access-entry .access-form input {
  display: block;
  width: 100%;
  min-width: 0;
  height: 46px;
  padding: 10px 13px;
  border: 1px solid rgba(255,255,255,.34) !important;
  border-radius: 9px !important;
  background: #202020 !important;
  color: #f7f6f2 !important;
  box-shadow: none !important;
  font: 500 16px/1.2 "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif;
  caret-color: #fff;
}
.access-entry .access-form input:focus { border-color: #f7f6f2 !important; outline: 2px solid #ef4d91; outline-offset: 2px; }
.access-entry .access-form button {
  width: 100%;
  min-height: 48px;
  margin-top: 24px;
  border: 1px solid #f7f6f2 !important;
  border-radius: 9px !important;
  background: #f7f6f2 !important;
  color: #101010 !important;
  font: 650 14px/1 "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif !important;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}
.access-entry .access-form button:hover { border-color: #f7f6f2 !important; background: #202020 !important; color: #fff !important; }
body.access-rotator-page #main-content .access-form button { border-color: #f7f6f2 !important; background: #f7f6f2 !important; color: #101010 !important; }
body.access-rotator-page #main-content .access-form button:hover { border-color: #f7f6f2 !important; background: #202020 !important; color: #fff !important; }
.access-entry .access-form button:focus-visible, .access-entry-heading > a:focus-visible { outline: 2px solid #ef4d91; outline-offset: 4px; }
.access-notice { margin: 22px 0 0; padding: 12px 14px; border: 1px solid rgba(255,150,150,.5); border-radius: 9px; background: #332022; color: #ffe4e2; font: 550 14px/1.45 "Avenir Next", Avenir, "Segoe UI", Helvetica, Arial, sans-serif; }
@media (max-width: 680px) {
  .access-entry { width: min(100%, 460px); margin: 24px 0 40px; padding: 30px 22px; }
  .access-entry-heading { align-items: start; flex-direction: column; gap: 8px; }
  .access-entry h1 { font-size: clamp(32px, 9vw, 40px) !important; }
  .access-choice-grid { grid-template-columns: 1fr; gap: 28px; margin-top: 22px; padding-top: 22px; }
  .access-entry .access-form, .access-entry .access-form + .access-form { padding: 0; border: 0 !important; }
  .access-entry .access-form + .access-form { padding-top: 28px; border-top: 1px solid rgba(255,255,255,.2) !important; }
  .access-entry .access-form p { margin-bottom: 18px; }
}
@media (prefers-reduced-motion: reduce) { .access-entry .access-form button { transition: none; } }
