/* v10 «Дом» (index.html) — the old Сегодня + Библиотека in one screen. Everything is scoped under .page-home.
   Prototype: design_handoff_shanyrak_v10/app «Shanyrak v13 Akui.dc.html», isHome + the qs / pick / people sheets. */
.page-home{background:var(--paper)}
.page-home .home{--hm-pad:var(--page-x);max-width:var(--page-max);margin:0 auto;padding:20px var(--hm-pad) 56px;display:flex;flex-direction:column;gap:32px}
@media (min-width:1000px){.page-home .home{padding-top:48px}}
.hm-body{display:flex;flex-direction:column;gap:32px;min-width:0}

/* ── greeting ── */
.hm-head{display:flex;flex-direction:column;gap:4px}
.hm-kicker{font:italic 400 17px/1.3 var(--serif);color:var(--ochre-ink);margin:0}
.hm-hello{font:500 var(--fs-h1)/1.1 var(--serif);color:var(--ink);margin:0;letter-spacing:0}
.hm-head .pending-pill{margin-top:10px;align-self:flex-start}
.hm-hello-sub{font:400 18px/1.45 var(--sans);color:var(--ink-3);margin:4px 0 0;max-width:40ch}
/* spec 05 §1: the demo guest's «Пример» chip on the date line (32 px, 1 px #CFC6B8 outline, PT Sans 700 14; the tap
   area is 48 px through ::after) */
.hm-dateline{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:32px}
.hm-demo-chip{position:relative;flex:none;height:32px;padding:0 12px;border:0;border-radius:16px;background:transparent;box-shadow:inset 0 0 0 1px var(--dots);
  font:700 14px/1 var(--sans);color:var(--muted);cursor:pointer}
.hm-demo-chip::after{content:"";position:absolute;inset:-8px -6px}
.hm-demo-chip:hover{box-shadow:inset 0 0 0 1px var(--muted);color:var(--ink)}
/* spec 05 §7: the gold «Как пользоваться приложением» button right under the title → help.html */
.hm-how{margin-top:10px;min-height:58px;max-width:620px;padding:10px 16px;border-radius:16px;background:#FBF4E4;box-shadow:inset 0 0 0 1.5px #E3CF9F;
  display:flex;align-items:center;gap:12px;text-align:left;text-decoration:none;color:var(--ink);box-sizing:border-box}
.hm-how[hidden]{display:none}
.hm-how:hover{color:var(--ink);box-shadow:inset 0 0 0 1.5px #C9A45C}
.hm-how-q{width:34px;height:34px;flex:none;border-radius:50%;background:#7A5A1E;display:grid;place-items:center;font:700 19px/1 var(--serif);color:#FFF8EC}
.hm-how-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.hm-how-h{font:700 18px/1.2 var(--sans)}
.hm-how-s{font:400 17px/1.2 var(--sans);color:var(--muted)}
.hm-how .chev{flex:none;color:#7A5A1E}

/* ── «Сегодня · книга» hero ── */
.hm-hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:clamp(20px,3vw,48px);align-items:center}
.hm-cover{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;padding:28px 22px 28px 36px;border-radius:6px 18px 18px 6px;
  background-color:var(--cv,var(--cv-night));background-image:var(--cloth-tex);text-decoration:none;color:var(--on-dark);
  box-shadow:0 24px 40px -24px rgba(20,30,20,.8),inset 14px 0 0 rgba(0,0,0,.22);transition:transform var(--d-ui,200ms) var(--ease-out,ease)}
.hm-cover::before{content:"";position:absolute;inset:10px 10px 10px 24px;border:1px solid rgba(201,164,92,.55);border-radius:3px 10px 10px 3px;pointer-events:none}
.hm-cover:hover{color:var(--on-dark);transform:translateY(-3px)}
.hm-cover-lbl{font:700 15px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--on-dark-3);position:relative}
.hm-cover .ring{position:relative}
.hm-cover .ring-face{font-family:var(--serif);font-weight:500;color:var(--gold-2)}
.hm-cover-name{font:500 clamp(28px,2.6vw,34px)/1.05 var(--serif);color:var(--on-dark);text-align:center;position:relative;text-wrap:balance}
.hm-cover-meta{font:400 17px/1.3 var(--sans);color:var(--on-dark-2);text-align:center;position:relative}
.hm-cover-wait::before{content:"\00a0· "}
/* spec 05 §5: the 5×8 chapter bar next to «16 из 40 страниц» (6 px, chapter colours, empty --ring-empty) */
.hm-bar{display:flex;gap:4px;width:100%;max-width:340px}
.hm-bar-ch{flex:1;min-width:0;display:flex;gap:1.5px}
.hm-bar-ch i{flex:1;min-width:0;height:6px;background:var(--ring-empty)}
.hm-bar-ch i.on{background:var(--c)}
/* «Открыть книгу ›» inside the cover (the whole cover is the link) */
.hm-cover-go{position:relative;align-self:stretch;min-height:48px;margin-top:4px;display:flex;align-items:center;justify-content:center;gap:6px;border-top:1px solid var(--gold-line);font:700 17px/1 var(--sans);color:var(--on-dark-3);white-space:nowrap}
.hm-cover-go .ico{flex:none}

.hm-next{display:flex;flex-direction:column;gap:14px;min-width:0}
.hm-next-lbl{font:italic 400 17px/1.3 var(--serif);color:var(--ochre-ink);margin:0}
.hm-next-q{font:500 clamp(24px,2.5vw,36px)/1.25 var(--serif);color:var(--ink);margin:0;text-wrap:pretty;letter-spacing:0}
.hm-next-hint{font:400 17px/1.45 var(--sans);color:var(--ink-3);margin:0}
.hm-cta{margin-top:8px;min-height:64px;border-radius:14px;font-size:20px;width:100%}
.hm-cta.btn--record{border-color:var(--clay)}
.hm-cta.btn--record::before{width:16px;height:16px}
.hm-pair{display:grid;grid-template-columns:1fr 1fr}
.hm-pair--one{grid-template-columns:1fr}
.hm-pair>*{min-height:52px;display:flex;align-items:center;justify-content:center;padding:0 8px;border:0;background:none;font:700 18px/1.2 var(--sans);color:var(--cover);text-align:center;text-decoration:none;border-radius:10px;cursor:pointer}
.hm-pair>*+*{border-left:1px solid var(--line-2);border-radius:0}
.hm-pair>*:hover{background:rgba(35,32,28,.04);color:var(--cover)}
.hm-open{align-self:center;min-height:48px;display:inline-flex;align-items:center;font:400 17px/1 var(--sans);color:var(--ink-3);text-decoration:none}
.hm-open span{box-shadow:inset 0 -1px 0 var(--line-btn);padding-bottom:3px}
.hm-open:hover{color:var(--ink)}

/* ── «Вопросы от близких»: one row card ── */
.hm-rq{display:flex;align-items:center;gap:16px;width:100%;padding:18px 20px;border:0;border-radius:16px;background:var(--page);box-shadow:0 1px 0 var(--line);text-align:left;color:var(--ink);cursor:pointer;font:inherit}
.hm-rq:hover{box-shadow:0 1px 0 var(--line),0 8px 20px -14px rgba(60,40,20,.35)}
.hm-rq-n{flex:none;width:52px;height:52px;border-radius:50%;background:var(--cover);color:var(--on-dark);display:grid;place-items:center;font:700 21px/1 var(--sans)}
.hm-rq-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.hm-rq-h{font:700 19px/1.2 var(--sans)}
.hm-rq-q{font:italic 400 17px/1.35 var(--serif);color:var(--ink-3)}
.hm-rq .chev{flex:none;color:var(--ink-3)}
.hm-norq{padding:18px 20px;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);font:400 17px/1.4 var(--sans);color:var(--ink-3);margin:0}

/* ── «Книги семьи» shelf ── */
.hm-sec{display:flex;flex-direction:column;gap:18px;scroll-margin-top:84px}
.hm-sec-h{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hm-h2{font:500 clamp(26px,2.4vw,32px)/1.1 var(--serif);margin:0;letter-spacing:0}
.hm-h3{font:500 24px/1.1 var(--serif);margin:0;letter-spacing:0}
.hm-sec-cap{font:400 17px/1.3 var(--sans);color:var(--ink-3);margin:0}
.hm-sec-h--start{justify-content:flex-start;align-items:baseline;gap:6px 14px}
.page-home .hm-seg{display:flex;gap:4px;padding:4px;border-radius:14px;background:var(--linen)}
.page-home .hm-seg button{min-height:48px;padding:0 16px;border:0;border-radius:10px;background:none;font:700 17px/1 var(--sans);color:var(--ink-3);cursor:pointer;white-space:nowrap}
.page-home .hm-seg button[aria-pressed="true"]{background:var(--page);color:var(--ink);box-shadow:0 1px 2px rgba(60,40,20,.2)}
/* v11: Дом shows one row + «Все N ›» (44 px, README 2a/3a); the wrapping grid lives in the «Все книги» view */
.hm-sec--shelf{gap:12px}
.hm-sec--shelf .hm-sec-h{align-items:baseline;gap:4px 12px}
.hm-all-link{min-height:44px;display:inline-flex;align-items:center;font:700 17px/1 var(--sans);color:var(--cover);text-decoration:none;white-space:nowrap}
.hm-all-link:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.hm-shelf--grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:26px 18px;padding-top:10px}
/* 8 per row only where a cover is still ≥ 110 px wide (1440 with the sidebar); narrower desktops fill by width */
@media (min-width:1400px){.hm-shelf--grid{grid-template-columns:repeat(8,minmax(0,1fr))}}
.hm-book{display:flex;flex-direction:column;gap:9px;text-decoration:none;color:var(--ink);min-width:0}
.hm-book:hover{color:var(--ink)}
.hm-book .book{--w:100%;width:100%}
.hm-book .shelf-meta{display:flex;justify-content:flex-start;gap:8px;font:400 17px/1 var(--sans);color:var(--ink-3);white-space:nowrap}
.hm-book .hm-ready{font-weight:700;color:#4E6A45}
/* cover: one line, first name only (shrunk to fit by fitCoverNames in index.html) */
.hm-book .book-cover{padding:10px 6px 10px 14px}
.hm-book .book-name{font-size:17px;white-space:nowrap;max-width:100%}
.hm-book .book-cover .ring{margin-top:6%}
.hm-book .book-cover .ring svg{width:100%;height:auto}
.hm-book.is-top .book{transform:translateY(-10px)}
.hm-book.is-top .book-cover{box-shadow:0 0 0 3px var(--paper),0 0 0 5px var(--ochre),0 16px 24px -16px rgba(30,20,10,.75)}
.hm-book.is-top .shelf-meta{color:var(--ochre-ink)}
.hm-book .book{transition:transform var(--d-slow,250ms) var(--ease-out,ease)}

/* spec 05 §6: the Дом shelf is one row that scrolls sideways at every width — touch swipe, mouse drag + wheel (index.html
   wireShelf), snap with proximity, no scrollbar. Phone: bleeds to the screen edges; today's book keeps the ochre ring. */
.hm-shelf--row{display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;margin:0 calc(-1 * var(--hm-pad));padding:10px var(--hm-pad) 6px;
  scroll-padding-inline:var(--hm-pad);scroll-snap-type:x proximity;scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab}
.hm-shelf--row::-webkit-scrollbar{display:none}
.hm-shelf--row.is-drag{cursor:grabbing;scroll-snap-type:none;user-select:none}
.hm-shelf--row.is-drag .hm-book{pointer-events:none}
.hm-shelf--row .hm-book{flex:none;width:100px;gap:8px;scroll-snap-align:start}
.hm-shelf--row .book-cover{padding:9px 5px 9px 12px;gap:8%}
.hm-shelf--row .book-name{font-size:15px}
.hm-shelf--row .hm-book.is-top .book{transform:none}
/* desktop: wider covers, the row stays inside the column (a little room for today's ochre ring and lift) */
@media (min-width:1000px){
  .hm-shelf--row{gap:20px;margin:0 -8px;padding:14px 8px 8px;scroll-padding-inline:8px}
  .hm-shelf--row .hm-book{width:128px}
  .hm-shelf--row .book-cover{padding:10px 6px 10px 14px}
  .hm-shelf--row .hm-book.is-top .book{transform:translateY(-8px)}
}

/* ── «Ещё без книги» + «Книги родни»: one row card each, side by side on desktop (README 2a/3a) ── */
.hm-rows{display:flex;flex-direction:column;gap:12px}
@media (min-width:1000px){.hm-rows{display:grid;grid-template-columns:1fr 1fr;gap:16px}}
.hm-rows>div>.hm-row{height:100%}
.hm-row{display:flex;align-items:center;gap:14px;width:100%;min-height:68px;padding:14px 16px;border:0;border-radius:16px;background:none;
  box-shadow:inset 0 0 0 1px var(--line);text-align:left;color:var(--ink);text-decoration:none;cursor:pointer;font:inherit;box-sizing:border-box}
.hm-row:hover{box-shadow:inset 0 0 0 1px var(--line-btn);color:var(--ink)}
.hm-row-stack{flex:none;display:flex;padding-right:6px}
.hm-row-mono{flex:none;width:40px;height:40px;border-radius:50%;background:var(--linen);box-shadow:0 0 0 3px var(--paper);display:grid;place-items:center;font:500 15px/1 var(--serif);color:var(--ink-3)}
.hm-row-mono .ico{width:20px;height:20px}
.hm-row-stack .hm-row-mono{margin-right:-6px;box-shadow:0 0 0 3px var(--paper)}
/* review r1: overlapping discs carry one initial each (index.html) — two letters were clipped by the next disc */
.hm-row-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.hm-row-h{font:700 18px/1.2 var(--sans)}
.hm-row-s{font:400 16px/1.3 var(--sans);color:var(--ink-3)}
.hm-row .chev{flex:none;color:var(--ink-3)}
.hm-row-kin{flex:none;width:40px;height:40px;border-radius:50%;background-color:var(--cv-sky);background-image:var(--cloth-tex);color:var(--gold-2);display:grid;place-items:center;font:500 17px/1 var(--serif)}
/* the no-book sheet: the old chips */
.hm-sh-sub{font:400 17px/1.4 var(--sans);color:var(--ink-3);margin:0 0 16px}
.hm-chips{display:flex;flex-wrap:wrap;gap:10px}
.hm-chip{white-space:nowrap;min-height:52px;padding:0 18px 0 8px;border:0;border-radius:26px;background:var(--page);box-shadow:inset 0 0 0 1px var(--line);display:inline-flex;align-items:center;gap:10px;font:700 17px/1.1 var(--sans);color:var(--ink);text-decoration:none;cursor:pointer}
.hm-chip:hover{box-shadow:inset 0 0 0 1px var(--line-btn);color:var(--ink)}
.hm-chip-mono{flex:none;width:38px;height:38px;border-radius:50%;background:var(--linen);display:grid;place-items:center;font:500 15px/1 var(--serif);color:var(--ink-3)}
.hm-chip-mono .ico{width:20px;height:20px}

/* ── «Все книги» (index.html#books-all): back to Дом, the title, the filter, the full shelf ── */
.hm-all{display:flex;flex-direction:column;gap:18px}
.hm-back{align-self:flex-start;min-height:48px;margin-left:-8px;padding:0 8px;display:inline-flex;align-items:center;gap:4px;font:700 17px/1 var(--sans);color:var(--cover);text-decoration:none;border-radius:10px}
.hm-back:hover{color:var(--ink);background:rgba(35,32,28,.04)}
.hm-all-head{display:flex;flex-direction:column;gap:6px}
.hm-all-h{font:500 var(--fs-h1)/1.1 var(--serif);color:var(--ink);margin:0;letter-spacing:0}
.hm-all .hm-seg{align-self:flex-start}

/* ── Родня + Архив (moved from library.html) ── */
.hm-list{display:flex;flex-direction:column;border-radius:16px;background:var(--page);box-shadow:inset 0 0 0 1px var(--line);max-width:760px}
.hm-list>.row{padding:12px 16px;border-bottom:1px solid var(--sand)}
.hm-list>.row:last-child{border-bottom:0}
/* the kin sheet (several linked families) reuses these rows */
.sheet .hm-list .hm-row-kin{width:52px;height:52px;font-size:20px}

/* ── first use (spec 04, Turn 4): the 3-step guide, the «Книга для кого» sheet, «Всё готово» ── */
.hm-guide-wrap{display:flex;flex-direction:column;gap:12px;max-width:620px}
.hm-guide{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.hm-gs{display:flex;gap:14px;padding:12px 18px;border-radius:16px}
.hm-gs.is-now{padding:18px;background:var(--page);box-shadow:0 1px 0 var(--line),0 16px 30px -24px rgba(60,40,20,.5)}
.hm-gs-n{width:40px;height:40px;flex:none;border-radius:50%;display:grid;place-items:center;font:500 19px/1 var(--serif);
  box-shadow:inset 0 0 0 1.5px var(--dots);color:var(--ink-4)}
.hm-gs.is-now .hm-gs-n{background:var(--cloth);color:var(--on-cloth);box-shadow:none}
.hm-gs.is-done .hm-gs-n{background:var(--ch-3);color:#fff;box-shadow:none}
.hm-gs-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px;padding-top:6px}
.hm-gs-h{font:400 21px/1.2 var(--serif);color:var(--ink-3)}
.hm-gs.is-now .hm-gs-h{font-weight:500;color:var(--ink)}
.hm-gs.is-done .hm-gs-t{padding-top:9px}
.hm-gs.is-done .hm-gs-h{font-size:19px;color:var(--ink)}
.hm-gs-p{font:400 17px/1.4 var(--sans);color:var(--ink-4);text-wrap:pretty}
.hm-gs.is-now .hm-gs-p{color:var(--ink-2)}
.hm-gs-go{margin-top:12px;min-height:56px;border-radius:14px;font-size:19px}
.hm-gs-later{align-self:center;margin-top:4px;font-size:17px}
/* narrow phones: the step's button takes the card's full width (one line for «Отправить приглашение» / KK) */
@media (max-width:479px){.hm-gs-go{margin-left:-54px;width:calc(100% + 54px);padding:0 14px}}
/* the started book: the shelf's cover component, small (the name is beside it) */
.hm-gbook{display:flex;align-items:center;gap:14px;padding:6px 0 8px;text-decoration:none;color:var(--ink)}
.hm-gbook:hover{color:var(--ink)}
.hm-gbook .book{--w:64px;width:64px}
.hm-gbook .book-cover{padding:8px 4px 8px 10px}
.hm-gbook .book-name{display:none}
.hm-gbook-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.hm-gbook-n{font:500 21px/1.15 var(--serif)}
.hm-gbook-m{font:400 17px/1.3 var(--sans);color:var(--ink-3)}
.hm-gbook .chev{flex:none;color:var(--ink-3)}
.hm-seeq{min-height:56px;border-radius:14px;font-size:18px;border:0;background:none;box-shadow:inset 0 0 0 1.5px var(--dots)}
.hm-seeq:hover{box-shadow:inset 0 0 0 1.5px var(--muted)}
.hm-near{margin-top:6px;padding:18px;border-radius:16px;background:var(--page);box-shadow:inset 0 0 0 1.5px var(--ch-2);display:flex;flex-direction:column;gap:10px}
.hm-near-head{display:flex;align-items:center;gap:12px}
.hm-near-ico{width:40px;height:40px;flex:none;border-radius:50%;background:var(--ch-2);color:#fff;display:grid;place-items:center}
.hm-near-h{font:500 20px/1.2 var(--serif);margin:0}
.hm-near-p{font:400 17px/1.4 var(--sans);color:var(--ink-2);margin:0;text-wrap:pretty}
/* «Книга для кого» sheet: 2×2 tiles, «Кто-то другой», the people already in the шежіре, the name */
.hm-who{display:flex;flex-direction:column;gap:14px}
.hm-who-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hm-who-tile{position:relative;min-height:72px;padding:0 18px;border:0;border-radius:14px;background:var(--page);box-shadow:inset 0 0 0 1px var(--line);
  display:flex;align-items:center;text-align:left;font:400 20px/1.15 var(--sans);color:var(--ink-2);cursor:pointer}
.hm-who-tile[aria-pressed="true"]{box-shadow:inset 0 0 0 2px #7A5A1E;font-weight:700;color:var(--ink)}
.hm-who-ok{position:absolute;top:10px;right:10px;width:24px;height:24px;border-radius:50%;background:#7A5A1E;color:var(--page);display:none;place-items:center}
.hm-who-tile[aria-pressed="true"] .hm-who-ok{display:grid}
.hm-who-other{align-self:flex-start;min-height:48px;padding:0;border:0;background:none;font:400 17px/1.3 var(--sans);color:var(--ink-3);cursor:pointer;
  text-decoration:underline;text-decoration-color:var(--dots);text-underline-offset:4px}
.hm-who-other[aria-pressed="true"]{color:var(--ink);font-weight:700;text-decoration-color:#7A5A1E}
.hm-who-k{font:700 17px/1.2 var(--sans);margin:4px 0 -4px}
.hm-who .hm-chip[aria-pressed="true"]{box-shadow:inset 0 0 0 2px #7A5A1E}
.hm-who-in{min-height:58px;padding:0 18px;border:0;border-radius:12px;background:var(--page);box-shadow:inset 0 0 0 1.5px var(--line-2);
  font:400 21px/1.2 var(--sans);color:var(--ink);width:100%;box-sizing:border-box}
.hm-who-in:focus{outline:none;box-shadow:inset 0 0 0 2px #7A5A1E}
.hm-who-go{min-height:60px;margin-top:6px;border-radius:14px;font-size:20px}
.hm-who-go:disabled{opacity:.55;cursor:default}
/* small sheets (the demo «Это пример», the sample) */
.hm-sh-p{font:400 18px/1.45 var(--sans);color:var(--ink-2);margin:0 0 18px}
.hm-sh-go{min-height:60px;margin-top:18px;border-radius:16px;font-size:20px}

/* ── sheets (qs / pick / people) ── */
.hm-sh-title{font:500 26px/1.1 var(--serif);margin:0;flex:1}
.hm-rq-item{padding:16px 0;border-bottom:1px dotted var(--line-btn);display:flex;flex-direction:column;gap:8px}
.hm-rq-item:last-child{border-bottom:0}
.hm-rq-who{font:700 15px/1.3 var(--sans);color:var(--ink-3);margin:0}
.hm-rq-text{font:500 21px/1.3 var(--serif);margin:0}
.hm-rq-acts{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center}
.hm-rq-acts .btn--record{min-height:52px;padding:0 20px;border-radius:14px;font-size:17px;border-color:var(--clay)}
.hm-rq-acts .btn--record::before{width:12px;height:12px}
.hm-quiet{min-height:48px;padding:0 4px;border:0;background:none;font:700 16px/1.2 var(--sans);color:var(--ink-3);cursor:pointer}
.hm-quiet:hover{color:var(--ink)}
.hm-pick{display:flex;flex-direction:column;gap:16px}
.hm-pick-k{font:italic 400 17px/1.2 var(--serif);color:var(--ochre-ink);margin:0}
.hm-pick-q{font:500 23px/1.3 var(--serif);margin:0}
.hm-pick .btn--record{min-height:58px;border-radius:14px;font-size:18px;border-color:var(--clay)}
.hm-pick-h{font:700 17px/1.2 var(--sans);padding-top:8px;margin:0}
.hm-alts{display:flex;flex-direction:column;border-radius:14px;background:var(--page);box-shadow:inset 0 0 0 1px var(--line)}
.hm-alt{min-height:60px;padding:10px 16px;display:flex;align-items:center;gap:12px;border:0;border-bottom:1px solid var(--sand);background:none;text-align:left;color:var(--ink);cursor:pointer;font:inherit}
.hm-alt:last-child{border-bottom:0}
.hm-alt-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.hm-alt-q{font:400 18px/1.35 var(--serif)}
.hm-alt-s{font:400 15px/1.2 var(--sans);color:var(--ink-3)}
.hm-alt .chev{flex:none;color:var(--ink-3)}
.hm-own{min-height:96px;border-radius:14px;border:0;box-shadow:inset 0 0 0 1px var(--line-2);background:var(--page);padding:14px 16px;font:400 19px/1.45 var(--serif);color:var(--ink);resize:vertical;width:100%;box-sizing:border-box}
.hm-own:focus{outline:3px solid var(--ochre);outline-offset:2px}
.hm-pick .btn--dark{min-height:56px;border-radius:14px;font-size:18px;border-color:var(--cover)}
.hm-pick .btn--dark:disabled{opacity:.55;cursor:default}
.hm-people{display:flex;flex-direction:column}
.hm-person{min-height:72px;padding:8px 10px;border:0;border-radius:14px;display:flex;align-items:center;gap:14px;background:none;text-align:left;color:var(--ink);cursor:pointer;font:inherit;width:100%}
.hm-person[aria-pressed="true"]{background:var(--sand)}
.hm-person:hover{background:rgba(35,32,28,.04)}
.hm-person[aria-pressed="true"]:hover{background:var(--sand)}
.hm-person-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.hm-person-n{font:500 19px/1.2 var(--serif)}
.hm-person-m{font:400 15px/1.25 var(--sans);color:var(--ink-3)}
.hm-person .ring{flex:none}

@media (prefers-reduced-motion:reduce){
  .hm-cover,.hm-book .book{transition:none}
  .hm-cover:hover{transform:none}
  .hm-shelf--row{scroll-behavior:auto}
}
.hm-person .ring-face{color:var(--gold-2);font-family:var(--serif)}

/* cover text block (name + meta); on phones the cover is compact — ring beside the name — so the next question and the
   red button fit on the first screen (Sanzh review 2026-09-25) */
.hm-cover-txt{display:flex;flex-direction:column;align-items:center;gap:12px;position:relative;min-width:0}
@media (max-width:599px){
  .hm-cover{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"lbl lbl" "ring txt";align-items:center;gap:14px 18px;padding:20px 20px 22px 34px}
  .hm-cover{grid-template-areas:"ring txt" "go go";gap:14px 16px;padding:16px 14px 0 30px}
  .hm-cover-lbl{display:none}
  .hm-cover .ring{grid-area:ring}
  .hm-cover-txt{grid-area:txt;align-items:flex-start;gap:6px}
  .hm-cover-name{font-size:23px;text-align:left}
  .hm-cover-meta{display:flex;flex-direction:column;gap:2px;font-size:17px;text-align:left}
  .hm-cover-wait{display:block}
  .hm-cover-wait::before{content:none}
  .hm-cover-wait::first-letter{text-transform:uppercase}
  .hm-cover-go{grid-area:go;justify-content:space-between;margin:0 0 4px}
  .hm-hero{gap:18px}
  .hm-next{gap:12px}
  .hm-next-q{font-size:25px;line-height:1.26}
  .hm-cta{margin-top:4px}
  /* «Все книги»: 3 covers per row, filter full width, no lift, «16 / 40» only */
  .page-home .hm-all .hm-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;align-self:stretch}
  .page-home .hm-seg button{padding:0 6px}
  .hm-shelf--grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 14px}
  .hm-shelf--grid .hm-book.is-top .book{transform:none}
}

/* v11 3a (≥ 600): the hero is one white card — an upright 196 px book + «Открыть книгу ›» beside the question column;
   ≈ 300 px tall, so the shelf starts on the first screen at 1440×900 */
@media (min-width:600px){
  .hm-hero{grid-template-columns:196px minmax(0,1fr);gap:clamp(28px,3.4vw,44px);padding:24px 32px 24px 24px;border-radius:18px;background:var(--page);
    box-shadow:0 1px 0 var(--line),0 16px 34px -26px rgba(60,40,20,.5)}
  .hm-cover--desk{padding:0;gap:12px;align-items:stretch;border-radius:0;background:none;box-shadow:none;color:var(--ink)}
  .hm-cover--desk::before{content:none}
  .hm-cover--desk:hover{transform:none;color:var(--ink)}
  .hm-cover--desk .book{--w:196px;width:196px}
  .hm-cover--desk .book-cover{padding:14px 10px 14px 26px;gap:10px}
  .hm-cover--desk .book-name{font:500 20px/1.15 var(--serif);color:var(--on-dark);text-wrap:balance}
  .hm-next .hm-bar{margin-top:-4px}
  .hm-cover--desk .hm-cover-go{min-height:44px;margin:0;gap:4px;border-top:0;color:var(--cover)}
  .hm-cover--desk:hover .hm-cover-go{color:var(--ink)}
  .hm-next-who{font:400 17px/1.3 var(--sans);color:var(--ink-3);margin:0}
  .hm-next-who b{font-weight:700;color:var(--ink)}
}

/* phone hero = a real book: the upright cloth cover (same as the shelf) + name, pages and «Открыть книгу» beside it */
@media (max-width:599px){
  .hm-cover.hm-cover--book{display:grid;grid-template-columns:112px minmax(0,1fr);grid-template-areas:"book txt" "book go";align-items:center;gap:4px 18px;
    padding:14px 16px 14px 14px;border-radius:16px;background:var(--page);background-image:none;color:var(--ink);box-shadow:0 1px 0 var(--line),0 12px 26px -20px rgba(60,40,20,.5)}
  .hm-cover--book::before{content:none}
  .hm-cover--book:hover{color:var(--ink)}
  .hm-cover--book .book{grid-area:book;--w:112px;width:112px}
  .hm-cover--book .book-cover{padding:10px 6px 10px 14px}
  .hm-cover--book .book-cover .ring{width:62%;margin-top:6%}
  .hm-cover--book .book-cover .ring svg{width:100%;height:auto}
  .hm-cover--book .book-name{font-size:15px;white-space:nowrap;max-width:100%}
  .hm-cover--book .hm-cover-txt{grid-area:txt;align-self:end;gap:6px;width:100%}
  .hm-cover--book .hm-bar{margin-top:4px}
  .hm-cover--book .hm-cover-name{color:var(--ink);font-size:23px}
  .hm-cover--book .hm-cover-meta{color:var(--ink-3)}
  .hm-cover--book .hm-cover-go{grid-area:go;align-self:start;justify-content:flex-start;gap:4px;border-top:0;margin:0;color:var(--cover)}
}