body.assessmentOpen{overflow:hidden!important}

.assessment:not([hidden]){
  position:fixed!important;
  z-index:2147483000!important;
  inset:18px!important;
  width:min(1120px,calc(100vw - 36px))!important;
  height:calc(100dvh - 36px)!important;
  margin:auto!important;
  padding:0!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr)!important;
  overflow:hidden!important;
  background:#0b0e0c!important;
  border:1px solid rgba(140,251,63,.35)!important;
}

.assessment:not([hidden]) .assessmentHeader{
  position:relative!important;
  z-index:3!important;
  padding:18px 70px 15px 24px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 230px!important;
  align-items:end!important;
  gap:22px!important;
  background:#0b0e0c!important;
  border-bottom:1px solid var(--line)!important;
}

.assessment:not([hidden]) .assessmentHeader h2{
  margin:0!important;
  font-size:clamp(27px,3vw,40px)!important;
  line-height:.98!important;
}

.assessment:not([hidden]) .assessmentHeader .eyebrow{margin:0 0 7px!important}
.assessment:not([hidden]) .assessmentClose{
  position:absolute!important;
  display:grid!important;
  place-items:center!important;
  right:16px!important;
  top:16px!important;
}

.assessment:not([hidden]) form{
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}

.assessment:not([hidden]) .step.isActive{
  flex:1 1 auto!important;
  min-height:0!important;
  margin:0!important;
  padding:22px 24px 16px!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
}

.assessment:not([hidden]) .step legend{font-size:clamp(23px,2.4vw,31px)!important}
.assessment:not([hidden]) .stepHint{margin:8px 0 15px!important}
.assessment:not([hidden]) .choice{min-height:76px!important}
.assessment:not([hidden]) .choice span{padding:13px 15px!important}

.assessment:not([hidden]) .formActions{
  position:relative!important;
  z-index:5!important;
  flex:0 0 auto!important;
  margin:0!important;
  padding:11px 18px!important;
  display:flex!important;
  background:#0b0e0c!important;
  border-top:1px solid var(--line)!important;
}

.assessment:not([hidden]) .formActions button{
  min-height:48px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}

@media(max-width:700px){
  .assessment:not([hidden]){
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    border:0!important;
    padding-top:env(safe-area-inset-top)!important;
  }
  .assessment:not([hidden]) .assessmentHeader{
    min-height:58px!important;
    padding:8px 48px 7px 12px!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:4px!important;
  }
  .assessment:not([hidden]) .assessmentHeader h2{display:none!important}
  .assessment:not([hidden]) .assessmentHeader .eyebrow{margin:0!important;font-size:7px!important}
  .assessment:not([hidden]) .progressWrap{margin:0!important}
  .assessment:not([hidden]) .progressWrap span{margin-bottom:4px!important;font-size:7px!important}
  .assessment:not([hidden]) .assessmentClose{right:8px!important;top:8px!important}
  .assessment:not([hidden]) .step.isActive{padding:9px 11px 6px!important;overflow:hidden!important}
  .assessment:not([hidden]) .step legend{font-size:17px!important;line-height:1.05!important}
  .assessment:not([hidden]) .stepHint{margin:4px 0 6px!important;font-size:9px!important;line-height:1.25!important}
  .assessment:not([hidden]) .choiceGrid{gap:5px!important}
  .assessment:not([hidden]) .distanceGrid,
  .assessment:not([hidden]) .dayGrid,
  .assessment:not([hidden]) .weekGrid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .assessment:not([hidden]) .choice{min-height:46px!important}
  .assessment:not([hidden]) .choice span{padding:6px!important;gap:2px!important}
  .assessment:not([hidden]) .choice b{font-size:11px!important;line-height:1.1!important}
  .assessment:not([hidden]) .choice small{font-size:7px!important;line-height:1.1!important}
  .assessment:not([hidden]) .distanceGrid .choice small,
  .assessment:not([hidden]) .dayGrid .choice small,
  .assessment:not([hidden]) .weekGrid .numberChoice small{display:none!important}
  .assessment:not([hidden]) .numberChoice b{font-size:17px!important}
  .assessment:not([hidden]) .optionalMetrics,
  .assessment:not([hidden]) .profileFields{gap:5px!important;margin-top:5px!important}
  .assessment:not([hidden]) input,
  .assessment:not([hidden]) select{min-height:33px!important;padding:5px 7px!important}
  .assessment:not([hidden]) .privacyNote{margin:4px 0 0!important;font-size:7px!important;line-height:1.15!important}
  .assessment:not([hidden]) .formActions{padding:6px 9px calc(6px + env(safe-area-inset-bottom))!important}
  .assessment:not([hidden]) .formActions button{min-height:40px!important}
}

@media(max-width:380px),(max-height:650px){
  .assessment:not([hidden]) .stepHint{display:none!important}
  .assessment:not([hidden]) .choice{min-height:41px!important}
  .assessment:not([hidden]) .choice small{display:none!important}
  .assessment:not([hidden]) .privacyNote{display:none!important}
}