/* The cover and the questionnaire share the full width of the window. */
body[data-view="home"] .cover{width:100%;max-width:none;padding:0}
body[data-view="home"] .hero{width:100%;height:calc(100svh - 81px);min-height:530px;max-height:none}
.cover .chapters{margin:auto;max-width:1640px;padding-inline:clamp(20px,5vw,80px)}
.cover .hero-copy{left:clamp(23px,7vw,140px);bottom:clamp(55px,9svh,120px)}
.cover .hero-deck{max-width:25ch}
.cover .hero h1{font-size:clamp(105px,15.2vw,260px)}
.cover .hero-photo{object-position:54% 62%}
.cover .photo-caption{right:clamp(16px,3vw,60px);bottom:20px}

body[data-view="survey"]{background:#191c1b}
body[data-view="survey"]>.masthead{display:none}
body[data-view="survey"] footer{position:relative;background:var(--paper)}
.long-survey{position:relative;isolation:isolate;color:#fbf7ef;--bar-height:61px}
.survey-backdrop{position:fixed;inset:0;z-index:-1;background:#292e2b;pointer-events:none;overflow:hidden}
.wall-photo,.wall-wash{position:absolute;inset:0}
.wall-photo{opacity:0;transition:opacity .65s ease}
.wall-photo.current{opacity:1}
.wall-photo img{width:100%;height:100%;display:block;object-fit:cover;object-position:52% 61%;filter:saturate(.72)}
.wall-experience img{object-position:50% 55%}
.wall-spray img{object-position:48% 70%}
.wall-wash{background:linear-gradient(90deg,rgba(23,29,29,.83),rgba(31,35,33,.60) 46%,rgba(32,29,27,.66)),linear-gradient(12deg,rgba(98,53,32,.66) 3%,rgba(54,42,36,.19) 55%,rgba(34,66,72,.36))}
.survey-bar{position:sticky;top:0;z-index:4;display:flex;align-items:center;gap:22px;min-height:var(--bar-height);padding:6px clamp(18px,5vw,80px);background:linear-gradient(105deg,rgba(25,31,30,.94),rgba(43,42,37,.92));border-bottom:1px solid #ffffff38}
.survey-wordmark{font:700 25px/1 var(--display);text-transform:uppercase;letter-spacing:-.025em;white-space:nowrap}
.chapter-select{border-left:1px solid #ffffff55;padding-left:15px}
.chapter-select select{border:0;color:#f6eee2;background:transparent;font:13px var(--body);min-height:42px;padding-right:2px}
.chapter-select select option{background:#212522;color:#fff}
.save-state{margin-left:auto;font:11px var(--mono);color:#e5ddd0;text-align:right}
.flow-progress{position:absolute;bottom:-1px;height:2px;left:0;right:0}
.flow-progress i{display:block;height:100%;background:linear-gradient(90deg,#c28a68,#f3d4a6);transform:scaleX(var(--at,.05));transform-origin:left;transition:transform .28s ease}
.bar-link{background:transparent;color:inherit;font-weight:500;text-decoration:underline;text-underline-offset:4px;padding:9px 3px}
.question-scene{position:relative;min-height:max(119svh,calc(var(--sheet-height,390px) + 31svh + var(--bar-height)));padding:7svh clamp(24px,7vw,145px) 0;scroll-margin-top:var(--bar-height)}
.scene-inner{position:sticky;top:var(--pin-top,15svh);max-width:1320px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.90fr);gap:clamp(42px,7vw,130px);align-items:start}
.scene-prompt .eyebrow,.survey-finish .eyebrow{color:#f3ded0;letter-spacing:.14em;font-size:11px}
.scene-prompt .eyebrow span{color:#c2b1a3}
.scene-prompt h2{font:700 clamp(43px,4.9vw,78px)/1 var(--display);letter-spacing:-.02em;margin:14px 0 0;text-wrap:pretty;max-width:20ch}
.scene-prompt h2:focus{outline:0}
.scene-hint{max-width:39ch;font-size:16px;line-height:1.45;color:#f0eadf;margin-top:15px}
.scene-fields{min-width:0}
.scene-fields fieldset{display:block;min-width:0}
.scene-fields .options{gap:7px}
.scene-fields .choice-body{min-height:50px;border-color:#d1cbbd77;background:linear-gradient(105deg,rgba(29,33,30,.82),rgba(39,40,34,.70));color:#fffaf2}
.scroll-hint{margin-top:16px;font-size:12px;color:#e3dbcf}
.survey-bar{background:linear-gradient(105deg,#202723,#32322b)}
.scene-fields .choice:hover .choice-body{border-color:#f0dbc5}
.scene-fields .control{border-color:#f2e8db;box-shadow:none}
.scene-fields .choice input:checked+.choice-body{color:#211f1c;background:linear-gradient(115deg,#f6eee0,#e8d4bd);border-color:#fff6e8}
.scene-fields .choice input:checked+.choice-body .control{border-color:#413d34;background:#413d34}
.scene-fields .choice input[type=checkbox]:checked+.choice-body .control:after{content:"";width:6px;height:3px;top:3px;left:3px;border:solid #fff;border-width:0 0 2px 2px;transform:rotate(-45deg)}
.scene-fields textarea{background:rgba(250,245,235,.95);border-color:#e3d8c7;color:#242723;min-height:94px;border-radius:1px}
.scene-fields .detail-label{margin:16px 0 6px}
.scene-fields .detail-label small,.scene-fields .scale-labels{color:#eae4da}
.scene-fields .matrix-row{border-bottom-color:#ffffff55}
.scene-fields .matrix-row select{background:#f5efe4;color:#222720}
.scene-fields .inline-error{color:#ffe2c3}
.scene-fields .choice input:focus-visible+.choice-body,.survey-bar :focus-visible,.scene-fields textarea:focus-visible,.scene-fields select:focus-visible{outline-color:#f3be80}
.survey-finish{min-height:68svh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:55px 24px;text-align:center}
.survey-finish h2{font-size:clamp(47px,6vw,95px)}
.survey-finish .bar-link{font-size:13px}
.score-dialog{border:1px solid #bbb2a2;background:linear-gradient(135deg,#fcf8ed,#eaddc9);color:#21231e;width:min(425px,calc(100% - 36px));padding:30px;box-shadow:0 18px 70px #13171250}
.score-dialog::backdrop{background:#1116119e;backdrop-filter:blur(4px)}
.score-dialog h2{font-size:42px;line-height:1.02}
.score-dialog p{margin:15px 0 21px;font-size:16px;line-height:1.45}
@media(prefers-reduced-motion:no-preference){
  .scene-inner.arrived .scene-prompt{animation:scene-arrive .44s cubic-bezier(.18,.7,.2,1) both}
  .scene-inner.arrived .scene-fields{animation:scene-arrive .52s .12s cubic-bezier(.18,.7,.2,1) both}
  .score-dialog[open]{animation:scene-arrive .22s ease-out}
  @keyframes scene-arrive{from{opacity:.16;transform:translateY(21px)}to{opacity:1;transform:none}}
}
@media(max-width:800px){
  body[data-view="home"] .hero{height:calc(100svh - 64px);min-height:430px}
  .cover .hero h1{font-size:clamp(96px,24vw,160px)}
  .cover .hero-copy{left:clamp(22px,5vw,42px);bottom:9svh}
  .cover .hero-photo{object-position:60% 60%}
  .long-survey{--bar-height:54px}
  .survey-bar{gap:12px}.survey-wordmark{font-size:22px}.save-state{font-size:9px;max-width:105px}
  .chapter-select{padding-left:9px}.chapter-select select{font-size:12px}
  .wall-wash{background:linear-gradient(155deg,rgba(20,38,40,.42),rgba(27,32,29,.69) 38%,rgba(38,31,26,.78) 83%),linear-gradient(10deg,rgba(133,76,47,.65),transparent 66%)}
  .scene-inner{grid-template-columns:1fr;gap:clamp(15px,2.6svh,26px)}
  .scene-prompt h2{font-size:clamp(32px,8.5vw,49px);max-width:23ch;margin-top:8px}
  .scene-prompt .eyebrow{font-size:10px}
  .scene-hint{font-size:14px;margin-top:8px}
  .question-scene{padding-inline:clamp(18px,5.3vw,44px)}
  .scene-fields .choice-body{min-height:47px;padding:10px 13px}
  .scene-fields .options{gap:5px}
  .survey-bar .bar-link{font-size:11px}
}
@media(max-width:360px){.survey-bar{gap:7px;padding-inline:12px}.save-state{font-size:8px}.scene-prompt h2{font-size:29px}}
@media(prefers-reduced-motion:reduce){
  .scene-inner{position:static}
  .question-scene{min-height:0;padding-block:clamp(40px,8svh,95px);border-bottom:1px solid #ffffff3b}
  .wall-photo,.flow-progress i{transition:none}
}
