/* Shared control skins. Registration is the visual source of truth. */
.onboarding .registration-step-chrome,
html.connection-route .partner-modal:not([data-connection-step="intro"]) .registration-step-chrome{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:44px 6px;
  flex:0 0 60px;
  width:100%;
  height:60px;
  gap:10px;
}
.onboarding .registration-step-head,
html.connection-route .partner-modal:not([data-connection-step="intro"]) .registration-step-head{
  display:grid;
  grid-template-columns:81px minmax(0,1fr) 81px;
  width:100%;
  min-height:44px;
  height:44px;
  align-items:center;
  gap:0;
  padding:8px 0;
}
.onboarding .registration-step-title,
html.connection-route .partner-modal:not([data-connection-step="intro"]) .registration-step-title{
  position:static;
  inset:auto;
  display:flex!important;
  width:auto;
  min-width:0;
  height:28px;
  align-items:center;
  justify-content:center;
  color:#f5f0ff;
  font-family:"Astra Welcome Inter",Inter,system-ui,sans-serif;
  font-size:16px;
  font-weight:500;
  line-height:19px;
  text-align:center;
  white-space:nowrap;
}
.onboarding .registration-step-head-spacer,
html.connection-route .partner-modal:not([data-connection-step="intro"]) .registration-step-head-spacer{
  display:block;
  width:81px;
  height:28px;
}
.onboarding .registration-step-progress,
html.connection-route .partner-modal:not([data-connection-step="intro"]) .registration-step-progress{
  position:static;
  display:block;
  width:100%;
  height:6px;
  overflow:hidden;
  border:.5px solid rgba(128,115,217,.1);
  border-radius:999px;
  background:rgba(20,18,41,.45);
  box-shadow:inset 0 .5px 2px rgba(0,0,0,.25);
}
.onboarding .registration-step-progress>span,
html.connection-route .partner-modal:not([data-connection-step="intro"]) .registration-step-progress>span{
  display:block;
  height:100%;
  border:.5px solid rgba(166,153,255,.22);
  border-radius:999px;
  background:linear-gradient(90deg,rgba(153,140,255,.3),rgba(115,102,235,.05) 50%,rgba(128,115,242,.18)),rgba(97,82,224,.85);
  box-shadow:inset 0 0 4px rgba(140,122,255,.15),inset 0 .75px 1.5px rgba(191,178,255,.35),0 0 8px -1px rgba(102,82,229,.18);
  opacity:.8;
  transition:width 160ms ease;
}
html.connection-route .partner-modal:not([data-connection-step="intro"]) .partner-modal-shell{
  padding-top:calc(env(safe-area-inset-top) + 2px);
  padding-inline:24px;
}
html.connection-route .partner-modal:not([data-connection-step="intro"]) .partner-modal-center{
  position:static;
  display:block;
  width:100%;
  height:6px;
}
html.connection-route .partner-modal:not([data-connection-step="intro"]) .registration-step-head .registration-back-control{
  position:static;
  top:auto;
  left:auto;
  z-index:auto;
  background:transparent url("/assets/onboarding/name-chevron-left.svg") 6px center/16px 16px no-repeat;
}

.registration-primary-cta{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  isolation:isolate;
  width:100%;
  height:64px;
  min-height:64px;
  margin:0;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border:.75px solid rgba(160,148,255,.28);
  border-radius:999px;
  background:linear-gradient(90deg,rgba(160,150,255,.18),rgba(120,110,230,.06) 35%,rgba(80,70,200,.02) 65%,rgba(100,90,210,.1)),rgba(55,48,130,.45);
  box-shadow:inset 0 -1px 3px rgba(0,0,0,.15),inset 0 0 12px rgba(130,115,255,.08),inset 0 1px 2px rgba(200,190,255,.22),0 2px 24px rgba(89,71,229,.12),0 4px 16px rgba(0,0,0,.2);
  color:#f5f2ff;
  font-family:"Astra Welcome Inter",Inter,system-ui,-apple-system,sans-serif;
  font-size:18px;
  font-weight:600;
  line-height:1;
  letter-spacing:0;
  text-align:left;
  text-transform:none;
  transition:filter 160ms ease,opacity 160ms ease,transform 160ms ease;
}
.registration-primary-cta::after{
  content:"";
  position:static;
  width:20px;
  height:20px;
  flex:0 0 20px;
  background:url("/assets/onboarding/focus-arrow-right.svg") center/20px 20px no-repeat;
}
.registration-primary-cta:active:not(:disabled){transform:scale(.985);filter:brightness(.94)}
.registration-primary-cta:disabled{
  border-color:rgba(160,148,255,.14);
  background:linear-gradient(90deg,rgba(160,150,255,.09),rgba(120,110,230,.03) 35%,rgba(80,70,200,.01) 65%,rgba(100,90,210,.05)),rgba(55,48,130,.22);
  box-shadow:inset 0 -1px 3px rgba(0,0,0,.08),inset 0 0 12px rgba(130,115,255,.04),inset 0 1px 2px rgba(200,190,255,.11),0 2px 24px rgba(89,71,229,.06),0 4px 16px rgba(0,0,0,.1);
  color:#646078;
  opacity:1;
}
.registration-primary-cta:disabled::after{opacity:.35}

.registration-welcome-cta{
  overflow:hidden;
  border-color:rgba(160,148,255,.36);
  background:linear-gradient(90deg,rgba(101,88,205,.46) 0%,rgba(55,48,130,.82) 45%,rgba(45,39,111,.88) 100%);
  box-shadow:inset 0 -1px 3px rgba(0,0,0,.2),inset 0 0 12px rgba(130,115,255,.1),inset 0 1px 2px rgba(215,207,255,.24),0 2px 24px rgba(89,71,229,.16),0 4px 16px rgba(0,0,0,.22);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.registration-welcome-cta::after{background-image:url("/assets/onboarding/welcome-arrow.svg")}
.welcome-start.registration-welcome-cta::after{content:none}

.registration-unknown-time{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  height:48px;
  margin:0;
  padding:0;
  border:0;
  border-radius:14px;
  outline:0;
  background:transparent;
  box-shadow:none;
  color:#9b96b0;
  font-family:"Astra Welcome Inter",Inter,system-ui,-apple-system,sans-serif;
  font-size:15px;
  font-weight:500;
  transition:color 160ms ease,opacity 160ms ease;
}
.registration-unknown-time:hover{opacity:.88}
.registration-unknown-time:active{opacity:.68}
.registration-unknown-time:focus,.registration-unknown-time:focus-visible{border:0;outline:0;box-shadow:none}
.registration-unknown-time::before,.registration-unknown-time::after{content:none}

/* Registration Name is the single physical input skin for both onboarding flows. */
.registration-name-field{
  display:flex;
  width:100%;
  height:52px;
  flex:0 0 52px;
  align-items:center;
  gap:10px;
  padding:0 14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.06);
  border-radius:12px;
  background-color:rgba(20,18,40,.6);
  background-image:none;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.018);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.registration-name-field>img{
  display:block;
  width:18px;
  height:18px;
  flex:0 0 18px;
  object-fit:contain;
}
.registration-name-input{
  appearance:none;
  -webkit-appearance:none;
  min-width:0;
  width:100%;
  height:50px;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  outline:0;
  background:transparent;
  box-shadow:none;
  color:#f5f0e8;
  font-family:"Astra Welcome Inter",Inter,system-ui,-apple-system,sans-serif;
  font-size:16px;
  font-weight:400;
  line-height:normal;
  text-align:left;
}
.registration-name-input::placeholder{color:#646078;font-size:16px;opacity:1}
.registration-name-input:focus,.registration-name-input:focus-visible{border:0;outline:0;box-shadow:none}
.registration-name-input:disabled{color:#646078;opacity:1}

.registration-final-insight{
  position:relative;
  display:block;
  width:100%;
  height:100px;
  min-height:100px;
  padding:14px 20px;
  overflow:hidden;
  border:.5px solid rgba(165,151,255,.18);
  border-radius:16px;
  background:radial-gradient(120% 120% at 12% 0%,rgba(123,103,226,.2),transparent 58%),rgba(35,29,73,.58);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.registration-final-insight-content{
  display:flex;
  height:100%;
  gap:6px;
  flex-direction:column;
  justify-content:space-between;
  transition:opacity .52s cubic-bezier(.22,.72,.2,1),transform .52s cubic-bezier(.22,.72,.2,1),filter .52s ease;
}
.registration-final-insight-content.is-changing{opacity:0;transform:translateY(-6px) scale(.985);filter:blur(5px)}
.registration-final-insight p{
  display:-webkit-box;
  width:100%;
  max-width:300px;
  height:42px;
  min-height:42px;
  max-height:42px;
  flex:0 0 42px;
  margin:0;
  overflow:hidden;
  color:#f2eefb;
  font-family:"Astra Welcome Inter",Inter,system-ui,-apple-system,sans-serif;
  font-size:15px;
  font-weight:400;
  line-height:21px;
  overflow-wrap:break-word;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.registration-final-insight span{
  display:flex;
  margin:0;
  align-items:center;
  gap:7px;
  color:#9d96b7;
  font-family:"Astra Welcome Inter",Inter,system-ui,-apple-system,sans-serif;
  font-size:11px;
  font-weight:500;
  line-height:16px;
  letter-spacing:.02em;
  text-transform:none;
}
.registration-final-insight span img{display:block;width:14px;height:14px;opacity:.7;filter:none}

.registration-back-control{
  appearance:none;
  -webkit-appearance:none;
  width:81px;
  height:28px;
  padding:6px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  border:0;
  border-radius:99px;
  background:transparent url("/assets/onboarding/name-chevron-left.svg") 6px center/16px 16px no-repeat;
  color:transparent;
  font-size:0;
}

.persona-card.registration-gender-card{
  position:relative;
  isolation:isolate;
  display:flex;
  min-width:0;
  min-height:220px;
  height:220px;
  padding:14px;
  flex-direction:column;
  align-items:flex-start;
  justify-content:space-between;
  overflow:hidden;
  border:1px solid rgba(180,168,255,.25);
  border-radius:16px;
  background:rgba(20,18,50,.8);
  box-shadow:none;
  color:#f5f0e8;
  text-align:center;
  transition:border-color 160ms ease,background-color 160ms ease,transform 160ms ease;
}
.persona-card.registration-gender-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(0deg,rgba(20,18,50,0) 0 55%,rgba(20,18,50,.8) 82%,rgb(20,18,50) 100%);
  pointer-events:none;
}
.persona-card.registration-gender-card::after{
  content:"";
  position:absolute;
  top:14px;
  right:14px;
  z-index:3;
  width:20px;
  height:20px;
  background:url("/assets/onboarding/gender-selection.svg") center/20px 20px no-repeat;
}
.persona-card.registration-gender-card:active{transform:scale(.985)}
.persona-card.registration-gender-card.selected{border-color:rgba(180,168,255,.6);background:rgba(35,30,80,.9);box-shadow:none}
.persona-card.registration-gender-card.selected::before{background:linear-gradient(0deg,rgba(35,30,80,0) 0 55%,rgba(35,30,80,.8) 82%,rgb(35,30,80) 100%)}
.persona-card.registration-gender-card.selected::after{border-radius:50%;background:#6b5ce8 url("/assets/onboarding/gender-check.svg") center/10px 10px no-repeat}
.persona-card.registration-gender-card strong{
  position:absolute;
  right:14px;
  bottom:14px;
  left:14px;
  z-index:2;
  height:18px;
  margin:0;
  color:#f5f0e8;
  font-family:"Astra Welcome Inter",Inter,system-ui,-apple-system,sans-serif;
  font-size:14px;
  font-weight:500;
  line-height:18px;
  text-align:center;
}
.persona-card.registration-gender-card .partner-gender-portrait{
  position:absolute;
  inset:0;
  z-index:-2;
  display:flex;
  width:100%;
  height:100%;
  align-items:flex-end;
  justify-content:center;
  overflow:hidden;
  pointer-events:none;
}
.persona-card.registration-gender-card .partner-gender-portrait img{
  position:absolute;
  left:50%;
  bottom:var(--gender-portrait-bottom);
  display:block;
  max-width:none;
  aspect-ratio:1/1;
  transform:translateX(-50%);
  object-fit:contain;
  object-position:center bottom;
  opacity:.9;
}
.persona-card.registration-gender-card[data-value="male"]{--gender-portrait-bottom:-24px}
.persona-card.registration-gender-card[data-value="male"] .partner-gender-portrait img{width:240px;height:240px}
.persona-card.registration-gender-card[data-value="female"]{--gender-portrait-bottom:-54px}
.persona-card.registration-gender-card[data-value="female"] .partner-gender-portrait img{width:270px;height:270px}