
@media(max-width:850px){
body:not(.result-page) #app{min-height:100svh;min-height:100dvh;display:flex;flex-direction:column}
body:not(.result-page) .topbar{width:100%;height:44px;flex:0 0 44px;padding:0 5%}
body:not(.result-page) .brand{font-size:12px;letter-spacing:1px;gap:6px}
body:not(.result-page) .brand-mark{font-size:24px}
body:not(.result-page) .brand small,body:not(.result-page) .header-actions>.eyebrow{display:none}
body:not(.result-page) .header-actions .quiet{font-size:11px;min-height:40px}
body:not(.result-page) .footer{width:90%;margin:auto 5% 0;padding:8px 0;display:block;font-size:10px;line-height:1.5}
body:not(.result-page) .footer span:first-child{display:none}body:not(.result-page) .chapter-layout{display:block;width:100%;max-width:620px;margin:8px auto;padding:0 5%}body:not(.result-page) .chapter-aside{position:static}body:not(.result-page) .chapter-visual{height:clamp(70px,14dvh,115px)}body:not(.result-page) .chapter-caption{left:12px;bottom:9px;display:flex;align-items:center;gap:10px}body:not(.result-page) .chapter-caption .num{font-size:25px}body:not(.result-page) .chapter-caption h2{font-size:15px;margin:0;letter-spacing:1px}body:not(.result-page) .companions{display:none}body:not(.result-page) .journey{margin:8px 0 11px}body:not(.result-page) .journey span{font-size:10px;padding-top:11px}body:not(.result-page) .journey span:before{width:5px;height:5px}body:not(.result-page) .chapter-main>.eyebrow{font-size:10px;letter-spacing:1.5px}body:not(.result-page) .chapter-main h1{font-size:clamp(18px,5vw,23px);line-height:1.35;margin:7px 0 0}body:not(.result-page) .chapter-text{font-size:13px;line-height:1.65;margin:8px 0 10px}body:not(.result-page) .question{font-size:14px;line-height:1.5;margin:0 0 8px}body:not(.result-page) .options{gap:7px}body:not(.result-page) .option{font-size:13px;line-height:1.5;min-height:48px;padding:9px 11px;gap:10px}body:not(.result-page) .letter{flex-basis:23px;height:23px;font-size:11px}body:not(.result-page) .chapter-controls{margin-top:8px;min-height:32px}body:not(.result-page) .chapter-controls .quiet{font-size:11px;padding:8px 0}body:not(.result-page) .response{font-size:13px;line-height:1.65;padding:12px 14px}body:not(.result-page) .response .eyebrow{font-size:10px}body:not(.result-page) .bridge{font-size:12px;margin-top:6px}body:not(.result-page) .auto-next{font-size:11px;margin-top:8px}body:not(.result-page) .intro{display:flex;flex-direction:column-reverse;width:100%;max-width:620px;min-height:0;padding:14px 5% 18px;gap:0;margin:auto}body:not(.result-page) .intro-art{width:100%;height:clamp(115px,24dvh,205px);border-radius:70px 70px 6px 6px}body:not(.result-page) .intro-copy{width:100%;padding:18px 0 0}body:not(.result-page) .intro-copy>.eyebrow{font-size:10px;letter-spacing:2px}body:not(.result-page) .intro h1{font-size:clamp(28px,8vw,38px);line-height:1.3;margin:12px 0}body:not(.result-page) .intro h1 br{display:none}body:not(.result-page) .intro p{font-size:13px;line-height:1.7;margin-bottom:16px}body:not(.result-page) .intro-meta{font-size:10px;margin-top:12px;gap:7px}body:not(.result-page) .intro-copy>.primary{width:100%}body:not(.result-page) .scene-label{font-size:10px;left:16px;bottom:12px}body:not(.result-page) .primary{min-height:44px;padding:11px 17px;font-size:14px}body:not(.result-page) .restart-intro{margin:8px 0 0;font-size:12px}body:not(.result-page) .narrative{width:100%;max-width:620px;margin:auto;padding:20px 5%}body:not(.result-page) .narrative>.eyebrow{font-size:11px}body:not(.result-page) .narrative h1{font-size:24px;line-height:1.4;margin:12px 0 16px}body:not(.result-page) .narrative p{font-size:14px;line-height:1.7;margin-bottom:12px}body:not(.result-page) .narrative .notice{font-size:12px}body:not(.result-page) .broadcast{font-size:14px;line-height:1.7;padding:14px 16px;margin:16px 0}
}
@media(max-width:850px) and (max-height:700px){body:not(.result-page) .chapter-visual{height:70px}body:not(.result-page) .journey{margin:6px 0 8px}body:not(.result-page) .chapter-layout{margin:6px auto}body:not(.result-page) .chapter-text{margin:6px 0 8px;line-height:1.55}body:not(.result-page) .option{padding:8px 10px;min-height:44px}body:not(.result-page) .options{gap:6px}body:not(.result-page) .intro-art{height:125px}body:not(.result-page) .narrative{padding-top:12px;padding-bottom:12px}body:not(.result-page) .narrative h1{font-size:22px;margin:9px 0 12px}body:not(.result-page) .narrative p,body:not(.result-page) .broadcast{font-size:13px;line-height:1.6}body:not(.result-page) .broadcast{padding:12px;margin:12px 0}
}

@media(max-width:850px){body:not(.result-page) .topbar{margin:0 auto}}
@media(max-width:850px) and (max-height:700px){body:not(.result-page) .chapter-visual{height:90px}}
