@font-face{font-family:Creato;src:url('/assets/original/CreatoDisplay-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Creato;src:url('/assets/original/CreatoDisplay-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Creato;src:url('/assets/original/CreatoDisplay-Bold.woff2') format('woff2');font-weight:700;font-display:swap}

:root{--blue:#007bb8;--cyan:#33bbd3;--navy:#082d8c;--ink:#17304d;--muted:#627185;--line:#dce5ed;--ice:#f6fafd;--error:#a62935;--radius:14px}
*{box-sizing:border-box}
body{margin:0;background:#fbfcfe;color:var(--ink);font-family:Creato,Arial,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}
button,a,summary{touch-action:manipulation}
button{border:0;cursor:pointer}
button:disabled{cursor:wait;opacity:.65}
a{color:inherit}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
h1:focus,h2:focus,main:focus{outline:none}
h1,h2,h3,p{margin:0}
svg{display:block}
img{display:block;max-width:100%;height:auto}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;z-index:20;left:16px;top:12px;padding:12px 20px;background:white;border-radius:8px;transform:translateY(-160%)}
.skip-link:focus{transform:translateY(0)}

.quiz-shell{min-height:100svh}
.quiz-main{width:100%;max-width:568px;min-height:100svh;margin:0 auto;padding:28px 24px 22px;display:flex;flex-direction:column}
.main-header{display:flex;justify-content:center;margin-bottom:32px}
.brand{display:block;width:145px;padding:12px 17px;background:var(--navy);border-radius:13px}
.brand:focus-visible{outline-color:var(--cyan)}
.main-body{width:100%;flex:1}
.quiz-view{animation:appear .22s ease-out}
.eyebrow{display:block;color:var(--blue);font-size:10px;font-weight:700;letter-spacing:.1em;line-height:1.6}
.intro{text-align:center;padding-top:12px}
.intro h1{font-size:38px;font-weight:700;line-height:1.15;letter-spacing:-.035em;margin:16px auto 0;max-width:500px}
.intro h1 span{color:var(--blue)}
.intro-visual{width:210px;max-width:60%;margin:19px auto 13px}
.intro-visual svg{width:100%;height:auto}
.intro-description{max-width:440px;margin:0 auto 25px;font-size:17px;line-height:1.6;color:var(--muted)}
.button{display:inline-flex;justify-content:center;align-items:center;gap:16px;min-height:56px;padding:15px 22px;border-radius:var(--radius);font-size:16px;font-weight:700;text-decoration:none;line-height:1.45;transition:background .16s,transform .16s,box-shadow .16s}
.button-primary{color:white;background:var(--blue);box-shadow:0 4px 0 #006da4}
.button-primary:hover{background:#006fa7;box-shadow:0 4px 0 #005d8c}
.button-primary:active{transform:translateY(2px);box-shadow:0 2px 0 #006da4}
.button-primary span[aria-hidden]{font-size:23px;line-height:1}
.button-secondary{background:#eaf3f8;color:var(--ink)}
.button-secondary:hover{background:#dfeef6}
.button-quiet{background:transparent;color:var(--muted);padding:11px 14px;font-size:14px;font-weight:400;min-height:44px}
.button-quiet:hover{color:var(--blue);background:#edf5fa}
.intro .button{width:100%}
.intro-note{font-size:12px;color:var(--muted);margin-top:18px}
.main-footer{text-align:center;padding-top:40px;font-size:12px;color:var(--muted)}
.main-footer a{display:inline-block;padding:8px;text-decoration:none;text-underline-offset:4px}
.main-footer a:hover{text-decoration:underline}

.progress-wrap{margin:0 0 30px}
.progress-label{display:flex;justify-content:space-between;gap:14px;align-items:center;font-size:11px;color:var(--muted);margin-bottom:9px}
.progress-label>span:first-child{font-weight:500}
progress{display:block;width:100%;height:6px;border:0;overflow:hidden;border-radius:10px;appearance:none;background:#e6edf3}
progress::-webkit-progress-bar{background:#e6edf3;border-radius:10px}
progress::-webkit-progress-value{background:var(--blue);border-radius:10px;transition:width .2s}
progress::-moz-progress-bar{background:var(--blue);border-radius:10px}
.question-header{margin-bottom:27px;text-align:center}
.question-header .eyebrow{margin-bottom:12px}
.question-header h1,.content-card h1,.result h1{font-size:32px;line-height:1.18;letter-spacing:-.03em;font-weight:700}
.question-header p,.content-card>p,.result-description{font-size:16px;line-height:1.6;color:var(--muted);margin-top:13px}
.fields{display:grid;gap:22px}
.field{min-width:0;border:0;padding:0;margin:0}
.field-label{font-size:14px;font-weight:500;display:block;padding:0;margin-bottom:10px}
.optional{font-weight:400;font-size:12px;color:var(--muted);margin-left:5px}
.options{display:grid;gap:11px}
.choice{display:flex;align-items:center;gap:14px;padding:14px 17px;position:relative;border:1px solid var(--line);border-radius:var(--radius);background:#fff;cursor:pointer;min-height:66px;text-align:left;transition:border-color .16s,background .16s,transform .16s,box-shadow .16s}
.choice:hover{border-color:#84bcd6;background:#f7fbfe;transform:translateY(-1px);box-shadow:0 3px 12px #16325106}
.choice:has(input:checked){border-color:var(--blue);background:#edf8fc;box-shadow:inset 0 0 0 1px var(--blue)}
.choice:has(input:focus-visible){outline:3px solid var(--blue);outline-offset:3px}
.choice input{position:absolute;opacity:0;width:1px;height:1px}
.choice-icon{width:34px;flex-shrink:0;font-size:26px;line-height:1.1;text-align:center}
.choice-text{font-size:16px;line-height:1.4;flex:1}
.choice-indicator{width:20px;height:20px;border:1.5px solid #c4d4df;border-radius:50%;flex-shrink:0;margin-left:2px;display:grid;place-items:center;color:white;font-size:12px;line-height:1}
.choice:has(input:checked) .choice-indicator{border-color:var(--blue);background:var(--blue)}
.choice:has(input:checked) .choice-indicator:after{content:'✓'}
.auto-hint{margin:0 0 16px;color:var(--muted);font-size:12px;text-align:center}
.field-control{display:block;width:100%;min-height:58px;padding:15px 17px;border:1px solid #bdcdd9;border-radius:var(--radius);background:white;color:var(--ink);font-size:16px;transition:border-color .16s}
.field-control::placeholder{color:#6c7d8f;opacity:1}
.field-control:focus{border-color:var(--blue)}
select.field-control{padding-right:35px}
textarea.field-control{min-height:132px;resize:vertical}
.voice-answer{margin:0 0 14px}
.button-voice{width:100%;border:1px solid var(--blue);background:#f0faff;color:var(--blue);gap:8px}
.button-voice:hover{background:#e2f5fc}
.voice-hint,.voice-status{font-size:12px;line-height:1.5;color:var(--muted);margin:8px 0 0}
.voice-status:empty{display:none}
.voice-answer.is-listening .button-voice{background:#fff1f0;border-color:#b63d3d;color:#942626}
.voice-answer.is-listening .voice-status{color:var(--navy)}
.field-control[readonly]{background:#f7fafc}
.checkbox-label{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.6;padding:17px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);cursor:pointer}
.checkbox-label input{width:20px;height:20px;flex-shrink:0;margin:2px 0 0;accent-color:var(--blue)}
.field-error{color:var(--error);font-size:13px;margin-top:8px}
.field.has-error .field-control,.field.has-error .choice,.field.has-error .checkbox-label{border-color:var(--error)}
.error-banner{padding:15px 17px;color:#81242d;background:#fff1f2;border:1px solid #edbec2;font-size:14px;border-radius:var(--radius);margin-bottom:22px;line-height:1.6}
.form-actions,.content-actions{display:flex;flex-direction:column-reverse;align-items:stretch;gap:10px;margin-top:25px}
.form-actions .button-quiet,.content-actions .button-quiet{align-self:center}
.form-note{font-size:12px;line-height:1.6;color:var(--muted);margin-top:16px}

.content-card{text-align:center}
.content-icon,.result-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#e3f4fa;color:var(--blue);font-size:24px;margin:0 auto 19px}
.content-card .eyebrow,.result .eyebrow{margin-bottom:12px}
.content-card>p{white-space:pre-line}
.content-visual{display:flex;flex-direction:column;gap:13px;margin:25px 0;padding:24px 20px;background:#edf5fa;border:1px solid #e2edf5;border-radius:20px;text-align:left}
.chat-bubble{max-width:91%;padding:13px 16px;font-size:14px;line-height:1.55;border-radius:16px;box-shadow:0 3px 10px #082d8c05}
.chat-bubble.user{align-self:flex-end;background:var(--navy);color:#fff;border-bottom-right-radius:4px}
.chat-bubble.assistant{align-self:flex-start;background:#fff;color:var(--ink);border-bottom-left-radius:4px}
.content-caption{color:var(--muted);font-size:11px;line-height:1.5;text-align:center;margin-top:2px}
.summary{margin-bottom:24px;text-align:left}
.summary-heading{font-size:15px;font-weight:700;margin-bottom:12px}
.summary-list{margin:0;border-top:1px solid var(--line)}
.summary-row{padding:14px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto;gap:5px 16px}
.summary-row dt{font-size:12px;color:var(--muted)}
.summary-row dd{font-size:14px;line-height:1.5;overflow-wrap:anywhere;margin:0;grid-column:1;white-space:pre-line}
.edit-answer{grid-column:2;grid-row:1/3;background:transparent;color:var(--blue);font-size:12px;text-decoration:underline;text-underline-offset:4px;align-self:center;min-height:44px;padding:0 5px}
.review-details{margin:25px 0;border:1px solid var(--line);border-radius:var(--radius);background:#fff;padding:0 18px;text-align:left}
.review-details>summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:18px 0;font-size:14px;font-weight:700}
.review-details>summary:after{content:'+';font-size:21px;color:var(--blue)}
.review-details[open]>summary:after{content:'−'}
.review-details>summary::-webkit-details-marker{display:none}
.review-details .summary{margin-bottom:14px}
.review-details .summary-row:last-child{border-bottom:0}
.result{text-align:center;padding-top:8px}
.result-icon{background:#e2f4f7;color:#08778b;font-size:25px}
.result-description{white-space:pre-line}
.result-next{padding-top:25px}
.result-next .button{width:100%}
.result-reasons{font-size:14px;line-height:1.7;color:var(--muted);padding-left:20px;margin:17px 0 0;text-align:left}
.result-footer{display:flex;flex-direction:column;gap:10px;align-items:center;padding-top:12px;margin-top:22px}
.result-footer a{font-size:13px;text-underline-offset:4px;color:var(--muted);padding:10px}

@keyframes appear{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){
  body{background:#fff}
  .quiz-main{padding:21px 20px 16px}
  .main-header{margin-bottom:27px}
  .brand{width:133px;padding:11px 15px;border-radius:12px}
  .intro{padding-top:8px}
  .intro h1{font-size:32px;margin-top:15px}
  .intro .eyebrow{font-size:9px;letter-spacing:.08em}
  .intro-visual{width:184px;margin:18px auto 14px}
  .intro-description{font-size:16px;margin-bottom:24px}
  .question-header h1,.content-card h1,.result h1{font-size:29px}
  .question-header{margin-bottom:24px}
  .progress-wrap{margin-bottom:26px}
  .choice{padding:14px;gap:11px;min-height:65px}
  .choice-icon{width:31px;font-size:25px}
  .choice-text{font-size:15px}
  .choice-indicator{width:19px;height:19px}
  .content-visual{padding:20px 16px}
  .main-footer{padding-top:32px}
}
@media(max-width:360px){
  .quiz-main{padding-right:17px;padding-left:17px}
  .intro h1{font-size:29px}
  .question-header h1,.content-card h1,.result h1{font-size:27px}
  .choice{padding:13px 11px;gap:10px}
  .button{padding-right:16px;padding-left:16px;font-size:15px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}