/* Эталон стилей для страниц с одной книгой (book-1 … book-10) */
.book-page .book-hero-wrap { display: grid; grid-template-columns: 1fr auto; grid-template-rows: 420px auto; gap: 0 var(--space-60); max-width: 900px; margin: 0 auto var(--space-60); }
.book-page .book-hero-left { grid-row: 1; grid-column: 1; min-width: 0; min-height: 420px; display: flex; flex-direction: column; gap: var(--space-40); align-self: start; }
.book-page .book-hero-cta { margin-top: auto; padding-top: 69px; opacity: 0; transform: translateX(-24px); pointer-events: none; animation: bookTextAppear 0.9s ease-out 11.2s forwards; }
.book-page .book-hero-title { opacity: 0; transform: translateX(-24px); animation: bookTextAppear 0.9s ease-out 0.4s forwards; }
.book-page .book-hero-image { grid-row: 1; grid-column: 2; align-self: start; }
.book-page .content-with-sides > .side-links-left { align-self: start; margin-top: calc(408px + var(--space-60)); }
.book-page .content-with-sides > .side-links-right { align-self: start; margin-top: calc(408px + var(--space-60)); }
.book-page .book-description-panel { display: none; grid-row: 2; grid-column: 1 / -1; }
.book-page .book-description-panel.active { display: block; }
.book-page .book-description-below { margin-top: var(--space-40); opacity: 0; transform: translateX(-24px); animation: bookTextAppear 0.9s ease-out 0.7s forwards; }
.book-page .book-flip-card { width: 280px; aspect-ratio: 2/3; perspective: 1000px; position: relative; animation: bookImageSlide 1.2s ease-out forwards; }
.book-page .book-flip-inner { position: relative; width: 100%; height: 100%; min-height: 200px; transition: transform 2.5s ease; transform-style: preserve-3d; }
.book-page .book-flip-card.flipped .book-flip-inner { transform: rotateY(180deg); }
.book-page .book-flip-front, .book-page .book-flip-back { position: absolute; inset: 0; backface-visibility: hidden; border-radius: 8px; overflow: hidden; }
.book-page .book-flip-back { transform: rotateY(180deg); background: #e8e4dc; }
.book-page .book-cover-wrap { max-width: 100%; height: 100%; border-radius: 8px; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,0.15); }
.book-page .book-flip-front .book-cover-wrap { animation: none; transform: none; }
.book-page .book-cover-wrap img { width: 100%; height: 100%; display: block; object-fit: cover; }
@keyframes bookImageSlide { from { transform: translateX(-50%); } to { transform: translateX(0); } }
@keyframes bookTextAppear { to { opacity: 1; transform: translateX(0); pointer-events: auto; } }
.book-page .page-content { max-width: 720px; margin: 0 auto; text-align: left; }
.book-page .page-content .page-title { margin: 0 0 var(--space-20); font-size: clamp(24px, 4vw, 36px); font-weight: 600; color: var(--color-text); text-transform: uppercase; }
.book-page .book-author { margin: 0 0 var(--space-40); color: var(--color-text-light); font-size: 1rem; }
.book-page .book-author:has(+ .book-series) { margin-bottom: var(--space-20); }
.book-page .book-series { margin: 0 0 var(--space-40); color: var(--color-text-light); font-size: 0.95rem; }
.book-page .book-description { margin: 0 0 var(--space-40); color: var(--color-text-light); line-height: 1.6; }
.book-page .book-review { margin-top: var(--space-60); }
.book-page .book-review:first-child { margin-top: 0; }
.book-page .book-video-wrap { max-width: 720px; }
.book-page .book-video-embed { position: relative; width: 100%; max-width: 640px; margin: 0 0 var(--space-40); border-radius: 8px; overflow: hidden; box-shadow: 0 4px 20px rgba(0,0,0,0.12); }
.book-page .book-video-embed iframe { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; }
.book-page .book-description-heading { margin: 0 0 var(--space-40); font-size: 1.25rem; font-weight: 600; color: var(--color-text); }
.book-page .book-description-list { margin: 0 0 var(--space-40); padding-left: 1.25rem; color: var(--color-text-light); line-height: 1.6; }
.book-page .book-description-list li { margin-bottom: 0.35rem; }
.book-page .book-status { margin-top: var(--space-60); padding: var(--space-40) 0; background: #f5f2eb; border-radius: 8px; }
.book-page .book-status-text { contain: layout; }
.book-page .book-format-buttons { margin-top: var(--space-60); }
.book-page .book-format-buttons p {
  margin: 0;
  width: 100%;
  display: grid;
  grid-template-columns: max-content 1fr max-content;
  align-items: center;
  column-gap: calc(var(--space-40) * 2);
  row-gap: var(--space-40);
}
/* Важно: search.js оборачивает заглушки-ссылки в .book-format-btn-wrap, поэтому выравниваем прямых детей <p> */
.book-page .book-format-buttons p > :nth-child(1) { grid-column: 1; justify-self: start; }
.book-page .book-format-buttons p > :nth-child(2) { grid-column: 2; justify-self: center; }
.book-page .book-format-buttons p > :nth-child(3) { grid-column: 3; justify-self: end; }
.book-page .book-format-buttons .btn.btn-accent {
  /* Не ломаем слова на буквы на узких ширинах */
  word-break: normal;
  overflow-wrap: normal;
  white-space: normal;
}
.book-page .book-status-text p { margin: 0; color: #1a237e; white-space: nowrap; }
.book-page .book-status .typewriter-text { display: inline-block; overflow: hidden; width: 0; white-space: nowrap; }
.book-page .book-status .typewriter-text.in-view { animation: typewriter 2.8s steps(var(--typewriter-ch, 48), end) forwards; }
@keyframes typewriter { to { width: calc(var(--typewriter-ch, 48) * 1ch); } }
:root { --space-20: 0.44rem; --space-40: 1rem; --space-60: 2.25rem; --color-text: #1e1e1e; --color-text-light: #181818; }
/* Планшеты и телефоны: одна колонка, без отступа сайдбаров под десктопный hero */
@media (max-width: 1024px) {
  /*
   * Важно: на десктопе .book-description-panel стоит в grid-row: 2 вместе с рядом под двухколоночный hero.
   * В одной колонке .book-hero-left тоже получает row 2 — без явного row 3 для панели она остаётся в row 2
   * и накладывается на заголовок/кнопку «К другим книгам».
   */
  .book-page .book-hero-wrap {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    max-width: 100%;
    row-gap: var(--space-40);
  }
  .book-page .book-hero-image { grid-row: 1; grid-column: 1; justify-self: center; }
  .book-page .book-hero-left {
    grid-row: 2;
    grid-column: 1;
    min-height: 0;
    align-self: stretch;
  }
  .book-page .book-hero-cta {
    margin-top: 1rem;
    padding-top: 0;
  }
  .book-page .book-description-panel {
    grid-row: 3;
    grid-column: 1 / -1;
  }
  .book-page .content-with-sides > .side-links-left,
  .book-page .content-with-sides > .side-links-right {
    margin-top: 0;
  }
  .book-page .book-status-text p { white-space: normal; }
  /* inline padding на <main> перекрывает общий padding-bottom; запас под «Назад»/«Наверх»/музыку */
  body.book-page .page-main {
    padding-bottom: max(5.5rem, calc(env(safe-area-inset-bottom, 0px) + 6.5rem)) !important;
  }
}
@media (max-width: 768px) {
  .book-page .page-content,
  .book-page .page-content p,
  .book-page .page-content li,
  .book-page .book-description {
    text-align: left;
  }
}
@media (max-width: 600px) {
  /* На телефонах показываем форматы одной колонкой, чтобы ничего не уезжало и не "становилось столбиком" */
  .book-page .book-format-buttons p {
    grid-template-columns: 1fr;
    row-gap: 12px;
    column-gap: 12px;
  }
  .book-page .book-format-buttons p > * {
    grid-column: 1 !important;
    justify-self: stretch !important;
    width: 100%;
    max-width: 100%;
  }
  .book-page .book-format-buttons .book-format-btn-wrap { display: block; width: 100%; }
  .book-page .book-format-buttons .paper-menu { display: block; width: 100%; }
  .book-page .book-format-buttons .paper-menu .paper-main { width: 100%; }
}
@media (max-width: 640px) {
  .book-page .book-flip-card { animation: bookImageSlideMobile 1s ease-out forwards; }
  @keyframes bookImageSlideMobile { from { transform: translateX(-50%); } to { transform: translateX(0); } }
}