:root{--ink:#252a31;--muted:#667080;--line:#e4e6eb;--blue:#2363c2;--font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--ink);font:15px/1.6 var(--font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.study-layout{max-width:780px;margin:52px auto 90px;padding:0 18px}
.study-main{width:100%;min-width:0}.survey-card{width:100%}
h1{font-size:21px;font-weight:650;line-height:1.38;letter-spacing:-.02em;margin:0 0 20px}
h2{font-size:17px;font-weight:650;letter-spacing:-.015em;margin:0 0 18px}
p{margin:0 0 20px;line-height:1.65}
.survey-kicker{font-size:12px;color:#788392;margin-bottom:12px}
.question-text{font-size:16px;font-weight:400;line-height:1.65;margin:0 0 24px}
.password-block{margin:16px auto 17px;padding:12px 15px;border:1px solid #e6e9ed;border-radius:3px;background:#f8f9fb;max-width:520px;text-align:center}
.password-block code{font:600 19px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;color:#1d293c}
.feedback-panel{max-width:520px;margin:11px auto 26px;text-align:center}
.feedback-panel .site-name{font-size:15px;color:#252d38}
.feedback-panel .site-rating{font-size:19px;font-weight:700;margin-top:6px}
.site-rating.strong,.site-rating.below{color:#252a31}
.field{margin:25px 0}.field-label,.question-label{display:block;font-size:15px;font-weight:500;line-height:1.6;margin:0 0 12px;color:#202733}
 .slider-figure{display:flex;align-items:center;gap:16px;max-width:680px;margin:14px 0 8px;position:relative}
/* Browser range controls always allocate a midpoint thumb, even when unanswered.
   An interaction-transparent neutral cover conceals that default thumb completely. */
.slider-figure:not(.has-answer)::before,.slider-figure:not(.has-answer)::after{
 content:'';position:absolute;left:0;right:0;pointer-events:none;z-index:2}
.slider-figure:not(.has-answer)::before{height:24px;top:50%;transform:translateY(-50%);background:#fff}
.slider-figure:not(.has-answer)::after{height:8px;top:50%;transform:translateY(-50%);background:#d7dce4;border-radius:999px}
/* Neutral, unanswered slider: no thumb/selected fill before a real interaction. */
.strength-slider{width:100%;appearance:none;-webkit-appearance:none;height:8px;border-radius:999px;
  background:#d7dce4;outline-offset:8px;cursor:pointer;margin:11px 0}
.strength-slider::-webkit-slider-runnable-track{height:8px;border-radius:999px;background:transparent}
.strength-slider::-moz-range-track{height:8px;border-radius:999px;background:transparent}
.strength-slider::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:18px;
  border:2px solid #2463c2;border-radius:50%;background:#fff;margin-top:-5px;
  opacity:0;transition:opacity .12s}
.strength-slider::-moz-range-thumb{width:15px;height:15px;border:2px solid #2463c2;
  background:#fff;border-radius:50%;opacity:0}
.strength-slider.has-answer::-webkit-slider-thumb,.strength-slider.has-answer::-moz-range-thumb{opacity:1}
.strength-slider.has-answer::-webkit-slider-thumb{opacity:1}
.strength-slider.has-answer::-moz-range-thumb{opacity:1}
.slider-value[hidden]{display:none!important}
.slider-value{width:42px;text-align:right;font-weight:600;color:#33465e;font-variant-numeric:tabular-nums}
.slider-anchors{max-width:624px;display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:#737f8f}
.slider-anchors span:nth-child(2){text-align:center}.slider-anchors span:last-child{text-align:right}
.options{display:grid;gap:11px}.option{display:flex;align-items:flex-start;gap:11px;font-size:14px;line-height:1.5;cursor:pointer}
.option input{accent-color:#2965bb;flex:none;margin:4px 0 0}
textarea,select{font:14px/1.5 var(--font-sans);color:var(--ink);border:1px solid #b9c0ca;border-radius:3px;padding:9px 10px;width:100%;max-width:640px;background:white}
textarea{min-height:186px;resize:vertical;max-width:680px}select{max-width:550px}
.matrix{border-collapse:collapse;width:100%;max-width:670px;margin:8px 0 22px}
.matrix th,.matrix td{text-align:left;border-bottom:1px solid #e8eaed;padding:12px 9px;vertical-align:middle;font-size:13px}
.matrix th{font-size:12px;font-weight:600;color:#626d7c}.matrix td:first-child{width:58%}.matrix select{font-size:13px;max-width:245px}
.form-actions{border-top:1px solid #e8eaef;margin-top:33px;padding:22px 0;display:flex;align-items:center;justify-content:flex-end;gap:13px}
.button{border:1px solid #235eb6;border-radius:4px;background:var(--blue);color:white;font:600 14px/1.5 var(--font-sans);padding:9px 23px;cursor:pointer}
.button:hover{background:#1d529f}.button:disabled{background:#b8c6d8;border-color:#b8c6d8;cursor:not-allowed}
.button.alt{background:white;color:#235bb0;border-color:#a5b7d1}.button.alt:hover{background:#f7faff}
.button.quiet{background:transparent;border:0;color:#225db4;padding:9px 5px}
.timer{display:none}.validation{font-size:13px;color:#ac3131;min-height:18px;margin:4px 0}.validation[hidden]{display:none}
.corrective{background:#fff8ed;border-left:3px solid #bd8a3f;padding:9px 12px;margin-top:15px;font-size:13px}
.support-actions{margin:22px 0 2px}
.session-meta{color:#657080;font-size:13px;margin-bottom:22px}
.compass-dock{position:fixed;right:24px;top:80px;width:432px;max-width:calc(100vw - 48px);border:0;border-radius:15px;overflow:hidden;background:white;z-index:60}
.compass-dock[hidden]{display:none}.compass-dock iframe{display:block;border:0;border-radius:15px;width:100%;height:400px;background:white}
.study-layout.compass-visible{max-width:calc(100vw - 520px);margin-left:5vw;margin-right:auto}
.toast{position:fixed;right:22px;bottom:20px;background:#303d50;color:white;padding:10px 14px;border-radius:5px;font-size:12px;z-index:100}.toast[hidden]{display:none}
.finish-actions{display:flex;gap:11px;flex-wrap:wrap;margin:24px 0}
.help{font-size:13px;color:#687687}
input:focus-visible,select:focus-visible,button:focus-visible,textarea:focus-visible{outline:2px solid #3676cf;outline-offset:2px}
@media(max-width:1120px){.study-layout.compass-visible{max-width:780px;margin:46px auto 550px}.compass-dock{top:auto;bottom:14px;right:14px;max-height:66vh}.compass-dock iframe{max-height:66vh}}
@media(max-width:640px){.study-layout{margin:32px auto 80px}.question-text{font-size:15px}.slider-anchors{font-size:10px}.matrix td:first-child{width:52%}.compass-dock{right:8px;bottom:8px;max-width:calc(100vw - 16px)}.form-actions{flex-wrap:wrap}}

/* Compass stays mounted for one With-Compass scenario; X minimizes, not destroys. */
.compass-dock.is-collapsed{visibility:hidden;opacity:0;pointer-events:none}
.option-field{margin-left:0;margin-right:0;padding:0;border:0;min-width:0}
.option-field legend{padding:0;width:100%}
.survey-card .matrix{margin-top:12px}
.survey-card .matrix select{width:100%;min-width:170px}
@media(max-width:600px){.study-layout{padding:0 20px}.matrix td:first-child{width:45%}.matrix select{min-width:0}}

/* Hidden entirely outside locally started QA preview mode. */
.qa-toolbar[hidden]{display:none!important}
.qa-toolbar{position:fixed;top:8px;right:10px;z-index:300;border:1px solid #d1d6df;border-radius:8px;background:#f7f9fc;display:flex;align-items:center;gap:10px;padding:5px 8px;font:600 11px/1.2 var(--font-sans);color:#475569}
.qa-toolbar button{background:white;border:1px solid #94a3b8;color:#334155;border-radius:5px;padding:7px 9px;cursor:pointer;font:600 12px var(--font-sans)}
.qa-toolbar button[aria-pressed=true]{background:#eef2ff;color:#1d4ed8;border-color:#6c8de0}
.qa-toolbar #qa-start-over{border-color:#64748b;font-weight:650}

/* V13: consistent survey navigation and question-adjacent Compass access. */
body{padding-bottom:112px}
/* One fixed viewport position, regardless of each page's content height. */
.form-actions{
 position:fixed;left:50%;bottom:0;transform:translateX(-50%);
 z-index:80;width:min(760px,calc(100vw - 36px));height:82px;
 margin:0;padding:13px 4px 15px;box-sizing:border-box;
 display:flex;justify-content:flex-end;align-items:center;gap:16px;
 border-top:1px solid #e4e6eb;background:rgba(255,255,255,.98)
}
.form-actions .validation{min-height:0;margin:0 auto 0 0;max-width:65%;line-height:1.35}
.form-actions .validation[hidden]{display:none!important}
.form-actions .button{flex:none}
/* Compass access is part of the question layout, not a detached corner bubble. */
.compass-access[hidden]{display:none!important}
.study-layout.has-compass-access{
 max-width:1070px;display:grid;grid-template-columns:minmax(0,780px) 206px;
 gap:24px;align-items:start
}
.study-layout.has-compass-access .study-main{grid-column:1;grid-row:1;min-width:0}
.compass-access{
 grid-column:2;grid-row:1;align-self:start;position:sticky;top:56px;
 width:206px;margin:0;padding:15px;border:1px solid #d4dfed;
 border-radius:9px;background:#f8fafc;color:#26374f;
}
.compass-access-title{font-size:14px;font-weight:700;line-height:1.3}
.compass-access-caption{color:#64748b;font-size:12px;margin:6px 0 12px;line-height:1.45}
.compass-access .button{display:block;width:100%;padding:9px 8px;font-size:13px;white-space:nowrap}
/* When the full tool is open, its original 432px panel takes the right side. */
.study-layout.has-compass-access.compass-visible{
 display:block;max-width:calc(100vw - 535px);margin-left:5vw;margin-right:auto
}
.study-layout.compass-visible .compass-access{display:none}
@media(max-width:1100px){
 .study-layout.has-compass-access{
  display:flex;flex-direction:column;gap:16px;max-width:780px
 }
 .study-layout.has-compass-access .compass-access{
  order:-1;position:sticky;top:0;z-index:52;width:100%;display:flex;
  align-items:center;gap:12px;padding:10px 14px;
 }
 .compass-access-title{flex:none}
 .compass-access-caption{flex:1;margin:0}
 .study-layout.has-compass-access .compass-access .button{width:auto;min-width:145px}
 .study-layout.has-compass-access.compass-visible{
  display:block;max-width:780px;margin:32px auto 140px
 }
 /* The open tool never covers the fixed Next control. */
 .compass-dock{top:auto;bottom:92px;right:14px;max-height:calc(100vh - 125px);overflow:auto}
 .compass-dock iframe{max-height:calc(100vh - 125px)}
}
@media(max-width:640px){
 .study-layout{margin-top:30px;margin-bottom:110px}
 .study-layout.has-compass-access{gap:12px}
 .study-layout.has-compass-access .compass-access{flex-wrap:wrap;top:0}
 .study-layout.has-compass-access .compass-access .button{width:100%}
 .form-actions{height:76px;width:calc(100vw - 24px);padding:11px 4px}
 .form-actions .validation{font-size:11px;max-width:60%}
 .compass-dock{right:8px;bottom:84px;max-width:calc(100vw - 16px)}
}
/* Keep the right edge and center of Next/Submit identical on every page. */
.form-actions .button{width:118px;text-align:center}
/* Keep local QA controls from covering a question-adjacent tool card on phones. */
@media(max-width:640px){
 body:has(.qa-toolbar:not([hidden])) .study-layout{margin-top:78px}
}

/* The open 432px Compass never extends underneath the fixed survey footer. */
.compass-dock{max-height:calc(100dvh - 175px);overflow:auto}
.compass-dock iframe{max-height:calc(100dvh - 190px)}


/* V14: survey legibility adjustment. Preserve the restrained Qualtrics-like layout. */
body{font-size:16.5px;line-height:1.65}
h1{font-size:23px}
h2{font-size:19px}
p{line-height:1.68}
.question-text{font-size:18px;line-height:1.6}
.password-block code{font-size:20px}
.feedback-panel .site-name{font-size:16px}
.feedback-panel .site-rating{font-size:20px}
.field-label,.question-label{font-size:17px;line-height:1.55}
.option{font-size:16px;line-height:1.55;gap:12px}
textarea,select{font-size:16px;line-height:1.55;padding:11px 12px}
.matrix th{font-size:14px}
.matrix td{font-size:15px;line-height:1.5;padding:13px 10px}
.matrix select{font-size:15px}
.slider-anchors{font-size:12.5px}
.slider-value{font-size:16px}
.button{font-size:16px}
.validation{font-size:14px}
.help,.session-meta{font-size:14px}
.compass-access-title{font-size:15px}
.compass-access-caption{font-size:13px}
.compass-access .button{font-size:14px}
@media(max-width:640px){
 body{font-size:16px}
 .question-text{font-size:17px}
 .field-label,.question-label{font-size:16px}
 .option{font-size:15.5px}
 .matrix th{font-size:13.5px}
 .matrix td{font-size:14px;padding:10px 6px}
 .matrix select{font-size:14px;padding:8px 5px}
 .slider-anchors{font-size:11.5px}
}

/* Match the supplied PassResolve 470px mock-up (450px inner width). */
.compass-dock{width:450px;}


/* V17: independent floating PassResolve panel, never a cropped survey card. */
.compass-dock {
  position: fixed;
  top: 22px;
  right: 22px;
  bottom: auto;
  width: 450px;
  max-width: calc(100vw - 44px);
  max-height: calc(100dvh - 120px);
  overflow: hidden;
  border: 1px solid #dbe5ef;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 46px rgba(27, 49, 77, .16);
  z-index: 90;
  isolation: isolate;
}
.compass-dock iframe {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 17px;
  background: #fff;
  max-height: calc(100dvh - 122px);
}
@media (max-width: 1100px) {
  .compass-dock {
    top: 18px;
    bottom: auto;
    right: 16px;
    width: 450px;
    max-width: calc(100vw - 32px);
    max-height: calc(100dvh - 118px);
    overflow: hidden;
  }
  .compass-dock iframe {max-height: calc(100dvh - 120px)}
}
@media (max-width: 640px) {
  .compass-dock {
    top: 14px;
    bottom: auto;
    right: 8px;
    max-width: calc(100vw - 16px);
    max-height: calc(100dvh - 104px);
  }
  .compass-dock iframe {max-height: calc(100dvh - 106px)}
}

/* Local QA toolbar must not cover the floating panel header or close button. */
body:has(.qa-toolbar:not([hidden])) .compass-dock {
  top:64px;max-height:calc(100dvh - 160px);
}
body:has(.qa-toolbar:not([hidden])) .compass-dock iframe {max-height:calc(100dvh - 162px)}


/* V18: full-height, viewport-responsive floating tool, with a single internal scrollbar. */
.compass-dock{
  top:20px;
  bottom:98px;
  height:auto;
  max-height:none;
  overflow:hidden;
}
.compass-dock iframe{
  width:100%;
  height:100% !important;
  max-height:none;
  overflow:auto;
}
@media(max-width:1100px){
 .compass-dock{top:18px;bottom:98px;height:auto;max-height:none;}
 .compass-dock iframe{max-height:none;}
}
@media(max-width:640px){
 .compass-dock{top:12px;right:8px;bottom:84px;height:auto;max-height:none;}
 .compass-dock iframe{max-height:none;}
}
body:has(.qa-toolbar:not([hidden])) .compass-dock{
 top:64px;bottom:98px;height:auto;max-height:none;
}
body:has(.qa-toolbar:not([hidden])) .compass-dock iframe{max-height:none;}
@media(max-width:640px){
 body:has(.qa-toolbar:not([hidden])) .compass-dock{top:64px;bottom:84px;}
}

/* PassResolve v19: avoid doubled card outlines; the embedded static panel
   supplies its exact original border and footer. */
.compass-dock{border:0}
/* Emphasize the tool identity on the intervention introduction, not elsewhere. */
.passresolve-heading{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:#213750}
.passresolve-logo{display:inline-grid;place-items:center;width:30px;height:30px;border:1.5px solid #53729d;border-radius:50%;color:#225ebb;font-size:19px;font-weight:400}
.passresolve-heading small{font-size:12px;font-weight:500;color:#667c94;letter-spacing:0;margin-left:2px}
.response-guidance{font-size:14px;color:#607080;line-height:1.4;margin:0 0 10px}

/* V20: carry the reference shell's final shadow and 17px radius at the
   outer floating boundary. All content styling remains in the static CSS. */
.compass-dock {
  border:0;
  border-radius:17px;
  box-shadow:0 14px 38px rgba(28,51,80,.075);
}


/* V25.4: V24 layout and survey controls retained. Website feedback is an
   optional text disclosure, not a sidebar or a second review screen. */
.rating-lookup-row{display:flex;justify-content:flex-end;margin:0 0 12px}
.rating-lookup{max-width:340px;min-width:174px;font-size:13px;line-height:1.45;color:#50647e}
.rating-lookup>summary{list-style:none;cursor:pointer;color:#235eb6;text-align:right;padding:4px 0;font-weight:500}
.rating-lookup>summary::-webkit-details-marker{display:none}
.rating-lookup>summary::before{content:"▸";font-size:10px;margin-right:7px}
.rating-lookup[open]>summary::before{content:"▾"}
.rating-lookup dl{margin:6px 0 8px;border:1px solid #e4e6eb;background:#fff;padding:9px 11px;border-radius:4px}
.rating-lookup dl>div{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:5px 0}
.rating-lookup dt{white-space:nowrap;color:#58677a;font-size:12px;font-weight:400;margin:0}
.rating-lookup dd{font-size:13px;font-weight:600;color:#252a31;text-align:right;margin:0}
.form-actions .button[hidden]{display:none!important}
/* Single concern question + short, adjacent explanation. */
.experience-rating{margin:24px 0 24px}
.experience-rating .slider-figure{max-width:700px}
.experience-rating .slider-value{width:142px;font-size:14px;text-align:left;flex:none;white-space:nowrap}
.likert-anchors{max-width:540px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;font-size:12px;color:#687587;margin:7px 0 18px}
.likert-anchors span{text-align:center;line-height:1.35}
.likert-anchors span:first-child{text-align:left}
.likert-anchors span:last-child{text-align:right}
.likert-anchors small{display:block;font-size:11px;line-height:1.4;color:#8590a0}
.paired-reason{border-top:1px solid #e9ebef;padding-top:13px;max-width:690px}
.paired-reason .field{margin:8px 0 10px}
.paired-reason textarea{min-height:92px;max-width:670px}
@media(max-width:640px){
 .rating-lookup-row{margin:0 0 14px}
 .experience-rating .slider-figure{gap:8px}
 .experience-rating .slider-value{width:92px;max-width:92px;font-size:11px;white-space:normal}
 .likert-anchors{font-size:10px;gap:3px}
 .likert-anchors small{font-size:10px}
}

/* V25.4: place website-rating lookup below the relevant response, not above the question. */
.rating-lookup-row{display:flex;justify-content:flex-start;max-width:100%;margin:12px 0 16px}
.rating-lookup{max-width:min(340px,100%);min-width:0}
.rating-lookup>summary{text-align:left;padding:3px 0}
.rating-lookup dl{max-width:330px}
.action-context{margin:0 0 16px;line-height:1.6}
.action-options{margin:23px 0 12px}
.action-options .options{gap:12px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;clip-path:inset(50%)}
.experience-rating .slider-value{width:auto;min-width:180px;max-width:250px;white-space:normal;line-height:1.3}
/* The questionnaire retains its width when the real plugin opens.
   Keep the left survey content AND fixed Next control clear of the right panel. */
@media(min-width:1101px){
 .study-layout.has-compass-access.compass-visible{
  display:block;width:min(760px,calc(100vw - 560px));max-width:none;
  margin-left:max(24px,calc((100vw - 520px - 760px)/2));margin-right:0
 }
 body:has(.study-layout.compass-visible) .form-actions{
  left:max(24px,calc((100vw - 520px - 760px)/2));transform:none;
  width:min(760px,calc(100vw - 560px))
 }
}
@media (max-width:1100px){
 .study-layout.has-compass-access.compass-visible{max-width:min(780px,calc(100vw - 36px));margin:32px auto 140px}
 .compass-dock{top:10vh;bottom:84px;max-height:80vh}
}
@media (max-width:640px){
 .experience-rating .slider-value{min-width:90px;max-width:140px;font-size:12px}
}

/* V25.5 additions: the original restrained V24 survey layout remains intact. */
.candidate-input{display:block;width:100%;max-width:540px;font:16px/1.5 var(--font-sans);border:1px solid #b9c0ca;border-radius:3px;padding:10px 12px;background:#fff;color:#252a31;margin:10px 0 14px}
.candidate-check-button{margin:0 0 12px}
#candidate-result{max-width:630px;min-height:1.6em;line-height:1.5;color:#46576a}
/* Long agree/disagree anchors may wrap, but remain five distinct labeled positions. */
.likert-anchors{max-width:590px;gap:8px;align-items:start}
.likert-anchors span{overflow-wrap:break-word}
@media(max-width:640px){.likert-anchors{gap:3px;font-size:10.5px}.candidate-input{max-width:100%}}

/* V25.6: five-position response anchors share the exact width of the slider.
   The selected value occupies its own line, so showing it cannot shrink the track. */
.experience-rating .experience-scale{width:100%;max-width:720px}
.experience-rating .experience-scale>.slider-value{
 display:block;visibility:visible;box-sizing:border-box;width:100%;min-height:28px;
 margin:0 0 2px;text-align:right;font-size:15px;font-weight:650;
 line-height:1.4;white-space:normal;color:#33465e
}
.experience-rating .experience-scale>.slider-value[hidden]{display:block!important;visibility:hidden}
.experience-rating .experience-scale .slider-figure{
 width:100%;max-width:none;display:block;position:relative;margin:0 0 2px;
}
.experience-rating .experience-scale .slider-figure .strength-slider{
 display:block;width:100%;margin:11px 0;
}
.experience-rating .experience-scale .likert-anchors{
 position:relative;display:block;box-sizing:border-box;
 width:100%;max-width:none;height:70px;margin:5px 0 19px;
 color:#687587;font-size:12px;
}
.experience-rating .experience-scale .likert-anchors span{
 position:absolute;top:0;display:block;width:22%;min-width:0;
 text-align:center;line-height:1.33;overflow-wrap:break-word;
}
.experience-rating .experience-scale .likert-anchors span:nth-child(1){left:0;transform:none;text-align:left}
.experience-rating .experience-scale .likert-anchors span:nth-child(2){left:25%;transform:translateX(-50%)}
.experience-rating .experience-scale .likert-anchors span:nth-child(3){left:50%;transform:translateX(-50%)}
.experience-rating .experience-scale .likert-anchors span:nth-child(4){left:75%;transform:translateX(-50%)}
.experience-rating .experience-scale .likert-anchors span:nth-child(5){left:100%;transform:translateX(-100%);text-align:right}
.experience-rating .experience-scale .likert-anchors small{display:block;margin-bottom:1px}
/* v25.19: 11 selectable difficulty values, visible numeric ticks and endpoint meanings.
   All other experience items retain their five-position layout. */
.experience-rating .difficulty-eleven .difficulty-ticks{
 display:grid;grid-template-columns:repeat(11,minmax(0,1fr));width:100%;
 margin:5px 0 4px;color:#758194;font-size:11px;line-height:1.35;
}
.experience-rating .difficulty-eleven .difficulty-ticks span{text-align:center}
.experience-rating .difficulty-eleven .difficulty-ticks span:first-child{text-align:left}
.experience-rating .difficulty-eleven .difficulty-ticks span:last-child{text-align:right}
.experience-rating .difficulty-eleven .difficulty-endpoints{
 display:flex;justify-content:space-between;gap:16px;width:100%;
 margin:4px 0 19px;font-size:12px;color:#687587;
}
.experience-rating .difficulty-eleven .difficulty-endpoints span:last-child{text-align:right}
@media(max-width:640px){
 .experience-rating .difficulty-eleven .difficulty-ticks{font-size:10px}
 .experience-rating .difficulty-eleven .difficulty-endpoints{font-size:11px}
}
/* A small inline emphasis identifies the tool without introducing extra cards or headings. */
.tool-name-inline{font-family:var(--font-sans);font-weight:750;color:#245eb0;letter-spacing:-.015em}
.conditional-detail{margin:2px 0 18px;max-width:600px}
.conditional-detail .field{margin:7px 0 10px}
.conditional-detail textarea{min-height:78px}
.field-instruction{display:block;margin-top:3px;color:#6e7887;font-size:14px;font-weight:400}
@media(max-width:640px){
 .experience-rating .experience-scale .likert-anchors{height:83px;font-size:10.5px}
 .experience-rating .experience-scale .likert-anchors span{width:23%}
 .experience-rating .experience-scale>.slider-value{font-size:13px;min-height:26px}
}

/* V25.7: visually distinguish the tool name without restyling V24 question controls. */
.passresolve-heading{color:#2363c2;font-weight:700;letter-spacing:-.02em}
.review-instruction{color:#53657b;font-size:15px;max-width:620px;margin:18px 0 14px}
.comprehension-intro{color:#566477;font-size:15px;margin:4px 0 18px}
.open-instruction{font-size:15px;color:#59697d;margin:0 0 14px}
.tool-feedback-page .field{margin:19px 0}
.tool-feedback-page textarea{min-height:105px;height:112px;max-width:680px}

/* V25.8: subdued identification of the study password, not a second heading. */
.password-caption{font-size:13px;font-weight:400;color:#758194;line-height:1.4;margin:0 0 5px}
.decision-context{font-size:16px;line-height:1.6;margin:0 0 19px;color:#37475b}
.study-layout .compass-access:not([hidden]){box-sizing:border-box}


/* V25.9: One consistent hierarchy for every survey question.
   Main question -> optional low-emphasis explanation -> response control. */
.survey-card .survey-question{
 font-family:var(--font-sans);font-size:24px;font-weight:650;line-height:1.42;
 color:var(--ink);letter-spacing:-.018em;margin:0 0 12px;max-width:780px;
}
.survey-card .survey-help{
 font-family:var(--font-sans);font-size:15px;line-height:1.58;font-weight:400;
 color:#5f6b7b;margin:0 0 21px;max-width:760px;letter-spacing:normal;
}
.survey-card .survey-help .tool-name-inline{font-size:inherit;line-height:inherit}
.survey-card .question-options{margin:18px 0 24px;padding:0;border:0;min-width:0}
.survey-card .question-options .options{margin-top:0}
.survey-card .strength-field{margin:20px 0 24px}
.survey-card .experience-rating{margin:20px 0 25px}
.survey-card .experience-rating .experience-scale{max-width:720px}
.survey-card .textarea-field{margin:14px 0 24px}
.survey-card .textarea-field textarea{display:block;width:100%;max-width:740px}
.survey-card .paired-reason{max-width:720px;padding-top:17px;margin-top:12px}
.survey-card .paired-reason .textarea-field{margin:3px 0 17px}
.survey-card .followup-label{
 font-size:16px;line-height:1.48;font-weight:550;color:var(--ink);
 display:block;margin:0 0 9px;
}
.survey-card .candidate-field{margin-top:14px}
.survey-card .password-block{margin:17px auto 22px}
/* The rating recall control is deliberately a lower-priority reference. */
.survey-card .rating-lookup-row{margin:14px 0 20px}
/* Matching mobile typography, not a second independent hierarchy. */
@media(max-width:640px){
 .survey-card .survey-question{font-size:21px;line-height:1.42;margin-bottom:11px}
 .survey-card .survey-help{font-size:14px;margin-bottom:18px}
 .survey-card .followup-label{font-size:15px}
}

/* V25.11: show the optional non-exposure answer for explanation clarity without imposing a feature click. */

/* V25.12: Tool is visible only during review and password decisions; no other questionnaire pages show it. */
/* The embedded tool has no minimize control while those decisions are being made. */


/* V25.16: prevent the fixed footer divider from painting across Next. */
.form-actions{
  left:0;right:0;transform:none;margin-left:auto;margin-right:auto;
  border-top:0;box-shadow:0 -1px 0 #e4e6eb;isolation:isolate;
}
@media(min-width:1101px){
  body:has(.study-layout.compass-visible) .form-actions{
    right:auto;margin-left:0;margin-right:0;
  }
}
.form-actions #continue-button{
  position:relative;z-index:1;
  -webkit-appearance:none;appearance:none;
  background-clip:padding-box;
}

/* v25.17: identical neutral four-website recap in both study arms */
.rating-recap {
 display:grid;
 grid-template-columns:repeat(4,minmax(0,1fr));
 max-width:670px;
 margin:16px 0 22px;
 border:1px solid #e0e5ed;
 border-radius:7px;
 overflow:hidden;
 background:#fff;
}
.rating-recap-cell {
 min-width:0;
 padding:12px 8px;
 text-align:center;
 border-right:1px solid #e0e5ed;
}
.rating-recap-cell:last-child {border-right:0;}
.rating-recap-cell span {display:block;font-size:12px;color:#697587;white-space:nowrap;}
.rating-recap-cell strong {display:block;font-size:13px;color:#252a31;margin-top:5px;font-weight:700;}
@media(max-width:560px) {
 .rating-recap {grid-template-columns:repeat(2,minmax(0,1fr));}
 .rating-recap-cell:nth-child(2) {border-right:0;}
 .rating-recap-cell:nth-child(-n+2) {border-bottom:1px solid #e0e5ed;}
}
