/* A compact, mobile-first questionnaire. The homepage keeps its own art direction. */
.quiz-page,.result-page{--paper:#f8f8f4;--ink:#253c3e;--muted:#687674;--line:#d9dfd9;--olive:#284a46;background:var(--paper);color:var(--ink)}
.quiz-shell{width:min(100%,560px);padding:0 28px 24px;min-height:100svh;display:block}
.quiz-masthead{padding-top:26px;min-height:70px}
.quiz-masthead .brand{width:106px}
.close{width:44px;height:44px;margin-right:-12px;color:#6c7975;font-size:25px}
.quiz-header{height:61px;gap:12px;font-size:12px}
.back{width:44px;height:44px;margin-left:-12px}
.back svg{width:20px;height:20px}
.quiz-chapter{color:var(--muted)}
.step-count{margin-left:auto;font-size:11px;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.step-count>span{margin-left:3px;color:#6c7975}
.quiz-progress{height:2px;background:#dfe4de;width:100%;overflow:hidden}
.quiz-progress i{display:block;width:100%;height:100%;background:#315a50;transform-origin:left;transition:transform .2s}
.quiz-main{padding:34px 0 0;flex:none}
.question-heading{text-align:left;margin-bottom:26px}
.quiz-main h1,.result-shell h1{font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:47px;line-height:1.04;letter-spacing:-.7px;text-align:left;text-wrap:pretty}
.question-hint{text-align:left;font-size:13px;line-height:1.6;margin:14px 0 0;max-width:440px}
.choices{gap:8px}
.choice{display:flex;justify-content:flex-start;gap:14px;min-height:62px;padding:16px 18px;border:1px solid #d8ded8;border-radius:9px;background:#fff;box-shadow:none;font-size:14px;font-weight:500;line-height:1.45;transition:border-color .15s,background .15s}
.choice-label{flex:1}
.choice-drawing{color:#5d7870;flex:0 0 22px}
.choice-drawing svg{width:22px;height:24px}
.choice:hover{border-color:#7d9b8d;background:#f3f6ef}
.choice:active{background:#e9efdf}
.choice[aria-pressed=true]{background:#edf2e7;border-color:#7b9481}
.choice-indicator{border:0;border-radius:0;width:19px;height:19px;color:#6e7f74}
.choice-indicator svg{width:17px;height:17px;opacity:1}
.choice-indicator svg:first-child{display:none}
.choice[aria-pressed=true] .choice-indicator{background:none;color:var(--olive);border:0}
.choice[aria-pressed=true] .choice-indicator svg:first-child{display:block}
.choice[aria-pressed=true] .choice-indicator svg:last-child{display:none}
.choice:disabled:hover{background:#fff;border-color:#d8ded8}
.is-multiple .choice-indicator{width:19px;height:19px;border:1px solid #b8c6bb;border-radius:4px}
.is-multiple .choice-indicator svg{display:none}
.is-multiple .choice[aria-pressed=true] .choice-indicator{background:var(--olive);color:white;border:1px solid var(--olive)}
.is-multiple .choice[aria-pressed=true] .choice-indicator svg:first-child{display:block;width:15px;height:15px}
.choice-grid{grid-template-columns:1fr 1fr;gap:8px}
.choice-grid .choice{font-size:12px;min-height:68px;gap:8px;padding:13px 12px}
.choice-grid .choice-indicator{width:14px;height:16px}
.choice-grid .choice-indicator svg{width:14px;height:14px}
.selection-note{font-size:11px;text-align:left;margin:12px 0 0;min-height:0;color:var(--muted)}
.selection-note:empty{display:none}
.quiz-footer{position:relative;bottom:auto;padding:14px 0 max(20px,env(safe-area-inset-bottom));background:var(--paper)}
.tap-note{font-size:11px;padding:3px 0;text-align:center;color:#67766c}
.quiz-welcome{display:flex;align-items:center;justify-content:center;gap:14px;margin:28px auto 0;color:#73847a}
.quiz-welcome>span{display:block;width:40px;height:50px;transform:rotate(-7deg)}
.quiz-welcome svg{width:100%;height:100%}
.quiz-welcome p{font-size:11px;line-height:1.7}
.quiz-page .primary,.result-page .primary{min-height:54px;background:var(--olive);border-color:var(--olive);border-radius:8px;font-size:14px;padding:15px 18px;color:#fff}
.quiz-page .primary:hover,.result-page .primary:hover{background:#203f3a}
.quiz-page .primary:disabled:hover{background:var(--olive)}
.quiz-page .skip{min-height:44px;margin-top:6px;font-size:11px}
.signup-main{text-align:left;padding-top:32px}
.signup-main>.section-name{display:none}
.signup-summary{justify-content:flex-start;gap:10px 18px;margin:23px 0}
.signup-summary>span{font-size:11px;color:#5c796a}
.google-button{border-color:var(--line);background:#fff;border-radius:8px}
.google-button:hover{background:#f1f5ed}
.auth-demo-label{text-align:center;color:#6d7b73}
.or-divider{margin:20px 0;color:#6d7b73}
.email-label{font-size:12px}
#email{border-color:#bdcabe;background:#fff;border-radius:8px}
#email::placeholder{color:#77877e}
.local-note{color:#6d7b73;font-size:10px}
.field-error{color:#a0472d}
.result-shell{max-width:560px;padding:32px 28px}
.result-header{margin-bottom:52px}
.result-header .brand{width:106px}
.result-shell .section-name{color:#5c796a;letter-spacing:.08em;margin-bottom:15px}
.result-shell h1{font-size:49px}
.team-list h2{font-size:19px;font-weight:500}
.team-number{color:#6d8373}
.result-shell .text-link{border-color:#b6c5b9}
@media(min-width:900px){.quiz-shell{padding-top:18px}.quiz-main{padding-top:40px}.question-heading{margin-bottom:28px}.quiz-welcome{margin-top:32px}}
@media(max-width:650px){
 .quiz-shell{padding:0 24px 18px}
 .quiz-masthead{padding-top:14px;min-height:58px}.quiz-masthead .brand{width:98px}
 .quiz-header{height:55px;gap:9px}.quiz-chapter{font-size:11px}.step-count{font-size:10px}
 .quiz-main{padding-top:28px}.question-heading{margin-bottom:24px}
 .quiz-main h1{font-size:42px;line-height:1.03;letter-spacing:-.5px}
 .question-hint{font-size:12px;line-height:1.6;margin-top:13px}
 .choice{min-height:60px;font-size:13px;padding:15px 15px;gap:12px}
 .choice-grid .choice{min-height:67px;font-size:12px;padding:12px 11px;gap:7px}
 .choice-drawing{flex-basis:22px}
 .quiz-footer{padding-top:14px}
 .quiz-welcome{margin-top:26px}
 .signup-main{padding-top:29px}.signup-summary{margin:22px 0}
 .result-shell{padding:25px 24px}.result-shell h1{font-size:46px}
}
@media(max-width:360px){.quiz-shell{padding-left:20px;padding-right:20px}.quiz-main h1{font-size:38px}.choice{font-size:12px}.choice-grid .choice{font-size:11px}.choice-grid .choice-indicator{width:12px}.quiz-main{padding-top:25px}}

/* A simple reassurance page, shared by the growth and time visuals. */
.story-focus{padding-top:39px}
.story-focus h1{text-align:center;font-size:48px;line-height:1.04}
.story-description{max-width:325px;margin:16px auto 0;text-align:center;font-size:13px;line-height:1.7;color:var(--muted)}
.story-footer{padding-top:27px}
@media(max-width:650px){.story-focus{padding-top:31px}.story-focus h1{font-size:44px}.story-description{font-size:12px;max-width:270px;margin-top:15px}.story-footer{padding-top:23px}}
@media(max-width:360px){.story-focus h1{font-size:41px}.story-focus{padding-top:26px}}
/* One conceptual growth graphic for the first reassurance step. */
.growth-story{display:flex}
.growth-story .story-focus{flex:1;display:flex;flex-direction:column;justify-content:center;padding:28px 0 20px}
.growth-story .story-description{max-width:340px;font-size:14px;line-height:1.65;margin-top:17px}
.growth-visual{width:100%;max-width:460px;margin:29px auto 0}
.growth-chart{display:block;width:100%;height:auto;overflow:visible}
.growth-axes{stroke:#ccd2c8;stroke-width:1.5}
.growth-axis-title,.growth-axis-label{fill:#778272;font-size:12px;font-family:var(--sans)}
.growth-axis-title{font-size:11px}
.growth-morrow,.growth-solo{fill:none;stroke-linecap:round;stroke-width:2.8}
.growth-morrow{stroke:#48795e}
.growth-solo{stroke:#a3aa9a;stroke-width:2.3}
.growth-halo{fill:none;stroke:#bfd1ba;stroke-width:1}
.growth-dot{fill:#48795e}
.growth-solo-dot{fill:#a3aa9a}
.growth-label{fill:#3e7053;font-family:var(--sans);font-size:15px;font-weight:600}
.growth-solo-label{fill:#6b7764;font-family:var(--sans);font-size:12px}
.growth-visual figcaption{margin-top:9px;text-align:center;font-size:10px;line-height:1.5;color:#6c7766}
.growth-story .story-footer{padding-top:15px}
@media(max-width:650px){
 .growth-story .story-focus{padding-top:25px;padding-bottom:20px}
 .growth-story .story-description{max-width:292px;font-size:13px;margin-top:17px}
 .growth-visual{margin-top:33px}
 .growth-axis-title{font-size:13px}.growth-axis-label{font-size:14px}
 .growth-label{font-size:17px}.growth-solo-label{font-size:14px}
 .growth-visual figcaption{font-size:10px;margin-top:13px}
 .growth-story .story-footer{padding-bottom:max(16px,env(safe-area-inset-bottom))}
}
@media(max-width:650px) and (max-height:720px){
 .growth-story{padding-bottom:8px}
 .growth-story .quiz-masthead{padding-top:10px;min-height:54px}
 .growth-story .quiz-header{height:49px}
 .growth-story .story-focus{padding:20px 0 12px}
 .growth-story h1{font-size:38px}
 .growth-story .story-description{font-size:12px;margin-top:12px}
 .growth-story .growth-visual{max-width:285px;margin-top:20px}
 .growth-story .growth-visual figcaption{margin-top:9px}
 .growth-story .story-footer{padding:8px 0 max(8px,env(safe-area-inset-bottom))}
}

.time-story{display:flex}
.time-story .story-focus{flex:1;display:flex;flex-direction:column;justify-content:center;padding:28px 0 20px}
.time-visual{margin:22px 0 0;width:100%}
.time-art{position:relative;width:100%;max-width:440px;margin:auto}
.time-art>svg{width:100%;height:auto}
.clock-face{fill:#eef2e6;stroke:#9bac93;stroke-width:1.4}
.clock-ticks{fill:none;stroke:#8c9d84;stroke-width:1.3;stroke-linecap:round}
.clock-hands{fill:none;stroke:#39564a;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.clock-pin{fill:#39564a}
.time-return{fill:none;stroke:#48795e;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.time-spark{stroke:#819875;stroke-width:1.5;stroke-linecap:round}
.time-helper{position:absolute;width:71px;height:88px;right:12%;bottom:14%;color:#647a61;transform:rotate(7deg)}
.time-helper svg{width:100%;height:100%}
.handoff-caption{font-size:9px;letter-spacing:.1em;color:#6c7b64;text-align:center;margin:10px 0 13px}
.handoff-work{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 18px;text-align:center}
.handoff-work>span{font-size:12px;line-height:1.7;color:#3b5545;border-bottom:1px solid #bdcbb1;padding-bottom:4px}
.time-story .story-footer{padding-top:15px}
.pilot-response h2{font-size:16px;margin:22px 0 12px}
.pilot-response ol{margin:0;padding-left:20px;line-height:1.9}
.signup-main #email-form{margin-top:30px}
@media(max-width:650px){
 .time-story .story-focus{padding:25px 0 20px}
 .time-story .story-description{font-size:13px;max-width:292px;margin-top:17px}
 .time-story h1{font-size:42px}
 .time-visual{margin-top:25px}
 .time-helper{width:59px;height:73px;right:10%}
 .handoff-work>span{font-size:11px}
 .time-story .story-footer{padding-bottom:max(16px,env(safe-area-inset-bottom))}
}
@media(max-width:650px) and (max-height:720px){
 .time-story{padding-bottom:8px}.time-story .quiz-masthead{padding-top:10px;min-height:54px}.time-story .quiz-header{height:49px}
 .time-story .story-focus{padding:20px 0 12px}.time-story h1{font-size:37px}
 .time-story .story-description{font-size:12px;margin-top:12px}
 .time-visual{max-width:285px;margin:16px auto 0}.time-helper{width:50px;height:62px}
 .time-story .story-footer{padding:8px 0 max(8px,env(safe-area-inset-bottom))}
}
@media(max-width:650px) and (max-height:720px){
 .time-story .story-focus{padding-bottom:10px}
 .time-story .time-visual{max-width:270px;margin-top:12px}
}
