/* Keep the mascot in the dialog's top layer, above the existing sign-in card. */
#member-entry-gate.member-entry-gate{box-sizing:border-box;position:fixed;inset:0;top:calc(var(--member-entry-viewport-top,0px) + var(--member-entry-viewport-height,100dvh)/2);bottom:auto;transform:translateY(-50%);margin:0 auto;width:min(500px,calc(100vw - 28px));max-width:calc(100vw - 28px);max-height:calc(100dvh - 32px);max-height:calc(var(--member-entry-viewport-height,100dvh) - max(16px,env(safe-area-inset-top)) - max(16px,env(safe-area-inset-bottom)));overflow:auto;overscroll-behavior:contain;scroll-padding-block:18px;padding:10px 10px 18px;border:0;border-radius:0;background:transparent;color:#f7f4ff;box-shadow:none;font:16px/1.45 system-ui,sans-serif}
/* Generic neon/frame-fill rules decorate every dialog. Only this outer shell
   stays clear; its inner sign-in card keeps the visible frame and surface. */
html body[data-neon-skin] #member-entry-gate.member-entry-gate{border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#member-entry-gate.member-entry-gate::before,#member-entry-gate.member-entry-gate::after{display:none!important}
#member-entry-gate::backdrop{background:#000917b3;backdrop-filter:blur(7px)}
.member-entry-welcome{padding:0 0 18px;text-align:center;pointer-events:none}
/* A modest welcome-sized companion, without returning to the oversized hero. */
.member-entry-mascot{display:block;width:192px;max-width:100%;height:128px;margin:0 auto;object-fit:contain;filter:drop-shadow(0 0 17px #4bdfff66);animation:member-bud-float 5s ease-in-out infinite;user-select:none}
#member-entry-greeting{max-width:360px;margin:6px auto 0;color:#f0fbff;font:750 clamp(18px,4.5vw,22px)/1.35 system-ui,sans-serif;text-wrap:balance;text-shadow:0 2px 5px #000,0 0 15px #4bdfff66}
.member-entry-card{padding:26px;border:2px solid #b893ff;border-radius:22px;background:linear-gradient(145deg,#18152bf5,#102332f5);box-shadow:0 0 20px #a56dff55;min-width:0}
.member-entry-gate h2{font-size:26px;line-height:1.2;margin:10px 0}.member-entry-gate .plans-entry{margin:18px 0 0;padding:0;border:0;box-shadow:none;background:none}.member-entry-gate .plans-login-title{font-size:19px}.member-entry-note{font-size:12px;color:#cbd7e6;text-align:center}html[data-member-gate=blocked]{overflow:hidden}.member-entry-gate :focus-visible{outline:3px solid #d7f7ff;outline-offset:3px}
@media(max-width:420px){#member-entry-gate.member-entry-gate{padding-inline:6px}.member-entry-card{padding:20px 18px}.member-entry-gate h2{font-size:23px}}
@media(max-height:620px){.member-entry-welcome{padding-bottom:12px}.member-entry-card{padding-block:18px}}
.member-entry-gate .plans-entry::before,.member-entry-gate .plans-entry::after{display:none!important}
.member-entry-gate .plans-login-form{grid-template-columns:minmax(0,1fr)}
/* One obvious public exit. Keep the bright treatment even when motion is off. */
.member-entry-gate .member-entry-choose{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:12px;box-sizing:border-box;min-height:62px;margin:18px 0 24px;padding:16px 20px;border:2px solid #fff4ae;border-radius:14px;background:linear-gradient(110deg,#fff18a,#6df1ff);color:#062237!important;text-decoration:none!important;font:900 clamp(21px,5vw,26px)/1.2 system-ui,sans-serif;box-shadow:0 0 14px #6deaff88,0 0 28px #ffec7c55;transform-origin:center;animation:member-plan-cue 5s ease-in-out infinite}
.member-entry-gate .member-entry-choose:is(:hover,:focus-visible){animation-play-state:paused;box-shadow:0 0 20px #7ef2ffbb,0 0 32px #ffec7c88}
@keyframes member-bud-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes member-plan-cue{0%,28%,100%{transform:translateX(0) rotate(0);box-shadow:0 0 14px #6deaff88,0 0 28px #ffec7c55}8%{transform:translateX(-2px) rotate(-.6deg);box-shadow:0 0 22px #7ef2ffbb,0 0 34px #ffec7c88}14%{transform:translateX(2px) rotate(.6deg)}20%{transform:translateX(-1px) rotate(-.3deg)}}
body.reduced-motion :is(.member-entry-choose,.member-entry-mascot){animation:none!important;transform:none!important}
@media(prefers-reduced-motion:reduce){.member-entry-gate :is(.member-entry-choose,.member-entry-mascot){animation:none!important;transform:none!important}}

/* Captions sit below the artwork, never over its face. Reserve two lines so
   real playback events and silent fallbacks cannot shift the sign-in form. */
.member-entry-welcome{position:relative;padding-bottom:12px}
#member-entry-greeting{position:static;box-sizing:border-box;width:calc(100% - 12px);max-width:360px;min-height:2.6em;margin:6px auto 0;padding:0;color:#fff;font:700 clamp(16px,4vw,19px)/1.3 system-ui;text-shadow:0 2px 5px #000}
#member-entry-greeting[hidden]{display:block!important;visibility:hidden}