/* Fallback CSS for static quiz — styled-components styles (injected by JS) are missing */

*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  font-family: "Red Hat Display", "Roboto", sans-serif;
  background: #faf8f5 !important; /* light cream */
  color: #333;
}

#root { min-height: 100vh; }

/* Onboarding layout */
[class*="onboarding__Layout"] {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100vh !important;
}

/* Header */
[class*="Header__HeaderWrapper"] {
  display: flex !important;
  flex-direction: column !important;
  padding: 12px 16px 0 !important;
  background: transparent !important;
}
[class*="Header__HeaderTop"] {
  display: grid !important;
  grid-template-columns: 40px 1fr 40px !important;
  align-items: center !important;
  justify-items: center !important;
  width: 100% !important;
  margin-bottom: 12px !important;
}
[class*="Header__HeaderTop"] [class*="Header__ButtonBack"] {
  justify-self: start !important;
  padding: 4px !important;
  color: #333 !important;
}
[class*="Header__HeaderTop"] [class*="Header__LogoWrapper"] {
  justify-self: center !important;
}
[class*="Header__HeaderTop"] [class*="Header__TextPageCounter"] {
  justify-self: end !important;
  font-size: 0.8rem !important;
  color: #999 !important;
}
[class*="Header__ProgressAndCounterWrap"] {
  width: 100% !important;
}
[class*="Header__ProgressBox"] {
  width: 100% !important;
  height: 4px !important;
  background: #e5e5e5 !important;
  border-radius: 2px !important;
  overflow: hidden !important;
}
[class*="Header__ProgressBar"] {
  height: 100% !important;
  background: #dc4b4b !important;
  border-radius: 2px !important;
  transition: width 0.2s ease !important;
}
[class*="Header__OneLineWrapper"] {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
}
[class*="Header__LogoWrapper"] img {
  max-height: 40px !important;
  width: auto !important;
}

/* Template layout */
[class*="TemplateLayout__DefaultTemplateLayout"] {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  padding: 16px !important;
}
[class*="TemplateLayout__Content"] {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 16px 100px !important;
  max-width: 560px !important;
  margin: 0 auto !important;
  width: 100% !important;
}
/* First page: centered content */
[class*="TemplateLayout__Content"]:has([data-locator="start_title"]) {
  align-items: center !important;
  text-align: center !important;
}

/* StyledBox — flex container */
[class*="StyledBox-sc-120r6yk"] {
  display: flex !important;
}
[class*="StyledBox-sc-120r6yk"].fKKiYU {
  flex-direction: column !important;
  gap: 16px !important;
}
[class*="TemplateLayout__Content"]:has([data-locator="start_title"]) [class*="StyledBox-sc-120r6yk"].fKKiYU {
  align-items: center !important;
  width: 100% !important;
}

/* GenderSelector / option cards grid */
[class*="GenderSelector__ContentOptions"] {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 12px !important;
  margin: 16px 0 !important;
}
@media (max-width: 480px) {
  [class*="GenderSelector__ContentOptions"] {
    grid-template-columns: 1fr !important;
  }
}

/* First page: age selection — horizontal row, circular images, pill buttons */
[class*="GenderSelector__ContentOptions"]:has([data-locator^="start_option_"]) {
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 16px 24px !important;
  justify-items: center !important;
  max-width: 700px !important;
  margin: 24px auto !important;
}
@media (max-width: 768px) {
  [class*="GenderSelector__ContentOptions"]:has([data-locator^="start_option_"]) {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 480px) {
  [class*="GenderSelector__ContentOptions"]:has([data-locator^="start_option_"]) {
    grid-template-columns: 1fr !important;
  }
}

/* Option wrapper (card) */
[class*="GenderSelector__OptionWrapper"] {
  min-width: 0 !important;
  width: 100% !important;
}
[class*="GenderSelector__ContentOptions"]:has([data-locator^="start_option_"]) [class*="GenderSelector__OptionWrapper"] {
  max-width: 140px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

/* StyledCardOption — card with image */
[class*="StyledCardOption-sc-1kq6qwn"] {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border-radius: 12px !important;
  background: #f5f5f5 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
}
[class*="StyledCardOption-sc-1kq6qwn"]:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,.12) !important;
}
/* First page: no shadow, transparent */
[class*="GenderSelector__ContentOptions"]:has([data-locator^="start_option_"]) [class*="StyledCardOption-sc-1kq6qwn"] {
  background: transparent !important;
  box-shadow: none !important;
}
[class*="GenderSelector__ContentOptions"]:has([data-locator^="start_option_"]) [class*="StyledCardOption-sc-1kq6qwn"]:hover {
  box-shadow: none !important;
}

/* image-outer-wrapper */
.image-outer-wrapper {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 1 !important;
  overflow: hidden !important;
}
.image-outer-wrapper img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
/* First page: circular images */
[class*="GenderSelector__ContentOptions"]:has([data-locator^="start_option_"]) .image-outer-wrapper {
  width: 100px !important;
  height: 100px !important;
  max-width: 100px !important;
  aspect-ratio: 1 !important;
  border-radius: 50% !important;
  margin: 0 auto 8px !important;
}
[class*="GenderSelector__ContentOptions"]:has([data-locator^="start_option_"]) .image-outer-wrapper img {
  border-radius: 50% !important;
}

/* StyledCardButton — label on card */
[class*="StyledCardButton-sc-1kq6qwn"] {
  padding: 12px 16px !important;
  background: #dc4b4b !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-align: center !important;
  margin: 0 !important;
}
/* First page: pill-shaped button */
[class*="GenderSelector__ContentOptions"]:has([data-locator^="start_option_"]) [class*="StyledCardButton-sc-1kq6qwn"] {
  border-radius: 9999px !important;
  width: 100% !important;
  padding: 10px 20px !important;
}

/* StyledText */
[class*="StyledText-sc-ee9odd"] {
  margin: 0 !important;
  font-family: inherit !important;
  line-height: 1.4 !important;
}
[class*="StyledText-sc-ee9odd"][type="h4"] {
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  margin-bottom: 8px !important;
}
[data-locator="start_title"] {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: #333 !important;
  margin-bottom: 24px !important;
}
[class*="StyledText-sc-ee9odd"][type="h1"] {
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  margin-bottom: 8px !important;
}
[class*="StyledText-sc-ee9odd"][type="medium-text"] {
  font-size: 1rem !important;
  color: #555 !important;
}
[class*="StyledText-sc-ee9odd"][type="large-text"] {
  font-size: 1.125rem !important;
  color: #555 !important;
}
[class*="StyledText-sc-ee9odd"][type="caption"] {
  font-size: 0.75rem !important;
  color: #999 !important;
  margin-top: 24px !important;
  max-width: 480px !important;
  line-height: 1.5 !important;
}
[class*="StyledText-sc-ee9odd"][type="small-button"] {
  font-size: 14px !important;
  font-weight: 600 !important;
}
[class*="StyledText-sc-ee9odd"][type="h5"] {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
}
[class*="StyledText-sc-ee9odd"][type="option-title-large-text"],
[class*="StyledText-sc-ee9odd"][type="option-title-medium-text"] {
  font-size: 1rem !important;
  font-weight: 600 !important;
}

/* StyledImage */
[class*="StyledImage-sc-1g4vl86"] {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
}

/* TemplateBlockLayout */
[class*="TemplateBlockLayout-sc-9u3lsk"] {
  margin: 8px 0 !important;
}
[class*="ImageBox__BlockWrap"] {
  width: 100% !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
[class*="ImageBox__ImageItem"] {
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

/* Welcome / Hero layout — image + headline + text + button (step 4, etc.) */
[class*="onboarding__Layout"]:has([data-locator="tImageBoxContainer"]):has([data-locator="tTextContainer"]) {
  align-items: center !important;
}
[class*="onboarding__Layout"]:has([data-locator="tImageBoxContainer"]):has([data-locator="tTextContainer"]) > [data-locator="tImageBoxContainer"],
[class*="onboarding__Layout"]:has([data-locator="tImageBoxContainer"]):has([data-locator="tTextContainer"]) > [data-locator="tTitleSubtitleContainer"],
[class*="onboarding__Layout"]:has([data-locator="tImageBoxContainer"]):has([data-locator="tTextContainer"]) > [data-locator="tTextContainer"] {
  max-width: 480px !important;
  width: 100% !important;
  padding: 0 16px !important;
  text-align: center !important;
}
[class*="onboarding__Layout"]:has([data-locator="tImageBoxContainer"]):has([data-locator="tTextContainer"]) [data-locator="tImageBoxContainer"] {
  margin: 16px 0 !important;
}
[class*="onboarding__Layout"]:has([data-locator="tImageBoxContainer"]):has([data-locator="tTextContainer"]) [data-locator="tImageBoxContainer"] .image-outer-wrapper {
  border-radius: 12px !important;
  overflow: hidden !important;
}
[class*="onboarding__Layout"]:has([data-locator="tImageBoxContainer"]):has([data-locator="tTextContainer"]) [data-locator="tTitle"] {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: #333 !important;
  margin: 0 0 12px !important;
}
[class*="onboarding__Layout"]:has([data-locator="tImageBoxContainer"]):has([data-locator="tTextContainer"]) [data-locator="tTextContainer"] p {
  font-size: 0.95rem !important;
  color: #333 !important;
  margin: 0 0 24px !important;
  line-height: 1.5 !important;
}
[class*="onboarding__Layout"]:has([data-locator="tImageBoxContainer"]):has([data-locator="tTextContainer"]) [class*="FixedWrapper__Wrapper"] [class*="StyledButton-sc-1lvqndl"] {
  background: #e35050 !important;
  border-radius: 10px !important;
  padding: 16px 40px !important;
  text-transform: uppercase !important;
}

/* FixedWrapper — footer CTA */
[class*="FixedWrapper__Wrapper"] {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 16px !important;
  background: linear-gradient(transparent, #faf8f5 20%) !important;
  z-index: 10 !important;
}
[class*="FixedWrapper__Gradient"] {
  display: none !important;
}
[class*="Wrapper400-sc-ldqat9"] {
  max-width: 400px !important;
  margin: 0 auto !important;
}

/* CTAButton */
[class*="StyledButton-sc-1lvqndl"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  padding: 14px 24px !important;
  background: #dc4b4b !important;
  color: #fff !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  border: none !important;
  cursor: pointer !important;
  text-decoration: none !important;
  font-size: 1rem !important;
}

/* Policy links */
[class*="DisclaimerWithLinks__PolicyLink"] {
  color: #dc4b4b !important;
  text-decoration: underline !important;
}

/* CTAButton support block (spacer) */
[class*="CTAButton__SupportBlock"] {
  height: 60px !important;
}

/* ProofContinue — social proof / transition pages (18 Millionen, etc.) */
[class*="TemplateLayout__DefaultTemplateLayout"]:has([class*="ProofContinue__ImageWrapper"]) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  padding: 24px 16px 32px !important;
  flex: 1 !important;
}
[class*="TemplateLayout__DefaultTemplateLayout"]:has([class*="ProofContinue__ImageWrapper"]) [data-locator="ob_title"] {
  font-size: 2.5rem !important;
  font-weight: 700 !important;
  color: #333 !important;
  margin: 0 0 8px !important;
}
[class*="TemplateLayout__DefaultTemplateLayout"]:has([class*="ProofContinue__ImageWrapper"]) [data-locator="ob_subtitle_1"] {
  font-size: 1.1rem !important;
  color: #555 !important;
  margin: 0 0 24px !important;
  font-weight: 400 !important;
}
[class*="ProofContinue__ImageWrapper"] {
  margin: 0 0 32px !important;
  width: 100% !important;
  max-width: 420px !important;
}
[class*="ProofContinue__ImageWrapper"] .image-outer-wrapper {
  width: 100% !important;
  aspect-ratio: auto !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
[class*="ProofContinue__ImageWrapper"] img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
}
/* ProofContinue WEITER button — coral, wide, rounded */
[class*="TemplateLayout__DefaultTemplateLayout"]:has([class*="ProofContinue__ImageWrapper"]) [class*="FixedWrapper__Wrapper"] [class*="StyledButton-sc-1lvqndl"] {
  background: #f26666 !important;
  border-radius: 12px !important;
  padding: 16px 48px !important;
  font-size: 1rem !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
}

/* tOptionCard / OptionCard — white cards with shadow (gender, etc.) */
[class*="OptionCard__ContentOptions"] {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 16px !important;
  max-width: 480px !important;
  margin: 24px auto !important;
}
@media (max-width: 520px) {
  [class*="OptionCard__ContentOptions"] {
    grid-template-columns: 1fr !important;
  }
}
a[data-locator^="tOptionCard_"],
[class*="OptionCard__Card"] {
  display: flex !important;
  flex-direction: column !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #fff !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.1) !important;
  text-decoration: none !important;
  color: inherit !important;
}
a[data-locator^="tOptionCard_"]:hover,
[class*="OptionCard__Card"]:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,.15) !important;
}
[class*="OptionCard__ImageWrapper"] {
  width: 100% !important;
  overflow: hidden !important;
}
[class*="OptionCard__ImageWrapper"] .image-outer-wrapper {
  aspect-ratio: 3/4 !important;
}
[class*="OptionCard__ImageWrapper"] img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
[class*="OptionCard__OptionText"] {
  padding: 16px !important;
  text-align: center !important;
}
[class*="OptionCard__OptionText"] p {
  margin: 0 !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  color: #333 !important;
}

/* Steps 2+ layout: title + subtitle + cards — centered */
[data-locator="tTitleSubtitleContainer"] {
  text-align: center !important;
  padding: 0 16px !important;
}
[data-locator="tTitle"] {
  font-size: 1.35rem !important;
  font-weight: 700 !important;
  color: #333 !important;
  margin-bottom: 8px !important;
}
[data-locator="tSubtitle2"] {
  font-size: 0.95rem !important;
  color: #b87333 !important;
  margin: 0 0 8px !important;
}
[class*="onboarding__Layout"] > [data-locator="tTitleSubtitleContainer"] {
  margin-top: 16px !important;
}
[class*="onboarding__Layout"] > [class*="StyledBox"]:has([class*="OptionCard__ContentOptions"]) {
  padding: 0 16px 80px !important;
}

/* MultiOptionSelector — multi-select in row, photos, selected highlight */
[class*="MultiOptionSelector__ContentOptionBox"] {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 12px !important;
  margin: 16px 0 24px !important;
}
[class*="MultiOptionSelector__ContentOptionBox"] > div {
  min-width: 0 !important;
  display: flex !important;
  height: 100% !important;
}
.quiz-multiselect-option {
  flex: 1 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  display: flex !important;
  width: 100% !important;
}
@media (max-width: 768px) {
  [class*="MultiOptionSelector__ContentOptionBox"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (max-width: 520px) {
  [class*="MultiOptionSelector__ContentOptionBox"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
[class*="StyledOptionBox-sc-oxx7cx"] {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.1) !important;
  border: 3px solid transparent !important;
  cursor: pointer !important;
  position: relative !important;
  transition: border-color .2s, box-shadow .2s !important;
}
[class*="StyledOptionBox-sc-oxx7cx"]:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,.15) !important;
}
/* Selected: red border + checkmark visible */
[class*="StyledOptionBox-sc-oxx7cx"]:has(input:checked) {
  border-color: #dc4b4b !important;
  box-shadow: 0 0 0 1px #dc4b4b, 0 4px 16px rgba(0,0,0,.15) !important;
}
[class*="StyledOptionBox-sc-oxx7cx"]:has(input:checked) [class*="StyledIndicator-sc-oxx7cx"] {
  opacity: 1 !important;
  background: #fff !important;
  border-radius: 50% !important;
  padding: 4px !important;
}
[class*="StyledOptionBox-sc-oxx7cx"] input[type="checkbox"] {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
[class*="StyledOption-sc-oxx7cx-0"] {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
  position: relative !important;
}
[class*="StyledTitleBox-sc-oxx7cx"] {
  padding: 8px 12px !important;
  order: 1 !important;
  min-height: 44px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
[class*="StyledTitleBox-sc-oxx7cx"] p {
  margin: 0 !important;
  font-weight: 600 !important;
  font-size: 0.85rem !important;
  color: #333 !important;
  text-align: center !important;
}
[class*="StyledImageBox-sc-oxx7cx"] {
  order: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
}
[class*="StyledImageBox-sc-oxx7cx"] .image-outer-wrapper {
  aspect-ratio: 1 !important;
  width: 100% !important;
}
[class*="StyledImageBox-sc-oxx7cx"] {
  flex-shrink: 0 !important;
}
[class*="StyledImageBox-sc-oxx7cx"] img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
[class*="StyledIndicator-sc-oxx7cx"] {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  width: 24px !important;
  height: 24px !important;
  opacity: 0 !important;
  transition: opacity .2s !important;
}
/* Weiter button: disabled = grey, enabled = red */
button.quiz-weiter-multiselect {
  transition: background .2s, cursor .2s !important;
}
button.quiz-weiter-multiselect:not(:disabled) {
  background: #dc4b4b !important;
  cursor: pointer !important;
}
button.quiz-weiter-multiselect:disabled {
  background: #999 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}
[class*="TemplateLayout__Content"]:has([class*="MultiOptionSelector"]) {
  align-items: stretch !important;
}
[class*="TemplateLayout__Content"]:has(.quiz-multiselect-vertical) {
  align-items: stretch !important;
  width: 100% !important;
}
[class*="TemplateLayout__Content"]:has([class*="MultiOptionSelector"]) [data-locator="ob_title"] {
  font-size: 1.35rem !important;
  font-weight: 700 !important;
  text-align: center !important;
  margin-bottom: 4px !important;
}
[class*="TemplateLayout__Content"]:has([class*="MultiOptionSelector"]) [data-locator="ob_subtitle_2"] {
  font-size: 0.95rem !important;
  color: #666 !important;
  text-align: center !important;
  margin-bottom: 8px !important;
}

/* Multi-select vertical (text-only list) — step_007 "Welche Bereiche" */
.quiz-multiselect-vertical {
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  margin: 16px 0 24px !important;
  width: 100% !important;
  max-width: 100% !important;
}
.quiz-multiselect-vertical > div {
  width: 100% !important;
  min-width: 0 !important;
}
.quiz-multiselect-vertical .quiz-multiselect-option {
  width: 100% !important;
}
.quiz-multiselect-vertical .quiz-option-text-only {
  width: 100% !important;
  box-sizing: border-box !important;
}
.quiz-option-text-only {
  flex-direction: row !important;
  align-items: center !important;
  min-height: 56px !important;
  padding: 0 16px !important;
}
.quiz-option-text-only [class*="StyledOption-sc-oxx7cx-0"] {
  flex-direction: row !important;
  align-items: center !important;
  width: 100% !important;
}
.quiz-option-text-only [class*="StyledTitleBox-sc-oxx7cx"] {
  order: 0 !important;
  flex: 1 !important;
  padding: 0 12px 0 0 !important;
  min-height: auto !important;
  justify-content: flex-start !important;
}
.quiz-option-text-only [class*="StyledTitleBox-sc-oxx7cx"] p {
  text-align: left !important;
  font-size: 1rem !important;
}
.quiz-option-text-only [class*="StyledImageBox-sc-oxx7cx"] {
  display: none !important;
}
.quiz-option-text-only::before {
  content: "" !important;
  display: block !important;
  width: 22px !important;
  height: 22px !important;
  border: 2px solid #ccc !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}
.quiz-option-text-only:has(input:checked)::before {
  border-color: #dc4b4b !important;
  background: #dc4b4b !important;
}
.quiz-option-text-only [class*="StyledIndicator-sc-oxx7cx"] {
  display: none !important;
}
.quiz-option-text-only .quiz-option-emoji {
  font-size: 1.25rem !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
}

/* Multi-select tags (flex-wrap pills) — step_014 "Wähle deinen Fokus aus" */
.quiz-multiselect-tags {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 20px 0 24px !important;
  width: 100% !important;
}
.quiz-tag-row {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 10px !important;
}
.quiz-multiselect-tags .quiz-tag-pill {
  display: inline-flex !important;
  cursor: pointer !important;
}
.quiz-multiselect-tags .quiz-tag-pill-inner {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 20px !important;
  max-width: 220px !important;
  box-sizing: border-box !important;
  background: #fff !important;
  border-radius: 9999px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
  border: 2px solid transparent !important;
  transition: border-color .2s, box-shadow .2s !important;
  min-height: 44px !important;
}
.quiz-multiselect-tags .quiz-tag-pill-inner:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,.12) !important;
}
.quiz-multiselect-tags .quiz-tag-pill-inner:has(input:checked) {
  border-color: #dc4b4b !important;
  box-shadow: 0 0 0 1px #dc4b4b, 0 4px 12px rgba(0,0,0,.12) !important;
}
.quiz-multiselect-tags .quiz-tag-pill-inner input[type="checkbox"] {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.quiz-multiselect-tags .quiz-tag-text {
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  color: #333 !important;
  text-align: center !important;
  line-height: 1.3 !important;
  overflow-wrap: break-word !important;
}
[class*="TemplateLayout__Content"]:has(.quiz-multiselect-tags) [data-locator="ob_title"] {
  font-size: 1.35rem !important;
  font-weight: 700 !important;
  text-align: center !important;
  margin-bottom: 0 !important;
}

/* Single-select vertical (text-only) — step_008 "Körpertyp" */
.quiz-single-select-vertical {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin: 20px 0 0 !important;
  width: 100% !important;
  max-width: 400px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.quiz-single-option-card {
  background: #fff !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.1) !important;
  padding: 16px 20px !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  color: #333 !important;
  text-align: left !important;
  transition: box-shadow .2s, border-color .2s !important;
  border: 3px solid transparent !important;
}
.quiz-single-option-card:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,.15) !important;
}
.quiz-option-with-emoji {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.quiz-option-with-emoji .quiz-option-emoji {
  font-size: 1.25rem !important;
  margin-left: 12px !important;
  flex-shrink: 0 !important;
}

/* Single-select with image on right — step_017 "Arbeitszeiten" */
.quiz-option-with-image {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
}
.quiz-option-with-image .quiz-option-text {
  flex: 1 !important;
  min-width: 0 !important;
}
.quiz-option-with-image .quiz-option-image {
  flex-shrink: 0 !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}
.quiz-option-with-image .quiz-option-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Single-select with subtitle + level icon — step_012 "Aktivitätslevel" */
.quiz-option-with-subtitle {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  text-decoration: none !important;
  color: inherit !important;
}
.quiz-option-with-subtitle .quiz-option-text {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  flex: 1 !important;
  min-width: 0 !important;
}
.quiz-option-with-subtitle .quiz-option-text strong {
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: #333 !important;
}
.quiz-option-subtitle {
  font-size: 0.875rem !important;
  color: #666 !important;
}
.quiz-level-bars {
  flex-shrink: 0 !important;
}
.quiz-level-bars svg {
  display: block !important;
}

/* Medical disclaimer — step_027, step_028 */
.quiz-medical-disclaimer {
  display: block !important;
  visibility: visible !important;
  font-size: 0.8rem !important;
  line-height: 1.4 !important;
  color: #555 !important;
  text-align: center !important;
  margin: 0 auto 12px !important;
  padding: 0 8px !important;
  max-width: 360px !important;
}

/* Hide preload image */
#image-preload {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}