/* v32 — телефон: 3D сверху липкой «картинкой книжки», под ней вкладки и страницы (листаются
   свайпом по любому тексту), внизу — листалка «Назад · точки · Далі»; протокол — нижний лист. */
.top-lab { display: none; }
.book { padding: 10px 16px calc(84px + env(safe-area-inset-bottom)); }
.stage-col { position: sticky; top: var(--top); z-index: 6; background: var(--bg); padding-top: 8px; padding-bottom: 6px;
  margin: 0 -16px; padding-left: 16px; padding-right: 16px; }
.stage { height: 32svh; min-height: 200px; }
.stage-tabs { padding-top: 8px; }
.attr { margin-top: 4px; font-size: 10px; max-height: 2.8em; overflow: hidden; }
.pages { margin-top: 10px; }
.page { padding: 18px 16px 24px; }
h1.kt { font-size: 31px; }
.kt { font-size: 26px; }
.hero-row { align-items: flex-start; }
.balloon { width: 96px; height: 128px; }
.b-n { font-size: 46px; top: 14px; }
.lead { font-size: 16px; }
.ages { grid-template-columns: repeat(6, 1fr); gap: 6px; }
.age { font-size: 16px; }
.animals { grid-template-columns: repeat(3, 1fr); }
.pager { position: fixed; left: 0; right: 0; bottom: 0; z-index: 15; padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
  background: color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter: blur(10px); border-top: 2px dashed var(--line); }
.sheet { margin: auto 0 0; max-width: none; }
html:not(.rm) .sheet[open] { animation: up .3s ease both; }
@keyframes up { from { transform: translateY(40%); opacity: .4; } }
.stage { transition: height .3s ease; }
.book.compact .stage { height: 22svh; min-height: 160px; }
.book.compact .attr { display: none; }
html.rm .stage { transition: none; }
.book.compact .pill { left: auto; right: 8px; bottom: 8px; padding: 4px 10px; gap: 6px; box-shadow: 2px 2px 0 #2b2140; }
.book.compact .pill-t { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
