/* Плашка книги наверху чертога и слой читалки (07.10.2026, «Пилот: книга
   наверху чертога», слова Лираз: «у нас чат, наверху у нас книга, читалка»).
   Цвет — только из опор index.html: золото текстом — --gold-text, заливка
   кнопки — лесенка --gold → --gold2 под --on-gold, как у кнопки курса.
   Без :has(), color-mix(), dvh и сокращения inset: на бабушкином самсунге
   Chromium 99, и правило с ними отбрасывается целиком. Направление письма —
   логическими свойствами и разворотом стрелок под [dir=rtl]. Сам читальный
   лист — reader.*.css, у него своя бумага и своя ночь. */

/* ---------- плашка: над закрепом, под шапкой зала ---------- */
.hbk-plate{display:flex;align-items:stretch;flex:0 0 auto;width:100%;background:var(--glass2);border-bottom:1px solid var(--line);
  box-shadow:inset 3px 0 var(--gold);color:var(--ink)}
[dir="rtl"] .hbk-plate{box-shadow:inset -3px 0 var(--gold)}
.hbk-plate[hidden]{display:none!important}
.hbk-plate button:focus-visible{outline:2px solid var(--violet);outline-offset:-2px}
.hbk-open{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:12px;min-height:68px;padding:10px 6px 10px 14px;
  color:inherit;text-align:start;cursor:pointer}
[dir="rtl"] .hbk-open{padding:10px 14px 10px 6px}
.hbk-cover{flex:0 0 auto;width:44px;height:56px;display:grid;place-items:center;border-radius:4px 8px 8px 4px;
  background:var(--gold-fill);color:var(--on-gold);
  font-family:var(--disp);font-size:calc(24px * var(--fs,1));font-weight:700;line-height:1}
[dir="rtl"] .hbk-cover{border-radius:8px 4px 4px 8px}
.hbk-mid{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.hbk-eyebrow{font-size:calc(10.5px * var(--fs,1));font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hbk-title{font-family:var(--disp);font-size:calc(16px * var(--fs,1));font-weight:600;line-height:1.2;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.hbk-author{font-size:calc(12px * var(--fs,1));line-height:1.3;color:var(--ink-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hbk-resume{font-size:calc(12px * var(--fs,1));font-weight:700;line-height:1.3;color:var(--gold-text)}
.hbk-cta{flex:0 0 auto;display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;
  background:var(--gold-fill);color:var(--on-gold);font-size:calc(14px * var(--fs,1));font-weight:700}
.hbk-fold{flex:0 0 auto;width:48px;display:grid;place-items:center;color:var(--ink-faint);cursor:pointer}
.hbk-fold svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
.hbk-plate.is-folded .hbk-fold svg{transform:rotate(180deg)}

/* Свёрнутая плашка — одна строка: корешок, название, «Читать». Лента под ней — обычный чат. */
.hbk-plate.is-folded .hbk-open{min-height:44px;padding-top:4px;padding-bottom:4px;gap:10px}
.hbk-plate.is-folded .hbk-cover{width:24px;height:30px;font-size:calc(15px * var(--fs,1));border-radius:2px 5px 5px 2px}
[dir="rtl"] .hbk-plate.is-folded .hbk-cover{border-radius:5px 2px 2px 5px}
.hbk-plate.is-folded .hbk-eyebrow,.hbk-plate.is-folded .hbk-author,.hbk-plate.is-folded .hbk-resume{display:none}
.hbk-plate.is-folded .hbk-title{-webkit-line-clamp:1;font-size:calc(14px * var(--fs,1))}
.hbk-plate.is-folded .hbk-cta{min-height:32px;padding:0 14px;font-size:calc(12.5px * var(--fs,1))}
html[data-kind="desktop"] .hbk-plate{width:auto;margin:14px 34px 0;border:1px solid var(--line);border-radius:16px}

/* ---------- слой читалки: поверх чата, «назад» закрывает его ---------- */
#hlBookReader{position:fixed;top:0;right:0;bottom:0;left:0;z-index:96;display:none;flex-direction:column;background:var(--bg0)}
#hlBookReader.on{display:flex}
.hbk-host{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.hbk-host>.br{flex:1 1 auto;height:auto;min-height:0}
/* Кнопка «назад» — первая в верхней полосе читалки (читалка вставляет её сама),
   в её красках: бумага или ночь. */
.hbk-x{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0;
  border:1px solid var(--line);border-radius:10px;background:none;color:inherit;cursor:pointer}
.hbk-x svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
[dir="rtl"] .hbk-x svg{transform:scaleX(-1)}