/* Presentation for the blood type questionnaire. */
html[data-hl-quiz-experience] body .quiz-wrap {
  width:min(calc(100% - 40px), 800px) !important;
  max-width:800px !important;
  margin:0 auto !important;
  padding:20px 0 40px !important;
}
html[data-hl-quiz-experience] body .quiz-wrap .quiz-hero {
  margin:0 0 18px !important;
  padding:20px 24px !important;
  text-align:left !important;
}
html[data-hl-quiz-experience] body .quiz-wrap .quiz-hero h1 {
  font-size:clamp(1.5rem, 3vw, 2rem) !important;
  line-height:1.35 !important;
  margin:0 0 10px !important;
}
html[data-hl-quiz-experience] body .quiz-wrap .quiz-hero p {
  max-width:none !important;
  margin:0 0 8px !important;
  font-size:1rem !important;
  line-height:1.7 !important;
}
html[data-hl-quiz-experience] body .quiz-wrap .quiz-hero-note {
  font-size:.875rem !important;
  padding:0 !important;
  border:0 !important;
  background:none !important;
  color:#3D3835 !important;
}
html[data-hl-quiz-experience] body #startArea>div {
  padding:20px 24px !important;
  color:#3D3835 !important;
  text-align:center;
}
html[data-hl-quiz-experience] body #startArea>div>div {
  color:#3D3835 !important;
  font-style:normal !important;
  opacity:1 !important;
  line-height:1.5 !important;
}
html[data-hl-quiz-experience] body #startArea>div>div:nth-child(4) {
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  max-width:100% !important;
  margin:12px auto 16px !important;
}
html[data-hl-quiz-experience] body #startArea button[id^="bs"] {
  padding:14px 10px !important;
  min-height:100px;
  color:#3D3835 !important;
  box-shadow:none !important;
}
html[data-hl-quiz-experience] body #startArea button[id^="bs"] span:empty {display:none !important;}
html[data-hl-quiz-experience] body #startArea button[id^="bs"] span:last-child {
  font-size:.875rem !important;
  line-height:1.5 !important;
  opacity:1 !important;
}
html[data-hl-quiz-experience] body #startArea #startBtn {min-height:50px;}
html[data-hl-quiz-experience] body #progressWrap {margin:0 0 16px !important;}
html[data-hl-quiz-experience] body #progressWrap .quiz-progress-label {font-size:.875rem !important;line-height:1.6 !important;}
html[data-hl-quiz-experience] body #questionsArea .quiz-card {
  padding:22px 24px !important;
  margin:0 !important;
}
html[data-hl-quiz-experience] body #questionsArea .quiz-q-num {margin:0 0 10px !important;font-size:.875rem !important;}
html[data-hl-quiz-experience] body #questionsArea .quiz-question {
  font-size:1.125rem !important;
  line-height:1.6 !important;
  margin:0 0 18px !important;
}
html[data-hl-quiz-experience] body #questionsArea .quiz-scenario {
  display:block;
  font-size:1rem !important;
  font-style:normal !important;
  line-height:1.6 !important;
  padding:8px 12px !important;
  margin:8px 0 0 !important;
}
html[data-hl-quiz-experience] body #questionsArea .quiz-options {gap:8px !important;}
html[data-hl-quiz-experience] body #questionsArea .quiz-option {
  min-height:50px !important;
  padding:12px 16px !important;
  font-size:1rem !important;
  line-height:1.5 !important;
}
html[data-hl-quiz-experience] body #questionsArea .quiz-nav {margin-top:16px !important;gap:12px !important;}
html[data-hl-quiz-experience] body #questionsArea .quiz-nav button {min-height:50px !important;flex:1;}
html[data-hl-quiz-experience] body #questionsArea .quiz-nav>span:empty {display:none !important;}
html[data-hl-quiz-experience] body #quizResult {width:100% !important;max-width:100% !important;overflow-wrap:anywhere;}
html[data-hl-quiz-experience] body #quizResult>div {max-width:100% !important;box-sizing:border-box !important;}
html[data-hl-quiz-experience] body #quizResult :is(.result-desc,.result-section-content,.hour-bridge-text,.bt-bar-label,.bt-bar-value) {
  font-size:1rem !important;
  line-height:1.8 !important;
}
html[data-hl-quiz-experience] body #quizResult :is(.share-row,.hl-product-cta) {margin:0 0 16px !important;}
html[data-hl-quiz-experience] body #quizResult .share-row {gap:8px !important;}
html[data-hl-quiz-experience] body #quizResult .share-btn {font-size:1rem !important;min-height:48px;}
html[data-hl-quiz-experience] body #quizResult .btn-retry {font-size:1rem !important;min-height:50px;}
html[data-hl-quiz-experience] body #quizResult #screenshotCard {
  position:absolute !important;
  left:-10000px !important;
  top:0 !important;
  width:680px !important;
  padding:32px !important;
  background:#fff !important;
  border:1px solid rgba(160,90,107,.24) !important;
  border-radius:20px !important;
  color:#3D3835 !important;
  font-size:1rem !important;
  line-height:1.8 !important;
}
html[data-hl-quiz-experience] body #quizResult #screenshotCard .ss-title {font-size:2rem !important;color:#007B7F !important;font-weight:700 !important;}
html[data-hl-quiz-experience] body #hlTitleReveal {margin:0 0 16px !important;}
html[data-hl-quiz-experience] body #hlTitleReveal .hl-title-card {padding:24px !important;margin:0 !important;}
html[data-hl-quiz-experience] body #hlTitleReveal .hl-title-eyebrow {font-size:.875rem !important;color:#A05A6B !important;margin:0 0 8px !important;}
html[data-hl-quiz-experience] body #hlTitleReveal .hl-title-main {font-size:1.75rem !important;line-height:1.4 !important;color:#007B7F !important;-webkit-text-fill-color:#007B7F !important;background:none !important;font-weight:700 !important;margin:0 0 8px !important;}
html[data-hl-quiz-experience] body #hlTitleReveal .hl-title-sub {font-size:1rem !important;line-height:1.8 !important;color:#3D3835 !important;margin:0 0 16px !important;}
html[data-hl-quiz-experience] body #hlTitleReveal .hl-title-grid {display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px !important;margin:0 0 16px !important;}
html[data-hl-quiz-experience] body #hlTitleReveal .hl-title-tag {padding:12px 16px !important;border:1px solid rgba(160,90,107,.16) !important;border-radius:12px !important;background:#F0EEE9 !important;}
html[data-hl-quiz-experience] body #hlTitleReveal .hl-title-tag-label {font-size:.875rem !important;line-height:1.6 !important;color:#A05A6B !important;margin:0 0 4px !important;}
html[data-hl-quiz-experience] body #hlTitleReveal .hl-title-tag-value {font-size:1rem !important;line-height:1.6 !important;color:#3D3835 !important;}
html[data-hl-quiz-experience] body #hlTitleReveal .hl-title-quote {font-size:1rem !important;line-height:1.8 !important;color:#3D3835 !important;border-left:3px solid #A05A6B !important;padding-left:14px !important;}
html[data-hl-quiz-experience] body #hlTitleReveal .hl-title-combo-hint {font-size:.875rem !important;line-height:1.6 !important;color:#3D3835 !important;margin-top:12px !important;}
html[data-hl-quiz-experience] body #resultHero .result-blood-type {font-size:1.75rem !important;line-height:1.4 !important;color:#007B7F !important;-webkit-text-fill-color:#007B7F !important;background:none !important;font-weight:700 !important;margin:8px 0 !important;}
html[data-hl-quiz-experience] body #quizResult .bt-bar-row {display:flex !important;align-items:center !important;gap:12px !important;margin:14px 0 !important;}
html[data-hl-quiz-experience] body #quizResult .bt-bar-label:empty {display:none !important;}
html[data-hl-quiz-experience] body #quizResult .bt-bar-row>div:last-child {order:-1 !important;width:52px !important;flex:0 0 52px !important;font-size:1rem !important;color:#3D3835 !important;}
html[data-hl-quiz-experience] body #quizResult .bt-bar-wrap {height:12px !important;border-radius:8px !important;background:#F0EEE9 !important;overflow:hidden !important;}
html[data-hl-quiz-experience] body #quizResult .bt-bar-fill {height:100% !important;border-radius:8px !important;background:#007B7F !important;}
html[data-hl-quiz-experience] body #quizResult .bt-bar-pct {min-width:46px !important;font-size:1rem !important;color:#3D3835 !important;}
@media (max-width:650px) {
  html[data-hl-quiz-experience] body .quiz-wrap {width:calc(100% - 32px) !important;}
  html[data-hl-quiz-experience] body #startArea>div>div:nth-child(4) {grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  html[data-hl-quiz-experience] body #questionsArea .quiz-card {padding:20px 18px !important;}
}
