/*
 * Hydari theme — books (P33): a book's box and contents, the library's shelves and grid, the search inside a book, the member's books,
 * and the reading mode of a chapter — the reader's bar, the text's size and spacing (scaled from the language's own line height: Urdu's
 * Nastaliq gets the room it needs), day / sepia / night, full screen, bookmarks and highlights. Palette tokens for the site; the
 * reading themes have their own paper and ink. Logical directions.
 */

/* =====================================================================
   The world of books (2026-10-29): leather and paper. A deep maroon
   "leather" with a gold lozenge pattern, warm paper, matte gold foil.
   ===================================================================== */
.hy-book-page, .hy-reader-page, .hy-library-page { --hy-bk-maroon: color-mix(in srgb, var(--color-danger, #a8443c) 58%, #2a0a12); --hy-bk-gold: var(--color-accent, #a98b4f);
    --hy-bk-paper: color-mix(in srgb, var(--bg-card) 86%, #e9d9b4); --hy-bk-line: color-mix(in srgb, var(--hy-bk-gold) 26%, transparent);
    --hy-bk-leather: radial-gradient(120% 90% at 30% 20%, color-mix(in srgb, var(--hy-bk-maroon) 80%, #7a3040), transparent 70%), linear-gradient(160deg, var(--hy-bk-maroon), color-mix(in srgb, var(--hy-bk-maroon) 70%, #000));
    --hy-bk-lozenge: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='36' viewBox='0 0 36 36'%3E%3Cg fill='none' stroke='%23d9bf86' stroke-width='.7'%3E%3Cpath d='M18 2l16 16-16 16L2 18z'/%3E%3Ccircle cx='18' cy='18' r='2.2'/%3E%3C/g%3E%3C/svg%3E"); }
/* A chapter's way on is the chapter navigation; the post's previous / next by date would lead out of the book. */
.hy-reader-page .hy-blk--adjacent { display: none; }
/* The post's own featured picture gives way to the book drawn in the box. */
.hy-book-page .hy-post__fig, .hy-book-page .hy-item__aside-fig { display: none; }
.hy-book-page .hy-item__main--beside { display: block; }
.hy-book-page .hy-post__head .hy-item__title::after, .hy-reader-page .hy-post__head .hy-item__title::after { background: linear-gradient(90deg, var(--hy-bk-gold), var(--hy-bk-maroon)); }
[dir="rtl"] .hy-book-page .hy-post__head .hy-item__title::after, [dir="rtl"] .hy-reader-page .hy-post__head .hy-item__title::after { background: linear-gradient(-90deg, var(--hy-bk-gold), var(--hy-bk-maroon)); }

/* ---- a book ------------------------------------------------------------------------------------------------------------------- */
.hy-book { display: grid; gap: 1rem; margin-block: 0 2rem; padding: 1.25rem; border-radius: 22px; background: var(--hy-bk-paper, var(--bg-card)); border: 1px solid var(--hy-bk-line, var(--border-light)); }
.hy-book--hero { grid-template-columns: minmax(13rem, 17rem) minmax(0, 1fr); gap: 0; padding: 0; overflow: hidden; box-shadow: 0 26px 50px -36px rgb(0 0 0 / .32); }
/* The leather stage and the book on it. */
.hy-book__stage { position: relative; isolation: isolate; display: grid; place-items: center; padding: clamp(2rem, 4vw, 2.6rem) 1.5rem 2.8rem; background: var(--hy-bk-leather); perspective: 1600px; }
.hy-book__stage::before { content: ""; position: absolute; z-index: -1; inset: 0; background-image: var(--hy-bk-lozenge); background-size: 36px 36px; opacity: .14;
    -webkit-mask-image: radial-gradient(circle at 50% 45%, transparent 25%, #000 75%); mask-image: radial-gradient(circle at 50% 45%, transparent 25%, #000 75%); }
.hy-book__stage::after { content: ""; position: absolute; z-index: -1; inset-inline: 18%; inset-block-end: 1.6rem; block-size: 22px; border-radius: 50%; background: rgb(0 0 0 / .55); filter: blur(12px);
    transition: transform .8s var(--hy-ease), opacity .8s var(--hy-ease); }
.hy-book3d { --hy-turn: -26deg; --hy-depth: 26px; position: relative; inline-size: min(180px, 100%); transform-style: preserve-3d; transform: rotateY(var(--hy-turn)) rotateX(5deg);
    transition: transform .9s cubic-bezier(.2, .8, .2, 1); animation: hy-bk-float 7s ease-in-out infinite; }
[dir="rtl"] .hy-book3d { --hy-turn: 26deg; }
@keyframes hy-bk-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
.hy-book__stage:hover .hy-book3d { transform: rotateY(calc(var(--hy-turn) * .3)) rotateX(2deg) translateZ(20px); }
.hy-book__stage:hover::after { transform: scaleX(.85); opacity: .7; }
.hy-book3d__body { position: relative; aspect-ratio: 2 / 3; transform-style: preserve-3d; }
.hy-book3d__cover, .hy-book3d__back { position: absolute; inset: 0; border-radius: 3px 9px 9px 3px; }
[dir="rtl"] .hy-book3d__cover, [dir="rtl"] .hy-book3d__back { border-radius: 9px 3px 3px 9px; }
.hy-book3d__cover { z-index: 2; overflow: hidden; transform: translateZ(calc(var(--hy-depth) / 2)); background: var(--hy-bk-maroon); box-shadow: 0 0 0 1px rgb(0 0 0 / .15); }
.hy-book3d__cover img, .hy-book3d__cover picture { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; }
/* The spine's fold and a matte light across the board. */
.hy-book3d__cover::before { content: ""; position: absolute; z-index: 1; inset: 0; pointer-events: none;
    background: linear-gradient(90deg, rgb(0 0 0 / .38) 0, rgb(255 255 255 / .16) 2.5%, rgb(0 0 0 / .14) 5%, transparent 9%), linear-gradient(115deg, rgb(255 255 255 / .1), transparent 40%); }
[dir="rtl"] .hy-book3d__cover::before { background: linear-gradient(-90deg, rgb(0 0 0 / .38) 0, rgb(255 255 255 / .16) 2.5%, rgb(0 0 0 / .14) 5%, transparent 9%), linear-gradient(-115deg, rgb(255 255 255 / .1), transparent 40%); }
.hy-book3d__back { transform: translateZ(calc(var(--hy-depth) / -2)); background: color-mix(in srgb, var(--hy-bk-maroon) 75%, #000); box-shadow: 18px 22px 30px -12px rgb(0 0 0 / .6); }
.hy-book3d__pages { position: absolute; z-index: 1; inset-block: 5px; inset-inline-end: 3px; inline-size: var(--hy-depth); transform: translateX(calc(var(--hy-depth) / 2)) rotateY(90deg);
    background: repeating-linear-gradient(90deg, #f6efdf 0 1.5px, #ddd0b3 1.5px 2.5px); box-shadow: inset 0 0 6px rgb(0 0 0 / .25); }
[dir="rtl"] .hy-book3d__pages { transform: translateX(calc(var(--hy-depth) / -2)) rotateY(-90deg); }
/* The facts (2026-10-29, second take): the author as a byline in large type with a gold rule; the other facts as a quiet sheet — two
   columns of rows, a small icon and label at the start, the value in bold at the end, hairlines between; the numbers as three figures;
   then the reading buttons. */
@keyframes hy-bk-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.hy-book__info { display: grid; align-content: center; gap: 1.15rem; padding: clamp(1.1rem, 2.6vw, 2rem); min-inline-size: 0; }
.hy-book__by { display: grid; gap: .1rem; margin: 0; padding-block-end: .9rem; border-block-end: 1px solid var(--hy-bk-line); }
.hy-book__by-label { color: var(--hy-bk-gold); font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.hy-book__by strong { color: var(--text-heading, var(--hy-text)); font-size: clamp(1.25rem, 1rem + .9vw, 1.65rem); font-weight: 800; line-height: 1.3; }
.hy-book__specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.75rem; margin: 0; }
.hy-book__spec { display: flex; align-items: center; justify-content: space-between; gap: .9rem; min-inline-size: 0; padding-block: .55rem; border-block-end: 1px dashed color-mix(in srgb, var(--hy-bk-gold) 30%, transparent);
    animation: hy-bk-rise .5s var(--hy-ease) both; animation-delay: calc(var(--i, 0) * 50ms + .1s); }
.hy-book__spec dt { display: inline-flex; align-items: center; gap: .45rem; color: var(--text-muted); font-size: .78rem; font-weight: 600; white-space: nowrap; }
.hy-book__spec dt .hy-icon { inline-size: 15px; block-size: 15px; color: var(--hy-bk-gold); }
.hy-book__spec dd { margin: 0; min-inline-size: 0; color: var(--text-heading, var(--hy-text)); font-size: .92rem; font-weight: 800; text-align: end; overflow-wrap: anywhere; }
.hy-book__spec--isbn dd { font-variant-numeric: tabular-nums; letter-spacing: .02em; white-space: nowrap; }
.hy-book__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin: 0; padding: 0; list-style: none; }
.hy-book__stat { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "icon num" "icon label"; align-items: center; column-gap: .6rem; padding: .55rem .7rem;
    border-radius: 14px; background: var(--bg-card); border: 1px solid var(--hy-bk-line); }
.hy-book__stat .hy-icon { grid-area: icon; inline-size: 34px; block-size: 34px; padding: 8px; border-radius: 11px; background: color-mix(in srgb, var(--hy-bk-gold) 15%, transparent); color: var(--hy-bk-maroon); }
.hy-book__stat strong { grid-area: num; font-size: 1.1rem; font-weight: 900; line-height: 1.1; font-variant-numeric: tabular-nums; }
.hy-book__stat span { grid-area: label; color: var(--text-muted); font-size: .72rem; font-weight: 600; }
/* Reading: a big maroon button with a gold medallion, quieter outlined ones beside it. */
.hy-book__actions { display: flex; flex-wrap: wrap; gap: .55rem; }
.hy-book__actions small { font-weight: 400; color: var(--text-muted); }
.hy-book__actions [hidden] { display: none; }
.hy-book__actions .hy-btn { min-block-size: 50px; padding: 5px 1.2rem 5px 5px; border-radius: 16px; font-weight: 800; transition: transform .25s var(--hy-ease), box-shadow .25s var(--hy-ease), background-color .25s var(--hy-ease); }
[dir="rtl"] .hy-book__actions .hy-btn { padding: 5px 5px 5px 1.2rem; }
.hy-book__btn-icon { display: grid; place-items: center; inline-size: 40px; block-size: 40px; border-radius: 12px; background: color-mix(in srgb, var(--hy-bk-gold) 18%, transparent); color: var(--hy-bk-gold); }
.hy-book .hy-book__read { border: 0; background: var(--hy-bk-leather); color: rgb(255 255 255); box-shadow: 0 14px 26px -18px rgb(0 0 0 / .4); }
.hy-book .hy-book__read .hy-book__btn-icon { background: var(--hy-bk-gold); color: var(--hy-bk-maroon); }
.hy-book .hy-book__read:hover { color: rgb(255 255 255); transform: translateY(-2px); }
.hy-book__more { border-color: var(--hy-bk-line); background: var(--bg-card); color: var(--hy-text); }
.hy-book__more:hover { border-color: var(--hy-bk-gold); background: var(--bg-card); transform: translateY(-2px); }
.hy-book__count { display: flex; align-items: center; gap: .4rem; margin: 0; color: var(--text-muted); }
@media (max-width: 991.98px) { .hy-book__specs { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767.98px) {
    .hy-book--hero { grid-template-columns: minmax(0, 1fr); }
    .hy-book__stage { padding: 2rem 1rem 2.6rem; }
    .hy-book3d { inline-size: 150px; }
    .hy-book__stats { gap: .35rem; }
    .hy-book__stat { grid-template-columns: minmax(0, 1fr); grid-template-areas: "num" "label"; justify-items: center; padding: .5rem .3rem; text-align: center; }
    .hy-book__stat .hy-icon { display: none; }
    .hy-book__actions .hy-btn { flex: 1 1 auto; }
}

/* ---- a book's contents: a page of its own with medallions and dotted leaders ----------------------------------------------- */
.hy-book-toc { position: relative; margin-block: 2.5rem 0; padding: clamp(1rem, 2.4vw, 1.5rem); border: 1px solid var(--hy-bk-line, var(--border-light)); border-radius: 22px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 7%, transparent), transparent 120px), var(--hy-bk-paper, var(--bg-card)); }
.hy-book-toc__head { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; margin-block-end: .9rem; }
/* The search inside the book: a small rounded field at the end of the contents' head. */
.hy-book-toc__search { display: flex; align-items: center; gap: 2px; margin-inline-start: auto; inline-size: min(17rem, 100%); padding: 3px; border: 1px solid var(--hy-bk-line, var(--border-light)); border-radius: 999px; background: var(--bg-card); transition: inline-size .35s var(--hy-ease), border-color .25s var(--hy-ease); }
.hy-book-toc__search:focus-within { inline-size: min(22rem, 100%); border-color: var(--hy-bk-gold, var(--color-primary)); }
.hy-book-toc__search .hy-input { flex: 1; min-inline-size: 0; min-block-size: 34px; padding-inline: .8rem; border: 0; background: transparent; box-shadow: none; font-size: .86rem; }
.hy-book-toc__search .hy-input:focus { outline: none; box-shadow: none; }
.hy-book-toc__search-go { display: grid; place-items: center; inline-size: 34px; block-size: 34px; border: 0; border-radius: 50%; background: var(--hy-bk-gold, var(--color-primary)); color: var(--hy-bk-maroon, rgb(255 255 255)); cursor: pointer; }
.hy-book-toc__search-go .hy-icon { inline-size: 15px; block-size: 15px; }
.hy-book-toc__title { display: inline-flex; align-items: center; gap: .65rem; margin: 0; font-size: 1.15rem; font-weight: 800; }
.hy-book-toc__mark { display: grid; place-items: center; inline-size: 38px; block-size: 38px; border-radius: 12px; background: var(--hy-bk-maroon, var(--color-primary)); color: var(--hy-bk-gold, #fff); }
.hy-book-toc__mark .hy-icon { inline-size: 18px; block-size: 18px; }
.hy-book-toc__count { padding: .2rem .75rem; border-radius: 999px; background: color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 16%, transparent); color: var(--hy-text); font-size: .8rem; font-weight: 700; }
.hy-book-toc__list { display: grid; gap: .25rem; margin: 0; padding: 0; list-style: none; counter-reset: none; }
.hy-book-toc__item { animation: hy-bk-rise .5s var(--hy-ease) both; animation-delay: calc(min(var(--i, 0), 12) * 50ms); }
.hy-book-toc__link { display: flex; align-items: center; gap: .9rem; padding: .55rem .6rem; border-radius: 14px; color: inherit; text-decoration: none; transition: background-color .25s var(--hy-ease), box-shadow .25s var(--hy-ease); }
.hy-book-toc__link:hover { background: var(--bg-card); box-shadow: 0 12px 24px -20px rgb(0 0 0 / .32); color: inherit; }
.hy-book-toc__num { flex: none; display: grid; place-items: center; inline-size: 40px; block-size: 40px; border-radius: 50%; border: 2px solid var(--hy-bk-gold, var(--color-primary));
    color: var(--hy-bk-maroon, var(--color-primary)); font-weight: 900; font-variant-numeric: tabular-nums; transition: background-color .25s var(--hy-ease), color .25s var(--hy-ease), transform .4s cubic-bezier(.34, 1.56, .64, 1); }
.hy-book-toc__link:hover .hy-book-toc__num { background: var(--hy-bk-maroon, var(--color-primary)); color: var(--hy-bk-gold, #fff); border-color: var(--hy-bk-maroon, var(--color-primary)); transform: rotate(-10deg); }
.hy-book-toc__name { flex: 0 1 auto; min-inline-size: 0; font-weight: 700; font-size: 1.02rem; }
.hy-book-toc__leader { flex: 1 1 2rem; min-inline-size: 1.5rem; align-self: center; block-size: 0; border-block-end: 2px dotted color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 45%, transparent); }
.hy-book-toc__go { flex: none; display: grid; place-items: center; inline-size: 34px; block-size: 34px; border-radius: 11px; background: var(--bg-sunken, var(--bg-app)); color: var(--text-muted);
    transition: transform .3s var(--hy-ease), background-color .3s var(--hy-ease), color .3s var(--hy-ease); }
.hy-book-toc__link:hover .hy-book-toc__go { background: var(--hy-bk-gold, var(--color-primary)); color: var(--hy-bk-maroon, #fff); transform: translateX(calc(3px * var(--hy-flip))); }

/* ---- the library --------------------------------------------------------------------------------------------------------------- */
.hy-library .hy-crumbbar { margin-block-end: clamp(.75rem, 1.6vw, 1.1rem); }
.hy-list-head--library .hy-list-head__mark { background: var(--hy-bk-leather); color: var(--hy-bk-gold); }
.hy-library__looks { gap: 4px !important; padding: 4px; border-radius: 999px; background: var(--bg-sunken, var(--bg-app)); }
.hy-library .hy-list-head__meta > .hy-library__look { display: inline-flex; align-items: center; gap: .35rem; padding: .35rem .85rem; border: 0; background: transparent; color: var(--text-muted); text-decoration: none; transition: background-color .25s var(--hy-ease), color .25s var(--hy-ease); }
.hy-library .hy-list-head__meta > .hy-library__look.is-on { background: var(--hy-bk-maroon); color: rgb(255 255 255); box-shadow: 0 8px 16px -10px rgb(0 0 0 / .32); }
.hy-library .hy-list-head__meta > .hy-library__look:not(.is-on):hover { background: var(--bg-card); color: var(--hy-text); }
.hy-library__look .hy-icon { inline-size: 15px; block-size: 15px; }
/* A shelf: a block of its own with its name in a tile and a count; the cards stand in a row that scrolls on a wooden ledge. */
.hy-shelf { margin-block-end: 1.25rem; padding: clamp(.9rem, 2vw, 1.2rem) clamp(.9rem, 2vw, 1.3rem) 0; border: 1px solid color-mix(in srgb, var(--hy-line) 70%, transparent); border-radius: 22px;
    background: var(--bg-card); box-shadow: var(--shadow-sm, none); }
.hy-shelf__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-block-end: .9rem; }
.hy-shelf__title { display: inline-flex; align-items: center; gap: .55rem; margin: 0; font-size: 1.05rem; font-weight: 800; }
.hy-shelf__mark { display: grid; place-items: center; inline-size: 36px; block-size: 36px; border-radius: 11px; background: var(--hy-bk-leather); color: var(--hy-bk-gold); }
.hy-shelf__mark .hy-icon { inline-size: 17px; block-size: 17px; }
.hy-shelf__title small { padding: .05rem .55rem; border-radius: 999px; background: color-mix(in srgb, var(--hy-bk-gold) 16%, transparent); color: var(--hy-text); font-weight: 700; font-size: .75rem; }
.hy-shelf__all { display: inline-flex; align-items: center; gap: .35rem; padding: .35rem .85rem; border-radius: 999px; background: var(--bg-sunken, var(--bg-app)); color: var(--hy-text); font-size: .85rem; font-weight: 700; text-decoration: none; }
.hy-shelf__all:hover { background: var(--hy-bk-maroon); color: rgb(255 255 255); }
.hy-shelf__books { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(14rem, 15.5rem); gap: 1rem; overflow-x: auto; margin-inline: calc(-1 * clamp(.9rem, 2vw, 1.3rem));
    padding: .2rem clamp(.9rem, 2vw, 1.3rem) 1.4rem; scroll-snap-type: inline mandatory; scroll-padding-inline: clamp(.9rem, 2vw, 1.3rem); scrollbar-width: thin; border-radius: 0 0 22px 22px;
    background: linear-gradient(to top, #3b2416 0 5px, #6b4428 5px 11px, #8a5a36 11px 13px, transparent 13px); }
.hy-shelf__books > * { scroll-snap-align: start; }
.hy-library__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(.9rem, 1.8vw, 1.4rem); }
@media (max-width: 991.98px) { .hy-library__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .hy-library__grid { grid-template-columns: minmax(0, 1fr); } }
.hy-library .hy-paging { display: flex; justify-content: center; margin-block-start: 1.5rem; }
/* The list look: one book a row — a narrow stage with the book, then the words with room for three lines of its description. */
.hy-library .hy-library__grid--list { grid-template-columns: minmax(0, 1fr); gap: .8rem; }
.hy-library .hy-library__grid--list .hy-bookcard { grid-template-columns: clamp(7.5rem, 16vw, 11rem) minmax(0, 1fr); grid-template-rows: none; }
.hy-library .hy-library__grid--list .hy-bookcard__stage { padding: 1rem .8rem 1.3rem; }
.hy-library .hy-library__grid--list .hy-bookcard__stage::after { inset-inline: 22%; inset-block-end: .8rem; }
.hy-library .hy-library__grid--list .hy-bookcard__cover { inline-size: min(66%, 7.5rem); }
.hy-library .hy-library__grid--list .hy-bookcard__body { align-content: center; gap: .35rem; padding: 1rem clamp(1rem, 2.4vw, 1.6rem); border-block-start: 0; border-inline-start: 1px solid var(--hy-bk-line); }
.hy-library .hy-library__grid--list .hy-bookcard__title { font-size: clamp(1.02rem, .95rem + .3vw, 1.2rem); }
.hy-library .hy-library__grid--list .hy-bookcard__excerpt { -webkit-line-clamp: 3; line-clamp: 3; max-inline-size: 80ch; font-size: .88rem; }
/* Three wide cards: the book and its words side by side. */
@media (min-width: 992px) {
    .hy-library__grid .hy-bookcard { grid-template-columns: 42% minmax(0, 1fr); grid-template-rows: none; }
    .hy-library__grid .hy-bookcard__cover { inline-size: 74%; }
    .hy-library__grid .hy-bookcard__body { align-content: center; border-block-start: 0; border-inline-start: 1px solid var(--hy-bk-line); }
}
/* A book's card: a small warm stage with the cover as a book (spine fold, page edges, a shadow on the floor) that turns towards the
   reader on hover; under it the title, author, the book's line and its facts as chips. */
.hy-bookcard { display: grid; grid-template-rows: auto 1fr; min-inline-size: 0; overflow: hidden; border: 1px solid color-mix(in srgb, var(--hy-line) 75%, transparent); border-radius: 20px;
    background: var(--bg-card); animation: hy-bk-rise .6s var(--hy-ease) both; transition: box-shadow .35s var(--hy-ease), border-color .35s var(--hy-ease); }
.hy-bookcard:nth-child(2) { animation-delay: .05s; } .hy-bookcard:nth-child(3) { animation-delay: .1s; } .hy-bookcard:nth-child(4) { animation-delay: .15s; }
.hy-bookcard:nth-child(5) { animation-delay: .2s; } .hy-bookcard:nth-child(n + 6) { animation-delay: .25s; }
.hy-bookcard:hover { border-color: color-mix(in srgb, var(--hy-bk-gold) 45%, transparent); box-shadow: 0 22px 40px -30px rgb(0 0 0 / .45); }
.hy-bookcard__stage { position: relative; isolation: isolate; display: grid; place-items: center; padding: 1.4rem 1rem 1.6rem; perspective: 1000px;
    background: radial-gradient(70% 90% at 50% 100%, color-mix(in srgb, var(--hy-bk-gold) 22%, transparent), transparent 70%), var(--hy-bk-paper); }
.hy-bookcard__stage::before { content: ""; position: absolute; z-index: -1; inset: 0; background-image: var(--hy-bk-lozenge); background-size: 30px 30px; opacity: .1; }
.hy-bookcard__stage::after { content: ""; position: absolute; z-index: -1; inset-inline: 24%; inset-block-end: 1.05rem; block-size: 14px; border-radius: 50%; background: rgb(0 0 0 / .45); filter: blur(8px);
    transition: transform .6s var(--hy-ease), opacity .6s var(--hy-ease); }
.hy-bookcard__cover { position: relative; display: block; inline-size: 52%; aspect-ratio: 2 / 3; border-radius: 3px 8px 8px 3px; background: var(--hy-bk-maroon);
    box-shadow: 3px 0 0 -1px #f3ecdc, 5px 1px 0 -1px #ddd0b4, 7px 2px 0 -1px #efe6d1, 9px 3px 0 -1px #cfc1a2, 0 14px 20px -12px rgb(0 0 0 / .55);
    transform: rotateY(-18deg) rotateX(4deg); transition: transform .7s cubic-bezier(.2, .8, .2, 1), box-shadow .7s var(--hy-ease); }
[dir="rtl"] .hy-bookcard__cover { border-radius: 8px 3px 3px 8px; transform: rotateY(18deg) rotateX(4deg);
    box-shadow: -3px 0 0 -1px #f3ecdc, -5px 1px 0 -1px #ddd0b4, -7px 2px 0 -1px #efe6d1, -9px 3px 0 -1px #cfc1a2, 0 14px 20px -12px rgb(0 0 0 / .55); }
.hy-bookcard__cover > * { display: block; inline-size: 100%; block-size: 100%; border-radius: inherit; overflow: hidden; }
.hy-bookcard__cover img { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; }
.hy-bookcard__cover::before { content: ""; position: absolute; z-index: 1; inset: 0; border-radius: inherit; pointer-events: none;
    background: linear-gradient(90deg, rgb(0 0 0 / .35) 0, rgb(255 255 255 / .15) 3%, rgb(0 0 0 / .12) 6%, transparent 11%); }
[dir="rtl"] .hy-bookcard__cover::before { background: linear-gradient(-90deg, rgb(0 0 0 / .35) 0, rgb(255 255 255 / .15) 3%, rgb(0 0 0 / .12) 6%, transparent 11%); }
.hy-bookcard:hover .hy-bookcard__cover, .hy-bookcard:focus-within .hy-bookcard__cover { transform: rotateY(0) translateY(-6px); }
.hy-bookcard:hover .hy-bookcard__stage::after { transform: scaleX(.8); opacity: .7; }
.hy-bookcard__blank { display: grid; place-items: center; block-size: 100%; padding: 1rem; background: var(--hy-bk-leather); color: var(--hy-bk-gold); font-weight: 800; text-align: center; line-height: 1.5;
    box-shadow: inset 0 0 0 6px color-mix(in srgb, var(--hy-bk-gold) 30%, transparent); }
.hy-bookcard__body { display: grid; align-content: start; gap: .3rem; padding: .85rem 1rem 1rem; border-block-start: 1px solid var(--hy-bk-line); }
.hy-bookcard__title { margin: 0; font-size: 1.02rem; font-weight: 800; line-height: 1.4; overflow-wrap: anywhere; }
.hy-bookcard__title a { color: inherit; text-decoration: none; }
.hy-bookcard__title a:hover { color: var(--hy-bk-maroon, var(--color-primary)); }
.hy-bookcard__author { margin: 0; color: var(--hy-bk-maroon, var(--text-muted)); font-size: .84rem; font-weight: 700; }
.hy-bookcard__excerpt { margin: .15rem 0 0; color: var(--text-secondary); font-size: .82rem; line-height: 1.6; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.hy-bookcard__facts { display: flex; flex-wrap: wrap; gap: .3rem; margin: .4rem 0 0; padding: 0; list-style: none; }
.hy-bookcard__facts li { display: inline-flex; align-items: center; gap: .3rem; padding: .12rem .55rem; border-radius: 999px; background: color-mix(in srgb, var(--hy-bk-gold) 13%, transparent); color: var(--text-secondary); font-size: .72rem; font-weight: 700; }
.hy-bookcard__facts .hy-icon { inline-size: 12px; block-size: 12px; color: var(--hy-bk-gold); }
.hy-library .hy-empty { display: grid; justify-items: center; gap: .5rem; padding: 3rem 1rem; color: var(--text-muted); }
@media (prefers-reduced-motion: reduce) { .hy-book3d, .hy-book__spec, .hy-bookcard, .hy-book-toc__item { animation: none !important; } }

/* ---- the search inside a book ---------------------------------------------------------------------------------------------- */
.hy-book-search .hy-list-head__title { display: flex; align-items: center; gap: .5rem; margin-block-end: 1rem; }
.hy-book-search__count { color: var(--text-muted); }
.hy-book-search__hits { display: grid; gap: 1rem; margin: 1rem 0; padding: 0; list-style: none; }
.hy-book-search__hit { padding: 1rem 1.1rem; border-radius: var(--radius-card, 14px); background: var(--bg-card); border: 1px solid var(--border-light); }
.hy-book-search__hit h2 { margin: 0 0 .4rem; font-size: 1.05rem; }
.hy-book-search__hit h2 a { color: inherit; text-decoration: none; }
.hy-book-search__passage { margin: .3rem 0 0; color: var(--text-secondary, var(--text-main)); }

/* ---- the member's books --------------------------------------------------------------------------------------------------- */
.hy-my-books ul { display: grid; gap: .75rem; padding: 0; list-style: none; }
.hy-my-books__bar { display: block; block-size: 4px; margin-block-start: .3rem; border-radius: 4px; background: var(--border-light); overflow: hidden; }
.hy-my-books__bar > span { display: block; block-size: 100%; background: var(--color-primary); }
.hy-my-books__mark { display: flex; align-items: flex-start; gap: .6rem; }
.hy-my-books__mark > div { flex: 1; min-inline-size: 0; }
.hy-my-books__mark blockquote { margin: .3rem 0 0; padding-inline-start: .7rem; border-inline-start: 3px solid #e9c46a; }

/* ---- reading a chapter (redone 2026-10-29) ------------------------------------------------------------------------------------
   The bar: the book's tag and the place at the start, round tools at the end. The contents, the "Aa" settings and the bookmarks open
   as small panels under their button; the search opens as a window over the page. The paper (day, sepia, night) colours the text's
   whole card: its ground, the words, headings, lists, tables and quotes. */
.hy-reader { position: sticky; inset-block-start: calc(var(--hy-header-h, 0px) + 8px); z-index: 20; margin-block: 0 1.25rem; }
.hy-reader__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .4rem .75rem; padding: .4rem .45rem .4rem .5rem; border-radius: 18px;
    background: color-mix(in srgb, var(--bg-card) 88%, transparent); backdrop-filter: blur(12px); border: 1px solid color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 26%, transparent);
    box-shadow: 0 14px 30px -24px rgb(0 0 0 / .45); color: var(--text-main); }
.hy-reader__where { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem; min-inline-size: 0; font-size: .88rem; }
.hy-reader__book { display: inline-flex; align-items: center; gap: .45rem; padding: .2rem .75rem .2rem .25rem; border-radius: 12px; background: color-mix(in srgb, var(--hy-bk-maroon, #6a2430) 8%, transparent);
    color: var(--text-heading, inherit); font-weight: 800; text-decoration: none; }
[dir="rtl"] .hy-reader__book { padding: .2rem .25rem .2rem .75rem; }
.hy-reader__book > .hy-icon { inline-size: 30px; block-size: 30px; padding: 7px; border-radius: 10px; background: var(--hy-bk-maroon, var(--color-primary)); color: var(--hy-bk-gold, #fff); }
.hy-reader__place, .hy-reader__page { padding: .15rem .6rem; border-radius: 999px; background: color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 15%, transparent); color: var(--text-secondary, inherit); font-size: .78rem; font-weight: 700; }
.hy-reader__page { background: var(--bg-sunken, var(--bg-app)); }
.hy-reader__page[hidden] { display: none; }
.hy-reader__tools { display: flex; align-items: center; gap: 2px; padding: 3px; border-radius: 14px; background: var(--bg-sunken, var(--bg-app)); }
.hy-reader__sep { inline-size: 1px; block-size: 22px; margin-inline: 3px; background: var(--border-light); }
.hy-reader__btn { position: relative; display: inline-grid; place-items: center; inline-size: 38px; block-size: 38px; padding: 0; border: 0; border-radius: 11px; background: transparent; color: var(--text-secondary, inherit);
    cursor: pointer; list-style: none; transition: background-color .2s var(--hy-ease), color .2s var(--hy-ease); }
.hy-reader__btn::-webkit-details-marker { display: none; }
.hy-reader__btn .hy-icon { inline-size: 18px; block-size: 18px; }
.hy-reader__btn:hover, .hy-reader__pop[open] > .hy-reader__btn { background: var(--bg-card); color: var(--hy-bk-maroon, var(--color-primary)); box-shadow: 0 1px 3px rgb(0 0 0 / .08); }
.hy-reader__btn--aa { font-family: Georgia, 'Times New Roman', serif; font-size: 1.05rem; font-weight: 700; letter-spacing: -.02em; }
.hy-reader__btn[hidden], .hy-reader__pop[hidden] { display: none; }
.hy-reader__badge { position: absolute; inset-block-start: 3px; inset-inline-end: 3px; min-inline-size: 16px; block-size: 16px; padding-inline: 4px; border-radius: 999px; background: var(--hy-bk-maroon, var(--color-primary)); color: rgb(255 255 255); font-size: .62rem; font-weight: 800; line-height: 16px; }
.hy-reader__badge[hidden] { display: none; }
/* The panels. */
.hy-reader__pop { position: relative; }
.hy-reader__panel { position: absolute; z-index: 30; inset-block-start: calc(100% + 10px); inset-inline-end: -3px; inline-size: min(21rem, 86vw); max-block-size: min(70vh, 32rem); overflow: auto; padding: .8rem;
    border-radius: 18px; background: var(--bg-card); color: var(--text-main); border: 1px solid color-mix(in srgb, var(--hy-line) 80%, transparent); box-shadow: 0 24px 50px -22px rgb(0 0 0 / .45);
    animation: hy-reader-pop .22s var(--hy-ease) both; transform-origin: top; }
@keyframes hy-reader-pop { from { opacity: 0; transform: translateY(-6px) scale(.98); } to { opacity: 1; transform: none; } }
.hy-reader__panel-title { display: flex; align-items: center; gap: .5rem; margin: 0 0 .7rem; padding-block-end: .6rem; border-block-end: 1px solid var(--border-light); font-size: .86rem; font-weight: 800; }
.hy-reader__panel-title > :first-child { display: grid; place-items: center; inline-size: 30px; block-size: 30px; border-radius: 10px; background: var(--hy-bk-maroon, var(--color-primary)); color: var(--hy-bk-gold, #fff);
    font-family: Georgia, serif; font-size: .9rem; }
.hy-reader__panel-title > svg { padding: 7px; }
.hy-reader__toc-list { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.hy-reader__toc-list a { display: flex; align-items: center; gap: .6rem; padding: .45rem .5rem; border-radius: 11px; color: inherit; text-decoration: none; font-size: .9rem; }
.hy-reader__toc-list a:hover { background: var(--bg-sunken, var(--bg-app)); }
.hy-reader__toc-list .is-current a { background: color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 16%, transparent); font-weight: 800; }
.hy-reader__toc-num { flex: none; display: grid; place-items: center; inline-size: 28px; block-size: 28px; border-radius: 50%; border: 1.5px solid var(--hy-bk-gold, var(--color-primary)); color: var(--hy-bk-maroon, var(--color-primary)); font-size: .76rem; font-weight: 800; }
.hy-reader__toc-list .is-current .hy-reader__toc-num { background: var(--hy-bk-maroon, var(--color-primary)); border-color: transparent; color: var(--hy-bk-gold, #fff); }
/* "Aa": size, spacing and paper. */
.hy-reader__row { display: grid; gap: .45rem; padding-block: .55rem; }
.hy-reader__row + .hy-reader__row { border-block-start: 1px dashed var(--border-light); }
.hy-reader__row-label { color: var(--text-muted); font-size: .7rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.hy-reader__stepper { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; gap: .4rem; padding: 3px; border-radius: 14px; background: var(--bg-sunken, var(--bg-app)); }
.hy-reader__step { display: grid; place-items: center; block-size: 38px; border: 0; border-radius: 11px; background: var(--bg-card); color: var(--text-main); font-family: Georgia, serif; font-size: .85rem; font-weight: 700; cursor: pointer;
    box-shadow: 0 1px 2px rgb(0 0 0 / .08); transition: transform .15s var(--hy-ease); }
.hy-reader__step--big { font-size: 1.25rem; }
.hy-reader__step:active { transform: scale(.94); }
.hy-reader__scale { text-align: center; font-size: .9rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.hy-reader__seg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 3px; border-radius: 14px; background: var(--bg-sunken, var(--bg-app)); }
.hy-reader__lead { display: grid; align-content: center; justify-items: center; gap: 3px; block-size: 40px; border: 0; border-radius: 11px; background: transparent; cursor: pointer; }
.hy-reader__lead i { display: block; inline-size: 22px; block-size: 2px; border-radius: 2px; background: currentColor; color: var(--text-secondary); }
.hy-reader__lead--loose { gap: 5px; } .hy-reader__lead--looser { gap: 7px; }
.hy-reader__lead[aria-pressed="true"] { background: var(--bg-card); box-shadow: 0 1px 3px rgb(0 0 0 / .1); }
.hy-reader__lead[aria-pressed="true"] i { color: var(--hy-bk-maroon, var(--color-primary)); }
.hy-reader__papers { display: grid; grid-template-columns: repeat(3, 1fr); gap: .45rem; }
.hy-reader__paper { display: grid; justify-items: center; gap: .3rem; padding: .45rem .3rem .4rem; border: 2px solid transparent; border-radius: 14px; background: transparent; color: var(--text-secondary); font: inherit; font-size: .76rem; font-weight: 700; cursor: pointer; }
.hy-reader__swatch { display: grid; place-items: center; inline-size: 100%; block-size: 44px; border-radius: 10px; font-family: Georgia, serif; font-size: 1.05rem; font-weight: 700; box-shadow: inset 0 0 0 1px rgb(0 0 0 / .1); }
.hy-reader__paper--day .hy-reader__swatch { background: rgb(255 253 247); color: rgb(35 42 34); }
.hy-reader__paper--sepia .hy-reader__swatch { background: rgb(243 231 207); color: rgb(75 58 38); }
.hy-reader__paper--night .hy-reader__swatch { background: rgb(29 32 30); color: rgb(221 216 203); }
.hy-reader__paper[aria-pressed="true"] { border-color: var(--hy-bk-gold, var(--color-primary)); color: var(--text-main); }
/* Bookmarks. */
.hy-reader__marks ul { display: grid; gap: .3rem; margin: 0; padding: 0; list-style: none; }
.hy-reader__marks li { display: flex; gap: .35rem; align-items: stretch; }
.hy-reader__marks p { margin: 0; color: var(--text-muted); font-size: .86rem; }
.hy-reader__marks .hy-reader__marks-note { margin-block-start: .6rem; font-size: .76rem; }
.hy-reader__mark { flex: 1; display: grid; gap: .1rem; min-inline-size: 0; padding: .45rem .65rem; border: 0; border-radius: 11px; border-inline-start: 3px solid var(--hy-bk-gold, var(--color-primary));
    background: var(--bg-sunken, var(--bg-app)); color: inherit; font: inherit; font-size: .86rem; text-align: start; cursor: pointer; }
.hy-reader__mark > span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.hy-reader__mark small { color: var(--text-muted); font-size: .72rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.hy-reader__mark:hover { background: color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 14%, transparent); }
.hy-reader__mark--highlight { border-inline-start-color: #e9c46a; }
.hy-reader__mark-remove { flex: none; inline-size: 30px; border: 0; border-radius: 10px; background: transparent; color: var(--text-muted); font-size: 1.1rem; cursor: pointer; }
.hy-reader__mark-remove:hover { background: var(--color-danger-light, #f6e5e2); color: var(--color-danger, #a8443c); }
.hy-reader__status:empty { display: none; }
.hy-reader__status { margin: .4rem 0 0; padding: .35rem .8rem; border-radius: 999px; background: var(--hy-bk-maroon, var(--color-primary)); color: rgb(255 255 255); font-size: .84rem; inline-size: fit-content; }
.hy-reader__highlight { position: absolute; z-index: 40; display: inline-flex; align-items: center; gap: .35rem; padding: .45rem .8rem; border: 0; border-radius: 999px; background: var(--text-main); color: var(--bg-card);
    font: inherit; font-size: .88rem; box-shadow: 0 6px 18px rgba(0, 0, 0, .25); cursor: pointer; }
.hy-reader__highlight[hidden] { display: none; }
/* The search window. */
.hy-reader__find { inline-size: min(40rem, calc(100vw - 2rem)); max-block-size: min(80vh, 44rem); margin: 10vh auto auto; padding: 0; border: 0; border-radius: 22px; background: var(--bg-card); color: var(--text-main);
    box-shadow: 0 40px 80px -30px rgb(0 0 0 / .6); }
.hy-reader__find[open] { animation: hy-reader-pop .25s var(--hy-ease) both; }
.hy-reader__find::backdrop { background: rgb(10 14 12 / .55); backdrop-filter: blur(4px); }
.hy-reader__find-form { position: relative; display: grid; gap: .8rem; padding: 1.1rem 1.2rem; border-block-end: 1px solid var(--border-light);
    background: radial-gradient(80% 140% at 100% 0%, color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 14%, transparent), transparent 60%); }
.hy-reader__find-title { display: flex; align-items: center; gap: .55rem; margin: 0; font-size: 1.02rem; font-weight: 800; }
.hy-reader__find-title svg { inline-size: 34px; block-size: 34px; padding: 8px; border-radius: 11px; background: var(--hy-bk-maroon, var(--color-primary)); color: var(--hy-bk-gold, #fff); }
.hy-reader__find-box { display: flex; gap: .4rem; padding: 4px; border: 1px solid var(--border-light); border-radius: 16px; background: var(--bg-sunken, var(--bg-app)); }
.hy-reader__find-box .hy-input { flex: 1; min-inline-size: 0; border: 0; background: transparent; box-shadow: none; }
.hy-reader__find-box .hy-btn { min-block-size: 42px; border-radius: 12px; }
.hy-reader__find-close { position: absolute; inset-block-start: .8rem; inset-inline-end: .8rem; display: grid; place-items: center; inline-size: 36px; block-size: 36px; border: 0; border-radius: 11px; background: var(--bg-sunken, var(--bg-app)); color: var(--text-secondary); cursor: pointer; }
.hy-reader__find-out { max-block-size: 52vh; overflow: auto; padding: .9rem 1.2rem 1.2rem; }
.hy-reader__find-out:empty { display: none; }
.hy-reader__find-count, .hy-reader__find-wait { margin: 0 0 .7rem; color: var(--text-muted); font-size: .86rem; }
.hy-reader__find-hits { display: grid; gap: .45rem; margin: 0; padding: 0; list-style: none; }
.hy-reader__find-hit { display: grid; gap: .25rem; padding: .7rem .85rem; border-radius: 14px; background: var(--bg-sunken, var(--bg-app)); color: inherit; text-decoration: none; }
.hy-reader__find-hit:hover { background: color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 14%, transparent); color: inherit; }
.hy-reader__find-hit span { color: var(--text-secondary); font-size: .86rem; line-height: 1.6; }
.hy-reader__find-hit .hy-book-toc__num { display: none; }

/* The text: the reader's size and spacing (from books.js) scale the language's own. */
.hy-reader-on .hy-item .hy-item__text { font-size: calc(var(--hy-item-size) * var(--lang-font-scale, 1) * var(--hy-reader-scale, 1)); }
.hy-reader-on[data-reader-leading="loose"] .hy-item .hy-item__text { line-height: calc(var(--hy-item-line) * 1.15); }
.hy-reader-on[data-reader-leading="looser"] .hy-item .hy-item__text { line-height: calc(var(--hy-item-line) * 1.32); }
.hy-reader-page .hy-item__text:lang(ur), .hy-reader-page .hy-item:lang(ur) .hy-item__text { font-family: var(--font-text, var(--font-body, serif)); line-height: max(var(--hy-item-line), 2.7);
    word-spacing: .05em; text-align: start; }
.hy-reader-on[data-reader-leading="loose"] .hy-item:lang(ur) .hy-item__text { line-height: 3.05; }
.hy-reader-on[data-reader-leading="looser"] .hy-item:lang(ur) .hy-item__text { line-height: 3.4; }
.hy-reader-page .hy-item__text:lang(hi) { line-height: max(var(--hy-item-line), 1.9); }

/* The visitor's choice of font for the text: the book's reading font (the theme's, per language) or the plain font of the site. */
.hy-reader-on[data-reader-font="plain"] .hy-item .hy-item__text.hb-flow { font-family: var(--font-body); }
.hy-reader__fonts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; padding: 3px; border-radius: 14px; background: var(--bg-sunken, var(--bg-app)); }
.hy-reader__font { display: grid; justify-items: center; gap: .1rem; padding: .35rem .3rem; border: 0; border-radius: 11px; background: transparent; color: var(--text-secondary); font-size: .74rem; font-weight: 700; cursor: pointer; }
.hy-reader__font b { font-size: 1.15rem; line-height: 1.2; color: var(--text-main); }
.hy-reader__font--text b { font-family: var(--font-text); }
.hy-reader__font--plain b { font-family: var(--font-body); }
.hy-reader__font[aria-pressed="true"] { background: var(--bg-card); box-shadow: 0 1px 3px rgb(0 0 0 / .1); color: var(--text-main); }

/* Day, sepia and night: the text's whole card takes the paper and its ink (warm, soft contrast, never pure black on white). */
.hy-reader-on[data-reader-theme="sepia"] { --hy-paper: #f4e9d2; --hy-paper-2: #ecdfc3; --hy-paper-line: #dccaa5; --hy-ink: #3d2f20; --hy-ink-muted: #6e5a41; --hy-ink-head: #2e2216; }
.hy-reader-on[data-reader-theme="night"] { --hy-paper: #1b1e1c; --hy-paper-2: #232724; --hy-paper-line: #343a36; --hy-ink: #d8d3c6; --hy-ink-muted: #9b978b; --hy-ink-head: #efe9da; }
.hy-reader-on:is([data-reader-theme="sepia"], [data-reader-theme="night"]) .hy-reader-page .hy-blk--main {
    --bg-card: var(--hy-paper); --bg-sunken: var(--hy-paper-2); --bg-app: var(--hy-paper-2); --border-light: var(--hy-paper-line); --hy-line: var(--hy-paper-line);
    --text-main: var(--hy-ink); --hy-text: var(--hy-ink); --text-secondary: var(--hy-ink-muted); --hy-muted: var(--hy-ink-muted); --text-muted: var(--hy-ink-muted); --text-heading: var(--hy-ink-head);
    --hb-text: var(--hy-ink); --hb-primary: var(--hy-ink-head); background: var(--hy-paper); border-color: var(--hy-paper-line); color: var(--hy-ink); transition: background-color .4s var(--hy-ease), color .4s var(--hy-ease); }
.hy-reader-on:is([data-reader-theme="sepia"], [data-reader-theme="night"]) .hy-reader-page .hy-blk--main .hy-post__head { background: linear-gradient(180deg, var(--hy-paper-2), var(--hy-paper)); border-color: var(--hy-paper-line); }
.hy-reader-on:is([data-reader-theme="sepia"], [data-reader-theme="night"]) .hy-reader-page .hy-blk--main :is(h1, h2, h3, h4, h5, h6) { color: var(--hy-ink-head); }
.hy-reader-on:is([data-reader-theme="sepia"], [data-reader-theme="night"]) .hy-reader-page .hy-blk--main :is(p, li, td, th, blockquote, figcaption, dd, dt) { color: inherit; }
.hy-reader-on:is([data-reader-theme="sepia"], [data-reader-theme="night"]) .hy-reader-page .hy-blk--main :is(table, th, td) { border-color: var(--hy-paper-line); background: transparent; }
.hy-reader-on:is([data-reader-theme="sepia"], [data-reader-theme="night"]) .hy-reader-page .hy-blk--main th { background: var(--hy-paper-2); }
.hy-reader-on:is([data-reader-theme="sepia"], [data-reader-theme="night"]) .hy-reader-page .hy-blk--main blockquote { background: var(--hy-paper-2); }
.hy-reader-on:is([data-reader-theme="sepia"], [data-reader-theme="night"]) .hy-reader-page .hy-blk--main a:not([class]) { color: inherit; }
.hy-reader-on[data-reader-theme="night"] .hy-reader-page .hy-blk--main img { filter: brightness(.85); }
/* The reader's bar does what the page's own size, night and reading tools do. */
.hy-reader-on .hy-reader-page :is(.hy-tools__item--font_size, .hy-tools__item--night, .hy-tools__item--reading_mode) { display: none; }

/* Full screen: only the text, on its paper. */
.hy-item.is-fullscreen { overflow: auto; padding: 1rem clamp(1rem, 6vw, 4rem) 3rem; background: var(--hy-paper, var(--bg-app)); color: var(--hy-ink, var(--text-main)); }
.hy-item.is-fullscreen .hy-reader { inset-block-start: 0; }
.hy-item.is-fullscreen :is(.hy-item__foot, .hy-tools, .hy-post__strip, .hy-post__crumbs) { display: none; }

/* Pages of a chapter (2026-10-29, smaller): a small capsule in the middle under the text — round arrows (the next one maroon with a gold
   arrow), "Page 1 of 3" and a dot per page; the words of the arrows are for screen readers only. */
.hy-item__pages:has(> .hy-pager) { display: flex; justify-content: center; margin: 0; }
.hy-pager { display: inline-flex; align-items: center; gap: .35rem; inline-size: fit-content; max-inline-size: 100%; margin-block: 1.5rem 0; padding: 3px;
    border: 1px solid color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 30%, transparent); border-radius: 999px; background: var(--bg-card); box-shadow: 0 6px 16px -12px rgb(0 0 0 / .35); }
.hy-pager__btn { position: relative; display: grid; place-items: center; flex: none; inline-size: 30px; block-size: 30px; padding: 0; border-radius: 50%; text-decoration: none;
    background: color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 14%, transparent); color: var(--hy-bk-maroon, var(--color-primary)); transition: transform .25s var(--hy-ease), background-color .25s var(--hy-ease); }
.hy-pager__btn > span { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hy-pager__btn--next { background: var(--hy-bk-maroon, var(--color-primary)); color: var(--hy-bk-gold, rgb(255 255 255)); }
.hy-pager__btn:hover { color: var(--hy-bk-maroon, var(--color-primary)); background: color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 28%, transparent); transform: scale(1.08); }
.hy-pager__btn--next:hover { color: var(--hy-bk-gold, rgb(255 255 255)); background: var(--hy-bk-maroon, var(--color-primary)); }
.hy-pager__btn.is-off { display: none; }
.hy-pager__btn .hy-icon { inline-size: 14px; block-size: 14px; }
.hy-pager__mid { display: inline-flex; align-items: center; gap: .55rem; padding-inline: .6rem; }
.hy-pager__of { color: var(--text-secondary); font-size: .72rem; font-weight: 700; white-space: nowrap; }
.hy-pager__dots { display: flex; align-items: center; gap: 4px; }
.hy-pager__dot { inline-size: 6px; block-size: 6px; border-radius: 999px; background: color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 40%, transparent); transition: inline-size .3s var(--hy-ease), background-color .3s var(--hy-ease); }
.hy-pager__dot:hover { background: var(--hy-bk-gold, #a98b4f); }
.hy-pager__dot.is-current { inline-size: 14px; background: var(--hy-bk-maroon, var(--color-primary)); }
@media (max-width: 30rem) { .hy-pager__dots { display: none; } }
/* Only the last page ends with the stars; the chapter navigation waits for it too. */
.hy-reader-page .hy-item__body:has(.hy-pager[data-last="0"]) .hy-item__text::after { display: none; }

/* A protected book: its words cannot be selected; the text is veiled while the window is not in front;
   it never prints. */
.hy-protect .hy-item__text, .hy-protect .hy-item__title { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.hy-protect .hy-item__text img { pointer-events: none; }
.hy-veiled .hy-protect .hy-blk--main { filter: blur(16px); transition: filter .1s; }
.hy-protect .hy-item__text[data-hy-mark] { background-image: var(--hy-protect-mark); background-repeat: repeat; background-size: 340px 190px; }
@media print { .hy-protect .hy-main { display: none !important; } }
/* Marks in the text. */
mark.hy-find { background: color-mix(in srgb, var(--color-warning, #a9812f) 38%, transparent); color: inherit; border-radius: 2px; }
mark.hy-hl { color: inherit; border-radius: 2px; scroll-margin-block: 30vh; }
mark.hy-hl--yellow { background: rgba(255, 214, 10, .45); }
mark.hy-hl--green { background: rgba(110, 200, 120, .4); }
mark.hy-hl--blue { background: rgba(110, 170, 255, .38); }
mark.hy-hl--pink { background: rgba(255, 130, 180, .38); }
.hy-reader-on[data-reader-theme="night"] mark.hy-hl--yellow, .hy-reader-on[data-reader-theme="night"] mark.hy-find { background: rgba(255, 214, 10, .3); }

/* The way on: two raised cards with arrow tiles, the book's contents between them as a maroon medallion. */
.hy-chapter-nav { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; gap: .75rem; margin-block: 2.5rem 0; padding-block-start: 1.5rem; border-block-start: 1px solid var(--hy-paper-line, var(--border-light)); }
.hy-chapter-nav__link { display: flex; align-items: center; gap: .8rem; padding: .65rem; border-radius: 18px; border: 1px solid var(--hy-paper-line, var(--hy-bk-line, var(--border-light))); background: var(--hy-paper, var(--bg-card));
    color: inherit; text-decoration: none; min-inline-size: 0; transition: transform .3s var(--hy-ease), box-shadow .3s var(--hy-ease), border-color .3s var(--hy-ease); }
.hy-chapter-nav__link--next { flex-direction: row-reverse; text-align: end; }
.hy-chapter-nav__link:hover { border-color: var(--hy-bk-gold, var(--color-primary)); color: inherit; transform: translateY(-2px); box-shadow: 0 16px 30px -22px rgb(0 0 0 / .32); }
.hy-chapter-nav__icon { flex: none; display: grid; place-items: center; inline-size: 42px; block-size: 42px; border-radius: 13px; background: var(--bg-sunken, var(--bg-app)); color: var(--hy-bk-maroon, var(--color-primary));
    transition: background-color .3s var(--hy-ease), color .3s var(--hy-ease); }
.hy-chapter-nav__link:hover .hy-chapter-nav__icon { background: var(--hy-bk-maroon, var(--color-primary)); color: var(--hy-bk-gold, #fff); }
.hy-chapter-nav__text { display: grid; gap: .15rem; min-inline-size: 0; }
.hy-chapter-nav__label { color: var(--hy-ink-muted, var(--text-muted)); font-size: .74rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.hy-chapter-nav__title { font-weight: 800; overflow-wrap: anywhere; }
.hy-chapter-nav__book { display: grid; place-items: center; align-content: center; gap: .3rem; padding: .5rem .9rem; border-radius: 18px; color: inherit; text-decoration: none; font-size: .8rem; font-weight: 700; }
.hy-chapter-nav__book-icon { display: grid; place-items: center; inline-size: 46px; block-size: 46px; border-radius: 50%; background: var(--hy-bk-leather, var(--color-primary)); color: var(--hy-bk-gold, #fff);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 22%, transparent); transition: transform .45s cubic-bezier(.34, 1.56, .64, 1); }
.hy-chapter-nav__book:hover .hy-chapter-nav__book-icon { transform: rotate(-12deg) scale(1.06); }

/* A chapter's text: a drop cap in maroon for left-to-right scripts, three stars where the text ends. */
.hy-reader-page .hy-item[dir="ltr"] .hy-item__text > p:first-of-type::first-letter { float: inline-start; margin-inline-end: .45rem; padding-block-start: .1em; font-size: 3.3em; line-height: .85; font-weight: 800; color: var(--hy-bk-maroon); }
.hy-reader-page .hy-item__text::after { content: "*  *  *"; display: block; margin-block-start: 2rem; color: var(--hy-bk-gold); font-size: 1.4rem; font-weight: 700; letter-spacing: .5em; text-align: center; white-space: pre; }

@media (max-width: 767.98px) {
    .hy-reader { inset-block-start: 0; margin-inline: -.5rem; }
    .hy-reader__bar { border-radius: 0 0 12px 12px; }
    .hy-reader__where { inline-size: 100%; }
    .hy-reader__tools { inline-size: 100%; justify-content: space-between; }
    .hy-chapter-nav { grid-template-columns: 1fr 1fr; }
    .hy-chapter-nav__book { grid-column: 1 / -1; grid-row: 2; display: flex; justify-content: center; align-items: center; gap: .6rem; }
    .hy-chapter-nav__link { flex-direction: column; align-items: flex-start; text-align: start; }
    .hy-chapter-nav__link--next { align-items: flex-end; text-align: end; }
}
@media print {
    .hy-reader, .hy-chapter-nav, .hy-book__actions, .hy-book__search { display: none; }
    mark.hy-hl, mark.hy-find { background: none; }
}

/* (2026-10-29, round 8 — the user's correction) The book's facts as a colophon: small tiles in three columns, the name in small gold
   capitals over the value in the reading face, hairlines between; the figures as small chips in one row; the reading buttons small
   pills with an icon, not big blocks. */
/* The facts: the earlier two columns of dashed rows (name at the start, value at the end), in the small gold capitals and the reading face. */
.hy-book .hy-book__spec dt { gap: .4rem; color: var(--hy-bk-gold); font-size: .66rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.hy-book .hy-book__spec dt .hy-icon { inline-size: 14px; block-size: 14px; }
.hy-book .hy-book__spec dd { color: var(--text-heading, var(--hy-text)); font-family: var(--font-text, inherit); font-size: 1.04rem; font-weight: 600; }
.hy-book .hy-book__spec--isbn dd { font-family: var(--font-body, inherit); font-size: .9rem; letter-spacing: .04em; }
/* The figures and the reading buttons at the end of the box (the right in a left-to-right page). */
.hy-book .hy-book__stats, .hy-book .hy-book__actions { justify-content: flex-end; }.hy-book .hy-book__stats { display: flex; flex-wrap: wrap; gap: .4rem; }
.hy-book .hy-book__stat { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .75rem .3rem .35rem; border-radius: 999px; background: var(--bg-card); }
[dir="rtl"] .hy-book .hy-book__stat { padding: .3rem .35rem .3rem .75rem; }
.hy-book .hy-book__stat .hy-icon { display: block; inline-size: 26px; block-size: 26px; padding: 6px; border-radius: 50%; }
.hy-book .hy-book__stat strong { font-size: .88rem; font-weight: 800; }
.hy-book .hy-book__stat span { font-size: .74rem; }
.hy-book .hy-book__actions { gap: .4rem; }
.hy-book .hy-book__actions .hy-btn { flex: 0 0 auto; min-block-size: 36px; padding: .3rem .95rem .3rem .4rem; border-radius: 999px; font-size: .84rem; font-weight: 700; gap: .4rem; }
[dir="rtl"] .hy-book .hy-book__actions .hy-btn { padding: .3rem .4rem .3rem .95rem; }
.hy-book .hy-book__btn-icon { inline-size: 26px; block-size: 26px; border-radius: 50%; }
.hy-book .hy-book__btn-icon .hy-icon { inline-size: 14px; block-size: 14px; }
.hy-book .hy-book__read { box-shadow: 0 8px 16px -12px rgb(0 0 0 / .45); }

/* =====================================================================
   The printed page (2026-10-29; Books\Services\BookLayout): a chapter —
   or a book's own text — read page by page as a printed book. The
   text's card is a sheet of paper (classic cream, modern white, antique
   old paper; or black and white); the first page opens the chapter (a
   large number, a rule, "Chapter", the title in capitals, a short
   accent rule); later pages carry a running head (the book · the
   chapter) instead of the title; every page its number at the foot;
   a dropped first letter, justified lines, section headings in small
   capitals, an opening quotation set as an epigraph, quiet book tables.
   The reader's own paper (sepia, night) and the site's night mode win.
   ===================================================================== */
.hy-pp { --pp-paper: #fbf7ec; --pp-ink: #2a251b; --pp-muted: #8a7f69; --pp-accent: color-mix(in srgb, var(--color-danger, #a8443c) 62%, #2a0a12); --pp-rule: color-mix(in srgb, var(--pp-ink) 22%, transparent); }
.hy-pp--modern { --pp-paper: #ffffff; --pp-ink: #1d2024; --pp-muted: #8a9098; --pp-accent: var(--color-primary, #46704f); }
.hy-pp--antique { --pp-paper: #f2e5c8; --pp-ink: #3a2a17; --pp-muted: #8c7350; --pp-accent: #7b3a1c; }
.hy-pp--mono { --pp-accent: var(--pp-ink); }
.hy-pp--mono .hy-item__text :is(img, picture, video, svg) { filter: grayscale(1) contrast(1.05); }
:root[data-mode="dark"] .hy-pp { --pp-paper: var(--bg-card); --pp-ink: var(--text-main, #e8e6dc); --pp-muted: var(--text-muted, #a6a491); --pp-accent: var(--color-accent, #c9ad73); }
/* the sheet */
:root:not([data-reader-theme="sepia"]):not([data-reader-theme="night"]) .hy-pp .hy-pp-page .hy-blk--main { background: var(--pp-paper); color: var(--pp-ink); }
:root:not([data-reader-theme="sepia"]):not([data-reader-theme="night"]) .hy-pp--antique .hy-pp-page .hy-blk--main {
    background: radial-gradient(120% 90% at 50% 40%, transparent 55%, rgb(120 80 30 / .16)), radial-gradient(5px 4px at 18% 28%, rgb(130 90 40 / .1), transparent), radial-gradient(7px 6px at 82% 70%, rgb(130 90 40 / .08), transparent), var(--pp-paper); }
.hy-pp .hy-pp-page .hy-blk--main { position: relative; border-radius: 6px; box-shadow: 0 1px 2px rgb(0 0 0 / .06), 0 24px 44px -30px rgb(0 0 0 / .35), 8px 0 0 -4px color-mix(in srgb, var(--pp-paper) 92%, #000), 14px 0 0 -8px color-mix(in srgb, var(--pp-paper) 85%, #000); }
[dir="rtl"] .hy-pp .hy-pp-page .hy-blk--main { box-shadow: 0 1px 2px rgb(0 0 0 / .06), 0 24px 44px -30px rgb(0 0 0 / .35), -8px 0 0 -4px color-mix(in srgb, var(--pp-paper) 92%, #000), -14px 0 0 -8px color-mix(in srgb, var(--pp-paper) 85%, #000); }
.hy-pp .hy-pp-page .hy-post__head { background: none; border-block-end: 0; }
.hy-pp .hy-pp-page .hy-post__head::before, .hy-pp .hy-pp-page .hy-post__head::after { display: none; }
/* the chapter's opening page */
.hy-pp--ornate .hy-pp-page--first .hy-post__head { padding-block-start: clamp(2.5rem, 9vw, 6rem); }
.hy-pp__opener { display: flex; align-items: center; gap: .9rem; margin: 0 0 1.1rem; }
.hy-pp__num { color: var(--pp-ink); font-family: var(--font-text, Georgia, serif); font-size: clamp(3.4rem, 2.4rem + 3vw, 5.4rem); font-weight: 400; line-height: .85; letter-spacing: -.02em; }
.hy-pp__label { padding-inline-start: .9rem; border-inline-start: 2px solid var(--pp-accent); color: var(--pp-accent); font-size: .8rem; font-weight: 700; letter-spacing: .3em; line-height: 2.2; text-transform: uppercase; }
.hy-pp .hy-pp-page .hy-item__title { color: var(--pp-ink); font-family: var(--font-text, inherit); font-weight: 700; letter-spacing: .01em; }
.hy-pp:is(.hy-pp--classic, .hy-pp--antique) .hy-pp-page .hy-item__title:not(:lang(fa)):not(:lang(ar)):not(:lang(ur)) { text-transform: uppercase; letter-spacing: .04em; font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.5rem); }
.hy-pp .hy-pp-page .hy-item__title::after { inline-size: 3.2rem; block-size: 2px; margin-block-start: 1rem; background: var(--pp-accent); border-radius: 0; }
.hy-pp .hy-pp-page .hy-item__lead { border: 0; padding: 0; color: var(--pp-muted); font-family: var(--font-text, inherit); font-style: italic; }
/* later pages: the running head instead of the title */
.hy-pp--ornate .hy-pp-page--later .hy-post__head { display: none; }
.hy-pp__running { display: flex; justify-content: space-between; gap: 1rem; margin: 0; padding: 1.1rem var(--hy-main-pad) .7rem; border-block-end: 1px solid var(--pp-rule); color: var(--pp-muted);
    font-family: var(--font-text, inherit); font-size: .74rem; letter-spacing: .2em; text-transform: uppercase; }
.hy-pp__running span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hy-pp__running :lang(fa), .hy-pp__running:lang(fa), .hy-pp__running:lang(ar), .hy-pp__running:lang(ur) { letter-spacing: 0; }
/* the page's number */
.hy-pp__folio { margin: 2.2rem 0 0; color: var(--pp-muted); font-family: var(--font-text, inherit); font-size: .9rem; font-variant-numeric: oldstyle-nums; text-align: center; }
.hy-pp__folio::before, .hy-pp__folio::after { content: "—"; margin-inline: .6em; opacity: .5; }
/* the text */
.hy-pp .hy-pp-page .hy-item__text { color: var(--pp-ink); }
.hy-pp--justify .hy-pp-page .hy-item__text :is(p, li) { text-align: justify; hyphens: auto; }
.hy-pp:not(.hy-pp--justify) .hy-pp-page .hy-item__text :is(p, li) { text-align: start; }
.hy-pp .hy-pp-page .hy-item__text > p + p { margin-block-start: -.35em; text-indent: 1.6em; }
.hy-pp--modern .hy-pp-page .hy-item__text > p + p { margin-block-start: 0; text-indent: 0; }
.hy-pp .hy-pp-page .hy-item__text :is(h2, h3, h4) { color: var(--pp-ink); font-family: var(--font-text, inherit); font-variant: small-caps; font-weight: 700; letter-spacing: .03em; }
.hy-pp .hy-pp-page .hy-item__text :is(h2, h3, h4):is(:lang(fa), :lang(ar), :lang(ur)) { font-variant: normal; letter-spacing: 0; }
.hy-pp .hy-pp-page .hy-item__text a { color: var(--pp-accent); }
/* the dropped first letter (first page only; left-to-right scripts) */
.hy-reader-page .hy-item[dir="ltr"] .hy-item__text > p:first-of-type::first-letter { float: none; margin: 0; padding: 0; font-size: inherit; line-height: inherit; font-weight: inherit; color: inherit; }
.hy-pp--dropcap .hy-pp-page--first[dir="ltr"] .hy-item__text > p:first-of-type::first-letter { float: inline-start; margin-inline-end: .5rem; padding-block-start: .08em; color: var(--pp-accent); font-family: var(--font-text, Georgia, serif);
    font-size: 3.5em; font-weight: 700; line-height: .82; }
.hy-pp--dropcap .hy-pp-page--first .hy-item__text > p:first-of-type { text-indent: 0; }
/* an opening quotation: an epigraph — italic, set in from both sides between two short rules */
.hy-pp .hy-pp-page--first .hy-item__text > blockquote:first-child, .hy-pp .hy-pp-page--first .hy-item__text > .hb-quote:first-child {
    margin: 0 auto 1.8em; max-inline-size: 34em; padding: 1em 0; border: 0; border-block: 1px solid var(--pp-accent); background: none; color: var(--pp-ink); font-style: italic; text-align: center; }
/* book tables and figures */
.hy-pp .hy-item__text table { border-collapse: collapse; border-block: 2px solid var(--pp-ink); font-size: .9em; }
.hy-pp .hy-item__text :is(th, td) { padding: .45em .8em; border: 0; border-block-end: 1px solid var(--pp-rule); background: none; }
.hy-pp .hy-item__text th { color: var(--pp-ink); font-weight: 700; text-align: start; }
.hy-pp .hy-item__text :is(figcaption, .hb-caption) { color: var(--pp-muted); font-style: italic; text-align: center; }
/* the pager under a printed page: quiet */
.hy-pp .hy-pp-page .hy-pager { margin-block-start: 1.4rem; }
/* A book's own text read in pages: the book's box only on the first page. */
body.hy-pp:has(.hy-pp-page--later) section.hy-book { display: none; }
/* The contents of a book's own text, like a printed "Índice": a large accent number for each top heading, the headings under it
   indented, a dotted leader to the page number. */
.hy-pp-toc { margin: 0 0 2.4rem; padding: clamp(1.1rem, 3vw, 2rem) 0 0; border-block-start: 1px solid var(--pp-rule); }
.hy-pp-toc__title { margin: 0 0 1.3rem; color: var(--pp-accent); font-family: var(--font-text, inherit); font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.3rem); font-weight: 700; }
.hy-pp-toc__list { display: grid; gap: .15rem; margin: 0; padding: 0; list-style: none; column-gap: 3rem; }
@media (min-width: 900px) { .hy-pp-toc__list { display: block; columns: 2; } .hy-pp-toc__item { break-inside: avoid; } }
.hy-pp-toc__item a { display: flex; align-items: baseline; gap: .55rem; padding: .3rem 0; color: var(--pp-ink); text-decoration: none; background: none; }
.hy-pp-toc__item a:hover .hy-pp-toc__text { color: var(--pp-accent); }
.hy-pp-toc__item--top { margin-block-start: .9rem; }
.hy-pp-toc__item--top:first-child { margin-block-start: 0; }
.hy-pp-toc__item--top a { font-family: var(--font-text, inherit); font-size: 1.12rem; font-weight: 700; }
.hy-pp-toc__num { flex: none; min-inline-size: 2.4ch; color: var(--pp-accent); font-family: var(--font-text, inherit); font-size: 2rem; font-weight: 700; line-height: 1; }
.hy-pp-toc__item--sub a { padding-inline-start: calc(2.4ch + 1.6rem); font-size: .92rem; }
.hy-pp-toc__text { transition: color .2s ease; }
.hy-pp-toc__dots { flex: 1; min-inline-size: 1.5rem; border-block-end: 1px dotted color-mix(in srgb, var(--pp-ink) 35%, transparent); transform: translateY(-.25em); }
.hy-pp-toc__page { flex: none; color: var(--pp-muted); font-variant-numeric: oldstyle-nums tabular-nums; }@media (max-width: 575.98px) { .hy-pp__running { padding-inline: 1.15rem; letter-spacing: .12em; } .hy-pp__num { font-size: 3rem; } }
@media print { .hy-pp__running, .hy-pp__folio { display: none; } }

/* =====================================================================
   The library's shelves, round 9 (2026-10-29; like a reading room):
   one soft room; each shelf its name and count, the covers standing on
   a wooden ledge with a shadow under it, lifting a little under the
   pointer, the title under each; a member's books in progress first
   with a thin bar, and "continue reading" beside the shelves.
   ===================================================================== */
.hy-room { display: grid; gap: 1rem; padding: clamp(.8rem, 2vw, 1.4rem); border-radius: 26px; background: linear-gradient(180deg, color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 8%, var(--bg-card)), color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 4%, var(--bg-app)));
    border: 1px solid color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 20%, transparent); box-shadow: inset 0 1px 0 rgb(255 255 255 / .6); }
.hy-room--side { grid-template-columns: minmax(0, 1fr) 12.5rem; align-items: start; }
.hy-room__shelves { display: grid; gap: 1.6rem; min-inline-size: 0; }
.hy-room .hy-shelf { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
.hy-room .hy-shelf::before, .hy-room .hy-shelf::after { display: none; }
.hy-room .hy-shelf__head { margin-block-end: .5rem; padding: 0; }
.hy-room .hy-shelf__title { font-size: 1rem; }
.hy-shelf__row { position: relative; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); align-items: end; gap: clamp(.6rem, 1.6vw, 1.3rem); padding: 1rem .9rem 3rem; }
.hy-shelf__row + .hy-shelf__row { margin-block-start: .4rem; }
@media (max-width: 991.98px) { .hy-shelf__row { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .hy-shelf__row { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.hy-room .hy-shelf { position: relative; min-inline-size: 0; inline-size: auto; margin-inline: 0; }
.hy-room .hy-shelf .hy-shelf__row::before { content: ""; position: absolute; inset-inline: 0; inset-block-end: 2.45rem; block-size: 14px; border-radius: 4px; z-index: 0;
    background: linear-gradient(180deg, color-mix(in srgb, #f3e6cc 92%, var(--hy-bk-gold, #a98b4f)), color-mix(in srgb, #d9c4a0 85%, var(--hy-bk-gold, #a98b4f)));
    box-shadow: 0 12px 16px -8px rgb(60 40 15 / .35), inset 0 -3px 0 rgb(0 0 0 / .07), inset 0 1px 0 rgb(255 255 255 / .8); min-inline-size: 100%; }
.hy-stand { position: relative; z-index: 1; display: grid; justify-items: center; gap: .4rem; inline-size: 100%; max-inline-size: 8rem; justify-self: center; color: inherit; text-decoration: none; background: none; }
.hy-stand__cover { display: block; inline-size: 100%; aspect-ratio: 2 / 3; overflow: hidden; border-radius: 3px 6px 6px 3px; background: var(--hy-bk-maroon, #6b2a2a);
    box-shadow: 2px 0 0 -1px #f3ecdc, 4px 1px 0 -1px #ddd0b4, 0 10px 14px -8px rgb(0 0 0 / .5); transform-origin: bottom center; transition: transform .45s cubic-bezier(.2, .8, .2, 1), box-shadow .45s ease; }
[dir="rtl"] .hy-stand__cover { border-radius: 6px 3px 3px 6px; box-shadow: -2px 0 0 -1px #f3ecdc, -4px 1px 0 -1px #ddd0b4, 0 10px 14px -8px rgb(0 0 0 / .5); }
.hy-stand__cover :is(picture, img) { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; }
.hy-stand__cover::after { content: ""; position: absolute; }
.hy-stand__blank { display: grid; place-items: center; block-size: 100%; padding: .5rem; color: var(--hy-bk-gold, #a98b4f); font-size: .74rem; font-weight: 800; text-align: center; }
.hy-stand:hover .hy-stand__cover, .hy-stand:focus-visible .hy-stand__cover { transform: translateY(-8px) rotate(-1.5deg); box-shadow: 2px 0 0 -1px #f3ecdc, 4px 1px 0 -1px #ddd0b4, 0 20px 24px -12px rgb(0 0 0 / .5); }
.hy-stand__title { position: absolute; inset-block-start: calc(100% + .1rem); inset-inline: -.4rem; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; line-clamp: 1; overflow: hidden;
    margin-block-start: 1.35rem; color: var(--hy-muted); font-size: .7rem; font-weight: 700; text-align: center; }
.hy-stand__bar { position: absolute; z-index: 2; inset-inline: 8%; inset-block-end: -.5rem; block-size: 4px; border-radius: 999px; background: rgb(0 0 0 / .14); overflow: hidden; }
.hy-stand__bar span { display: block; block-size: 100%; border-radius: inherit; background: var(--hy-bk-maroon, #6b2a2a); }
.hy-stand:focus-visible { outline: none; }
.hy-stand:focus-visible .hy-stand__cover { outline: 3px solid var(--hy-bk-gold, #a98b4f); outline-offset: 3px; }
/* continue reading */
.hy-room__side { position: sticky; inset-block-start: calc(var(--hy-header-sticky, 0px) + 1rem); display: grid; justify-items: center; gap: .9rem; padding: 1rem .9rem 1.1rem; border-radius: 20px;
    background: color-mix(in srgb, var(--bg-card) 80%, transparent); border: 1px solid color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 22%, transparent); box-shadow: 0 16px 30px -24px rgb(0 0 0 / .4); }
.hy-room__label { margin: 0; color: var(--hy-bk-gold, #a98b4f); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.hy-room__side .hy-stand { inline-size: 7.5rem; }
.hy-room__side .hy-stand__title { position: static; -webkit-line-clamp: 2; line-clamp: 2; margin-block-start: .5rem; color: var(--hy-text); font-size: .8rem; }
.hy-room__side .hy-stand__bar { inset-block-end: auto; inset-block-start: calc(100% * 1.5 - .1rem); }
.hy-room__go { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem 1rem; border-radius: 999px; background: var(--hy-bk-maroon, #6b2a2a); color: rgb(255 255 255); font-size: .8rem; font-weight: 800; text-decoration: none; }
.hy-room__go .hy-icon { inline-size: 15px; block-size: 15px; color: var(--hy-bk-gold, #a98b4f); }
@media (max-width: 767.98px) { .hy-room--side { grid-template-columns: minmax(0, 1fr); } .hy-room__side { position: static; order: -1; grid-template-columns: auto minmax(0, 1fr); justify-items: start; align-items: center; } .hy-room__side .hy-stand { inline-size: 5rem; } }
@media (prefers-reduced-motion: reduce) { .hy-stand__cover { transition: none; } }
/* (fix) The title in the flow under the cover; the ledge sits right under the covers, the titles under the ledge. */
.hy-room .hy-shelf__row { padding-block-end: .6rem; }
.hy-room .hy-shelf .hy-shelf__row::before { inset-block-end: 1.775rem; }
.hy-room .hy-stand { gap: .7rem; }
.hy-room .hy-stand__title { position: static; margin: 0; inline-size: 100%; line-height: 1.1rem; block-size: 1.1rem; }
.hy-room .hy-stand__bar { inset-block-end: calc(1.1rem + .7rem + .35rem); }

/* =====================================================================
   A book's contents (2026-10-30): the chapters of the book's own text
   as a printed "Índice" — a large title, each chapter with its number
   in large accent figures, its name, a dotted leader and its page (or
   its reading time), its sections under it in a quieter hand. Each
   line opens the reader there.
   ===================================================================== */
.hy-bktoc { --bt-accent: var(--hy-bk-maroon, var(--color-primary)); position: relative; margin-block: 2rem 0; padding: clamp(1.25rem, 3.4vw, 2.6rem) clamp(1.1rem, 4vw, 3rem);
    border-radius: 22px; border: 1px solid var(--hy-bk-line, var(--border-light)); background: var(--hy-bk-paper, var(--bg-card)); box-shadow: 0 26px 50px -40px rgb(0 0 0 / .4); }
:root[data-mode="dark"] .hy-bktoc { --bt-accent: var(--hy-bk-gold, var(--color-accent)); }
.hy-bktoc__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .4rem 1rem; margin-block-end: clamp(1rem, 2.4vw, 1.6rem); padding-block-end: .9rem;
    border-block-end: 2px solid var(--bt-accent); }
.hy-bktoc__title { margin: 0; color: var(--bt-accent); font-family: var(--font-text, Georgia, serif); font-size: clamp(1.9rem, 1.3rem + 2vw, 2.9rem); font-weight: 700; line-height: 1.1; letter-spacing: -.01em; }
.hy-bktoc__count { color: var(--text-muted); font-size: .82rem; font-weight: 700; letter-spacing: .06em; }
.hy-bktoc__list { display: grid; margin: 0; padding: 0; list-style: none; }
.hy-bktoc__chapter { padding-block: .35rem; animation: hy-bk-rise .5s var(--hy-ease) both; }
.hy-bktoc__chapter + .hy-bktoc__chapter { border-block-start: 1px solid color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 20%, transparent); }
.hy-bktoc__link { display: flex; align-items: baseline; gap: .9rem; padding: .55rem .4rem; border-radius: 12px; color: var(--text-heading, var(--hy-text)); text-decoration: none; transition: background-color .25s var(--hy-ease); }
.hy-bktoc__link:hover { background: color-mix(in srgb, var(--hy-bk-gold, #a98b4f) 10%, transparent); color: var(--text-heading, var(--hy-text)); }
.hy-bktoc__num { flex: none; min-inline-size: 2.2ch; color: var(--bt-accent); font-family: var(--font-text, Georgia, serif); font-size: clamp(1.7rem, 1.3rem + 1.2vw, 2.3rem); font-weight: 700; line-height: 1;
    font-variant-numeric: lining-nums tabular-nums; transition: transform .35s cubic-bezier(.34, 1.56, .64, 1); }
.hy-bktoc__link:hover .hy-bktoc__num { transform: translateY(-2px) scale(1.06); }
.hy-bktoc__name { flex: 0 1 auto; min-inline-size: 0; font-family: var(--font-text, inherit); font-size: clamp(1.02rem, .95rem + .3vw, 1.18rem); font-weight: 700; line-height: 1.45; }
.hy-bktoc__dots { flex: 1 1 1.5rem; min-inline-size: 1.5rem; block-size: 0; border-block-end: 2px dotted color-mix(in srgb, var(--text-muted) 55%, transparent); transform: translateY(-.25em); }
.hy-bktoc__page { flex: none; color: var(--text-muted); font-size: .9rem; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hy-bktoc__page:empty { display: none; }
.hy-bktoc__sections { display: grid; gap: 0; margin: 0 0 .2rem; padding: 0; padding-inline-start: calc(2.2ch * 1.9 + .9rem); list-style: none; }
.hy-bktoc__link--sub { gap: .6rem; padding-block: .28rem; color: var(--text-secondary, var(--hy-text)); }
.hy-bktoc__link--sub .hy-bktoc__name { font-size: .96rem; font-weight: 500; }
.hy-bktoc__link--sub .hy-bktoc__dots { border-block-end-width: 1px; }
@media (max-width: 575.98px) {
    .hy-bktoc__link { gap: .65rem; }
    .hy-bktoc__sections { padding-inline-start: 2.6rem; }
}

/* The look of a book's page (books.layout_page): the large leather stage (hero), the book in the middle over its facts (centred), or a
   quiet sheet with a small cover (minimal). */
.hy-bkp--centered .hy-book--hero { grid-template-columns: minmax(0, 1fr); }
.hy-bkp--centered .hy-book__stage { padding-block: 2.6rem 3rem; }
.hy-bkp--centered .hy-book__info { justify-items: center; text-align: center; padding-block-start: 1.6rem; }
.hy-bkp--centered .hy-book__by { justify-items: center; inline-size: min(100%, 34rem); }
.hy-bkp--centered .hy-book__specs { inline-size: min(100%, 44rem); }
.hy-bkp--centered .hy-book__actions { justify-content: center; }
.hy-bkp--minimal .hy-book--hero { grid-template-columns: minmax(8rem, 11rem) minmax(0, 1fr); gap: clamp(1rem, 3vw, 2rem); padding: clamp(1rem, 2.6vw, 1.6rem); box-shadow: none; }
.hy-bkp--minimal .hy-book__stage { padding: 0; background: none; perspective: none; align-self: start; }
.hy-bkp--minimal .hy-book__stage::before, .hy-bkp--minimal .hy-book__stage::after { display: none; }
.hy-bkp--minimal .hy-book3d { inline-size: 100%; transform: none; animation: none; }
.hy-bkp--minimal .hy-book__stage:hover .hy-book3d { transform: none; }
.hy-bkp--minimal .hy-book3d__cover { transform: none; border-radius: 6px; box-shadow: 0 18px 30px -18px rgb(0 0 0 / .5); }
.hy-bkp--minimal :is(.hy-book3d__pages, .hy-book3d__back) { display: none; }
.hy-bkp--minimal .hy-book__info { padding: 0; }
@media (max-width: 575.98px) { .hy-bkp--minimal .hy-book--hero { grid-template-columns: 6.5rem minmax(0, 1fr); } .hy-bkp--minimal .hy-book__stats { grid-column: 1 / -1; } }

/* =====================================================================
   The reader (2026-10-30; books.js "The book reader"): the whole screen
   for the book. A bar at the top (back, the book and the chapter, the
   tools), the paper in the middle, the progress at the foot. The paper:
   classic cream, modern white, antique old paper; or the reader's own
   white / sepia / night. A page turns by its corner: the leaf is cut
   along the fold, the folded part shows the paper's back with a light
   along the crease and casts a shadow on the page beneath it.
   ===================================================================== */
html.hy-rd-on, html.hy-rd-on body { overflow: hidden; }
.hy-rd { --rd-paper: rgb(251 247 236); --rd-ink: rgb(42 37 27); --rd-muted: rgb(138 127 105); --rd-accent: color-mix(in srgb, var(--color-danger, rgb(168 68 60)) 62%, rgb(42 10 18));
    --rd-desk: rgb(226 219 203); --rd-chrome: rgb(246 241 230 / .88); --rd-line: color-mix(in srgb, var(--rd-ink) 14%, transparent); --rd-back: color-mix(in srgb, var(--rd-paper) 93%, rgb(120 100 60));
    --rd-scale: 1; --rd-lead: 1.62; --rd-gap: 40px;
    position: fixed; inset: 0; z-index: 2100; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; background: var(--rd-desk); color: var(--rd-ink);
    -webkit-tap-highlight-color: transparent; animation: hy-rd-in .35s var(--hy-ease) both; }
@keyframes hy-rd-in { from { opacity: 0; } to { opacity: 1; } }
.hy-rd--modern { --rd-paper: rgb(255 255 255); --rd-ink: rgb(29 32 36); --rd-muted: rgb(128 134 142); --rd-accent: var(--color-primary, rgb(70 112 79)); --rd-desk: rgb(234 237 240); --rd-chrome: rgb(255 255 255 / .88);
    --rd-back: rgb(244 245 247); }
.hy-rd--antique { --rd-paper: rgb(242 229 200); --rd-ink: rgb(58 42 23); --rd-muted: rgb(140 115 80); --rd-accent: rgb(123 58 28); --rd-desk: rgb(92 64 44); --rd-chrome: rgb(242 229 200 / .9); }
.hy-rd.hy-rd--paper-white { --rd-paper: rgb(255 255 255); --rd-ink: rgb(29 32 36); --rd-muted: rgb(128 134 142); --rd-desk: rgb(232 234 237); --rd-chrome: rgb(255 255 255 / .9); --rd-back: rgb(243 244 246); }
.hy-rd.hy-rd--paper-sepia { --rd-paper: rgb(244 236 216); --rd-ink: rgb(91 70 54); --rd-muted: rgb(150 125 100); --rd-desk: rgb(214 200 172); --rd-chrome: rgb(244 236 216 / .9); --rd-back: rgb(236 225 198); }
.hy-rd.hy-rd--paper-night { --rd-paper: rgb(30 31 35); --rd-ink: rgb(214 208 196); --rd-muted: rgb(140 136 128); --rd-accent: var(--color-accent, rgb(201 173 115)); --rd-desk: rgb(14 15 17);
    --rd-chrome: rgb(24 25 28 / .9); --rd-line: rgb(255 255 255 / .1); --rd-back: rgb(40 41 46); }
.hy-rd--mono { --rd-accent: var(--rd-ink); }
.hy-rd--mono .hy-rd__flow :is(img, picture, video, svg) { filter: grayscale(1) contrast(1.05); }

/* the bar */
.hy-rd__bar { position: relative; z-index: 3; display: flex; align-items: center; gap: .5rem; min-block-size: 56px; padding: 6px max(10px, env(safe-area-inset-right)) 6px max(10px, env(safe-area-inset-left));
    background: var(--rd-chrome); backdrop-filter: blur(14px); border-block-end: 1px solid var(--rd-line); transition: transform .35s var(--hy-ease), opacity .35s var(--hy-ease); }
.hy-rd__where { display: grid; flex: 1 1 auto; min-inline-size: 0; line-height: 1.25; }
.hy-rd__where > span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.hy-rd__where .hy-rd__book { color: var(--rd-muted); font-size: .74rem; font-weight: 700; letter-spacing: .04em; }
.hy-rd__chap { font-family: var(--font-text, inherit); font-size: .98rem; font-weight: 700; }
.hy-rd__tools { display: flex; align-items: center; gap: 2px; }
.hy-rd__btn { position: relative; display: inline-grid; flex: none; place-items: center; inline-size: 40px; block-size: 40px; padding: 0; border: 0; border-radius: 12px; background: transparent; color: var(--rd-ink);
    cursor: pointer; transition: background-color .2s var(--hy-ease), color .2s var(--hy-ease), transform .15s var(--hy-ease); }
.hy-rd__btn:hover { background: color-mix(in srgb, var(--rd-ink) 8%, transparent); }
.hy-rd__btn:active { transform: scale(.92); }
.hy-rd__btn:focus-visible, .hy-rd__choice:focus-visible, .hy-rd__toc-link:focus-visible { outline: 2px solid var(--rd-accent); outline-offset: 2px; }
.hy-rd__btn--aa { font-family: var(--font-text, Georgia, serif); font-size: 1.08rem; font-weight: 700; letter-spacing: -.02em; }
.hy-rd__btn--mark.is-on { color: var(--rd-accent); }
.hy-rd__btn--mark.is-on svg { fill: currentColor; }
.hy-rd__btn--close { margin-inline-end: .1rem; }

/* the stage and the paper */
.hy-rd__stage { position: relative; z-index: 1; display: grid; place-items: center; min-block-size: 0; overflow: hidden; touch-action: none; user-select: text; }
.hy-rd__stage > .hy-rd__book { position: relative; display: flex; direction: ltr; gap: 0; transition: opacity .25s var(--hy-ease); }
.hy-rd.is-loading .hy-rd__stage > .hy-rd__book { opacity: 0; }
.hy-rd__slot { position: relative; inline-size: var(--rd-pw); block-size: var(--rd-ph); }
.hy-rd:not(.hy-rd--spread) .hy-rd__slot--a { display: none; }
.hy-rd__page { position: absolute; inset: 0; overflow: hidden; border-radius: 4px; background: var(--rd-paper); color: var(--rd-ink); direction: inherit;
    box-shadow: 0 1px 2px rgb(0 0 0 / .08), 0 22px 46px -26px rgb(0 0 0 / .45); }
.hy-rd__stage .hy-rd__page { direction: var(--rd-dir, ltr); }
.hy-rd[dir="rtl"] { --rd-dir: rtl; }
.hy-rd--antique .hy-rd__page { background: radial-gradient(120% 90% at 50% 40%, transparent 55%, rgb(120 80 30 / .16)), radial-gradient(5px 4px at 18% 28%, rgb(130 90 40 / .1), transparent), var(--rd-paper); }
.hy-rd--antique.hy-rd--paper-white .hy-rd__page, .hy-rd--antique.hy-rd--paper-sepia .hy-rd__page, .hy-rd--antique.hy-rd--paper-night .hy-rd__page { background: var(--rd-paper); }
.hy-rd__page.is-blank { background: var(--rd-paper); }
/* one page: the edges of the pages under it; two pages: the spine between them */
.hy-rd:not(.hy-rd--spread) .hy-rd__slot--b::before { content: ""; position: absolute; inset-block: 3px -3px; inset-inline: 4px -4px; border-radius: 4px; background: var(--rd-back); box-shadow: 0 1px 2px rgb(0 0 0 / .1); }
.hy-rd[dir="rtl"]:not(.hy-rd--spread) .hy-rd__slot--b::before { inset-inline: -4px 4px; }
.hy-rd--spread .hy-rd__slot--a .hy-rd__page { border-radius: 6px 0 0 6px; }
.hy-rd--spread .hy-rd__slot--b .hy-rd__page { border-radius: 0 6px 6px 0; }
.hy-rd--spread .hy-rd__slot::after { content: ""; position: absolute; z-index: 2; inset-block: 0; inline-size: 9%; pointer-events: none; }
.hy-rd--spread .hy-rd__slot--a::after { inset-inline-end: 0; background: linear-gradient(90deg, transparent, rgb(0 0 0 / .05) 55%, rgb(0 0 0 / .2)); }
.hy-rd--spread .hy-rd__slot--b::after { inset-inline-start: 0; background: linear-gradient(-90deg, transparent, rgb(0 0 0 / .05) 55%, rgb(0 0 0 / .2)); }
/* the window of words, the running head, the page number */
.hy-rd__win { position: absolute; inset-block-start: var(--rd-pad-y); inset-inline-start: var(--rd-pad-x); inline-size: var(--rd-ww); block-size: var(--rd-wh); overflow: hidden; }
.hy-rd__win.is-long { overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y; scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--rd-ink) 25%, transparent) transparent; }
.hy-rd__head, .hy-rd__folio { position: absolute; inset-inline: var(--rd-pad-x); overflow: hidden; color: var(--rd-muted); font-family: var(--font-text, inherit); text-align: center; white-space: nowrap; text-overflow: ellipsis; }
.hy-rd__head { inset-block-start: calc(var(--rd-pad-y) * .38); font-size: .74rem; letter-spacing: .14em; }
.hy-rd__head:not(:lang(fa)):not(:lang(ar)):not(:lang(ur)) { font-variant: small-caps; text-transform: lowercase; }
.hy-rd__folio { inset-block-end: calc(var(--rd-pad-y) * .32); font-size: .82rem; font-variant-numeric: oldstyle-nums; }
.hy-rd--modern .hy-rd__head { letter-spacing: .08em; }
/* the text */
.hy-rd .hy-rd__flow { font-family: var(--font-text, Georgia, serif); font-size: calc(var(--rd-size, 18px) * var(--lang-font-scale, 1)); line-height: var(--rd-lead); color: var(--rd-ink); overflow-wrap: break-word; }
.hy-rd.hy-rd--plain .hy-rd__flow { font-family: var(--font-body, system-ui, sans-serif); }
.hy-rd .hy-rd__flow:lang(ur) { line-height: calc(var(--rd-lead) + .75); }
.hy-rd .hy-rd__flow:lang(ar) { font-size: calc(var(--rd-size, 18px) * var(--lang-font-scale, 1) * 1.08); }
.hy-rd__flow { display: flow-root; }
/* the pages are cut in the book's own face, so the plain face does not move words between pages */
.hy-rd .hy-rd__flow--ref { font-family: var(--font-text, Georgia, serif); }
/* a paragraph split between two pages: its first part fills its last line, the rest goes on without an indent */
.hy-rd--justify .hy-rd__flow > .is-cut { text-align-last: justify; }
.hy-rd .hy-rd__flow > .is-cont { text-indent: 0; }
.hy-rd__stage.is-edge { cursor: grab; }
.hy-rd--noselect .hy-rd__flow { user-select: none; -webkit-user-select: none; }
.hy-rd__flow > * { margin-block: 0 .85em; }
.hy-rd--justify .hy-rd__flow :is(p, li) { text-align: justify; text-justify: inter-word; hyphens: auto; }
.hy-rd:is(.hy-rd--classic, .hy-rd--antique) .hy-rd__flow > p { margin-block-end: 0; }
.hy-rd:is(.hy-rd--classic, .hy-rd--antique) .hy-rd__flow > p + p { text-indent: 1.6em; }
.hy-rd .hy-rd__flow :is(h1, h2, h3, h4, h5, h6) { margin-block: 1.1em .55em; color: var(--rd-ink); font-family: var(--font-text, inherit); font-weight: 700; line-height: 1.3; break-after: avoid; break-inside: avoid; }
.hy-rd .hy-rd__flow > :first-child { margin-block-start: 0; }
.hy-rd .hy-rd__flow :is(h3, h4):not(:lang(fa)):not(:lang(ar)):not(:lang(ur)) { font-variant: small-caps; letter-spacing: .03em; }
.hy-rd .hy-rd__flow h2 { font-size: 1.32em; } .hy-rd .hy-rd__flow h3 { font-size: 1.14em; } .hy-rd .hy-rd__flow :is(h4, h5, h6) { font-size: 1em; }
.hy-rd .hy-rd__flow :is(img, video, svg, iframe) { display: block; max-inline-size: 100%; max-block-size: calc(var(--rd-wh, 70vh) * .8); block-size: auto; margin-inline: auto; border-radius: 4px; break-inside: avoid; }
.hy-rd .hy-rd__flow :is(figure, table, pre, blockquote) { break-inside: avoid; }
.hy-rd .hy-rd__flow blockquote { margin-inline: 0; padding-inline-start: 1em; border-inline-start: 2px solid var(--rd-accent); color: color-mix(in srgb, var(--rd-ink) 82%, var(--rd-paper)); font-style: italic; }
.hy-rd .hy-rd__flow a { color: var(--rd-accent); }
.hy-rd .hy-rd__flow hr { block-size: 0; margin-block: 1.4em; border: 0; text-align: center; overflow: visible; }
.hy-rd .hy-rd__flow hr::before { content: "\2042"; color: var(--rd-muted); }
/* a chapter's opening: lower on its page, its number in large figures, "Chapter", the title, a short rule */
.hy-rd .hy-rd__flow > .hy-rd-opener { display: grid; justify-items: center; gap: .35rem; margin-block: calc(var(--rd-wh, 400px) * .1) .9em; text-indent: 0; text-align: center; }
.hy-rd-opener__num { color: var(--rd-accent); font-family: var(--font-text, Georgia, serif); font-size: 3.4em; font-weight: 400; line-height: 1; font-variant-numeric: lining-nums; }
.hy-rd-opener__label { color: var(--rd-muted); font-size: .72em; font-weight: 700; letter-spacing: .32em; text-transform: uppercase; }
/* (2026-10-30) the ornament over a chapter's title (the site owner's designs, books.layout_opener): a single-colour one is a shape
   painted in the accent (it follows the palette, night paper and black-and-white); the others keep their own colours */
.hy-rd .hy-rd__flow > .hy-rd-opener--art { margin-block: calc(var(--rd-wh, 400px) * .055) .7em; line-height: 0; }
.hy-rd .hy-rd__flow .hy-rd-orn { display: block; inline-size: clamp(84px, 31%, 172px); block-size: auto; max-block-size: none; margin: 0 auto; border-radius: 0; }
.hy-rd-orn--mask { background-color: var(--rd-accent); -webkit-mask: var(--orn) center / contain no-repeat; mask: var(--orn) center / contain no-repeat; }
.hy-rd--mono .hy-rd-orn--mask { background-color: var(--rd-ink); }
.hy-rd--modern .hy-rd__flow > .hy-rd-opener--art { justify-items: start; }
.hy-rd--modern .hy-rd__flow .hy-rd-orn { margin-inline: 0; }
/* (2026-10-30) footnotes at the foot of their page: a short rule in the accent, then the notes smaller and softer, numbers in the accent */
.hy-rd__win { display: flex; flex-direction: column; }
.hy-rd__win > .hy-rd__flow { flex: none; }
.hy-rd__notes { flex: none; margin-block-start: auto; padding-block-start: .95em; color: color-mix(in srgb, var(--rd-ink) 84%, var(--rd-paper));
    font-family: var(--font-text, Georgia, serif); font-size: calc(var(--rd-size, 18px) * var(--lang-font-scale, 1) * .8); line-height: 1.7; text-align: start; }
.hy-rd.hy-rd--plain .hy-rd__notes { font-family: var(--font-body, system-ui, sans-serif); }
.hy-rd__notes::before { content: ""; display: block; inline-size: 34%; block-size: 1px; margin-block-end: .6em; background: color-mix(in srgb, var(--rd-accent) 62%, transparent); }
.hy-rd__notes-list { display: grid; gap: .3em; margin: 0; padding: 0; list-style: none; }
.hy-rd__note { display: flex; align-items: baseline; gap: .45em; border-radius: 4px; }
.hy-rd__note-n { flex: none; min-inline-size: 1.1em; color: var(--rd-accent); font-weight: 700; font-variant-numeric: tabular-nums; }
.hy-rd__note-t { min-inline-size: 0; overflow-wrap: anywhere; }
.hy-rd__note-t p { display: inline; margin: 0; }
.hy-rd__note.is-lit { animation: hy-rd-note 1.8s ease; }
@keyframes hy-rd-note { 0%, 45% { background: color-mix(in srgb, var(--rd-accent) 16%, transparent); } 100% { background: transparent; } }
.hy-rd[lang="ur"] .hy-rd__notes, .hy-rd__notes:lang(ur) { line-height: 2.25; }
.hy-rd .hy-rd__flow .hb-fnref a { padding: 0 .12em; background: none; color: var(--rd-accent); font-weight: 700; text-decoration: none; cursor: pointer; }
.hy-rd .hy-rd__flow > .hy-rd-title { margin-block: 0 1.5em; font-size: 1.55em; text-align: center; text-indent: 0; }
.hy-rd .hy-rd__flow > .hy-rd-title:first-child { margin-block-start: calc(var(--rd-wh, 400px) * .12); }
.hy-rd .hy-rd__flow > .hy-rd-title::after { content: ""; display: block; inline-size: 2.6rem; block-size: 2px; margin: .7em auto 0; background: var(--rd-accent); }
.hy-rd:is(.hy-rd--classic, .hy-rd--antique) .hy-rd__flow > .hy-rd-title:not(:lang(fa)):not(:lang(ar)):not(:lang(ur)) { text-transform: uppercase; letter-spacing: .05em; font-size: 1.4em; }
.hy-rd--modern .hy-rd__flow > :is(.hy-rd-opener, .hy-rd-title) { justify-items: start; text-align: start; }
.hy-rd--modern .hy-rd__flow > .hy-rd-title::after { margin-inline: 0; }
.hy-rd .hy-rd__flow > .hy-rd-title + p { text-indent: 0; }
.hy-rd--dropcap .hy-rd__flow > .hy-rd-title + p:not(:lang(fa)):not(:lang(ar)):not(:lang(ur))::first-letter { float: inline-start; margin-inline-end: .08em; padding-block-start: .06em; color: var(--rd-accent);
    font-family: var(--font-text, Georgia, serif); font-size: 3.3em; line-height: .82; }
/* marks */
.hy-rd mark.hy-rd-hl { padding: 0; border-radius: 2px; background: rgb(250 214 90 / .55); color: inherit; box-shadow: 0 0 0 1px rgb(250 214 90 / .35); }
.hy-rd.hy-rd--paper-night mark.hy-rd-hl { background: rgb(190 150 40 / .45); }
.hy-rd mark.hy-rd-find { padding: 0; border-radius: 2px; background: color-mix(in srgb, var(--rd-accent) 30%, transparent); color: inherit; animation: hy-rd-find 2.4s ease forwards; }
@keyframes hy-rd-find { 70% { background: color-mix(in srgb, var(--rd-accent) 30%, transparent); } to { background: transparent; } }

/* turning: the slide of the scrolling reader (and of a reader who asked for less motion) */
.hy-rd__stage > .hy-rd__book.is-in-next { animation: hy-rd-next .38s var(--hy-ease) both; }
.hy-rd__stage > .hy-rd__book.is-in-prev { animation: hy-rd-prev .38s var(--hy-ease) both; }
@keyframes hy-rd-next { from { opacity: 0; transform: translateX(calc(36px * var(--rd-flow, 1))); } to { opacity: 1; transform: none; } }
@keyframes hy-rd-prev { from { opacity: 0; transform: translateX(calc(-36px * var(--rd-flow, 1))); } to { opacity: 1; transform: none; } }
.hy-rd[dir="rtl"] { --rd-flow: -1; }
/* turning: the curl */
.hy-rd__turn { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.hy-rd__turn > * { position: absolute; inset: 0; }
.hy-rd__under .hy-rd__page { box-shadow: none; }
.hy-rd__shade { z-index: 1; opacity: 0; }
.hy-rd__leaf { z-index: 2; }
.hy-rd__leaf .hy-rd__page { box-shadow: none; }
.hy-rd__leaf-shade { z-index: 2; pointer-events: none; }
.hy-rd__flapwrap { z-index: 3; filter: drop-shadow(0 0 1px rgb(0 0 0 / .18)) drop-shadow(-6px 4px 14px rgb(0 0 0 / .3)); }
.hy-rd[dir="rtl"] .hy-rd__flapwrap { filter: drop-shadow(0 0 1px rgb(0 0 0 / .18)) drop-shadow(6px 4px 14px rgb(0 0 0 / .3)); }
.hy-rd__flap { position: absolute; inset: 0; border-radius: 4px; background-color: var(--rd-back); clip-path: polygon(0 0, 0 0, 0 0); }

/* the arrows beside the paper */
.hy-rd__nav { position: absolute; z-index: 2; inset-block-start: 50%; inline-size: 46px; block-size: 46px; margin-block-start: -23px; border-radius: 50%; background: var(--rd-chrome); color: var(--rd-ink);
    box-shadow: 0 6px 18px -8px rgb(0 0 0 / .35); opacity: .8; }
.hy-rd__nav:hover { opacity: 1; background: var(--rd-chrome); }
.hy-rd__nav:disabled { opacity: 0; pointer-events: none; }
.hy-rd__nav--prev { inset-inline-start: 14px; }
.hy-rd__nav--next { inset-inline-end: 14px; }

/* the foot: the chapter, the slider, page / pages */
.hy-rd__foot { position: relative; z-index: 3; display: flex; align-items: center; gap: .9rem; min-block-size: 50px; padding: 6px max(16px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
    background: var(--rd-chrome); backdrop-filter: blur(14px); border-block-start: 1px solid var(--rd-line); font-size: .8rem; transition: transform .35s var(--hy-ease), opacity .35s var(--hy-ease); }
.hy-rd__foot-chap { flex: 0 1 14rem; min-inline-size: 0; overflow: hidden; color: var(--rd-muted); font-weight: 700; white-space: nowrap; text-overflow: ellipsis; }
.hy-rd__range { flex: 1 1 auto; min-inline-size: 4rem; block-size: 22px; margin: 0; accent-color: var(--rd-accent); cursor: pointer; }
.hy-rd[dir="rtl"] .hy-rd__range { direction: rtl; }
.hy-rd__count { flex: none; padding: .25rem .7rem; border-radius: 999px; background: color-mix(in srgb, var(--rd-ink) 8%, transparent); font-weight: 800; font-variant-numeric: tabular-nums; }
/* calm: a tap in the middle hides the bars */
.hy-rd.is-calm .hy-rd__bar { transform: translateY(-100%); opacity: 0; }
.hy-rd.is-calm .hy-rd__foot { transform: translateY(100%); opacity: 0; }
.hy-rd.is-calm .hy-rd__nav { opacity: 0; }
.hy-rd.is-veiled .hy-rd__stage { filter: blur(14px); }

/* the panels */
.hy-rd__panel { position: absolute; z-index: 5; inset-block-start: 64px; inset-inline-end: 12px; inline-size: min(24rem, calc(100% - 24px)); max-block-size: calc(100% - 136px); overflow: auto; padding: .9rem;
    border-radius: 18px; background: var(--rd-paper); color: var(--rd-ink); border: 1px solid var(--rd-line); box-shadow: 0 30px 60px -24px rgb(0 0 0 / .5); animation: hy-reader-pop .22s var(--hy-ease) both; transform-origin: top; }
.hy-rd__panel[hidden] { display: none; }
.hy-rd__panel-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-block-end: .6rem; padding-block-end: .5rem; border-block-end: 1px solid var(--rd-line); }
.hy-rd__panel-head strong { font-family: var(--font-text, inherit); font-size: 1.05rem; }
.hy-rd__toc, .hy-rd__results, .hy-rd__marks { display: grid; gap: 1px; margin: 0; padding: 0; list-style: none; }
.hy-rd__toc-link, .hy-rd__result, .hy-rd__mark-go { display: flex; align-items: baseline; gap: .7rem; inline-size: 100%; padding: .5rem .55rem; border: 0; border-radius: 10px; background: transparent; color: inherit;
    font: inherit; text-align: start; cursor: pointer; }
.hy-rd__toc-link:hover, .hy-rd__result:hover, .hy-rd__mark-go:hover { background: color-mix(in srgb, var(--rd-ink) 7%, transparent); }
.hy-rd__toc-num { flex: none; min-inline-size: 2ch; color: var(--rd-accent); font-family: var(--font-text, Georgia, serif); font-size: 1.25rem; font-weight: 700; line-height: 1; }
.hy-rd__toc-name { flex: 1 1 auto; min-inline-size: 0; font-family: var(--font-text, inherit); font-weight: 700; }
.hy-rd__toc .is-sub .hy-rd__toc-link { padding-inline-start: calc(2ch * 1.25 + 1.25rem); }
.hy-rd__toc .is-sub .hy-rd__toc-name { font-weight: 500; font-size: .92em; color: color-mix(in srgb, var(--rd-ink) 80%, var(--rd-paper)); }
.hy-rd__toc-page, .hy-rd__result-page { flex: none; color: var(--rd-muted); font-size: .82rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.hy-rd__row { display: grid; gap: .45rem; padding-block: .6rem; }
.hy-rd__row + .hy-rd__row { border-block-start: 1px dashed var(--rd-line); }
.hy-rd__row-label { color: var(--rd-muted); font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hy-rd__seg { display: flex; align-items: center; gap: 4px; padding: 3px; border-radius: 14px; background: color-mix(in srgb, var(--rd-ink) 6%, transparent); }
.hy-rd__choice { display: inline-flex; flex: 1 1 0; align-items: center; justify-content: center; gap: .4rem; min-block-size: 40px; padding: .3rem .5rem; border: 0; border-radius: 11px; background: transparent; color: inherit;
    font: inherit; font-size: .86rem; cursor: pointer; }
.hy-rd__choice.is-on { background: var(--rd-paper); box-shadow: 0 1px 3px rgb(0 0 0 / .14); color: var(--rd-accent); font-weight: 800; }
.hy-rd__scale { flex: 1 1 0; text-align: center; font-weight: 800; font-variant-numeric: tabular-nums; }
.hy-rd__face-text { font-family: var(--font-text, Georgia, serif); } .hy-rd__face-plain { font-family: var(--font-body, system-ui, sans-serif); }
.hy-rd__lines { display: grid; gap: 3px; } .hy-rd__lines i { display: block; inline-size: 22px; block-size: 2px; border-radius: 2px; background: currentColor; }
.hy-rd__lines--1 { gap: 5px; } .hy-rd__lines--2 { gap: 7px; }
.hy-rd__choice--paper { flex-direction: column; gap: .2rem; padding-block: .4rem; font-size: .72rem; }
.hy-rd__swatch { display: grid; place-items: center; inline-size: 100%; block-size: 34px; border-radius: 9px; font-family: var(--font-text, Georgia, serif); font-size: 1rem; font-weight: 700; box-shadow: inset 0 0 0 1px rgb(0 0 0 / .12); }
.hy-rd__swatch--white { background: rgb(255 255 255); color: rgb(29 32 36); }
.hy-rd__swatch--day { background: rgb(251 247 236); color: rgb(42 37 27); }
.hy-rd--modern .hy-rd__swatch--day { background: rgb(250 250 250); }
.hy-rd--antique .hy-rd__swatch--day { background: rgb(242 229 200); color: rgb(58 42 23); }
.hy-rd__swatch--sepia { background: rgb(244 236 216); color: rgb(91 70 54); }
.hy-rd__swatch--night { background: rgb(30 31 35); color: rgb(214 208 196); }
.hy-rd__find { display: flex; margin-block-end: .5rem; }
.hy-rd__find-input { inline-size: 100%; min-block-size: 42px; padding-inline: .9rem; border: 1px solid var(--rd-line); border-radius: 12px; background: color-mix(in srgb, var(--rd-ink) 4%, var(--rd-paper)); color: inherit; font: inherit; }
.hy-rd__find-input:focus { outline: 2px solid var(--rd-accent); outline-offset: 0; }
.hy-rd__result-text { flex: 1 1 auto; min-inline-size: 0; font-size: .9rem; line-height: 1.6; }
.hy-rd__found, .hy-rd__none, .hy-rd__note { padding: .4rem .55rem; color: var(--rd-muted); font-size: .82rem; }
.hy-rd__mark-row { display: flex; align-items: center; gap: .2rem; }
.hy-rd__mark-kind { flex: none; color: var(--rd-accent); }
.hy-rd__mark-kind svg { inline-size: 16px; block-size: 16px; }
.hy-rd__mark-quote { flex: 1 1 auto; min-inline-size: 0; overflow: hidden; font-size: .88rem; white-space: nowrap; text-overflow: ellipsis; }
.hy-rd__mark-rm { inline-size: 34px; block-size: 34px; color: var(--rd-muted); }
.hy-rd__mark-row--highlight .hy-rd__mark-quote { background: linear-gradient(transparent 55%, rgb(250 214 90 / .5) 55%); }
/* the highlight button over a selection, the passing note */
.hy-rd__hl { position: fixed; z-index: 6; display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .85rem; border: 0; border-radius: 999px; background: var(--rd-ink); color: var(--rd-paper);
    font: inherit; font-size: .84rem; font-weight: 700; box-shadow: 0 10px 26px -10px rgb(0 0 0 / .5); cursor: pointer; }
.hy-rd__hl[hidden] { display: none; }
.hy-rd__hl svg { inline-size: 16px; block-size: 16px; }
.hy-rd__toast { position: absolute; z-index: 7; inset-block-end: 66px; inset-inline-start: 50%; max-inline-size: calc(100% - 32px); margin: 0; padding: .55rem 1rem; border-radius: 999px; background: var(--rd-ink); color: var(--rd-paper);
    font-size: .86rem; font-weight: 700; opacity: 0; transform: translate(calc(-50% * var(--rd-flow, 1)), 10px); pointer-events: none; transition: opacity .25s var(--hy-ease), transform .25s var(--hy-ease); }
.hy-rd__toast.is-on { opacity: 1; transform: translate(calc(-50% * var(--rd-flow, 1)), 0); }
.hy-rd__measure { position: absolute; inset-block-start: 0; inset-inline-start: 0; visibility: hidden; pointer-events: none; inline-size: var(--rd-ww); block-size: var(--rd-wh); overflow: hidden; contain: layout style; }
/* copying kept from the book */
.hy-rd--protect .hy-rd__stage { -webkit-touch-callout: none; }

/* the scrolling reader: one card of words a page, the page scrolls inside the stage */
.hy-rd--scroll .hy-rd__stage { display: block; overflow: auto; touch-action: pan-y; padding-block: 24px 40px; }
.hy-rd--scroll .hy-rd__stage > .hy-rd__book { justify-content: center; margin-inline: auto; }
.hy-rd--scroll .hy-rd__slot { block-size: auto; }
.hy-rd--scroll .hy-rd__page { position: relative; padding: var(--rd-pad-y) var(--rd-pad-x) calc(var(--rd-pad-y) + 1.6rem); border-radius: 10px; }
.hy-rd--scroll .hy-rd__win { position: static; inline-size: auto; block-size: auto; overflow: visible; }
.hy-rd--scroll .hy-rd__head { inset-block-start: 14px; }
.hy-rd--scroll .hy-rd__folio { inset-block-end: 14px; }
.hy-rd--scroll .hy-rd__flow > .hy-rd-opener, .hy-rd--scroll .hy-rd__flow > .hy-rd-title:first-child { margin-block-start: 1.5rem; }
.hy-rd--scroll .hy-rd__nav { position: fixed; }

/* phones: the paper fills the width, the arrows give way to taps at the edges, the panels rise from the foot */
.hy-rd--phone .hy-rd__nav { display: none; }
.hy-rd--phone .hy-rd__page { border-radius: 3px; }
@media (max-width: 639.98px) {
    .hy-rd__bar { gap: .2rem; min-block-size: 52px; }
    .hy-rd__btn { inline-size: 36px; block-size: 36px; }
    .hy-rd__btn--full { display: none; }
    .hy-rd__where .hy-rd__book { display: none; }
    .hy-rd__chap { font-size: .9rem; }
    .hy-rd__foot-chap { display: none; }
    .hy-rd__panel { inset-block: auto 0; inset-inline: 0; inline-size: auto; max-block-size: 78%; border-radius: 20px 20px 0 0; padding-block-end: max(.9rem, env(safe-area-inset-bottom)); animation-name: hy-rd-sheet; }
}
@keyframes hy-rd-sheet { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .hy-rd, .hy-rd__panel, .hy-rd__stage > .hy-rd__book { animation: none !important; } }
@media print { .hy-rd { display: none !important; } }
