.books-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; padding-block: 1.25rem; }
.books-logo { display: block; width: min(11.75rem, 55%); }
.books-header-links { display: flex; flex-wrap: wrap; align-items: center; gap: 0 1rem; }
.books-back { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.books-back:hover, .story-link:hover { text-decoration: underline; text-underline-offset: .2em; }
.books-main { padding-block: clamp(2rem, 6vw, 5rem) 5rem; }
.books-catalog { padding-block-start: .5rem; }
.books-main h1 { font-size: clamp(2.5rem, 6vw, 4rem); line-height: 1.1; }
.books-intro { margin-top: 1rem; max-width: 38rem; color: var(--muted); font-size: 1.125rem; }
.books-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; padding: 0; margin: 2.5rem 0 0; list-style: none; }
.book-tile { display: flex; flex-direction: column; gap: 1.25rem; min-inline-size: 0; }
.book-card { --cover-paper: #ffdfc6; --cover-edge: #d39b7f; --cover-spine: #c58c72; --cover-ink: #593d40; --cover-coral: #e98784; --cover-mint: #76b8a3; --cover-gold: #eeb547; position: relative; isolation: isolate; container-type: inline-size; display: flex; flex-direction: column; aspect-ratio: 2 / 3; min-height: 15rem; height: auto; padding: 24% 10% 14% 15%; border: 1px solid var(--cover-edge); border-radius: .35rem 1.4rem 1.4rem .35rem; overflow: hidden; background: var(--cover-paper); color: var(--cover-ink); box-shadow: 0 4px 0 #fff5dd, 1px 8px 0 #cfb697, 2px 11px 0 #f4e7d2, 0 17px 22px #6244351c; }
.book-card[data-cover-palette="mint"] { --cover-paper: #d5eadb; --cover-edge: #91b8a0; --cover-spine: #7fa28c; --cover-ink: #294c48; }
.book-card[data-cover-palette="sky"] { --cover-paper: #d9eaf5; --cover-edge: #9bb8ca; --cover-spine: #8aa8be; --cover-ink: #344963; }
.book-card[data-cover-palette="butter"] { --cover-paper: #fff0bc; --cover-edge: #d4ba77; --cover-spine: #bca366; --cover-ink: #5c4934; }
.book-card[data-cover-palette="lilac"] { --cover-paper: #e9def1; --cover-edge: #b7a0c6; --cover-spine: #a28bb5; --cover-ink: #51415f; }
.book-card[data-cover-palette="rose"] { --cover-paper: #f6dce2; --cover-edge: #d3a0af; --cover-spine: #bd899a; --cover-ink: #603e50; }
.book-card::before { content: ""; position: absolute; z-index: 4; inset: 0 auto 0 0; width: 4.7%; min-inline-size: 7px; border-radius: .35rem 0 0 .35rem; background: linear-gradient(90deg, var(--cover-spine), #ffffff65 55%, #ffffff00); border-inline-end: 1px solid #ffffff60; pointer-events: none; }
.book-card::after { content: ""; position: absolute; z-index: 1; inset: 0; border-radius: inherit; background: radial-gradient(ellipse at 28% 8%, #fffaf090, transparent 65%), linear-gradient(135deg, #ffffff25, #ffffff00 65%, #72553708); pointer-events: none; }
.book-cover-title, .book-cover-action { position: relative; z-index: 3; }
.book-cover-heading { position: relative; z-index: 3; display: flex; flex-direction: column; align-items: center; min-inline-size: 0; margin-block-end: .75rem; text-align: center; }
.book-cover-frame { position: absolute; z-index: 1; inset: 13% 7% 10% 11%; border: 1px solid var(--cover-edge); border-radius: 999px 999px 1rem 1rem; background: linear-gradient(180deg, #fffdf51c, #fffdf54d); opacity: .7; pointer-events: none; }
.book-cover-sparkles { position: absolute; z-index: 2; inset: 0; pointer-events: none; }
.book-cover-sparkles span { position: absolute; inline-size: clamp(10px, 8cqi, 19px); aspect-ratio: 1; background: var(--cover-gold); clip-path: polygon(50% 0, 63% 35%, 100% 50%, 63% 65%, 50% 100%, 37% 65%, 0 50%, 37% 35%); }
.book-cover-sparkles span:nth-child(1) { inset-inline-start: 20%; inset-block-end: 33%; transform: rotate(-12deg); }
.book-cover-sparkles span:nth-child(2) { inset-inline-end: 16%; inset-block-end: 23%; inline-size: clamp(7px, 5cqi, 12px); background: var(--cover-coral); transform: rotate(12deg); }
.book-cover-sparkles span:nth-child(3) { inset-inline-start: 20%; inset-block-start: 11%; inline-size: clamp(6px, 4cqi, 10px); background: var(--cover-mint); }
.book-cover-motif { position: relative; z-index: 2; display: flex; flex: 0 0 auto; justify-content: center; align-items: flex-end; gap: clamp(4px, 3cqi, 7px); block-size: clamp(1.65rem, 23cqi, 3.6rem); margin-block: auto 1rem; }
.book-cover-motif span { display: block; inline-size: clamp(13px, 11cqi, 29px); block-size: 72%; border-radius: 999px 999px 5px 5px; background: var(--cover-coral); transform: rotate(-9deg); box-shadow: inset 2px 1px 0 #ffffff45; }
.book-cover-motif span:nth-child(2) { block-size: 100%; background: var(--cover-gold); transform: rotate(4deg); }
.book-cover-motif span:nth-child(3) { block-size: 60%; background: var(--cover-mint); transform: rotate(10deg); }
.book-cover-dots { position: absolute; z-index: 2; inset-inline-start: 18%; inset-block-end: 6%; inline-size: 5px; block-size: 5px; border-radius: 50%; background: var(--cover-coral); box-shadow: 13px -2px 0 -1px var(--cover-gold), 24px 0 0 -1px var(--cover-mint); }
.book-age-badge { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; padding: .2em .45em; border: 1px solid #788899; border-radius: .35rem; background: #fffdf8; color: var(--ink); font-size: .875rem; line-height: 1.35; font-weight: 700; white-space: nowrap; }
.book-title-row { display: flex; align-items: flex-start; gap: .75rem; }
.book-title-row h1 { flex: 1 1 auto; min-inline-size: 0; }
.book-title-row .book-age-badge { margin-block-start: .35rem; }
.book-cover-title { font-family: var(--rounded); font-size: clamp(1.05rem, 2.4vw, 2.1rem); font-size: clamp(1.05rem, 16cqi, 2.1rem); line-height: 1.13; font-weight: 800; letter-spacing: -.035em; text-wrap: balance; overflow-wrap: anywhere; }
.book-card .book-age-badge { position: absolute; z-index: 3; inset-block-start: 4%; inset-inline-end: 6%; padding: 2px 0; border: 0; border-radius: 0; background: transparent; color: #344943; font-size: .75rem; font-size: clamp(.7rem, 7cqi, .85rem); }
.book-cover-action { align-self: stretch; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; width: 100%; min-height: 3rem; margin: 0; padding: .65rem .5rem; border: 0; border-radius: .85rem; background: #ce3350; color: #fff; font-family: var(--rounded); font-size: clamp(.8rem, 1.5vw, 1rem); line-height: 1.2; font-weight: 700; text-align: center; box-shadow: 0 4px 0 #a42640, 0 7px 13px #8c243725; }
.book-cover-arrow { flex: 0 0 auto; font-size: 1.15em; line-height: 1; }
.book-cover-action:hover { background: #a8273b; }
.book-cover-action:active { transform: translateY(2px); box-shadow: 0 2px 0 #92273a; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) { .book-card { transition: transform 180ms ease; } .book-card:hover { transform: translateY(-3px) rotate(-.5deg); } }
.story-label { color: #a32b3d; font-size: .8rem; font-weight: 700; letter-spacing: .08em; }
@media (min-width: 650px) { .books-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem 1.75rem; } }
@media (min-width: 1000px) { .books-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.purchase-panel { max-width: 40rem; margin-inline: auto; padding: clamp(1.5rem, 5vw, 3rem); border: 1px solid var(--line); border-radius: 1.5rem; background: var(--surface-tint); }
.test-order-form { margin-block: 1.5rem; }
.test-order-form label { display: block; margin-bottom: .4rem; font-weight: 700; }
.test-order-form input[type="email"] { display: block; width: 100%; min-height: 48px; padding: .7rem .85rem; border: 1px solid #788899; border-radius: .6rem; background: #fff; color: var(--ink); font: inherit; }
.test-order-form .email-note { display: block; margin-top: .5rem; color: var(--muted); font-size: .875rem; }
.test-order-form .purchase-button { margin-top: 1.25rem; }
.purchase-button { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; max-width: 100%; padding: .8rem 1.5rem; border: 0; border-radius: 100px; background: var(--button); color: white; font: inherit; font-weight: 700; text-align: center; cursor: pointer; }
.purchase-button:hover { background: var(--coral-dark); }
.purchase-button:disabled, .purchase-button:disabled:hover { background: #566473; cursor: not-allowed; }
.purchase-panel h1 { margin-top: .5rem; }
.purchase-panel h2 { margin-top: 1.5rem; font-size: 1.5rem; }
.purchase-panel p:not(.story-label) { margin-block: 1rem; color: var(--muted); }
.purchase-panel .purchase-price { font-size: 1.5rem; font-weight: 800; color: var(--ink); }

/* Характеристики и редакция первой платной книги. */
.purchase-panel { overflow-wrap: anywhere; }
.purchase-facts { display: grid; gap: 1rem; margin-block: 1.5rem; }
.purchase-facts div { min-inline-size: 0; }
.purchase-facts dt { color: var(--muted); font-size: .875rem; }
.purchase-facts dd { margin: .2rem 0 0; font-weight: 700; }
.purchase-edition { margin-block: 1.5rem; padding: 1rem; border: 1px solid #c6b7a6; border-radius: .75rem; }
.purchase-panel .purchase-edition h2 { margin: 0; font-size: 1.125rem; letter-spacing: normal; }
.purchase-panel .purchase-edition p:last-child { margin-bottom: 0; }
.purchase-excerpt { margin-block: 1.5rem; border-block: 1px solid #c6b7a6; }
.purchase-excerpt summary { min-block-size: 44px; padding-block: .75rem; cursor: pointer; font-weight: 700; }
.purchase-panel .purchase-price span { display: block; margin-top: .25rem; color: var(--muted); font-size: .875rem; font-weight: 400; }
.purchase-availability { margin-block: 1.5rem; }
@media (min-width: 560px) { .purchase-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Короткая карточка; подробности и документы открываются по ссылкам. */
.purchase-page--compact { padding-block: 1rem 2.5rem; }
.purchase-panel--compact { max-inline-size: 32rem; padding: clamp(1.25rem, 4vw, 2rem); }
.purchase-panel--compact h1 { margin: 0; font-size: clamp(2rem, 5vw, 2.75rem); }
.purchase-panel--compact p.purchase-summary { margin-block: .75rem 1rem; font-size: .9375rem; }
.purchase-panel--compact p.purchase-price { margin-block: 0 1rem; font-size: 1.875rem; }
.purchase-panel--compact p.purchase-note { margin-block: 0 1.25rem; font-size: .875rem; line-height: 1.5; }
.purchase-panel--compact .purchase-button { inline-size: 100%; }
.purchase-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.purchase-actions .purchase-button { flex: 1 1 12rem; inline-size: auto; }
.purchase-test-link { display: inline-flex; align-items: center; justify-content: center; min-block-size: 44px; flex: 1 1 auto; text-decoration: underline; text-underline-offset: .2em; font-size: .875rem; }
.purchase-panel--compact p.purchase-status { margin-block: .5rem 0; text-align: center; font-size: .875rem; }
.purchase-links { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; margin-block-start: .75rem; }
.purchase-links a { display: inline-flex; align-items: center; min-block-size: 44px; max-inline-size: 100%; font-size: .9375rem; text-decoration: underline; text-underline-offset: .2em; }
.purchase-panel--compact .test-order-form { margin-block: 1.25rem 0; }
.purchase-panel--compact .test-order-form .purchase-button { margin-block-start: .75rem; }
.purchase-panel--compact .test-order-form .email-note { font-size: .8125rem; }
.purchase-panel--compact p.purchase-terms { margin-block: .25rem 0; font-size: .8125rem; }

/* Buyer documents: native links, wrapped on narrow screens. */
.catalog-footer { padding-block: 1.5rem 2rem; border-block-start: 1px solid var(--line); color: var(--muted); font-size: .875rem; overflow-wrap: anywhere; }
.catalog-footer nav { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; }
.catalog-footer nav a { display: inline-flex; align-items: center; min-block-size: 44px; max-inline-size: 100%; padding-block: .5rem; }
.catalog-footer p { margin-block-start: .75rem; line-height: 1.6; }
.catalog-footer a, .purchase-terms a { text-decoration: underline; text-underline-offset: .2em; }
.purchase-terms { font-size: .9375rem; line-height: 1.6; overflow-wrap: anywhere; }
.purchase-terms a { display: inline-block; padding-block: .5rem; }

/* Ручное восстановление доступа со страницы владельца. */
.owner-recovery { margin-block: 1.25rem 2rem; padding-block-start: 1rem; border-block-start: 1px solid var(--line); }
.owner-recovery-check { display: flex; align-items: flex-start; gap: .6rem; margin-block: 1rem; cursor: pointer; }
.owner-recovery-check input { flex: 0 0 auto; inline-size: 1.25rem; block-size: 1.25rem; margin: .2rem 0 0; }
.owner-recovery-message:empty { display: none; }
.owner-recovery-link { display: block; inline-size: 100%; min-block-size: 5rem; margin-block-start: .5rem; padding: .7rem; border: 1px solid #788899; border-radius: .6rem; background: white; color: var(--ink); font: inherit; overflow-wrap: anywhere; resize: vertical; }
.owner-recovery-copy { min-block-size: 44px; margin-block-start: .75rem; padding: .5rem .9rem; border: 1px solid var(--ink); border-radius: .6rem; background: white; color: var(--ink); font: inherit; font-weight: 700; cursor: pointer; }

.owner-completion { margin-block: 1.25rem; }
.owner-completion-label { display: flex; align-items: center; gap: .65rem; min-block-size: 44px; padding-block: .5rem; cursor: pointer; font-weight: 700; }
.owner-completion-label input { flex: 0 0 auto; inline-size: 1.25rem; block-size: 1.25rem; margin: 0; accent-color: var(--ink); }
.owner-completion-label input:focus-visible { outline: 3px solid var(--ink); outline-offset: 4px; }
.purchase-panel p.owner-completion-note { margin-block: .25rem; font-size: .875rem; }
.owner-completion-message:empty { display: none; }

/* Owner ledger: shared table structure, stacked rows on narrow screens. */
.owner-orders-page { padding-block: clamp(1rem, 3vw, 2.5rem); }
.owner-orders-panel { container-type: inline-size; container-name: owner-ledger; padding: clamp(1rem, 2.5vw, 2rem); border: 1px solid #dcd6cc; border-radius: 1.25rem; background: #fffdf8; overflow-wrap: anywhere; }
.owner-orders-panel h1 { margin: 0 0 .75rem; font-size: clamp(2rem, 4vw, 3rem); }
.owner-orders-panel #owner-status { max-inline-size: 56rem; color: #4b5b6c; font-size: .9375rem; }
.owner-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem 1.5rem; margin-block: 1.5rem 1rem; }
.owner-summary { font-size: .9375rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.owner-filters { display: flex; flex-wrap: wrap; gap: .75rem 1rem; }
.owner-filter { display: flex; flex-direction: column; gap: .3rem; font-size: .875rem; font-weight: 700; }
.owner-filter select { min-block-size: 44px; max-inline-size: 100%; padding: .5rem 2rem .5rem .75rem; border: 1px solid #aeb8be; border-radius: .5rem; background: #fffdf8; color: var(--ink); font: inherit; font-weight: 400; cursor: pointer; }
.owner-filter select:focus-visible, .owner-access summary:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.owner-orders-table { inline-size: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: .875rem; line-height: 1.5; }
.owner-orders-table caption { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
.owner-orders-table th { padding: .85rem .75rem; background: #eee9df; text-align: start; border-block: 1px solid #d8d1c6; color: #33495e; font-size: .8125rem; }
.owner-orders-table th:first-child { inline-size: 23%; border-start-start-radius: .5rem; }
.owner-orders-table th:nth-child(2) { inline-size: 20%; }
.owner-orders-table th:nth-child(3) { inline-size: 10%; }
.owner-orders-table th:nth-child(4) { inline-size: 15%; }
.owner-orders-table th:nth-child(5) { inline-size: 17%; }
.owner-orders-table th:last-child { inline-size: 15%; border-start-end-radius: .5rem; }
.owner-orders-table td { padding: 1rem .75rem; vertical-align: top; border-block-end: 1px solid #d8d1c6; background: #fffdf8; overflow-wrap: anywhere; }
.owner-orders-table tbody tr:nth-child(even):not(.owner-order--completed) td { background: #faf6ee; }
.owner-orders-table .owner-order--completed td { background: #d2d6d9; color: #46515a; }
.owner-orders-table .owner-order--completed .owner-book-title,
.owner-order--completed .owner-order-number, .owner-order--completed .owner-order-date,
.owner-order--completed .owner-order-mode, .owner-order--completed .owner-cell-label { color: #46515a; }
.owner-order--completed .owner-completion-label input { accent-color: #56636b; }
.owner-order-row[hidden], .owner-orders-table[hidden] { display: none; }
.owner-orders-table p { margin: 0; }
.owner-book-title { color: var(--ink); font-size: 1rem; font-weight: 750; }
.owner-order-number, .owner-order-date, .owner-order-mode { margin-block-start: .3rem !important; color: #5c6670; font-size: .75rem; font-variant-numeric: tabular-nums; }
.owner-order-number { font-family: ui-monospace, monospace; }
.owner-email-line { display: flex; align-items: center; gap: .25rem; min-inline-size: 0; }
.owner-email { display: block; min-inline-size: 0; overflow-wrap: anywhere; }
.owner-copy-email { display: inline-flex; flex: 0 0 44px; align-items: center; justify-content: center; inline-size: 44px; block-size: 44px; padding: 0; border: 0; border-radius: .5rem; background: transparent; color: var(--ink); cursor: pointer; }
.owner-copy-email:hover { background: #e8e5de; }
.owner-copy-email svg { inline-size: 20px; block-size: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.owner-copy-check { display: none; }
.owner-copy-email[data-copied='true'] .owner-copy-icon { display: none; }
.owner-copy-email[data-copied='true'] .owner-copy-check { display: block; }
.owner-copy-email:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }
.owner-copy-status { display: block; font-size: .8125rem; color: #355370; }
.owner-copy-status:empty { display: none; }
.owner-copy-status[data-success='true'] { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.owner-order--completed .owner-copy-email, .owner-order--completed .owner-copy-status { color: #46515a; }
.owner-amount { font-weight: 700; font-variant-numeric: tabular-nums; }
.owner-payment { display: inline-block; padding: .25rem .45rem; border: 1px solid #d6c4a0; border-radius: .4rem; background: #fff3d8; color: #6c4a12; font-size: .8125rem; }
.owner-payment--paid { background: #eaf3ec; border-color: #b2c7b6; color: #285a36; }
.owner-order--completed .owner-payment { background: #c1c8cd; border-color: #a7b0b7; color: #3d4952; }
.owner-orders-panel .owner-completion { margin: 0; }
.owner-orders-panel .owner-completion-label { align-items: flex-start; font-size: .875rem; line-height: 1.5; padding-block: .2rem; }
.owner-orders-panel .owner-completion-label input { margin-block-start: .1rem; }
.owner-completion-message { margin-block-start: .4rem !important; font-size: .75rem; }
.owner-access summary { min-block-size: 44px; cursor: pointer; font-size: .8125rem; text-decoration: underline; text-underline-offset: .2em; }
.owner-access .owner-recovery { margin: .75rem 0 0; padding: 0; border: 0; }
.owner-access .owner-recovery p { margin-block: .75rem; }
.owner-access .owner-recovery-check { min-block-size: 44px; }
.owner-access .purchase-button { min-block-size: 44px; padding: .65rem; font-size: .8125rem; }
.owner-access-note { color: #5c6670; font-size: .8125rem; }
.owner-cell-label { display: none; }
.owner-filter-empty { padding: 1.25rem; border: 1px solid #d8d1c6; border-radius: .75rem; color: #4b5b6c; }
@container owner-ledger (max-width: 860px) {
  .owner-orders-table, .owner-orders-table tbody { display: block; }
  .owner-orders-table thead { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }
  .owner-orders-table tbody { display: grid; gap: 1rem; }
  .owner-orders-table .owner-order-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border: 1px solid #cfc8bc; border-radius: .75rem; overflow: hidden; background: #fffdf8; }
  .owner-orders-table .owner-order-row[hidden] { display: none; }
  .owner-orders-table .owner-order--completed { background: #d2d6d9; border-color: #b0b8be; }
  .owner-orders-table td { display: block; min-inline-size: 0; padding: .65rem 1rem; border: 0; background: transparent; }
  .owner-orders-table tbody tr:nth-child(even):not(.owner-order--completed) td { background: transparent; }
  .owner-orders-table .owner-col-0, .owner-orders-table .owner-col-1, .owner-orders-table .owner-col-4, .owner-orders-table .owner-col-5 { grid-column: 1 / -1; }
  .owner-orders-table .owner-col-0 { padding-block: .9rem; border-block-end: 1px solid #d8d1c6; }
  .owner-orders-table .owner-col-4 { border-block-start: 1px solid #d8d1c6; padding-block-start: .85rem; }
  .owner-cell-label { display: block; margin-block-end: .25rem; font-size: .75rem; color: #5c6670; font-weight: 600; }
  .owner-col-0 .owner-cell-label, .owner-col-4 .owner-cell-label { display: none; }
  .owner-book-title { font-size: 1.125rem; }
  .owner-orders-panel .owner-completion-label { align-items: center; }
  .owner-orders-panel .owner-completion-label input { margin: 0; }
}