/* Version F only (body.f). Loaded after shared.css and final.css. */
body.f .btn.solid{cursor:default}
body.f .btn.solid:hover{outline:0}
body.f .tagline a{color:var(--muted);text-decoration:underline}
body.f .tagline a:hover{color:var(--ink)}

/* prompt: a hidden sizer holds the longest easy/medium prompt so the height never changes */
body.f .prompt{display:grid}
body.f .prompt>span{grid-area:1/1}
body.f .prompt .sz{visibility:hidden}
body.f .acts{display:flex;align-self:stretch}
body.f .acts button{border-left:1px solid var(--frame)}
body.f .acts button:first-child{border-left:1px solid var(--frame)}

/* footer strip inside the sheet */
body.f footer.strip{align-items:center}

/* desktop: one screen, no scroll */
@media(min-width:861px){
  body.f .sheet{display:flex;flex-direction:column;height:calc(100vh - 48px);height:calc(100dvh - 48px);min-height:560px}
  body.f main{flex:1;min-height:0;display:flex}
  body.f main>.row{flex:1;min-height:0;width:100%}
  body.f .hero{display:flex;flex-direction:column;justify-content:center;padding:24px 32px}
  body.f h1{font-size:clamp(40px,min(5.6vw,8.5vh),76px);margin:14px 0 16px}
  body.f .sub{font-size:clamp(16px,2.2vh,19px);margin-bottom:0}
  body.f .cta{margin-top:clamp(16px,3vh,28px)}
  body.f .specwrap{align-items:center;padding-top:16px;padding-bottom:16px}
  body.f .spec .stage{padding-top:6px}
  body.f .rin.big{font-size:clamp(9px,min(1.3vw,1.85vh),16px)}
  body.f .spec .prompt{font-size:clamp(18px,min(2vw,3vh),24px);padding:12px}
  body.f .answers button{min-height:clamp(56px,9.5vh,76px);font-size:clamp(16px,2.2vh,19px)}
  body.f .spec .head{padding:8px 12px}
}
/* short desktop windows */
@media(min-width:861px) and (max-height:700px){
  body.f .sub{display:none}
}

/* phones and narrow windows: stack, riddle prompt starts in the first screen */
@media(max-width:860px){
  body.f .hero{padding:14px 16px}
  body.f .hero:first-child{padding-bottom:14px}
  body.f h1{font-size:clamp(28px,8.5vw,38px);margin:6px 0 8px}
  body.f .sub{font-size:14.5px;line-height:1.4;margin-bottom:0}
  body.f .cta{margin-top:12px}
  body.f .btn.solid{width:100%;justify-content:center}
  body.f .tagline{margin-top:8px;margin-bottom:0}
  body.f .tagline a,body.f .tagline .xl{white-space:nowrap}
  body.f .specwrap{padding:10px 12px 16px}
  body.f .spec .head{min-height:0;flex-wrap:nowrap;align-content:normal;padding:8px 12px}
  body.f .spec .head .mono{white-space:nowrap}
  body.f .spec .stage{padding-top:4px}
  body.f .rin.big{font-size:clamp(8.5px,2.5vw,12px)}
  body.f .strip{padding:8px 12px;flex-wrap:nowrap}
  body.f header.strip>span:first-child{white-space:nowrap;letter-spacing:0}
  body.f .dx{display:none}
}
@media(max-width:700px){
  body.f .stripr{display:none}
}
@media(prefers-reduced-motion:reduce){
  body.f .rin .sym,body.f .rin .eyes,body.f .rin .mouth{transition:none}
  body.f .bar.run i{animation:none;width:100%}
}
