/* extracted from index.html: homepage-value-proof */
.production-hero-proof{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}
.production-hero-proof span,.production-hero-proof a{display:inline-flex;align-items:baseline;gap:4px;min-height:30px;padding:6px 10px;border:1px solid #cfe1dc;border-radius:999px;background:#eaf4f1;color:#254e46;font-size:12px;font-weight:760;line-height:1.2}.production-hero-proof a{text-decoration:none}.production-hero-proof a:hover{text-decoration:underline}
.production-hero-proof b{font-size:15px;font-weight:950;letter-spacing:-.02em}
@media(max-width:600px){.production-hero-proof{gap:6px;margin-top:13px}.production-hero-proof span,.production-hero-proof a{min-height:29px;padding:6px 9px;font-size:11px}.production-hero-proof b{font-size:14px}}

/* extracted from index.html: desktop-question-scale-density */
/* PC questionnaire only: keep the seven choices compact without changing result width. */
@media(min-width:900px){
  #questionList .question-card>.scale{
    width:100%;
    max-width:480px;
    margin-left:auto;
    margin-right:auto;
  }
  #questionList .question-card>.labels{
    width:100%;
    max-width:480px;
    margin:12px auto 0;
  }
}

/* diagnosis-ui-viewport-fixes-20261011
   Keep deep result details on the user's visual axis on desktop widths.
   The existing dialog semantics, backdrop close, Escape handling and focus trap
   stay in diagnosis-app.js; this block changes geometry only. Tablet/mobile
   widths up to 820px keep the existing bottom-sheet interaction. */
@media(min-width:821px){
  html body .resultDetailSheet,
  html body .resultDetailSheet[data-sheet-kind],
  html body .resultDetailSheet[data-sheet-kind="method"]{
    display:grid!important;
    grid-template-columns:1fr!important;
    place-items:center!important;
    padding:clamp(18px,3.5vh,40px) clamp(18px,3.5vw,48px)!important;
    box-sizing:border-box!important;
  }
  html body .resultDetailSheetBackdrop{
    position:absolute!important;
    inset:0!important;
    grid-column:1!important;
    grid-row:1!important;
  }
  html body .resultDetailSheetPanel{
    grid-column:1!important;
    grid-row:1!important;
    width:min(1120px,100%)!important;
    height:auto!important;
    min-height:min(460px,88dvh)!important;
    max-height:min(90dvh,940px)!important;
    box-sizing:border-box!important;
    border:1px solid rgba(205,224,218,.95)!important;
    border-radius:24px!important;
    box-shadow:0 28px 90px rgba(20,48,43,.22)!important;
  }
}

/* Mobile seven-point scale: every option must remain a complete circle inside
   the question width. The button row keeps seven equal centers; only the visual
   dot sizes respond to the available viewport. */
@media(max-width:560px){
  html body #questionList .scale{
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
    width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  html body #questionList .scale .opt{
    min-width:0!important;
    width:100%!important;
  }
  html body #questionList .scale .opt.s3{--lf-scale-dot:clamp(34px,10.75vw,42px)!important}
  html body #questionList .scale .opt.s2{--lf-scale-dot:clamp(29px,8.95vw,35px)!important}
  html body #questionList .scale .opt.s1{--lf-scale-dot:clamp(25px,7.45vw,29px)!important}
  html body #questionList .scale .opt.neutral{--lf-scale-dot:clamp(23px,6.4vw,25px)!important}
}