/* NOVIQ V21.1 — onboarding visual refinement only.
   Additive UI layer. No legal, consent, proof, auth or action logic changes. */

.v70-onboarding{
  z-index:2147483600!important;
  align-items:center!important;
  justify-content:center!important;
  padding:clamp(18px,4vw,48px)!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(84,103,255,.13),transparent 32%),
    radial-gradient(circle at 82% 78%,rgba(104,70,255,.10),transparent 30%),
    rgba(2,6,14,.80)!important;
  backdrop-filter:blur(20px) saturate(115%)!important;
  -webkit-backdrop-filter:blur(20px) saturate(115%)!important;
}

.v70-onboarding-card{
  position:relative;
  width:min(780px,100%)!important;
  max-height:min(780px,calc(100dvh - 36px))!important;
  overflow:auto!important;
  padding:28px 30px 24px!important;
  border:1px solid rgba(157,174,255,.16)!important;
  border-radius:30px!important;
  background:
    linear-gradient(180deg,rgba(17,24,41,.98),rgba(8,13,24,.985)) padding-box,
    linear-gradient(135deg,rgba(157,174,255,.42),rgba(111,81,255,.08),rgba(255,255,255,.08)) border-box!important;
  box-shadow:0 40px 120px rgba(0,0,0,.58),0 0 0 1px rgba(255,255,255,.025) inset!important;
  scrollbar-width:thin;
}

.v70-onboarding-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:150px;
  border-radius:30px 30px 0 0;
  pointer-events:none;
  background:radial-gradient(circle at 24% -20%,rgba(109,125,255,.16),transparent 58%);
}

.v70-onboarding-top{
  position:relative;
  z-index:1;
  align-items:flex-start!important;
  gap:22px!important;
  padding-bottom:4px;
}

.v70-onboarding-top .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin:0 0 9px!important;
  padding:6px 9px;
  border:1px solid rgba(156,172,255,.14);
  border-radius:999px;
  background:rgba(139,151,255,.055);
  color:#b6c2ff!important;
  font-size:10px!important;
  font-weight:850!important;
  letter-spacing:.11em!important;
  text-transform:uppercase;
}

.v70-onboarding-top h2{
  margin:0!important;
  max-width:560px;
  color:#f7f9ff;
  font-size:clamp(25px,3.3vw,34px)!important;
  line-height:1.08!important;
  letter-spacing:-.032em;
  font-weight:860!important;
}

#v70OnboardingClose{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  padding:0!important;
  border:1px solid rgba(255,255,255,.09)!important;
  border-radius:14px;
  background:rgba(255,255,255,.035)!important;
  color:#aeb8ca!important;
  font-size:24px!important;
  line-height:1;
  transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}

#v70OnboardingClose:hover{
  background:rgba(255,255,255,.075)!important;
  border-color:rgba(255,255,255,.15)!important;
  color:#fff!important;
  transform:translateY(-1px);
}

.v70-step-dots{
  position:relative;
  z-index:1;
  gap:8px!important;
  margin:20px 0 24px!important;
}

.v70-step-dots span{
  height:4px!important;
  border-radius:999px!important;
  background:rgba(148,162,190,.14)!important;
  overflow:hidden;
}

.v70-step-dots span.active{
  background:linear-gradient(90deg,#8ca8ff,#7264ff)!important;
  box-shadow:0 0 16px rgba(118,104,255,.28);
}

.v70-onboarding-step{
  position:relative;
  z-index:1;
  min-height:300px;
}

.v70-onboarding-step>h2{
  max-width:680px;
  margin:0 0 10px!important;
  color:#f7f9ff;
  font-size:clamp(29px,4.3vw,42px)!important;
  line-height:1.08!important;
  letter-spacing:-.042em;
  font-weight:870!important;
}

.v70-onboarding-step>p{
  max-width:650px;
  margin:0!important;
  color:#9eaabd!important;
  font-size:15px!important;
  line-height:1.55!important;
}

.v70-choice-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
  margin:24px 0 4px!important;
}

.v70-choice-grid button{
  position:relative;
  min-height:92px;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) 22px;
  align-items:center;
  gap:13px;
  padding:14px 15px!important;
  border:1px solid rgba(157,174,255,.12)!important;
  border-radius:19px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.038),rgba(255,255,255,.018))!important;
  color:#eff3ff!important;
  text-align:left!important;
  cursor:pointer;
  box-shadow:0 1px 0 rgba(255,255,255,.02) inset;
  transition:transform .17s ease,border-color .17s ease,background .17s ease,box-shadow .17s ease;
}

.v70-choice-grid button:hover{
  transform:translateY(-2px);
  border-color:rgba(150,164,255,.28)!important;
  background:linear-gradient(145deg,rgba(123,137,255,.085),rgba(255,255,255,.022))!important;
  box-shadow:0 12px 30px rgba(0,0,0,.18),0 1px 0 rgba(255,255,255,.04) inset;
}

.v70-choice-grid button.selected{
  border-color:rgba(132,147,255,.62)!important;
  background:linear-gradient(145deg,rgba(94,111,255,.18),rgba(105,74,255,.09))!important;
  box-shadow:0 0 0 1px rgba(126,142,255,.12) inset,0 16px 38px rgba(39,47,128,.18);
}

.nq211-choice-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border:1px solid rgba(167,180,255,.12);
  border-radius:15px;
  background:rgba(123,139,255,.075);
  color:#cbd4ff;
  font-size:20px;
  font-weight:850;
  line-height:1;
}

.nq211-choice-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
}

.nq211-choice-copy b,
.nq211-choice-copy small{
  display:block!important;
  width:100%;
}

.nq211-choice-copy b{
  color:#f7f9ff;
  font-size:15px;
  line-height:1.2;
  font-weight:830;
}

.nq211-choice-copy small{
  color:#8f9bae;
  font-size:12px;
  line-height:1.35;
  font-weight:520;
}

.nq211-choice-check{
  width:20px;
  height:20px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
  color:transparent;
  font-size:11px;
  font-weight:900;
  transition:all .17s ease;
}

.v70-choice-grid button.selected .nq211-choice-check{
  border-color:#8fa4ff;
  background:#8298ff;
  color:#08101f;
  box-shadow:0 0 20px rgba(122,142,255,.28);
}

.v70-onboarding-actions{
  position:relative;
  z-index:1;
  align-items:center!important;
  margin-top:22px!important;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.07);
}

.v70-onboarding-actions .btn{
  min-width:120px!important;
  height:48px;
  border-radius:15px!important;
  font-weight:820!important;
}

#v70OnboardingBack{
  border-color:rgba(255,255,255,.08)!important;
  background:rgba(255,255,255,.025)!important;
  color:#9ba7b8!important;
}

#v70OnboardingBack:disabled{
  opacity:0!important;
  pointer-events:none!important;
}

#v70OnboardingNext{
  min-width:132px!important;
  border:1px solid rgba(166,180,255,.25)!important;
  background:linear-gradient(135deg,#b9cbff 0%,#8faeff 48%,#a692ff 100%)!important;
  color:#08101f!important;
  box-shadow:0 10px 30px rgba(104,123,255,.22)!important;
}

#v70OnboardingNext:hover{
  transform:translateY(-1px);
  filter:brightness(1.04);
}

#v70OnboardingMessage{
  position:relative;
  z-index:1;
  margin:14px 0 -5px!important;
  border-radius:13px!important;
}

.v70-onboarding .v70-actions{
  margin-top:22px;
}

.v70-onboarding .v70-actions .btn{
  min-height:48px;
  border-radius:15px!important;
}

.v70-onboarding .v70-guard{
  margin-top:16px!important;
  padding:15px 16px!important;
  border:1px solid rgba(157,174,255,.10)!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.025)!important;
}

.v70-onboarding .v70-guard b,
.v70-onboarding .v70-guard small{
  display:block;
}

.v70-onboarding .v70-guard small{
  margin-top:4px;
  color:#8f9aae;
  line-height:1.45;
}

/* Do not let the fixed HEUTE / ONE pill sit above the setup dialog. */
body:has(#v70Onboarding.show) .nq170-nav,
body:has(#v70Onboarding.show) #hudBottomNav,
body:has(#v70Onboarding.show) .nq150-nav{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

@media(max-width:720px){
  .v70-onboarding{
    align-items:flex-end!important;
    padding:8px!important;
  }
  .v70-onboarding-card{
    width:100%!important;
    max-height:calc(100dvh - 16px)!important;
    padding:22px 18px 18px!important;
    border-radius:26px!important;
  }
  .v70-onboarding-card::before{border-radius:26px 26px 0 0}
  .v70-choice-grid{grid-template-columns:1fr!important;gap:9px!important;margin-top:18px!important}
  .v70-choice-grid button{min-height:78px;grid-template-columns:43px minmax(0,1fr) 20px;padding:11px 12px!important;border-radius:17px!important}
  .nq211-choice-icon{width:43px;height:43px;border-radius:13px;font-size:18px}
  .v70-onboarding-step{min-height:auto}
  .v70-onboarding-step>h2{font-size:clamp(27px,8vw,35px)!important}
  .v70-onboarding-step>p{font-size:14px!important}
  .v70-onboarding-actions{position:sticky;bottom:-18px;margin-left:-2px;margin-right:-2px;padding:14px 2px 2px;background:linear-gradient(180deg,rgba(8,13,24,0),rgba(8,13,24,.96) 28%)}
}

@media(max-width:390px){
  .v70-onboarding-top h2{font-size:24px!important}
  .v70-onboarding-step>h2{font-size:28px!important}
  .nq211-choice-copy b{font-size:14px}
  .nq211-choice-copy small{font-size:11.5px}
}

@media(prefers-reduced-motion:reduce){
  .v70-choice-grid button,
  #v70OnboardingClose,
  #v70OnboardingNext{transition:none!important}
}