html,body,#app{height:100%;min-height:0;overflow:hidden}
.life{height:100dvh;min-height:0;width:100%;max-width:none;margin:0;overflow:hidden;grid-template-rows:minmax(0,1fr) auto}
.top,.play{min-height:0}.top{padding:24px}.play{overflow:hidden;display:flex;flex-direction:column;gap:12px;padding:24px 30px}
#story{min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;padding:0 6px 8px 0;scrollbar-width:thin}
.page-head{position:sticky;top:0;background:var(--zc-book-paper);z-index:1;padding-bottom:12px}
.threads,.controls{flex:none;margin:0}.end{min-height:0;overflow:auto;overscroll-behavior:contain}.status{flex:none}
.chapter-number{align-self:flex-start;background:color-mix(in srgb,var(--zc-book-paper) 94%,transparent);padding:4px 6px;border-radius:2px}
@media(max-width:859px){.life{display:grid;grid-template-columns:1fr;grid-template-rows:clamp(126px,24dvh,180px) minmax(0,1fr) auto;max-width:none;margin:0}.top{grid-row:1;padding:14px 20px;min-height:0}.stage-row{margin-top:10px}.stage-row h1{font-size:30px}.path{padding-top:10px}.chapter-number{margin-top:5px}.play,.end{grid-row:2;padding:16px 20px;gap:10px}.status{grid-row:3;padding:5px 20px}.brand-row{min-height:14px}.controls{padding-top:2px}#beat-title{margin:14px 0 10px;font-size:27px}.beat-text{font-size:15px;margin-bottom:12px}.choice{min-height:50px}.threads .small-title{margin:0 0 5px}}