/* e-ink: только чёрное и белое, без анимаций, полутонов и теней; цели нажатия не меньше 48 px. */
:root { --ink: #000; --paper: #fff; --hit: 48px; --rule: 1px solid var(--ink); --thick: 3px solid var(--ink);
  --ui: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", sans-serif;
  --serif: Literata, Georgia, "Noto Serif", "PT Serif", serif; }
:root.dark { --ink: #fff; --paper: #000; }   /* тема — «Аа» → «Тема» (look.js), как в reader */
* { box-sizing: border-box; transition: none !important; animation: none !important; scroll-behavior: auto !important; }
html, body { margin: 0; background: var(--paper); color: var(--ink); font: 17px/1.4 var(--ui); }
main { max-width: 46rem; margin: 0 auto; padding: 0 16px 4rem; }
h1 { font-size: 1.4rem; margin: 1rem 0; }
h2 { font-size: 1.1rem; }
a { color: var(--ink); }
button, input { font: inherit; color: var(--ink); background: var(--paper); border: var(--rule); border-radius: 3px;
  min-height: var(--hit); padding: 0 12px; }
button:disabled { opacity: 1; border-style: dashed; background: var(--paper); color: var(--ink); }
button[aria-pressed="true"], .primary { background: var(--ink); color: var(--paper); }
input { min-width: 0; }
form { display: grid; gap: 12px; max-width: 24rem; }
.list { padding: 0; list-style: none; }
.list li a { display: block; min-height: var(--hit); padding: 12px 0; border-bottom: var(--rule); text-decoration: none; }
/* главная: «Транскрипты» и «Книги» как библиотека reader (client/shelves.js) — список, листание экранами ◂ ▸ */
.lib { display: flex; flex-direction: column; height: min(78vh, 760px); margin: 0 0 32px; border-bottom: var(--thick); }
.lib .libhead { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 0 0 8px; border-bottom: var(--rule); }
.lib .libhead h1 { margin: 12px 0 4px; flex: 1 0 auto; }
.lib .libhead select { flex: 1 1 16rem; max-width: 100%; }
.lib .evchips { flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: 6px; }
.lib .evchips .chip { min-height: 40px; padding: 0 10px; font-size: 15px; border: var(--rule); }
.lib .evchips .more { border-style: dashed; }
.lib .libhead .seg { flex-wrap: wrap; } .lib .libhead .seg button { padding: 0 10px; font-size: 15px; }
.lib .libpage { flex: 1; overflow: hidden; position: relative; }
.lib h4 { margin: 12px 0 2px; font: 600 13px var(--ui); letter-spacing: .08em; text-transform: uppercase; }
.lib h4 small { font-weight: normal; letter-spacing: 0; text-transform: none; }
.lib h5 { margin: 8px 0 0; font: italic 14px var(--ui); }
.lib .book { display: block; padding: 8px 10px; min-height: 52px; border-bottom: var(--rule); text-decoration: none; }
.lib .book .t { display: block; font: 19px/1.25 var(--serif); }
.lib .book .s { display: block; font-size: 14px; margin-top: 3px; }
.lib .book[aria-current] { border-left: 6px solid var(--ink); }
.lib .libfoot { display: flex; align-items: center; gap: 8px; padding-top: 8px; flex-wrap: wrap; }
.lib .libfoot .grow { flex: 1; }
.lib .libfoot output { min-width: 56px; text-align: center; }
.lib .libfoot .chip { min-width: var(--hit); font-size: 20px; }
.lib select[hidden] { display: none; }
.lib .upload { display: inline-flex; align-items: center; margin: 0; padding: 0 12px; min-height: var(--hit); border: var(--rule); border-radius: 3px; position: relative; }
.lib .upload input { position: absolute; inset: 0; opacity: 0; width: 100%; }
body > footer { max-width: 46rem; margin: 0 auto 2rem; padding: 0 16px; font-size: .85em; }
.consent { white-space: pre-wrap; font: inherit; border-left: var(--thick); padding-left: 12px; }
.bar { position: sticky; top: 0; z-index: 1; display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  padding: 8px 0; background: var(--paper); border-bottom: var(--rule); }
.seg { display: inline-flex; }
.seg button { border-radius: 0; }
.seg button + button { border-left: 0; }
.status { font-style: italic; }
.doc .ProseMirror { font: 19px/1.55 var(--serif); outline: none; white-space: pre-wrap; padding-top: 8px; }
/* отбивка абзацев — полем, а не отступом: черта активного блока караоке идёт одной линией через все его абзацы */
.doc p { margin: 0; padding: 0 0 .6em 10px; border-left: 3px solid transparent; }
.doc p.active { border-left-color: var(--ink); }
.doc p.locked { font-style: italic; }
.doc .time { min-height: 0; padding: 0 6px; margin-right: 6px; font: 14px var(--ui); vertical-align: 2px; }
.doc .speaker { font-family: var(--ui); }
/* отметки линией (e-ink), как в reader: вопрос — тонкая, выделение — жирная, заметка — двойная */
.doc .note { text-decoration: underline 1px; text-underline-offset: 3px; }
.doc .note.highlight { text-decoration-thickness: 3px; }
.doc .note.note { text-decoration-style: double; text-decoration-thickness: 1px; }
.graph { font-style: italic; }
.proposals article { border-top: var(--rule); padding: 8px 0; }
.change { margin: 6px 0; }
.change del { text-decoration: line-through 2px; }
.change ins { text-decoration: none; border-bottom: var(--thick); }
.logout { float: right; margin-top: 8px; }
.doc .speaker { cursor: pointer; }
.rename { display: inline-flex; gap: 6px; align-items: center; }
.rename[hidden] { display: none; }
.hint { font-style: italic; }
select { font: inherit; min-height: var(--hit); border: var(--rule); background: var(--paper); color: var(--ink); }
.upload { display: block; margin: 1rem 0; }
.search p { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.search input[type=search] { flex: 1; }
.results article { border-top: var(--rule); padding: 6px 0; }
.results .where { font-family: var(--ui); }
.doc p.found { border-left: var(--thick); }
.row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 8px 0; }
.tasks li { padding: 6px 0; border-bottom: var(--rule); }
.tasks li.mine { border-left: var(--thick); padding-left: 8px; }
.round { display: grid; gap: 8px; margin-top: 1rem; }
textarea { font: inherit; border: var(--rule); padding: 8px; background: var(--paper); color: var(--ink); }
.doc img { max-width: calc(100% - 13px); display: block; margin: 8px 0 8px 13px; }
.tasks { list-style: none; padding: 0; }
.doc .ProseMirror { min-height: 30vh; }
.doc p.placeholder::before { content: "Начните писать здесь…"; font-style: italic; position: absolute; pointer-events: none; }
.seg[hidden] { display: none; }
.doc img.ProseMirror-selectednode { outline: var(--thick); }
.doc { position: relative; }
.watermark { position: absolute; inset: 0; pointer-events: none; z-index: 2; }
.card { border-top: var(--rule); padding: 8px 0; }
@media print { .watermark { -webkit-print-color-adjust: exact; print-color-adjust: exact; } }
.inline-note { padding: 0 0 .6em 10px; border-left: 3px solid transparent; font: italic 16px/1.4 var(--ui); }
.inline-note > div { margin-left: 3px; padding: 4px 8px; border: var(--rule); border-left: var(--thick); }
.doc .inline-note.active { border-left-color: var(--ink); }
.inline-note img.ink { max-width: min(100%, 320px); vertical-align: middle; }
.inkpad canvas { display: block; width: min(100%, 100vh); margin: 0 auto; aspect-ratio: 600 / 240; border: var(--rule); touch-action: none; background: var(--paper); color: var(--ink); }
.engines { border: 0; padding: 0; margin: 0 0 .5rem; }
.engines legend { font-weight: 600; padding: 0; }
.engines p { margin: .2rem 0; }

/* ── Читалка: вид и поведение reader (proto/index.html), один для книги и транскрипта ──
   Панель — внизу: большой планшет держат за низ и края. Касание в середине прячет и показывает её. Рамок мало:
   группы держит отступ и одна линия, а не коробки. Цели не меньше 48 px, без анимаций и теней. */
body.reading { height: 100dvh; overflow: hidden; --radius: 3px; --thick2: 2px solid var(--ink); }
body.reading > footer { display: none; }
body.reading main { max-width: none; height: 100%; padding: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto; grid-template-columns: minmax(0, 1fr); }
.reading button, .reading select, .reading input { border: 0; border-radius: var(--radius); }
.reading button { cursor: pointer; }
.reading button:disabled { text-decoration: line-through; border-style: none; }
.reading input { border-bottom: var(--thick2); }
.reading input::placeholder { color: var(--ink); opacity: 1; font-style: italic; }
svg.i { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; vertical-align: middle; }
.reading .seg { display: inline-flex; border: var(--rule); border-radius: var(--radius); overflow: hidden; }
.reading .seg button + button { border-left: var(--rule); }
.reading .seg button, #tocsheet .toc button, #moresheet button { border-radius: 0; }
.reading .chip { border: var(--rule); border-radius: var(--radius); }
.reading .primary { font-weight: 600; }
#rmain { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 0; }
#reader { position: relative; min-height: 0; overflow: hidden; }
#reader foliate-view { display: block; height: 100%; }
#bottom { padding-bottom: max(6px, env(safe-area-inset-bottom)); min-width: 0; }
#top { display: flex; align-items: center; gap: 4px; padding: 0 max(10px, env(safe-area-inset-right)) 0 max(4px, env(safe-area-inset-left)); }
body.chrome-off #top, body.chrome-off #progress, body.selecting #look { display: none; }
/* при выделении раскладка не меняется ни на пиксель: панель значков прячется, сохраняя место, строка выделения —
   поверх текста (отзыв 27.10: окно текста меняло высоту, книга переставлялась, палец «съезжал» на строки ниже) */
body.selecting #top, body.selecting #chromeback { visibility: hidden; }
#chromeback { display: none; width: max-content; margin: 0 4px 4px auto; min-height: var(--hit); padding: 0 14px; border: var(--rule) !important; }
body.chrome-off #chromeback { display: block; }
#bookpick { flex: 1; min-width: 0; display: flex; align-items: center; min-height: var(--hit); text-decoration: none; }
#booktitle { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-left: 8px; font: 600 18px/1.2 var(--serif); }
#booktitle::before { content: "‹ "; font-family: var(--ui); }
#top > button { flex: none; min-width: var(--hit); padding: 0 8px; }
#top > button[hidden] { display: none; }
#feedbtn { position: relative; }
#feedbtn .badge { position: absolute; top: 2px; right: 0; min-width: 22px; height: 22px; padding: 0 5px; border-radius: 11px;
  background: var(--ink); color: var(--paper); font: 700 14px/22px var(--ui); text-align: center; border: 2px solid var(--paper); }
#feedbtn[aria-pressed="true"] .badge { background: var(--paper); color: var(--ink); }
#progress { height: 3px; border-top: var(--rule); }
#progress > div { height: 100%; background: var(--ink); width: 0; }
.over { display: none !important; }
/* «Аа»: вкладки + строки «подпись — выбор»; высота одна на все вкладки (не скачет) */
#look { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: 1fr auto auto; gap: 10px; padding: 10px 16px 14px; height: min(60vh, 560px); overflow-y: auto; align-content: start; }
#look[hidden], #tocsheet[hidden], #moresheet[hidden], #inksheet[hidden] { display: none; }
#looktabs { display: flex; flex-wrap: wrap; }
#looktabs button { flex: 1 1 auto; font-weight: 600; }
.lookpane { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 10px 16px; align-items: center; align-content: start; }
.lookpane[hidden] { display: none; }
#lookfoot { display: flex; justify-content: flex-end; align-self: end; }
#look .lbl { font-size: 15px; }
#look .ctl { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
#look .seg { flex-wrap: wrap; }
#look output { min-width: 96px; text-align: center; }
#look select { border: var(--rule); }
#look .ctl input { flex: 1 1 12rem; }
#presets button { font-family: var(--serif); }
/* оглавление — лист над панелью: строки 48 px, текущее — жирно и толстой чертой слева */
#tocsheet { height: min(60vh, 560px); overflow-y: auto; padding: 6px 16px 10px; }
body.selecting #tocsheet, body.chrome-off #tocsheet, body.selecting #moresheet, body.chrome-off #moresheet { display: none; }
#tocsheet .tochead { display: flex; align-items: center; gap: 6px; background: var(--paper); padding: 4px 0; }
#tocsheet .tochead .grow { flex: 1; }
#tocsheet .toc { list-style: none; margin: 0; padding: 0; }
#tocsheet .toc button { display: block; width: 100%; min-height: var(--hit); text-align: left; padding: 6px 10px; border-bottom: var(--rule); font: 17px/1.3 var(--serif); }
#tocsheet .toc .lvl1 button { padding-left: 32px; font-size: 16px; }
#tocsheet .toc button[aria-current] { font-weight: 700; border-left: 6px solid var(--ink); }
#tocsheet .toc small { display: block; font: 13px var(--ui); margin-top: 2px; }
#tocsheet .empty { padding: 12px 0; font-style: italic; }
#toctabs button { font-weight: 600; }
#moresheet { display: flex; flex-direction: column; padding: 4px 12px; }
#moresheet button { display: flex; align-items: center; gap: 12px; min-height: var(--hit); text-align: left; border-bottom: var(--rule); }
#moresheet button span { font-size: 16px; }
#inksheet { padding: 10px 12px; }
body.inking #askbar { display: none !important; }
/* нижние листы — один вид: скруглённые верхние углы, ручка сверху, без тени */
#look, #tocsheet, #moresheet, #inksheet { position: relative; margin: 8px 6px 0; border: var(--rule); border-bottom: 0; border-radius: 14px 14px 0 0; padding-top: 20px; background: var(--paper); }
#look::before, #tocsheet::before, #moresheet::before, #inksheet::before { content: ''; position: absolute; top: 7px; left: 50%; width: 40px; height: 4px; margin-left: -20px; border-radius: 2px; background: var(--ink); }
/* одна рука: частое — у нижнего края со стороны руки; «Рука: левая» зеркалит */
.lookpane { order: 1; } #looktabs { order: 2; } #lookfoot { order: 3; }
body.hand-left #lookfoot { justify-content: flex-start; }
#tocsheet { display: flex; flex-direction: column; }
#tocsheet .toc { order: 1; }
#tocsheet .tochead { order: 2; position: sticky; bottom: -10px; border-top: var(--rule); margin-top: auto; }
.tochead .grow { order: 0; } .tochead .seg { order: 1; } .tochead [data-close] { order: 2; }
body.hand-left .tochead [data-close] { order: -1; } body.hand-left .tochead .grow { order: 3; }
body.hand-left #top { flex-direction: row-reverse; }
body.hand-left #chromeback { margin: 0 auto 4px 4px; }
body:not(.hand-left) #askbar .acts, body:not(.hand-left) #seledges { justify-content: flex-end; }
@media (min-width: 900px) {
  #look { grid-template-columns: minmax(0, 1fr) 170px; grid-template-rows: 1fr auto; align-items: start; }
  #looktabs { flex-direction: column; grid-row: 1 / span 2; grid-column: 2; order: 0 !important; align-self: end; }
  .lookpane { grid-column: 1; grid-row: 1; }
  body.hand-left #look { grid-template-columns: 170px minmax(0, 1fr); }
  body.hand-left #looktabs { grid-column: 1; }
  body.hand-left .lookpane { grid-column: 2; }
  #looktabs button + button { border-left: 0; border-top: var(--rule); }
  #looktabs button { text-align: left; }
  #lookfoot { grid-column: 1; grid-row: 2; }
  body.hand-left #lookfoot { grid-column: 2; }
}
/* строка выделения и вопроса */
#askbar { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 4; margin: 0 6px; border: var(--rule); border-bottom: 0; border-radius: 14px 14px 0 0;
  padding: 10px 12px max(8px, env(safe-area-inset-bottom)); gap: 6px; flex-direction: column; background: var(--paper); min-width: 0; }
body.selecting #askbar { display: flex; }
#askbar .selrow { display: flex; align-items: center; gap: 8px; min-width: 0; }
#selText { flex: 1; min-width: 0; font: italic 15px/1.3 var(--serif); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#askbar .acts { display: flex; gap: 6px; flex-wrap: wrap; }
#askbar [hidden] { display: none; }
#selmore { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
#selhint { flex: 1 1 260px; font-size: 15px; font-weight: 600; }
#seledges { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
#seledges .edge { display: inline-flex; align-items: center; gap: 4px; }
#seledges .edge .chip { min-width: var(--hit); font-size: 20px; border: var(--thick2); font-weight: 700; }
#seledges .lbl { font-size: 14px; font-weight: 600; }
#chapbtn { border: var(--thick2) !important; font-weight: 600; }
#selcount { flex: none; font-weight: 600; font-size: 15px; }
#selcount:empty { display: none; }
#seledges .badge { display: inline-block; min-width: 22px; height: 22px; margin-left: 6px; padding: 0 5px; border-radius: 11px;
  background: var(--ink); color: var(--paper); font: 700 14px/22px var(--ui); text-align: center; vertical-align: middle; }
#qform { display: flex; gap: 6px; align-items: center; max-width: none; }
#qform input { flex: 1; }
#toast { position: fixed; left: 50%; top: 56px; transform: translateX(-50%); display: none; max-width: 90vw; z-index: 5;
  background: var(--paper); border: var(--thick2); border-radius: var(--radius); padding: 10px 16px; font-size: 15px; }
/* лента ответов: справа на широком экране, нижним листом на узком */
#feed { display: none; overflow: hidden; border-left: var(--thick2); }
body.feed-open #rmain { grid-template-columns: minmax(0, 1fr) minmax(340px, 40%); }
body.feed-open #feed { display: flex; flex-direction: column; }
@media (max-width: 820px) {
  body.feed-open #rmain { grid-template-columns: 1fr; grid-template-rows: 1fr 50%; }
  #feed { border-left: 0; border-top: var(--thick2); }
}
/* транскрипт в читалке: экранами — без прокрутки (листает касание), прокруткой и в правке — обычная прокрутка */
.tdoc { height: 100%; overflow-y: auto; padding: 12px 16px 24px; }
body.pages .tdoc:not(.editing) { overflow: hidden; }
.tdoc .ProseMirror { margin: 0 auto; }
/* сенсор — своё выделение (select.js): системное не возвращать */
body.touch .tdoc:not(.editing) { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; }
body.reading .tdoc:not(.editing) .ProseMirror[contenteditable=false] { caret-color: transparent; }
::highlight(rsel), ::highlight(tpgo) { background: var(--ink); color: var(--paper); }
body.editing #top, body.editing #progress, body.editing #chromeback, body.editing #askbar { display: none !important; }  /* листы (адресат) — можно и в правке */
.editbar { position: sticky; top: -12px; z-index: 2; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 8px 0; margin-bottom: 8px; background: var(--paper); border-bottom: var(--rule); }
.editbar button, .editbar input { border: var(--rule) !important; }
.reading [hidden] { display: none !important; }  /* hidden сильнее любых display у панели и листов */
/* лента: карточка — вопрос и ответ; граница — жирная линия, новая — жирная черта слева */
#list { flex: 1; overflow-y: auto; padding: 0 12px 24px; }
#list .card { padding: 14px 10px 10px 14px; border-top: 0; border-bottom: var(--thick2); }
#list .card.new { border-left: 6px solid var(--ink); }
#list .card .meta { font-size: 13px; display: flex; gap: 8px; justify-content: space-between; }
#list .card .quote { font: italic var(--feedsize, 18px)/var(--feedlh, 1.5) var(--feedfont, var(--serif)); margin: 6px 0; padding-left: 10px; border-left: var(--thick2); cursor: pointer; }
#list .card .q { font-weight: 600; margin-top: 8px; }
#list .card .a { font: var(--feedsize, 18px)/var(--feedlh, 1.5) var(--feedfont, var(--serif)); white-space: pre-wrap; margin: 4px 0; hyphens: auto; }
#feedhead { order: 2; background: var(--paper); padding: 8px 12px; border-top: var(--rule); display: grid; gap: 8px; }
#feedhead #filter { width: 100%; } #feedhead #filter button { flex: 1; padding: 0 6px; }
#feedhead .hrow { display: flex; justify-content: space-between; gap: 8px; }
#feedhead .hrow button { font-size: 15px; }
#threadhead { order: 2; display: flex; gap: 10px; align-items: center; padding: 8px 12px; border-top: var(--rule); background: var(--paper); }
#feedhead[hidden], #threadhead[hidden] { display: none; }
#list { order: 1; } #cmdform { order: 3; }
#cmdform { display: flex; gap: 6px; align-items: center; padding: 8px 12px; border-top: var(--rule); max-width: none; }
#cmdform input { flex: 1; }
#list .empty { padding: 16px 0; font-style: italic; }
#list .card .note { font: var(--feedsize, 18px)/var(--feedlh, 1.5) var(--feedfont, var(--serif)); white-space: pre-wrap; margin: 4px 0; }
#list .card .turn.sub { border-left: var(--rule); padding-left: 12px; margin-top: 10px; }
#list .card .row { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-top: 8px; }
#list .card .row .grow { flex: 1; }
#list .card .row button.ic { min-width: var(--hit); min-height: var(--hit); padding: 0 10px; border: var(--rule); }
#list .card .row button[data-del].sure { background: var(--ink); color: var(--paper); }
#list .card .reply { flex-wrap: nowrap; } #list .card .reply input { flex: 1; font-size: 15px; }
body:not(.hand-left) #list .card .row button[data-del] { order: -1; }
body:not(.hand-left) #list .card .row { justify-content: flex-end; }
#feedbtn .badge.think { background: var(--paper); color: var(--ink); border: 2px solid var(--ink); line-height: 14px; }
body.feed-full #reader { display: none; }
body.feed-full.feed-open #rmain { grid-template-columns: 1fr; grid-template-rows: 1fr; }
body.feed-full #feed { border: 0; }
body.feed-full #list, body.feed-full #feedhead, body.feed-full #threadhead, body.feed-full #cmdform { width: 100%; max-width: 46em; margin-inline: auto; }
.inkpad .row { justify-content: flex-end; } body.hand-left .inkpad .row { justify-content: flex-start; }
/* строка выделения сверху, когда снизу она закрыла бы выделенное (shell.js, placeAsk): поверх текста, текст не двигается */
body.ask-top #askbar { top: 0; bottom: auto; border: var(--rule); border-top: 0; border-radius: 0 0 14px 14px; padding: max(10px, env(safe-area-inset-top)) 12px 8px; }
/* «Читалка обновилась» — одна плашка без анимации над панелью (как в reader) */
#update { position: fixed; left: 0; right: 0; bottom: 56px; z-index: 6; display: flex; gap: 12px; align-items: center; justify-content: flex-end;
  padding: 8px 16px; background: var(--paper); border-top: 2px solid var(--ink); border-bottom: 2px solid var(--ink); font-size: 16px; }
/* сенсор: в панели, листах и ленте — без системного выделения и меню долгого нажатия; поля ввода — как обычно */
body.reading.touch #bottom, body.reading.touch #feed, body.reading.touch .tdoc img { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
body.reading.touch :is(input, textarea) { -webkit-user-select: text; user-select: text; -webkit-touch-callout: default; }
#inksheet .quote { margin: 0 0 8px; font-style: italic; border-left: var(--thick2); padding-left: 10px; }
#inksheet textarea { width: 100%; font: 17px/1.4 var(--serif); }
#inksheet .row button.sure { background: var(--ink); color: var(--paper); }
#pageerror { position: fixed; top: 0; left: 0; right: 0; z-index: 9; padding: 8px 16px; background: var(--paper); border-bottom: 2px solid var(--ink); font: 14px/1.3 var(--ui); }
/* пока палец после долгого нажатия прижат — строки выделения нет совсем (как в Kindle, KOReader): текст на весь экран,
   строка появляется после отрыва пальца там, где не закрывает конец выделения (отзыв владельца 28.10) */
body.pressing #askbar { visibility: hidden; pointer-events: none; }
/* «Мои тексты»: адресат над текстом, ответы под ним; выбор адресата — лист со строками по 48 px */
/* шапка записи мероприятия (shelves.js, eventHead): тренинг ссылкой, даты; день, дата, время — сдержанно, как в reader */
.evhead { font: 14px/1.4 var(--ui); margin: 0 0 14px; padding: 0 0 8px; border-bottom: var(--rule); }
.evhead p { margin: 0; text-indent: 0 !important; } .evhead p:first-child { font-weight: 600; letter-spacing: .04em; }
.texthead { font: 15px/1.4 var(--ui); margin: 0 0 12px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.textfoot { margin-top: 24px; border-top: var(--rule); padding-top: 8px; font-family: var(--ui); }
.picker .row { display: flex; gap: 8px; align-items: center; margin: 0 0 8px; }
.picker .grow { flex: 1; }
.picker .rows { max-height: 50vh; overflow-y: auto; }
.picker .rows button { display: block; width: 100%; min-height: var(--hit); text-align: left; padding: 6px 10px; border-bottom: var(--rule) !important; border-radius: 0; font: 17px/1.3 var(--serif); }
.picker .rows small { display: block; font: 13px var(--ui); }
.picker input[type=search] { width: 100%; margin-bottom: 8px; }
/* выделение через страницы: пока оно «продолжается», вместо строки выделения — узкая плашка на месте панели значков */
#extendbar { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 5; gap: 6px; align-items: center;
  padding: 4px max(10px, env(safe-area-inset-right)) max(4px, env(safe-area-inset-bottom)) 12px; background: var(--paper); border-top: var(--rule); font: 15px var(--ui); }
#extendbar .grow { flex: 1; }
body.extending #extendbar { display: flex; }
body.extending #askbar { display: none !important; }

/* видео записи (client/video.js): окошко в углу поверх поля текста; снизу — над панелью */
#vwin { position: fixed; z-index: 30; background: var(--paper); border: var(--rule); width: max(200px, 25vw); max-width: calc(100vw - 16px); }
#vwin.s-m { width: max(280px, 40vw); }
#vwin.s-l { width: max(320px, 66vw); }
@media (max-width: 600px) { #vwin { width: 55vw; } #vwin.s-m { width: 75vw; } #vwin.s-l { width: calc(100vw - 16px); } }
#vwin.c-tl { top: 8px; left: 8px; } #vwin.c-tr { top: 8px; right: 8px; }
#vwin.c-bl { bottom: calc(var(--hit) + 24px); left: 8px; } #vwin.c-br { bottom: calc(var(--hit) + 24px); right: 8px; }
#vwin video { display: block; width: 100%; aspect-ratio: 16 / 9; background: #000; touch-action: none; }
#vwin .vbar { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; padding: 2px; font-size: 14px; }
#vwin .vbar button { min-height: 32px; padding: 0 8px; }