body{height:100vh;height:var(--screen,100vh);display:flex;flex-direction:column;background:#f8f9ff}
.preview{padding:3px 10px;letter-spacing:.035em;font-size:10px}
header,footer,main{width:100%;max-width:600px;margin:0 auto}
header{height:auto;padding:4px 16px;flex:none}.wordmark{font-size:11px;letter-spacing:.05em}
main{display:flex;flex:1;min-height:0;padding:0 8px}
.hero{width:100%;max-width:none;min-height:0;margin:0;padding:10px 14px;display:flex;flex-direction:column;gap:5px;align-items:stretch;border-radius:20px}
.hero-copy{text-align:center}.hero-copy h1{font-size:clamp(21px,5.9vw,34px);letter-spacing:-.04em;line-height:1.05;margin:4px auto}
.hero-copy .eyebrow{font-size:10px;letter-spacing:.07em}
.lead{margin:4px auto;font-size:13px;line-height:1.25}.lead br{display:none}
.pills,.watch-hint,.video-caption{display:none}
.concept{font-size:10px;line-height:1.25;margin:2px auto}
.video-column{display:flex;flex:1;min-height:0;width:100%;max-width:none;align-items:center;justify-content:center}
.video-shell{height:100%;max-width:100%;aspect-ratio:9/16;border-radius:14px;padding:3px;box-shadow:0 3px 12px #29245529}
.video-shell video{height:100%;width:100%;object-fit:contain;border-radius:11px}
.skip{margin:0;padding:4px;min-height:30px;font-size:12px;line-height:1.2}
#downloadButton{flex:none;padding:10px 14px;min-height:44px;border-radius:12px}
footer{flex:none;padding:3px 12px;padding-bottom:max(3px,env(safe-area-inset-bottom));margin:0 auto;align-items:center;gap:6px;font-size:9px}.legal{font-size:10px;padding:6px 3px}
#details{position:fixed;padding:18px;max-height:85vh;overflow:auto}#details .close{position:sticky;display:block;top:0;margin-inline-start:auto;z-index:2}#details .summary{padding:0}#details .section-heading{margin-bottom:14px}
@media(max-height:580px){.hero{padding:5px 10px;gap:2px}.hero-copy h1{font-size:21px}.lead{font-size:12px}.concept{font-size:10px}.sound-toggle{padding:5px}.hero-copy h1 br{display:none}}
.video-shell .video-action.replay{position:absolute;top:50%;left:50%;bottom:auto;right:auto;transform:translate(-50%,-50%);width:58px;height:58px;padding:0;border:1px solid #ffffffab;border-radius:50%;background:#111a32dc;box-shadow:0 3px 14px #0004}
.video-action.replay::before{content:"";position:absolute;inset:14px;background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10a8 8 0 1 1 1 7M4 4v6h6'/%3E%3C/svg%3E")}

footer{justify-content:flex-end}
