.signup-flow{padding:0;width:920px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 40px);background:#192227;border:1px solid #53636e;border-radius:18px;color:#eff2eb;box-shadow:0 24px 90px #0008}.signup-flow::backdrop{background:#060b10b3;backdrop-filter:blur(10px)}.flow-top{display:flex;justify-content:space-between;align-items:center;padding:22px 28px;border-bottom:1px solid #36434b}.flow-wordmark{font:800 29px/1 Manrope,sans-serif;letter-spacing:-1.8px}.flow-wordmark small{font:500 8px/1 'DM Sans',sans-serif;letter-spacing:1.8px;border-left:1px solid #596963;padding-left:10px;margin-left:10px}.flow-close{font-size:25px;background:none;border:0;color:#c2cfd5;width:30px;height:30px}.flow-layout{display:grid;grid-template-columns:300px 1fr}.flow-summary{padding:32px 28px;background:#202d34;border-right:1px solid #36434b}.flow-caption{font-size:10px;letter-spacing:1.4px;color:#a5b8c3}.flow-summary h2{font-size:24px;margin:12px 0}.flow-price{font-size:22px;line-height:1.4}.flow-summary p{font-size:12px;color:#a9bdc7}.flow-summary ul{list-style:none;padding:24px 0;margin:24px 0;border-top:1px solid #405059;display:grid;gap:14px;font-size:12px;color:#cad8de}.flow-change,.flow-existing{background:none;border:0;padding:10px 0;color:#bdcdd5;font-size:12px;text-decoration:underline;text-underline-offset:4px}.flow-preview{margin-top:44px!important}.flow-body{padding:28px 36px 36px}.flow-steps{display:flex;justify-content:space-between;list-style:none;padding:0;margin:0 0 34px;font-size:11px;color:#a2b2bc}.flow-steps li{display:flex;align-items:center;gap:7px}.flow-steps span{display:grid;place-items:center;width:23px;height:23px;border:1px solid #54636e;border-radius:50%}.flow-steps [aria-current]{color:#eff2eb}.flow-steps [aria-current] span{background:#c9e6dc;color:#172b25;border-color:#c9e6dc}.flow-body h1{font:400 29px/1.25 Manrope,sans-serif;letter-spacing:-.8px;margin:0 0 12px}.flow-sub{font-size:13px;color:#a8bbc6;margin:0 0 24px}.flow-google,.flow-primary{display:block;width:100%;padding:12px;border:1px solid #5c6e78;border-radius:9px;background:transparent;color:#eff2eb;font-size:13px}.flow-primary{background:#eff2eb;color:#1a2a32;border-color:#eff2eb;font-weight:600;margin-top:22px}.flow-primary:hover{background:#fff}.flow-divider{text-align:center;font-size:11px;color:#9fb1bc;margin:18px 0}.flow-helper{font-size:11px;color:#9fb1bc;line-height:1.7;margin:12px 0}.flow-body input{background:#121b20;border-color:#465a66;padding:11px;color:#eff2eb}.flow-review{border-top:1px solid #40515b;border-bottom:1px solid #40515b;margin:20px 0}.flow-review>div{display:flex;justify-content:space-between;gap:20px;padding:12px 0;font-size:12px}.flow-review span{color:#a8bbc6}.flow-review strong{font-weight:500;text-align:right;overflow-wrap:anywhere;min-width:0}.flow-message{font-size:12px;color:#c4dfd5}.flow-success-icon{display:grid;place-items:center;border:1px solid #527970;background:#253b36;color:#b9e6d6;width:44px;height:44px;border-radius:50%;margin-bottom:18px}.flow-url{display:flex;align-items:center;margin-top:4px;border:1px solid #465a66;border-radius:6px;padding-left:10px;background:#121b20}.flow-url span{font-size:11px;color:#a8bbc6}.flow-url input{border:0;margin:0;min-width:0}.signup-flow label{color:#c9d5db}body:has(.signup-flow[open]){overflow:hidden}@media(max-width:700px){.flow-layout{grid-template-columns:1fr}.flow-summary{border-right:0;border-bottom:1px solid #36434b;padding:20px 24px}.flow-summary ul,.flow-preview{display:none}.flow-summary h2{margin:5px 0}.flow-body{padding:24px}.flow-summary p{margin:5px 0}.flow-steps{margin-bottom:26px}}

.flow-details-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.flow-split{display:grid;grid-template-columns:1fr 1fr;gap:12px}.signup-flow:has(#details-form){width:1080px}.flow-payment-preview{padding:18px;border:1px solid #425661;border-radius:10px;background:#162026}.flow-payment-preview>.flow-caption{display:block;margin-bottom:14px}.flow-payment-preview input:disabled{opacity:.7}.flow-payment-preview label:last-child{margin-bottom:0}@media(max-width:800px){.flow-details-grid{grid-template-columns:1fr;gap:0}.signup-flow:has(#details-form) .flow-layout{grid-template-columns:1fr}}

.signup-flow,.signup-flow:has(#details-form){width:800px}.flow-layout{display:block}.flow-body{padding:28px 36px 36px}.signup-flow:not(:has(#details-form)) .flow-body{max-width:600px;margin:auto}@media(max-width:700px){.flow-body{padding:24px}}

/* A quieter, more polished checkout form. */
.signup-flow{background:linear-gradient(150deg,#202a30,#171f24 75%);border-color:#475760;border-radius:20px;box-shadow:0 28px 90px #0008,inset 0 1px 0 #ffffff0a}.flow-top{padding:20px 32px;border-bottom-color:#ffffff0a}.flow-close{display:grid;place-items:center;border-radius:50%;font-size:22px;color:#a8bac5}.flow-close:hover{background:#ffffff0a;color:#fff}.flow-body{padding:24px 34px 32px}.flow-steps{justify-content:initial;gap:14px;margin-bottom:30px}.flow-steps li{flex:1;position:relative;font-size:11px;gap:8px;white-space:nowrap}.flow-steps li:not(:last-child):after{content:'';height:1px;background:#3a4a54;flex:1;margin-left:6px}.flow-steps span{width:24px;height:24px;flex-shrink:0;border-color:#4b5d68;background:#ffffff03}.flow-steps [aria-current] span{background:#e5efeb;border-color:#e5efeb;color:#22352d}.flow-body h1{font-size:30px;margin-bottom:8px}.flow-sub{color:#a8b7c0;margin-bottom:28px}.flow-details-grid{gap:28px}.flow-group-title{font-size:12px;font-weight:500;color:#e1e8ed;margin:0 0 17px;padding-bottom:10px;border-bottom:1px solid #ffffff0b}.signup-flow label{font-size:11px;color:#b6c4cd;margin-bottom:16px}.flow-body input{min-height:46px;background:#ffffff04;border:1px solid #42525c;border-radius:9px;margin-top:7px;padding:11px 12px;color:#eff2eb;box-shadow:inset 0 1px 2px #00000012}.flow-body input:hover{border-color:#647581}.flow-body input:focus-visible{outline:0;border-color:#aec9c4;box-shadow:0 0 0 3px #aec9c415}.flow-helper{font-size:11px;color:#94a7b3;margin-top:7px}.flow-primary{min-height:48px;background:#eff3f0;border:1px solid #ffffffc0;border-radius:10px;box-shadow:0 4px 12px #0002,inset 0 1px 0 #fff;font-size:13px;margin-top:20px}.flow-primary:hover{box-shadow:0 5px 16px #0003}.flow-primary:focus-visible{outline:2px solid #aec9c4;outline-offset:4px}@media(max-width:700px){.flow-body{padding:22px}.flow-top{padding:18px 22px}.flow-steps{gap:8px}.flow-steps li{font-size:10px}.flow-details-grid{gap:12px}.flow-body h1{font-size:27px}}
/* Focused signup surface, aligned with the landing's glass treatment. */
.signup-flow,.signup-flow:has(#details-form){width:840px;background:linear-gradient(135deg,rgba(45,59,68,.96),rgba(22,30,36,.98) 55%);border:1px solid #71848f66;border-radius:22px;box-shadow:inset 0 1px 0 #ffffff21,0 32px 100px #0009}
.flow-top{padding:22px 36px;border-bottom:0}.flow-wordmark{font-size:32px}.flow-close{width:32px;height:32px;border:1px solid #ffffff12;background:#ffffff03}.flow-body{padding:8px 40px 36px}.flow-steps{padding-bottom:23px;margin-bottom:25px;border-bottom:1px solid #ffffff12}.flow-steps li{font-size:12px;color:#8fa3b0}.flow-steps [aria-current]{color:#f0f4f5}.flow-steps span{width:25px;height:25px}.flow-body h1{font-size:34px;font-weight:400;letter-spacing:-1.1px;margin-bottom:9px}.flow-sub{font-size:14px;color:#aebfc9;margin-bottom:30px}.flow-details-grid{gap:36px}.flow-group-title{font-size:12px;font-weight:600;margin-bottom:17px;border:0;padding:0;color:#e3ebef}.signup-flow label{font-size:12px;font-weight:400;color:#b8c7d0;margin-bottom:17px}.flow-body input{background:rgba(11,19,25,.27);border-color:#849dab38;border-radius:10px;min-height:48px;padding:12px 14px;box-shadow:inset 0 1px 3px #00000014}.flow-body input::placeholder{color:#859aa8}.flow-body input:focus-visible{border-color:#c6ddd8;box-shadow:0 0 0 3px #c6ddd810;background:#18252d}.flow-helper{margin:4px 0 0;font-size:11px;color:#96aab7}.flow-primary{margin-top:22px;min-height:50px;font-size:13px;border-radius:11px;background:linear-gradient(#fff,#e4ecef);box-shadow:inset 0 1px 0 #fff,0 5px 16px #0003;color:#17272f}.flow-primary:hover{background:#fff}.flow-review{border-color:#ffffff18}.flow-payment-preview{background:#ffffff03;border-color:#ffffff20}.flow-url{background:#141f27;border-color:#849dab38}.flow-url input{background:none;box-shadow:none}.flow-url input:focus-visible{box-shadow:none}.flow-url:focus-within{border-color:#c6ddd8}.flow-payment-preview input:disabled{background:#101a2066}
@media(max-width:700px){.flow-top{padding:20px 24px}.flow-body{padding:4px 24px 28px}.flow-body h1{font-size:28px}.flow-steps{padding-bottom:20px;margin-bottom:22px}.flow-steps li{font-size:10px}.flow-details-grid{gap:10px}.flow-sub{font-size:13px;margin-bottom:24px}}

.flow-source>span{color:#96aab7;font-size:11px}.flow-source select{display:block;width:100%;min-height:48px;margin-top:7px;padding:12px 14px;border:1px solid #849dab38;border-radius:10px;background:#18232b;color:#eff2eb;font:inherit;color-scheme:dark}.flow-source select:focus-visible{outline:2px solid #c6ddd8;outline-offset:2px}

/* Local design-review controls. */
.signup-flow .flow-preview-toggle{margin-left:auto;margin-right:12px;padding:7px 12px;border:1px solid #ffffff24;border-radius:20px;background:#ffffff06;color:#b9c9d0;font:inherit;font-size:11px;cursor:pointer}
.signup-flow .flow-preview-nav{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:10px;margin-bottom:20px;border:1px dashed #ffffff26;border-radius:12px;background:#ffffff03}
.flow-preview-nav>span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#9daeb8;margin:0 8px}
.signup-flow .flow-preview-nav button{border:0;border-radius:7px;background:transparent;color:#b9c9d0;padding:8px 10px;font:inherit;font-size:12px;cursor:pointer}
.signup-flow .flow-preview-nav button[aria-pressed=true]{background:#e8eef0;color:#17232a}
.flow-payment-preview{padding:20px;border:1px solid #ffffff20;border-radius:14px;background:#ffffff03;margin:20px 0}
.flow-payment-heading{display:flex;justify-content:space-between;margin-bottom:20px;font-weight:600}
.flow-payment-heading span{font-size:11px;font-weight:400;color:#aebfc8}
.signup-flow .flow-payment-preview input:disabled{opacity:.7;cursor:default}

/* Checkout is one continuous surface, including the secure Whop frame. */
.signup-flow.flow-checkout{width:680px;background:#1c1c1c;border-color:#ffffff20;border-radius:20px;color-scheme:dark;scrollbar-width:thin;scrollbar-color:#ffffff30 transparent}
.flow-checkout .flow-top{padding:22px 30px 16px;background:linear-gradient(135deg,#263139,#1c1c1c);border-radius:20px 20px 0 0}
.flow-checkout .flow-wordmark{font-size:28px}
.signup-flow.flow-checkout .flow-body{max-width:none;padding:0 38px 22px}
.flow-checkout .flow-steps{padding:12px 0 18px;margin:0 0 22px;font-size:11px}
.flow-checkout .flow-body h1{font-size:28px;letter-spacing:-.8px;margin:0 0 8px}
.flow-checkout .flow-sub{font-size:13px;margin-bottom:20px;color:#a7afb5}
.flow-checkout.flow-is-preview .flow-steps{display:none}
.flow-checkout .flow-preview-nav{padding:5px;margin:0 0 22px;border:1px solid #ffffff12;border-radius:9px;background:#ffffff03;gap:4px}
.flow-checkout .flow-preview-nav>span{font-size:9px;margin:0 8px}
.flow-checkout #whop-signup-checkout>.flow-helper{font-size:10px;color:#929a9e;margin:0 0 14px}
.flow-checkout iframe{display:block;border-radius:12px}
.flow-checkout .flow-existing{display:block;margin:14px auto 0;color:#aeb6ba;text-decoration:none;padding:8px 14px;border-radius:8px}
.flow-checkout .flow-existing:hover{background:#ffffff08;color:white}
.flow-checkout .flow-review{margin:8px 0 20px;padding:0 0 8px;border-top:0}
.flow-checkout .flow-review>div{padding:7px 0}
@media(max-width:700px){.signup-flow.flow-checkout{max-width:calc(100vw - 20px);max-height:calc(100dvh - 20px)}.flow-checkout .flow-top{padding:18px 20px 14px}.signup-flow.flow-checkout .flow-body{padding:0 20px 20px}.flow-checkout .flow-body h1{font-size:25px}.flow-checkout .flow-preview-nav{margin-bottom:20px}.flow-checkout .flow-preview-nav button{font-size:11px;padding:8px}.flow-checkout .flow-preview-nav>span{display:none}}

/* Compact payment step. */
.signup-flow.flow-checkout{width:600px;background:#1c1c1c;border-radius:24px;border-color:#ffffff1c;box-shadow:0 28px 100px #0008,inset 0 1px 0 #ffffff0b}
.flow-checkout .flow-top{padding:24px 30px 20px;background:transparent;border-bottom:1px solid #ffffff0b}
.signup-flow.flow-checkout .flow-body{padding:26px 30px 22px}
.flow-checkout.flow-is-preview .flow-preview-nav{display:none}
.flow-checkout .flow-body h1{font-size:26px;font-weight:500;letter-spacing:-.8px}
.flow-checkout .flow-sub{margin-bottom:18px;font-size:12px;color:#a8afb4}
.flow-checkout #whop-signup-checkout>.flow-helper{margin-bottom:14px;font-size:10px;color:#858e94}
.flow-preview-select{margin-left:auto;margin-right:14px;border:1px solid #ffffff1c;border-radius:8px;padding:8px 28px 8px 12px;background:#ffffff04;color:#bbc4ca;font:12px 'DM Sans',sans-serif;color-scheme:dark;max-width:155px}
.flow-checkout .flow-existing{font-size:11px;color:#8d989f;margin:12px auto 0;padding:6px 12px}
@media(max-width:700px){.flow-checkout .flow-top{padding:20px}.signup-flow.flow-checkout .flow-body{padding:22px 20px 18px}.flow-preview-select{max-width:125px;font-size:11px;margin-right:8px}.flow-checkout .flow-wordmark small{font-size:6px;letter-spacing:1px}}

.beso-payment-footer{margin-top:18px;padding-top:22px;border-top:1px solid #ffffff12}
.beso-total{display:flex;align-items:center;justify-content:space-between;gap:16px}
.beso-total>div:first-child>span{display:block;font-size:14px;font-weight:500;color:#eff2f3}
.beso-total small{display:block;font-size:11px;color:#8d989f;margin-top:5px}
.beso-total-price{font:500 30px/1.2 Manrope,sans-serif;letter-spacing:-1px;color:#f4f6f7;white-space:nowrap}
.beso-total-price>span{font:11px 'DM Sans',sans-serif;letter-spacing:0;color:#839099;margin-left:5px}
.beso-renewal{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:20px 0 22px;padding:12px 14px;background:#ffffff04;border:1px solid #ffffff09;border-radius:9px;font-size:12px;color:#9eabb2}
.beso-renewal strong{font-weight:500;color:#d9e0e4}.beso-renewal strong span{font-weight:400;color:#8e9ba3}
.signup-flow .beso-pay-button{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;min-height:50px;padding:14px 20px;border:1px solid #ffffffb0;border-radius:10px;background:linear-gradient(180deg,#fff,#e3e9ec);color:#18232a;font:600 13px 'DM Sans',sans-serif;box-shadow:inset 0 1px 0 white,0 4px 14px #0002;opacity:1}
.beso-pay-button>span{font-size:18px;font-weight:400}
.beso-payment-terms{text-align:center;font-size:10px;line-height:1.6;color:#859198;max-width:330px;margin:14px auto 10px}
.beso-payment-secure{display:flex;align-items:center;justify-content:center;gap:6px;color:#a0abb1;font-size:10px}
.flow-checkout:has(.beso-payment-footer) .flow-existing{margin-top:18px;padding-top:14px;border-top:1px solid #ffffff0a;border-radius:0;width:100%}

.signup-flow.flow-thank-you{width:640px}.flow-thank-you .flow-steps,.flow-thank-you .flow-preview-nav{display:none}.signup-flow.flow-thank-you .flow-body{max-width:none;padding:24px 40px 36px}.flow-thanks-content{text-align:center}.flow-thank-you .flow-success-icon{margin:0 auto 24px;width:58px;height:58px;background:#ffffff07;border:1px solid #ffffff20;color:#dbece7}.flow-thank-you .flow-body h1{font-size:29px;letter-spacing:-.9px}.flow-thank-you .flow-sub{margin-bottom:28px}.flow-email-next{padding:22px;background:#ffffff04;border:1px solid #ffffff0e;border-radius:14px;text-align:left;margin-bottom:18px}.flow-email-next h2{font-size:14px;margin:0 0 8px;font-weight:500}.flow-email-next p{font-size:13px;line-height:1.7;color:#aebec7;margin:0;overflow-wrap:anywhere}.flow-email-next strong{font-weight:500;color:#e3ebef}.flow-thank-you .flow-primary{max-width:300px;margin:24px auto 0}@media(max-width:700px){.signup-flow.flow-thank-you .flow-body{padding:20px 24px 28px}.flow-thank-you .flow-body h1{font-size:25px}}

.flow-thank-you .flow-login-link{box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-decoration:none}

/* One-time network reveal, followed by the welcome message. */
.signup-flow.flow-thank-you .flow-body{padding-top:0;padding-bottom:32px}
.beso-welcome-art{height:220px;position:relative;display:grid;place-items:center;isolation:isolate;margin:0 -18px 12px}
.beso-welcome-glow{position:absolute;width:220px;height:160px;border-radius:50%;background:radial-gradient(ellipse,#65c7c02b,transparent 70%);animation:beso-glow-arrive 1.8s ease-out both}
.beso-welcome-network{position:absolute;inset:0;width:100%;height:100%;color:#8fc3c4;opacity:.35;mask-image:radial-gradient(ellipse,#000 30%,transparent 75%)}
.beso-welcome-network path{stroke-dasharray:1200;stroke-dashoffset:1200;animation:beso-network-connect 1.8s ease-out forwards}
.beso-welcome-network circle{transform-box:fill-box;transform-origin:center;animation:beso-node-arrive .65s ease-out var(--node-delay) both}
.beso-welcome-brand{display:flex;flex-direction:column;align-items:center;animation:beso-brand-arrive 1.1s cubic-bezier(.16,1,.3,1) .2s both}
.beso-welcome-brand>span{font:800 76px/1 Manrope,sans-serif;letter-spacing:-5px;color:#f2f6f3;text-shadow:0 0 35px #1b2a30}
.beso-welcome-brand>small{font:500 9px/1 'DM Sans',sans-serif;letter-spacing:5px;margin-top:14px;margin-left:5px;color:#c2d3d9}
.flow-thank-you .beso-welcome-copy h1{font-size:34px;line-height:1.18;letter-spacing:-1px;margin-bottom:16px}
.beso-welcome-copy{animation:beso-welcome-arrive .65s ease-out 1.4s both}
.flow-thank-you .beso-welcome-copy .flow-sub{font-size:13px;margin:0 0 24px}
.flow-thank-you .beso-welcome-copy .flow-login-link{gap:22px;margin:0 auto 16px;max-width:280px}
.beso-welcome-copy .flow-helper{font-size:10px;color:#859aa7}
@keyframes beso-network-connect{to{stroke-dashoffset:0}}
@keyframes beso-node-arrive{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}
@keyframes beso-brand-arrive{from{opacity:0;transform:translateY(12px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes beso-glow-arrive{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}
@keyframes beso-welcome-arrive{from{opacity:0;transform:translateY(10px);visibility:hidden}to{opacity:1;transform:translateY(0);visibility:visible}}
@media(max-width:700px){.beso-welcome-art{height:185px}.beso-welcome-brand>span{font-size:64px}.flow-thank-you .beso-welcome-copy h1{font-size:28px}}
@media(prefers-reduced-motion:reduce){.beso-welcome-art *,.beso-welcome-copy{animation:none!important}.beso-welcome-network path{stroke-dashoffset:0}}

/* Cinematic welcome: gather, illuminate, then reveal. */
.signup-flow.flow-thank-you{width:820px;background:#10181e;border-radius:24px;overflow:hidden}
.flow-thank-you .flow-top{position:relative;z-index:2;padding:24px 30px;background:transparent}
.signup-flow.flow-thank-you .flow-body{padding:0;max-width:none}
.beso-cinema{height:500px;max-height:calc(100dvh - 140px);min-height:350px;position:relative;isolation:isolate;overflow:hidden;text-align:center;display:grid;place-items:center}
.beso-cinema-halo{position:absolute;inset:-30%;z-index:-1;background:radial-gradient(ellipse at 48% 45%,#78e1d826,transparent 40%),radial-gradient(ellipse at 65% 65%,#529be319,transparent 45%);animation:cinema-halo 8s ease-in-out both}
.beso-cinema-grid{position:absolute;inset:0;z-index:-1;background-image:radial-gradient(#b4ddd333 .7px,transparent .8px);background-size:22px 22px;mask-image:radial-gradient(ellipse,#0009,transparent 65%);opacity:.35}
.beso-cinema-intro{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;animation:cinema-exit 1s ease-in-out 6.1s both}
.beso-cinema-brand{position:relative;animation:cinema-logo 5.8s cubic-bezier(.22,1,.36,1) both}
.beso-cinema-brand>span{display:block;font:800 clamp(90px,13vw,142px)/1 Manrope,sans-serif;letter-spacing:-9px;background:linear-gradient(110deg,#eff5f0 32%,#a3c2c2 42%,#fff 49%,#eff5f0 58%);background-size:260% 100%;background-clip:text;color:transparent;animation:cinema-shine 2.3s ease-in-out 3s both}
.beso-cinema-brand>small{display:block;font:500 11px/1 'DM Sans',sans-serif;letter-spacing:10px;margin:24px 0 0 10px;color:#c5d7dc;animation:cinema-rise 1s ease 2.2s both}
.beso-cinema-tagline{font-size:13px;letter-spacing:.1px;color:#9bb5c0;margin-top:34px;animation:cinema-rise 1s ease 3.2s both}
.beso-cinema-particles{position:absolute;left:50%;top:42%}
.beso-cinema-particles i{position:absolute;width:var(--size);height:var(--size);background:#b6ece2;border-radius:1px;box-shadow:0 0 8px #a5e7e05c;animation:cinema-particle 3.4s cubic-bezier(.5,0,.15,1) var(--delay) both}
.beso-cinema-welcome{position:relative;max-width:560px;padding:24px;animation:cinema-reveal 1.2s cubic-bezier(.16,1,.3,1) 6.8s both}
.beso-welcome-eyebrow{font-size:9px;letter-spacing:2.6px;color:#98b8be;display:block;margin-bottom:24px}
.flow-thank-you .beso-cinema-welcome h1{font:400 clamp(30px,4vw,46px)/1.13 Manrope,sans-serif;letter-spacing:-1.8px;margin:0 0 22px;color:#eaf0f0}
.beso-cinema-welcome h1>span{color:#fff}.beso-cinema-welcome>p{font-size:14px;line-height:1.8;color:#9cb1bd;margin:0 0 28px}
.flow-thank-you .beso-cinema-welcome .flow-login-link{max-width:300px;gap:28px;margin:0 auto 18px;border-radius:50px;min-height:52px}
.beso-cinema-welcome>small{font-size:9px;color:#6f8795}
.beso-cinema-bottom{position:absolute;bottom:24px;left:30px;right:30px;display:flex;align-items:center;justify-content:space-between;gap:30px;animation:cinema-exit .4s ease 7.6s both}
.beso-cinema-progress{width:90px;height:2px;background:#ffffff12;overflow:hidden}.beso-cinema-progress>i{display:block;height:100%;background:#bed9dc;transform-origin:left;animation:cinema-progress 7.8s linear both}
.beso-cinema-skip{border:0;background:none;color:#9db4be;font-size:11px;padding:8px;cursor:pointer}
@keyframes cinema-particle{0%{opacity:0;transform:translate(var(--x),var(--y)) scale(.4)}20%{opacity:.8}85%{opacity:.65}100%{opacity:0;transform:translate(0,0) scale(.2)}}
@keyframes cinema-logo{0%,20%{opacity:0;filter:blur(16px);transform:scale(.85)}52%{opacity:1;filter:blur(0);transform:scale(1)}100%{opacity:1;filter:blur(0);transform:scale(1.04)}}
@keyframes cinema-shine{from{background-position:100% 0}to{background-position:0 0}}
@keyframes cinema-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes cinema-exit{from{opacity:1;visibility:visible}to{opacity:0;transform:translateY(-12px);visibility:hidden}}
@keyframes cinema-reveal{from{opacity:0;visibility:hidden;transform:translateY(24px)}to{opacity:1;visibility:visible;transform:translateY(0)}}
@keyframes cinema-halo{0%{opacity:0;transform:scale(.7)}45%{opacity:1;transform:scale(1.1)}100%{opacity:.6;transform:scale(1)}}
@keyframes cinema-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.intro-finished .beso-cinema-intro,.intro-finished .beso-cinema-bottom{display:none}.intro-finished .beso-cinema-welcome{animation:none}
@media(max-width:700px){.beso-cinema{height:470px}.flow-thank-you .flow-top{padding:18px 20px}.beso-cinema-brand>span{letter-spacing:-6px}.beso-cinema-welcome{padding:20px}.flow-thank-you .beso-cinema-welcome h1{letter-spacing:-1px}}
@media(prefers-reduced-motion:reduce){.beso-cinema *{animation:none!important}.beso-cinema-intro,.beso-cinema-bottom{display:none}}

/* The signature stays in place after its reveal. */
.beso-cinema-intro{animation:none;pointer-events:none;justify-content:flex-start;padding-top:95px;box-sizing:border-box}
.beso-cinema-brand{display:flex;align-items:center;justify-content:center;gap:26px;animation:beso-signature-settle 1.2s cubic-bezier(.16,1,.3,1) 5.5s both;transform-origin:center}
.beso-cinema-brand>span{font-size:100px;letter-spacing:-6px;animation:beso-signature-logo 1.5s cubic-bezier(.16,1,.3,1) .7s both,cinema-shine 2.3s ease-in-out 3s both}
.beso-brand-divider{display:block;width:1px;height:56px;background:linear-gradient(transparent,#c9e2e4,transparent);transform-origin:center;animation:beso-divider-draw 1s cubic-bezier(.22,1,.36,1) 2.3s both}
.beso-cinema-brand>small{margin:0;font-size:13px;letter-spacing:6px;animation:beso-network-reveal 1.2s cubic-bezier(.16,1,.3,1) 3.1s both}
.beso-cinema-welcome{padding-top:155px;animation-delay:6.2s}
.flow-thank-you .beso-cinema-welcome h1{font-size:35px;letter-spacing:-1px}
.beso-cinema-particles{top:29%}
@keyframes beso-signature-logo{from{opacity:0;filter:blur(12px);transform:translateY(12px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}
@keyframes beso-divider-draw{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}
@keyframes beso-network-reveal{from{opacity:0;transform:translateX(-14px);filter:blur(5px)}to{opacity:1;transform:translateX(0);filter:blur(0)}}
@keyframes beso-signature-settle{from{transform:translateY(45px) scale(1.1)}to{transform:translateY(-45px) scale(.78)}}
.intro-finished .beso-cinema-intro{display:flex}.intro-finished .beso-cinema-brand{animation:none;transform:translateY(-45px) scale(.78)}.intro-finished .beso-cinema-brand>*{animation:none}.intro-finished .beso-cinema-particles{display:none}
@media(max-width:700px){.beso-cinema-brand{gap:18px}.beso-cinema-brand>span{font-size:76px;letter-spacing:-5px}.beso-cinema-brand>small{font-size:10px;letter-spacing:4px}.beso-brand-divider{height:42px}.beso-cinema-welcome{padding-top:130px}.flow-thank-you .beso-cinema-welcome h1{font-size:28px}}
@media(prefers-reduced-motion:reduce){.beso-cinema-intro{display:flex}.beso-cinema-brand{transform:translateY(-45px) scale(.78)}.beso-cinema-particles{display:none}}

/* Refined welcome signature: one logo, crisp divider, measured movement. */
.flow-thank-you .flow-top .flow-wordmark{display:none}
.flow-thank-you .flow-top{min-height:54px;padding:16px 24px 0;box-sizing:border-box}
.flow-thank-you .flow-top .flow-close{margin-left:0}
.beso-cinema-intro{padding-top:100px}
.beso-cinema-brand{gap:27px;animation:beso-signature-lift 1.4s cubic-bezier(.22,1,.36,1) 5.1s both}
.beso-cinema-brand>span{font-size:94px;letter-spacing:-5.5px;background:none;color:#edf4ef;animation:beso-clean-logo 1.5s cubic-bezier(.22,1,.36,1) .65s both;text-shadow:0 0 36px #bcece408}
.beso-brand-divider{width:1px;height:39px;background:#b3c9cc66;align-self:center;flex-shrink:0;animation:beso-clean-divider .85s cubic-bezier(.22,1,.36,1) 2.1s both}
.beso-cinema-brand>small{font-size:11px;letter-spacing:5px;color:#d0dfe2;animation:beso-clean-network 1.2s cubic-bezier(.22,1,.36,1) 2.8s both}
.beso-cinema-halo{background:radial-gradient(ellipse at 50% 35%,#80d9d11c,transparent 43%),radial-gradient(ellipse at 55% 70%,#529be30c,transparent 50%)}
.beso-cinema-particles i{box-shadow:none;background:#accfcd;animation-duration:2.7s}
.beso-cinema-grid{opacity:.2;background-size:25px 25px}
.beso-cinema-welcome{animation-delay:6s}
@keyframes beso-clean-logo{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes beso-clean-divider{from{opacity:0;clip-path:inset(50% 0)}to{opacity:1;clip-path:inset(0)}}
@keyframes beso-clean-network{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}
@keyframes beso-signature-lift{from{transform:translateY(42px)}to{transform:translateY(-42px)}}
.intro-finished .beso-cinema-brand{transform:translateY(-42px)}
@media(max-width:700px){.beso-cinema-brand{gap:19px}.beso-cinema-brand>span{font-size:70px;letter-spacing:-4px}.beso-cinema-brand>small{font-size:9px;letter-spacing:3.8px}.beso-brand-divider{height:30px}.flow-thank-you .flow-top{padding:12px 18px 0}}
@media(prefers-reduced-motion:reduce){.beso-cinema-brand{transform:translateY(-42px)}}

/* Seamless backdrop and optical alignment of the wordmark. */
.signup-flow.flow-thank-you{background:radial-gradient(ellipse at 50% 45%,#17272d 0%,#10181e 66%)}
.flow-thank-you .flow-top{border:0;box-shadow:none}
.beso-cinema-halo{display:none}
.beso-cinema-grid{mask-image:radial-gradient(ellipse at center,#0006 0%,transparent 62%)}
.beso-cinema-brand>span{line-height:1}
.beso-brand-divider{height:54px;position:relative;top:5px;background:#bacfd06b}
.beso-cinema-brand>small{position:relative;top:5px;line-height:1;display:block}
@media(max-width:700px){.beso-brand-divider{height:40px;top:4px}.beso-cinema-brand>small{top:4px}}

.flow-thank-you .beso-cinema-welcome .flow-login-link{max-width:290px;min-height:54px;padding:10px 12px 10px 22px;justify-content:space-between;gap:22px;border-radius:13px;border:1px solid #ffffffc7;background:linear-gradient(180deg,#fff 0%,#e7eff1 100%);box-shadow:inset 0 1px 0 #fff,0 5px 18px #0003;color:#17262e;font-size:13px;font-weight:600;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.beso-login-arrow{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:#192e3709;border:1px solid #192e370c;transition:transform .2s ease}
.flow-thank-you .beso-cinema-welcome .flow-login-link:hover{background:#fff;transform:translateY(-2px);box-shadow:inset 0 1px 0 #fff,0 8px 24px #0004}
.flow-login-link:hover .beso-login-arrow{transform:translateX(2px)}
.flow-thank-you .beso-cinema-welcome .flow-login-link:active{transform:translateY(0)}
@media(prefers-reduced-motion:reduce){.flow-thank-you .beso-cinema-welcome .flow-login-link,.beso-login-arrow{transition:none}}

.signup-flow .flow-close{display:flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;padding:0;margin:0;border:1px solid #ffffff14;border-radius:10px;background:#ffffff03;color:#a9bcc7;line-height:1;cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease}
.signup-flow .flow-close svg{display:block;flex-shrink:0}
.signup-flow .flow-close:hover{background:#ffffff0b;border-color:#ffffff28;color:#fff}
.signup-flow .flow-close:focus-visible{outline:2px solid #c6ddd8;outline-offset:3px}

.whop-stable-shell{position:relative;overflow:hidden;transition:height .2s ease}
.whop-stable-content{position:absolute;left:0;top:0;width:100%;transition:opacity .2s ease}
.whop-loading-placeholder{display:grid;place-items:center;position:absolute;inset:0;border:1px solid #ffffff12;border-radius:12px;background:#ffffff02;color:#9aaab4;font-size:12px}
@media(prefers-reduced-motion:reduce){.whop-stable-shell,.whop-stable-content{transition:none}}

/* Align the header brand by its visible letterforms, not the text baseline. */
.signup-flow .flow-wordmark{display:inline-flex;align-items:center;gap:13px;line-height:1;white-space:nowrap}
.signup-flow .flow-wordmark small{display:inline-flex;align-items:center;gap:12px;margin:0;padding:0;border:0;position:relative;top:2px;font:500 8px/1 'DM Sans',sans-serif;letter-spacing:1.8px}
.signup-flow .flow-wordmark small::before{content:'';display:block;flex:0 0 1px;width:1px;height:18px;background:#a8bec44d}
.flow-thank-you .flow-top .flow-wordmark{display:none}
.signup-flow .beso-pay-button:disabled{opacity:.55;cursor:wait}
.signup-flow .beso-pay-button:focus-visible{outline:2px solid #c6ddd8;outline-offset:3px}
