/* SHABDA Books — shared styles for /books, /books/<slug>, /books/library and the reader.
   The parchment palette of My SHABDA (public/me.html), so the two read as one product.
   VijayaDV carries the Vedic accent marks (PUA) the source text uses — never substituted. */
@font-face { font-family: 'VijayaDV'; src: url('/books/fonts/VijayaDV.ttf') format('truetype'); font-display: block; }
/* VKG 2026-11-01: Vijaya for Telugu, Nandana for Kannada (as the app's pubspec.yaml);
   Noto (Google Fonts, linked from book.html and read.html) is the reserve. */
@font-face { font-family: 'VijayaTL'; src: url('/books/fonts/VijayaTL.ttf') format('truetype'); font-display: block; }
@font-face { font-family: 'NandanaKN'; src: url('/books/fonts/NandanaKN.ttf') format('truetype'); font-display: block; }
/* VKG 2026-11-05: "Clean server-rendered custom fonts on the customer's screen." A reader's device has
   no VijayaDV, so any text set in a device font showed the Vedic marks (PUA) and Indian scripts as boxes.
   'ShabdaScripts' is one family made of our own three fonts, each for its own script only (unicode-range).
   It stands FIRST in every font stack on these pages, so labels, the contents, headings, prose and
   buttons all draw Devanāgarī, Telugu and Kannada from this server; Latin falls through to the next font. */
@font-face { font-family: 'ShabdaScripts'; src: url('/books/fonts/VijayaDV.ttf') format('truetype'); font-display: block;
  unicode-range: U+0900-093B, U+093D-0965, U+0970-097B, U+097D, U+097F, U+1CD0-1CFF, U+A8E0-A8FF, U+E000-F8FF; }
/* VKG 2026-11-05: "preview sections should carry production quality". VijayaDV has no Devanāgarī
   digits ०-९, no ॼ ॾ and no nukta, so on phones every verse number fell to the device's own font.
   Those few glyphs come from our server too: Noto Serif Devanagari (OFL), subset to 5 KB. */
@font-face { font-family: 'ShabdaScripts'; src: url('/books/fonts/ShabdaDevaDigits.ttf') format('truetype'); font-display: block;
  unicode-range: U+093C, U+0966-096F, U+097C, U+097E; }
@font-face { font-family: 'ShabdaScripts'; src: url('/books/fonts/VijayaTL.ttf') format('truetype'); font-display: block; unicode-range: U+0C00-0C7F; }
@font-face { font-family: 'ShabdaScripts'; src: url('/books/fonts/NandanaKN.ttf') format('truetype'); font-display: block; unicode-range: U+0C80-0CFF; }
:root {
  --ink:#241C15; --muted:#6b5f4f; --parchment:#FAF6EE; --parchment-deep:#F0E9D8; --paper:#fff;
  --maroon:#7A2E2E; --gold:#B8863B; --line:#DCD2B8; --ok:#2F6B3A; --warn:#8A5A12; --err:#A23B3B; --hl:#FBE7A1;
}
*{box-sizing:border-box}
body{margin:0;background:var(--parchment);color:var(--ink);font-family:'ShabdaScripts','Iowan Old Style','Palatino Linotype',Georgia,serif;line-height:1.5}
a{color:var(--maroon)}
.sans,.meta,.btn,nav.crumbs{font-family:'ShabdaScripts','Helvetica Neue',Arial,sans-serif}
.dev{font-family:'VijayaDV','ShabdaScripts','Noto Serif Devanagari','Nirmala UI',serif}
header.top{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 1rem;border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,var(--parchment-deep),var(--parchment))}
header.top .brand{display:flex;align-items:baseline;gap:.6rem;text-decoration:none;color:var(--ink)}
header.top .brand .mark{font-size:1.5rem;color:var(--maroon)}
header.top .brand b{font-size:1.1rem}
nav.crumbs{font-size:.85rem;display:flex;gap:.9rem;flex-wrap:wrap}
.who{position:relative}
.avatar{width:2.3rem;height:2.3rem;border-radius:50%;background:var(--maroon);color:#fff;border:none;padding:0;font:600 1rem 'Helvetica Neue',Arial,sans-serif;cursor:pointer}
.signin-link{font:600 .85rem 'Helvetica Neue',Arial,sans-serif}
.menu{display:none;position:absolute;right:0;top:2.7rem;background:#fff;border:1px solid var(--line);border-radius:8px;padding:.9rem 1rem;min-width:15rem;z-index:20;
  font:.85rem 'Helvetica Neue',Arial,sans-serif;box-shadow:0 4px 14px rgba(0,0,0,.08)}
.menu.open{display:block}
.menu a{display:block;margin-top:.45rem}
main{max-width:980px;margin:0 auto;padding:1.25rem 1rem 4rem}
.meta{font-size:.86rem;color:var(--muted)}
.note{background:#fff;border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:4px;padding:.9rem 1.1rem;margin:0 0 1.1rem;font-size:.95rem}
.banner{background:var(--maroon);color:#fff;border-radius:6px;padding:.9rem 1.1rem;margin:0 0 1.2rem;display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;justify-content:space-between}
.banner a.btn{background:#fff;color:var(--maroon)}
.btn{display:inline-block;text-decoration:none;background:var(--maroon);color:#fff;border:none;border-radius:4px;padding:.55rem 1rem;font-size:.9rem;cursor:pointer}
.btn.ghost{background:transparent;color:var(--maroon);border:1px solid var(--line)}
.btn[disabled],.btn.off{opacity:.55;cursor:not-allowed}
.shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.2rem}
.card{background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:var(--ink)}
.cover{aspect-ratio:2/3;background:linear-gradient(160deg,var(--maroon),#4d1c1c);color:#F6E7C1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:1rem;gap:.5rem}
.cover .ct{font-size:1.6rem;line-height:1.3}
.cover .cs{font:.8rem 'Helvetica Neue',Arial,sans-serif;letter-spacing:.06em;opacity:.85}
.cover.has-img{background:#FFF8EC;color:var(--maroon);justify-content:flex-start}
.cover .cimg{width:100%;max-height:65%;object-fit:contain}
.cover.full-art{padding:0;background:#FFF8EC;overflow:hidden}
.cover .cimg-full{width:100%;height:100%;object-fit:cover;display:block}
.card .body{padding:.7rem .8rem;display:flex;flex-direction:column;gap:.25rem}
.price{font:600 .8rem 'Helvetica Neue',Arial,sans-serif;color:var(--ok)}
.price.paid{color:var(--ink)}
.tag{display:inline-block;font:600 .72rem 'Helvetica Neue',Arial,sans-serif;padding:.05rem .45rem;border-radius:3px;border:1px solid var(--ok);color:var(--ok)}
.bookhead{display:grid;grid-template-columns:200px 1fr;gap:1.4rem;align-items:start}
@media (max-width:640px){.bookhead{grid-template-columns:1fr}.bookhead .cover{max-width:200px}}
h1{font-size:1.7rem;margin:.2rem 0 .3rem;font-weight:600}
h2{font-size:1.2rem;margin:1.4rem 0 .5rem}
.toc{list-style:none;padding:0;margin:0;columns:2 240px}
.toc li{break-inside:avoid;padding:.2rem 0;font:.9rem 'Helvetica Neue',Arial,sans-serif}
.toc .part{font-weight:600;margin-top:.5rem;color:var(--maroon)}
.lock{color:var(--muted)}
.verse{white-space:pre-line;font-size:1.35rem;line-height:1.8}
.preview-page{margin:.6rem 0}
.preview-page .sec-label{margin-bottom:.4rem}
.sample{background:#fff;border:1px solid var(--line);border-radius:6px;padding:1rem 1.2rem;margin:.6rem 0}
.state{text-align:center;color:var(--muted);font-family:'ShabdaScripts','Helvetica Neue',Arial,sans-serif;padding:2.5rem 1rem}
.err{color:var(--err)}
.progress{height:6px;background:var(--parchment-deep);border-radius:3px;overflow:hidden}
.progress span{display:block;height:100%;background:var(--gold)}
.row{display:flex;gap:1rem;align-items:center;justify-content:space-between;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:6px;padding:.9rem 1rem;margin:.6rem 0}
/* Reader */
.reader{display:grid;grid-template-columns:240px 1fr;gap:1.2rem}
@media (max-width:820px){.reader{grid-template-columns:1fr}.reader aside.chapters{max-height:40vh}}
aside.chapters{background:#fff;border:1px solid var(--line);border-radius:6px;padding:.6rem .8rem;max-height:80vh;overflow:auto;font:.88rem 'Helvetica Neue',Arial,sans-serif}
aside.chapters button{display:block;width:100%;text-align:left;background:none;border:none;padding:.25rem .3rem;cursor:pointer;font:inherit;color:var(--ink);border-radius:3px}
aside.chapters button.cur{background:var(--parchment-deep);font-weight:600}
aside.chapters button.locked{color:var(--muted)}
.toolbar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:.8rem;font:.85rem 'Helvetica Neue',Arial,sans-serif}
.toolbar label{display:flex;gap:.3rem;align-items:center}
.tabs{display:flex;gap:.3rem;border-bottom:1px solid var(--line);margin-bottom:.8rem}
.tabs button{background:none;border:none;border-bottom:2px solid transparent;padding:.45rem .8rem;cursor:pointer;font:600 .9rem 'Helvetica Neue',Arial,sans-serif;color:var(--muted)}
.tabs button.on{color:var(--maroon);border-bottom-color:var(--maroon)}
.page{background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:6px;padding:1.2rem 1.4rem;min-height:12rem}
.page .text{font-size:calc(1.35rem * var(--scale,1));line-height:var(--lh,1.85);white-space:pre-line}
mark.mine{background:var(--hl);padding:0 .1em}
.ann{border-top:1px dashed var(--line);margin-top:1rem;padding-top:.8rem}
.ann h3{font-size:1rem;margin:.2rem 0;color:var(--maroon)}
.ann .abody{white-space:pre-line;font-size:calc(1.05rem * var(--scale,1));line-height:calc(var(--lh,1.85) - .15)}
.ann details summary{cursor:pointer;font:600 .9rem 'Helvetica Neue',Arial,sans-serif;color:var(--maroon)}
.marks .m{border:1px solid var(--line);border-radius:4px;padding:.5rem .7rem;margin:.4rem 0;display:flex;justify-content:space-between;gap:.6rem;font-size:.95rem}
.pager{display:flex;justify-content:space-between;margin-top:1rem}
textarea,input[type=text]{width:100%;padding:.5rem;font:inherit;border:1px solid var(--line);border-radius:4px}
/* MAP panel — the nine segments */
.map-title{font-size:1.1rem;margin:.2rem 0 .4rem;color:var(--maroon)}
.seg{border:1px solid var(--line);border-radius:6px;padding:.7rem .9rem;margin:.6rem 0;background:var(--parchment)}
.seg h3{font-size:1rem;margin:0 0 .3rem;display:flex;flex-wrap:wrap;gap:.45rem;align-items:baseline}
.seg .segn{display:inline-flex;width:1.6rem;height:1.6rem;border-radius:50%;background:var(--maroon);color:#fff;align-items:center;justify-content:center;font:600 .8rem 'Helvetica Neue',Arial,sans-serif}
.seg .srctag{font:600 .7rem 'Helvetica Neue',Arial,sans-serif;border:1px solid var(--gold);color:var(--warn);border-radius:3px;padding:0 .35rem}
.segrow{display:flex;flex-wrap:wrap;gap:.2rem .8rem;padding:.3rem 0;border-top:1px dashed var(--line);font-size:calc(1rem * var(--scale,1))}
.segrow .sa{font-size:calc(1.15rem * var(--scale,1))}
.segrow .detail{white-space:pre-line}
/* The donation line — free books only, very top and very bottom (VKG 2026-10-25) */
.donate-line{font-size:.85rem;text-align:center;padding:.35rem .8rem;margin:0 0 .9rem;background:var(--parchment-deep);border:1px solid var(--line);border-radius:4px;color:var(--ink)}
.donate-line[data-donate=bottom]{margin:1.2rem 0 0}
.donate-line a{font-weight:600}
.credits{font-size:.9rem;margin:.3rem 0}
/* Structured entries (Rāmāyaṇa Sukti Muktāhāra) and front-matter prose */
.prose{white-space:pre-line;font-size:calc(1.05rem * var(--scale,1));line-height:1.75}
.page .text.prose{font-family:'ShabdaScripts','Iowan Old Style','Palatino Linotype',Georgia,serif;font-size:calc(1.05rem * var(--scale,1))}
.entry-ref{font-weight:600;color:var(--maroon);font-size:.95rem;margin-bottom:.4rem}
.page .text.entry-verse{font-size:calc(1.6rem * var(--scale,1));line-height:1.9;margin:.2rem 0 .8rem}
.entry-en{font-size:calc(1.08rem * var(--scale,1));margin:.4rem 0}
.entry-speaker{font-size:.9rem;font-weight:600;margin:.6rem 0 .2rem}
.entry-ctx{font-size:calc(1rem * var(--scale,1));margin:.2rem 0 .6rem}
.entry-link{font-size:.82rem;word-break:break-all}
/* The Translation row (VKG 2026-11-06): English · తెలుగు · ಕನ್ನಡ · हिन्दी · मराठी */
.tr-row{display:flex;flex-wrap:wrap;gap:.3rem;margin:.5rem 0 .2rem}
.tr-row .seg-btn,#lang-set .seg-btn{font-family:'ShabdaScripts',system-ui,sans-serif}
.tr-note{margin:.1rem 0 .4rem}
.entry-en[lang],.entry-ctx[lang]{font-family:'ShabdaScripts','Noto Sans',system-ui,serif;line-height:1.75}

/* ── Reader settings, themes, scroll play (ported from Vaakya, 2026-11-04) ── */
body[data-theme=sepia]{--parchment:#F4ECD8;--parchment-deep:#E9DDC0;--paper:#FBF3DF;--ink:#3B2F22;--line:#D8C9A3}
body[data-theme=dark]{--parchment:#16130F;--parchment-deep:#221D17;--paper:#1E1A15;--ink:#E9E1D2;--muted:#B5A991;--line:#3A3229;--maroon:#E0A07A;--hl:#6B5418}
body[data-theme=dark] aside.chapters,body[data-theme=dark] .card,body[data-theme=dark] .row,body[data-theme=dark] .note,body[data-theme=dark] .menu{background:var(--paper);color:var(--ink)}
body[data-theme=dark] aside.chapters button{color:var(--ink)}
body[data-theme=dark] header.top{background:var(--parchment-deep)}
body.rd-focus header.top,body.rd-focus aside.chapters,body.rd-focus .rd-head .meta,body.rd-focus .tabs,body.rd-focus .credit-line{display:none}
body.rd-focus .reader{grid-template-columns:1fr}
.rd-head{display:flex;gap:.6rem;align-items:flex-start;justify-content:space-between}
.star{background:none;border:none;font-size:1.6rem;line-height:1;cursor:pointer;color:var(--gold);padding:.2rem}
.card .star{position:absolute;top:.3rem;right:.3rem;font-size:1.35rem;color:#F6E7C1;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.card{position:relative}
.rd-settings{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:.8rem 1rem;margin:0 0 .9rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.7rem 1.2rem;font:.88rem 'Helvetica Neue',Arial,sans-serif}
.rd-settings[hidden]{display:none}
.rd-settings .grp{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}
.rd-settings .grp>span:first-child{min-width:6.5rem;color:var(--muted)}
.seg-btn{border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:4px;padding:.3rem .6rem;cursor:pointer;font:inherit}
.seg-btn.on{background:var(--maroon);color:#fff;border-color:var(--maroon)}
.rd-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:max(.8rem,env(safe-area-inset-bottom));z-index:30;display:flex;gap:.25rem;align-items:center;
  background:var(--paper);border:1px solid var(--line);border-radius:999px;padding:.3rem .5rem;box-shadow:0 4px 18px rgba(0,0,0,.18);font:.85rem 'Helvetica Neue',Arial,sans-serif;max-width:calc(100vw - 1.2rem);flex-wrap:wrap;justify-content:center}
.rd-bar button{width:2.3rem;height:2.3rem;border-radius:50%;border:none;background:transparent;color:var(--ink);font-size:1rem;cursor:pointer}
.rd-bar button:hover{background:var(--parchment-deep)}
.rd-bar button.main{background:var(--maroon);color:#fff}
.rd-bar input[type=range]{width:6rem}
.rd-bar .rd-note{flex-basis:100%;text-align:center;color:var(--muted);font-size:.75rem}
main.reading{padding-bottom:6rem}
@media (max-width:520px){.rd-bar input[type=range]{width:4.5rem}.rd-bar button{width:2.1rem;height:2.1rem}}
.continue{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.7rem;margin:.4rem 0 1.4rem}
.continue a{display:block;background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:.7rem .9rem;text-decoration:none;color:var(--ink)}
.offers{display:flex;flex-direction:column;gap:.4rem;margin:.6rem 0}
.code-box{margin:.7rem 0}
.code-box summary{cursor:pointer;font-weight:600;color:var(--maroon)}
/* Dark theme: the accent is light, so text on it is dark (Council I 2.1; ~9:1). */
body[data-theme=dark] .btn:not(.ghost),body[data-theme=dark] .rd-bar button.main,body[data-theme=dark] .seg-btn.on,
body[data-theme=dark] .banner,body[data-theme=dark] .avatar,body[data-theme=dark] .seg .segn{color:#1E1A15}
body[data-theme=dark] .banner{background:var(--maroon)}
body[data-theme=dark] .banner a.btn{background:#1E1A15;color:var(--maroon)}
/* Council I 2.4: nothing under the 14 px floor (readable-text rule, 2026-10-16). */
.meta,.price,.tag,.cover .cs,nav.crumbs,.signin-link,.donate-line,.rd-note,.seg .srctag,.entry-link,.toc li{font-size:max(.875rem,14px)}
.rd-bar .rd-note{font-size:14px}
/* Council I 2.5: on a phone the bar stays one row; the speed is in Settings. */
@media (max-width:520px){.rd-bar{flex-wrap:nowrap;gap:.1rem;padding:.25rem .35rem}.rd-bar input[type=range]{display:none}}
/* Pay buttons (migration 047): one row per offer, its label above its buttons. */
.offer-row{display:flex;flex-direction:column;gap:.3rem;margin:.5rem 0}
.offer-row .toolbar{display:flex;flex-wrap:wrap;gap:.4rem}

/* The locked view ends above the fixed reading bar, never under it (QA 2026-11-04). */
#locked{margin-bottom:5.5rem}
/* Script tabs: Sanskrit · IAST · Telugu · Kannada (VKG 2026-11-04). VijayaDV is the
   fallback in every script, so its PUA svara marks still draw (rule 20.5). */
.script-tabs{flex-wrap:wrap;margin-bottom:.6rem}
.script-tabs button{font-size:1rem}
/* The nine scripts of the reader's Script setting (reading_script.dart): each script's
   own font, then Noto, then VijayaDV last, so the PUA svara marks still draw. */
.f-deva{font-family:'VijayaDV','ShabdaScripts','Noto Serif Devanagari','Nirmala UI',serif}
.f-telu,.sc-telugu{font-family:'VijayaTL','ShabdaScripts','Noto Sans Telugu','Gautami','Nirmala UI','VijayaDV',serif}
.f-knda,.sc-kannada{font-family:'NandanaKN','ShabdaScripts','Noto Sans Kannada','Tunga','Nirmala UI','VijayaDV',serif}
.f-taml,.sc-tamil{font-family:'ShabdaScripts','Noto Sans Tamil','Latha','Nirmala UI','VijayaDV',sans-serif}
.f-mlym,.sc-malayalam{font-family:'ShabdaScripts','Noto Sans Malayalam','Kartika','Nirmala UI','VijayaDV',sans-serif}
.f-beng,.sc-bengali{font-family:'ShabdaScripts','Noto Sans Bengali','Vrinda','Nirmala UI','VijayaDV',sans-serif}
.f-gujr,.sc-gujarati{font-family:'ShabdaScripts','Noto Sans Gujarati','Shruti','Nirmala UI','VijayaDV',sans-serif}
.f-orya,.sc-odia{font-family:'ShabdaScripts','Noto Sans Oriya','Kalinga','Nirmala UI','VijayaDV',sans-serif}
/* Sized to sit beside VijayaDV, as the app sizes them. */
.page .text.sc-telugu{font-size:calc(1.35rem * 1.1 * var(--scale,1))}
.page .text.sc-tamil{font-size:calc(1.35rem * .88 * var(--scale,1))}
.page .text.sc-malayalam{font-size:calc(1.35rem * .9 * var(--scale,1))}
.page .text.sc-bengali,.page .text.sc-gujarati,.page .text.sc-odia{font-size:calc(1.35rem * .95 * var(--scale,1))}
#script-set .seg-btn{font-size:1rem}
.sc-iast{font-family:'ShabdaScripts','Iowan Old Style','Palatino Linotype','Gentium Plus','Noto Serif',Georgia,'VijayaDV',serif}
.page .text.sc-iast{font-size:calc(1.2rem * var(--scale,1))}

/* ── Full-page reading (VKG 2026-11-05: "like an app … a simple PDF will deliver the comfort") ──
   Only the text, on the whole screen. Four corners: Home (top left: back to the regular screen, to change
   the text or settings), Settings (top right), Previous (bottom left), Next (bottom right). Double tap
   switches between this and the regular screen; a left or right swipe turns the section. */
body.immersive header.top,body.immersive .rd-head,body.immersive #preview-note,body.immersive aside.chapters,
body.immersive #script-tabs-wrap,body.immersive .tabs,body.immersive .donate-line,body.immersive .rd-bar,
body.immersive #jalpa-launch,body.immersive .credit-line,body.immersive .page .pager{display:none!important}
body.immersive main#content{max-width:none;margin:0;padding:0}
body.immersive .reader{display:block}
body.immersive .page{border:none;border-radius:0;box-shadow:none;margin:0;min-height:100vh;
  padding:max(3.2rem,env(safe-area-inset-top)) max(1.1rem,env(safe-area-inset-right)) 4.5rem max(1.1rem,env(safe-area-inset-left))}
body.immersive .page .text{max-width:46rem;margin-left:auto;margin-right:auto}
body.immersive #settings:not([hidden]){position:fixed;top:3.2rem;right:.6rem;left:.6rem;z-index:45;max-height:75vh;overflow:auto;
  background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 28px rgba(0,0,0,.18);display:grid!important}
.im-corner{display:none}
body.immersive .im-corner{display:flex;align-items:center;justify-content:center;position:fixed;z-index:40;min-width:2.8rem;height:2.8rem;
  padding:0 .8rem;border-radius:1.4rem;border:1px solid var(--line);background:rgba(250,246,238,.92);color:var(--ink);
  font:600 .9rem 'Helvetica Neue',Arial,sans-serif;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.08)}
body.immersive .im-corner:disabled{opacity:.35}
#im-home{top:max(.6rem,env(safe-area-inset-top));left:max(.6rem,env(safe-area-inset-left))}
#im-settings{top:max(.6rem,env(safe-area-inset-top));right:max(.6rem,env(safe-area-inset-right))}
#im-prev{bottom:max(.8rem,env(safe-area-inset-bottom));left:max(.6rem,env(safe-area-inset-left))}
#im-next{bottom:max(.8rem,env(safe-area-inset-bottom));right:max(.6rem,env(safe-area-inset-right))}
#im-hint{display:none}
body.immersive #im-hint:not([hidden]){display:block;position:fixed;left:50%;transform:translateX(-50%);bottom:max(.9rem,env(safe-area-inset-bottom));z-index:39;
  font:.78rem 'Helvetica Neue',Arial,sans-serif;color:var(--muted);background:rgba(250,246,238,.92);padding:.3rem .7rem;border-radius:1rem}
body.immersive[data-theme=dark] .im-corner,body.immersive[data-theme=dark] #im-hint{background:rgba(30,26,22,.9);color:#eee}

body.immersive .page,body.immersive{touch-action:manipulation}   /* no double-tap zoom: double tap switches the screens */

/* Book Publication Module (VKG 2026-11-06, migration 052): the details panel, ratings, the staff form. */
.pub-dl{display:grid;grid-template-columns:minmax(8rem,12rem) 1fr;gap:.45rem 1rem;margin:.4rem 0 .6rem;font-size:.95rem}
.pub-dl dt{color:var(--muted)}
.pub-dl dd{margin:0}
.pub-works{margin:.2rem 0 .4rem;padding-left:1.1rem;font-size:.9rem}
.pub-stars{color:var(--gold);letter-spacing:.05em}
.pub-review{background:#fff;border:1px solid var(--line);border-radius:6px;padding:.8rem 1rem;margin:.6rem 0}
.pub-review p{margin:.4rem 0}
.pub-reply{border-left:3px solid var(--gold);padding-left:.8rem;margin-top:.5rem}
.pub-form,.pub-edit{display:flex;flex-direction:column;gap:.6rem;max-width:44rem}
.pub-form textarea,.pub-edit input,.pub-edit textarea,.pub-edit select,.pub-review textarea,.pub-review select{width:100%;box-sizing:border-box;font:inherit;padding:.45rem .55rem;border:1px solid var(--line);border-radius:4px;background:#fff}
.pub-edit label,.pub-review label{display:flex;flex-direction:column;gap:.2rem}
.pub-edit label.pub-check{flex-direction:row;align-items:center;gap:.5rem}
.pub-edit label.pub-check input{width:auto}
.pub-rate{border:1px solid var(--line);border-radius:4px;display:flex;flex-wrap:wrap;gap:.3rem 1rem}
.pub-rate label{color:var(--gold);cursor:pointer}
.pub-person{border:1px solid var(--line);border-radius:4px;display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.4rem;padding:.6rem}
.pub-date{display:grid;grid-template-columns:repeat(auto-fit,minmax(8rem,1fr));gap:.6rem}
.pub-table-wrap{overflow-x:auto}
.pub-table{border-collapse:collapse;width:100%;font-size:.9rem}
.pub-table th,.pub-table td{border-bottom:1px solid var(--line);padding:.45rem .5rem;text-align:left;vertical-align:top}
@media (max-width:600px){.pub-dl{grid-template-columns:1fr}.pub-dl dt{font-weight:600;margin-top:.4rem}}
/* 054: the Overview tabs and the contents list */
.pub-ov p{margin:.5rem 0}
.pub-ov-tabs{margin:.3rem 0 .4rem}
.pub-contents{margin:.1rem 0 .3rem;padding-left:1.3rem}
