/* Living memoir site styles.
   Ported from the style-cartographer memoir design study and adapted for
   dynamic chapter content. */

@font-face { font-family: "Tell Mel Newsreader"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/newsreader-latin-400-normal-48b72fa720bf98bfc1cc223056683e08.woff2?vsn=d") format("woff2"); }
@font-face { font-family: "Tell Mel Newsreader"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/newsreader-latin-500-normal-398a694b44c1a59e02254dd9a9938a8e.woff2?vsn=d") format("woff2"); }
@font-face { font-family: "Tell Mel Newsreader"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/newsreader-latin-600-normal-7cc0808d6d69ca914ad67a2a8472845a.woff2?vsn=d") format("woff2"); }
@font-face { font-family: "Tell Mel Geist"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/geist-latin-400-normal-56809efdfa4e42b32e3ea87e024ddcb7.woff2?vsn=d") format("woff2"); }
@font-face { font-family: "Tell Mel Geist"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/geist-latin-500-normal-10c3a6c65729628712239bb6a86a1c3a.woff2?vsn=d") format("woff2"); }
@font-face { font-family: "Tell Mel Geist"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/geist-latin-600-normal-c5fb39ae6acec6e07b7a450e92ee031c.woff2?vsn=d") format("woff2"); }
@font-face { font-family: "Tell Mel Geist"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/geist-latin-700-normal-6c351f5556aef684e09cd38479604b7e.woff2?vsn=d") format("woff2"); }
@font-face { font-family: "Tell Mel Geist Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/geist-mono-latin-500-normal-c15c192528ff172f5436fbd65cd6da3d.woff2?vsn=d") format("woff2"); }
@font-face { font-family: "Tell Mel Geist Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/geist-mono-latin-600-normal-99179cde64baf3e71a01d8baf5eea454.woff2?vsn=d") format("woff2"); }

:root {
  --serif: "Iowan Old Style", "Palatino Linotype", Baskerville, Georgia, serif;
  --sans: "Helvetica Neue", "Avenir Next", Arial, sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --memoir-ui-serif: "Tell Mel Newsreader", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --memoir-ui-sans: "Tell Mel Geist", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --memoir-ui-mono: "Tell Mel Geist Mono", "SFMono-Regular", Consolas, monospace;
  --memoir-ui-canvas: #f6f5f0;
  --memoir-ui-canvas-muted: #eee9df;
  --memoir-ui-paper: #fff;
  --memoir-ui-ink: #292a2c;
  --memoir-ui-ink-muted: #6f6e66;
  --memoir-ui-rule: #b7b6af;
  --memoir-ui-brick: #a74f3b;
  --memoir-ui-brick-hover: #823a2c;
  --memoir-ui-success: #315b39;
  --memoir-ui-success-soft: #e3eddc;
  --memoir-ui-danger: #8b2f2f;
  --memoir-ui-danger-soft: #f4dada;
  --memoir-ui-info: #35596b;
  --memoir-ui-info-soft: #dde8f1;
  /* Celebration confetti. Brighter and more saturated than the UI tokens —
     the muted chrome palette reads as falling dirt in motion — but kept in
     the memoir's warm register rather than going neon. */
  --memoir-confetti-1: #e2694a;
  --memoir-confetti-2: #e8b647;
  --memoir-confetti-3: #6b9e5f;
  --memoir-confetti-4: #4f93a8;
  --memoir-confetti-5: #a8547e;
  --memoir-confetti-6: #f6f5f0;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { display: flex; flex-direction: column; height: 100dvh; margin: 0; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.eyebrow { font: 500 10px/1.2 var(--mono); letter-spacing: .09em; text-transform: uppercase; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* Tell Mel navigation sits outside the themed memoir document so every public
   page and access gate has a consistent way back to the main product. */
.memoir-brand-bar { background: var(--memoir-ui-canvas); border-bottom: 1px solid var(--memoir-ui-rule); color: var(--memoir-ui-ink); flex: 0 0 auto; position: relative; z-index: 210; }
.memoir-brand-bar__inner { align-items: center; display: flex; gap: 24px; justify-content: space-between; margin: 0 auto; max-width: 1280px; min-height: 68px; padding: 12px 24px; }
.memoir-brand-bar__logo { flex: 0 0 auto; }
.memoir-brand-bar__logo img { height: auto; width: 132px; }
.memoir-brand-bar__nav { align-items: center; display: flex; flex-wrap: wrap; font: 500 14px/1.2 var(--memoir-ui-sans); gap: clamp(12px, 2.4vw, 28px); justify-content: flex-end; }
.memoir-brand-bar__nav > a:not(.memoir-brand-bar__cta) { color: var(--memoir-ui-ink-muted); white-space: nowrap; }
.memoir-brand-bar__nav > a:not(.memoir-brand-bar__cta):hover { color: var(--memoir-ui-ink); text-decoration: underline; text-decoration-color: var(--memoir-ui-brick); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.memoir-brand-bar__cta { background: var(--memoir-ui-brick); border: 1px solid var(--memoir-ui-brick); border-radius: 8px; color: var(--memoir-ui-canvas); font-weight: 600; padding: 10px 14px; white-space: nowrap; }
.memoir-brand-bar__cta:hover { background: var(--memoir-ui-brick-hover); border-color: var(--memoir-ui-brick-hover); }
.memoir-site-content { container-name: memoir-site-content; container-type: size; flex: 1 1 auto; min-height: 0; }
.memoir-site-content:has(.memoir-image-upload-backdrop) { container-type: normal; position: relative; z-index: 220; }
body:has(.memoir-image-upload-backdrop) .memoir-brand-bar { pointer-events: none; }

/* Owner-only inline editing */
.memoir-live-shell { isolation: isolate; min-height: 100cqh; position: relative; }
.memoir-live-shell.phx-click-loading { cursor: progress; }
.memoir-owner-sticky-tools { position: sticky; top: 0; z-index: 200; }
.memoir-owner-toolbar { --toolbar-border: rgb(246 245 240 / .28); --toolbar-muted: rgb(246 245 240 / .68); align-items: center; background: var(--memoir-ui-ink); border-bottom: 1px solid var(--toolbar-border); box-shadow: 0 8px 24px rgb(41 42 44 / .18); color: var(--memoir-ui-canvas); display: flex; font-family: var(--memoir-ui-sans); gap: 12px; min-height: 56px; padding: 8px 16px; position: relative; }
.memoir-owner-toolbar__back { align-items: center; color: var(--memoir-ui-canvas); display: inline-flex; flex: 0 0 auto; font: 600 12px var(--memoir-ui-sans); gap: 5px; white-space: nowrap; }
.memoir-owner-toolbar__back:hover { color: var(--memoir-ui-paper); text-decoration: underline; text-underline-offset: 3px; }
.memoir-owner-toolbar__back-mark { color: #d88975; font: 700 14px/1 var(--memoir-ui-sans); }
.memoir-owner-toolbar__preview { background: var(--memoir-ui-info-soft); border: 1px solid var(--memoir-ui-info); border-radius: 8px; color: var(--memoir-ui-info); flex: 0 0 auto; font: 700 10px/1 var(--memoir-ui-mono); letter-spacing: .07em; padding: 7px 9px; text-transform: uppercase; }
.memoir-owner-toolbar__formats { align-items: center; display: flex; gap: 8px; min-width: 0; }
.memoir-owner-toolbar__label { color: var(--toolbar-muted); flex: 0 0 auto; font: 600 10px var(--memoir-ui-mono); letter-spacing: .07em; margin-right: 3px; text-transform: uppercase; }
.memoir-owner-toolbar__select-wrap { display: block; position: relative; }
.memoir-owner-toolbar__select-wrap select { appearance: none; background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; color: var(--memoir-ui-ink); cursor: pointer; font: 500 13px var(--memoir-ui-sans); min-width: 170px; padding: 8px 34px 8px 12px; }
.memoir-owner-toolbar__select-wrap select:hover { border-color: var(--memoir-ui-ink-muted); }
.memoir-owner-toolbar__select-wrap select:disabled { cursor: default; opacity: .62; }
.memoir-owner-toolbar__select-wrap .hero-chevron-down-mini { height: 16px; pointer-events: none; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 16px; }
.memoir-owner-toolbar button { background: var(--memoir-ui-paper); border: 1px solid var(--toolbar-border); border-radius: 8px; color: var(--memoir-ui-ink); cursor: pointer; flex: 0 0 auto; font: 600 12px var(--memoir-ui-sans); padding: 8px 10px; white-space: nowrap; }
.memoir-owner-toolbar button:hover { border-color: var(--memoir-ui-ink-muted); }
.memoir-owner-toolbar button:disabled { cursor: default; opacity: .62; }
.memoir-owner-toolbar__status { color: var(--toolbar-muted); flex: 1 1 auto; font: 12px/1.3 var(--memoir-ui-sans); min-width: 130px; text-align: right; }
.memoir-owner-toolbar__status .is-success { color: var(--memoir-ui-success-soft); }
.memoir-owner-toolbar__status .is-error { color: var(--memoir-ui-danger-soft); }
.memoir-owner-toolbar .memoir-owner-toolbar__undo { background: none; border: 0; border-bottom: 1px solid currentColor; border-radius: 0; color: var(--memoir-ui-success-soft); cursor: pointer; font: 600 12px/1.3 var(--memoir-ui-sans); margin-left: 8px; padding: 0; }
.memoir-owner-toolbar .memoir-owner-toolbar__undo:hover { color: var(--memoir-ui-canvas); }
.memoir-owner-toolbar__sharing { align-items: stretch; border: 1px solid var(--toolbar-border); border-radius: 8px; display: flex; flex: 0 0 auto; }
.memoir-owner-toolbar .memoir-owner-toolbar__sharing .memoir-share-action { background: var(--memoir-ui-brick); border: 0; border-radius: 7px; color: var(--memoir-ui-canvas); }
.memoir-owner-toolbar .memoir-owner-toolbar__sharing .memoir-share-action:hover { background: var(--memoir-ui-brick-hover); }
.memoir-share-action { align-items: center; display: inline-flex; gap: 6px; }
.memoir-share-action svg { height: 15px; width: 15px; }
.memoir-share-menu { flex: 0 0 auto; position: relative; }
.memoir-share-menu__panel { background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 12px; box-shadow: 0 20px 52px rgb(41 42 44 / .2); color: var(--memoir-ui-ink); margin-top: 8px; padding: 20px; position: absolute; right: 0; top: 100%; width: min(360px, calc(100vw - 20px)); }
.memoir-share-menu__panel header > span { color: var(--memoir-ui-brick); display: block; font: 700 10px var(--memoir-ui-mono); letter-spacing: .08em; margin-bottom: 5px; text-transform: uppercase; }
.memoir-share-menu__panel h2 { font: 500 26px/1.1 var(--memoir-ui-serif); letter-spacing: -.02em; margin: 0; }
.memoir-share-menu__panel header p { color: var(--memoir-ui-ink-muted); font: 13px/1.4 var(--memoir-ui-sans); margin: 6px 0 0; }
.memoir-share-menu__panel form { margin-top: 18px; }
.memoir-share-menu__panel fieldset { border: 0; display: grid; gap: 7px; margin: 0; padding: 0; }
.memoir-share-menu__panel legend { font: 700 11px var(--memoir-ui-sans); margin-bottom: 8px; text-transform: uppercase; }
.memoir-share-menu__choice { align-items: flex-start; border: 1px solid var(--memoir-ui-rule); border-radius: 8px; cursor: pointer; display: flex; gap: 9px; padding: 10px; }
.memoir-share-menu__choice:has(input:checked) { background: var(--memoir-ui-canvas-muted); border-color: var(--memoir-ui-brick); }
.memoir-share-menu__panel input[type="radio"] { accent-color: var(--memoir-ui-brick); margin-top: 2px; }
.memoir-share-menu__panel strong, .memoir-share-menu__panel small { display: block; }
.memoir-share-menu__panel strong { font: 600 13px/1.3 var(--memoir-ui-sans); }
.memoir-share-menu__panel small { color: var(--memoir-ui-ink-muted); font: 11px/1.35 var(--memoir-ui-sans); margin-top: 2px; }
.memoir-share-menu__password-choice { display: grid; gap: 8px; }
.memoir-share-menu__password { display: none; font: 600 11px/1.35 var(--memoir-ui-sans); gap: 6px; padding: 0 10px 4px; }
.memoir-share-menu__password-choice:has(input[value="password"]:checked) .memoir-share-menu__password { display: grid; }
.memoir-share-menu__password input { border: 1px solid var(--memoir-ui-rule); border-radius: 8px; color: var(--memoir-ui-ink); font: 14px var(--memoir-ui-sans); min-width: 0; padding: 9px 10px; width: 100%; }
.memoir-share-menu__password-note { color: var(--memoir-ui-ink-muted); font: 11px/1.35 var(--memoir-ui-sans); }
.memoir-share-menu__preview { background: var(--memoir-ui-canvas-muted); border-radius: 8px; display: grid; gap: 6px; margin-top: 14px; padding: 10px; }
.memoir-share-menu__preview h3 { font: 700 11px var(--memoir-ui-sans); margin: 0; text-transform: uppercase; }
.memoir-share-menu__preview output { font: 12px/1.4 var(--memoir-ui-mono); overflow-wrap: anywhere; }
.memoir-share-menu__password-preview { display: none; }
.memoir-share-menu__panel:has(input[value="password"]:checked) .memoir-share-menu__password-preview { display: block; }
.memoir-share-menu__errors { background: var(--memoir-ui-danger-soft); border-radius: 8px; color: var(--memoir-ui-danger); font: 12px/1.35 var(--memoir-ui-sans); list-style: none; margin: 12px 0 0; padding: 9px 10px; }
.memoir-owner-toolbar .memoir-share-menu__save { background: var(--memoir-ui-brick); border-color: var(--memoir-ui-brick); border-radius: 8px; color: var(--memoir-ui-canvas); font: 600 12px var(--memoir-ui-sans); margin-top: 13px; padding: 9px 12px; width: 100%; }
.memoir-owner-toolbar .memoir-share-menu__save:hover { background: var(--memoir-ui-brick-hover); border-color: var(--memoir-ui-brick-hover); }

.memoir-editable-field { position: relative; }
.memoir-editable-field__placeholder { opacity: .45; }
.memoir-editable-field__controls { display: inline-flex; gap: 4px; opacity: 0; pointer-events: none; position: absolute; right: 0; top: 0; transform: translateY(calc(-100% - 6px)); transition: opacity .15s ease; z-index: 5; }
.memoir-editable-field:hover > .memoir-editable-field__controls, .memoir-editable-field:focus-within > .memoir-editable-field__controls { opacity: 1; pointer-events: auto; }
.memoir-editable-field__controls::after { content: ""; height: 6px; left: 0; position: absolute; right: 0; top: 100%; }
.memoir-editable-field__controls button { background: var(--memoir-ui-canvas); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; box-shadow: 0 2px 8px rgb(41 42 44 / .12); color: var(--memoir-ui-brick); cursor: pointer; font: 600 12px/1 var(--memoir-ui-sans); letter-spacing: 0; padding: 9px 12px; position: relative; text-transform: none; white-space: nowrap; }
/* Grows the tap target to ~44px without growing the visible button, so
   dense inline-edit rows don't reflow to make room for bigger buttons. */
.memoir-editable-field__controls button::after { content: ""; inset: -8px; position: absolute; }
.memoir-editable-field__controls button:hover { background: var(--memoir-ui-canvas-muted); border-color: var(--memoir-ui-brick); }
.memoir-editable-field__controls button:disabled { cursor: default; opacity: .7; }
.memoir-editable-field__click-target { background: none; border: 0; color: inherit; cursor: text; display: block; font: inherit; margin: 0; padding: 0; text-align: inherit; width: 100%; }
.memoir-editable-field__click-target:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }

/* Reader language toggle: structure only. Each of the nine themes styles
   its own colour and typography for these class hooks. */
.memoir-language-toggle { align-items: center; display: inline-flex; gap: 4px; }
.memoir-language-toggle__option { border-radius: 999px; display: inline-block; padding: 4px 12px; }

/* Shown beside a chapter that a bilingual memoir only ever produced in
   English. Structure only; themes inherit their own colour and type. */
.memoir-english-only-note { font-size: 0.85em; font-style: italic; margin-top: 1.25em; opacity: 0.7; }

/* Byline naming the contributor a chapter came from, shown between the
   chapter title and body on all five templates. */
.memoir-chapter-byline { color: var(--memoir-ui-ink-muted); font: 13px/1.4 var(--memoir-ui-sans); margin: 6px 0 20px; }

.memoir-owner-toolbar .memoir-chapter-call-action { align-items: center; background: var(--memoir-ui-brick); border-color: var(--memoir-ui-brick); color: var(--memoir-ui-canvas); display: inline-flex; font-size: 13px; gap: 6px; left: 50%; min-height: 44px; padding: 10px 16px; position: absolute; top: 50%; transform: translate(-50%, -50%); }
.memoir-owner-toolbar .memoir-chapter-call-action:hover { background: var(--memoir-ui-brick-hover); border-color: var(--memoir-ui-brick-hover); }
.memoir-chapter-call-action svg { height: 15px; width: 15px; }
.memoir-chapter-call-menu { background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 12px; box-shadow: 0 24px 70px rgb(41 42 44 / .28); color: var(--memoir-ui-ink); display: grid; font: 14px/1.4 var(--memoir-ui-sans); gap: 18px; max-width: 420px; padding: 24px; width: 100%; }
.memoir-chapter-call-menu__header span { color: var(--memoir-ui-brick); display: block; font: 700 10px var(--memoir-ui-mono); letter-spacing: .08em; margin-bottom: 6px; text-transform: uppercase; }
.memoir-chapter-call-menu__header h2 { color: var(--memoir-ui-ink); font: 500 24px/1.15 var(--memoir-ui-serif); letter-spacing: -.02em; margin: 0; }
.memoir-chapter-call-menu__header p { color: var(--memoir-ui-ink-muted); font: 13px/1.4 var(--memoir-ui-sans); margin: 7px 0 0; }
.memoir-chapter-call-menu__actions { display: grid; gap: 10px; }
.memoir-chapter-call-menu__actions button, .memoir-chapter-call-menu__actions a { align-items: center; background: var(--memoir-ui-canvas); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; color: var(--memoir-ui-ink); cursor: pointer; display: flex; font: 600 14px var(--memoir-ui-sans); gap: 8px; justify-content: center; min-height: 48px; padding: 12px 16px; text-align: center; text-decoration: none; }
.memoir-chapter-call-menu__actions button:hover, .memoir-chapter-call-menu__actions a:hover { border-color: var(--memoir-ui-ink-muted); }
.memoir-chapter-call-menu__actions .is-primary { background: var(--memoir-ui-brick); border-color: var(--memoir-ui-brick); color: var(--memoir-ui-canvas); font-size: 15px; }
.memoir-chapter-call-menu__actions .is-primary:hover { background: var(--memoir-ui-brick-hover); border-color: var(--memoir-ui-brick-hover); }
.memoir-chapter-call-menu__actions button:disabled { cursor: default; opacity: .55; }
.memoir-chapter-call-menu__actions .is-danger { border-color: var(--memoir-ui-danger); color: var(--memoir-ui-danger); }
.memoir-chapter-call-menu__actions .is-danger:hover { background: var(--memoir-ui-danger); border-color: var(--memoir-ui-danger); color: var(--memoir-ui-canvas); }
.memoir-chapter-call-menu__tag { background: var(--memoir-ui-canvas); border-radius: 999px; color: var(--memoir-ui-brick); font: 700 9px var(--memoir-ui-mono); letter-spacing: .06em; padding: 3px 8px; text-transform: uppercase; }
.memoir-chapter-call-menu__actions .is-primary { flex-direction: column; gap: 4px; }
.memoir-chapter-call-menu__primary-title { align-items: center; display: inline-flex; font: 700 15px var(--memoir-ui-sans); gap: 8px; }
.memoir-chapter-call-menu__primary-hint { font: 400 13px/1.3 var(--memoir-ui-sans); opacity: .85; }

/* Approval celebration. The confetti canvas sits above the modal backdrop but
   never takes pointer events, so the dialog stays operable while it plays. */
.memoir-release-celebration { background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 12px; box-shadow: 0 24px 70px rgb(41 42 44 / .28); color: var(--memoir-ui-ink); display: grid; font: 14px/1.4 var(--memoir-ui-sans); gap: 20px; max-width: 440px; padding: 28px; position: relative; text-align: center; width: 100%; z-index: 1; }
.memoir-release-celebration__header span { color: var(--memoir-ui-brick); display: block; font: 700 10px var(--memoir-ui-mono); letter-spacing: .08em; margin-bottom: 8px; text-transform: uppercase; }
.memoir-release-celebration__header h2 { color: var(--memoir-ui-ink); font: 500 28px/1.1 var(--memoir-ui-serif); letter-spacing: -.02em; margin: 0; }
.memoir-release-celebration__header p { color: var(--memoir-ui-ink-muted); font: 14px/1.5 var(--memoir-ui-sans); margin: 10px 0 0; }
.memoir-release-celebration .is-primary { background: var(--memoir-ui-brick); border: 1px solid var(--memoir-ui-brick); border-radius: 8px; color: var(--memoir-ui-canvas); cursor: pointer; font: 700 15px var(--memoir-ui-sans); min-height: 48px; padding: 12px 16px; width: 100%; }
.memoir-release-celebration .is-primary:hover { background: var(--memoir-ui-brick-hover); border-color: var(--memoir-ui-brick-hover); }
.memoir-confetti-canvas { inset: 0; pointer-events: none; position: absolute; }

/* Standalone approval bar for review-token readers (owners get the same
   actions merged into the owner toolbar instead). Mirrors the owner
   toolbar treatment — dark ink bar, brick primary, outlined secondary —
   and sits inside the same sticky chrome wrapper. */
.memoir-review-banner { align-items: center; background: var(--memoir-ui-ink); border-bottom: 1px solid rgb(246 245 240 / .28); box-shadow: 0 8px 24px rgb(41 42 44 / .18); color: var(--memoir-ui-canvas); display: flex; flex-wrap: wrap; font-family: var(--memoir-ui-sans); gap: 14px; justify-content: space-between; min-height: 56px; padding: 8px 16px; }
.memoir-review-banner__message { font: 700 14px/1.3 var(--memoir-ui-sans); margin: 0; }
.memoir-review-banner__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.memoir-review-banner__actions button { background: transparent; border: 1px solid rgb(246 245 240 / .28); border-radius: 8px; color: var(--memoir-ui-canvas); cursor: pointer; font: 700 14px var(--memoir-ui-sans); min-height: 44px; padding: 11px 20px; }
.memoir-review-banner__actions button:hover { border-color: var(--memoir-ui-canvas); }
.memoir-review-banner__actions .is-primary { background: var(--memoir-ui-brick); border-color: var(--memoir-ui-brick); color: var(--memoir-ui-canvas); }
.memoir-review-banner__actions .is-primary:hover { background: var(--memoir-ui-brick-hover); border-color: var(--memoir-ui-brick-hover); }

/* "Add your story" call to action for eligible contributors. Its transparent
   surface carries through the active memoir template's canvas. */
.memoir-add-story-banner { align-items: center; background: transparent; border-bottom: 1px solid var(--memoir-ui-rule); display: flex; justify-content: center; padding: 10px 20px 36px; }
.memoir-add-story-banner__link { align-items: center; background: var(--memoir-ui-brick); border: 1px solid var(--memoir-ui-brick); border-radius: 8px; color: var(--memoir-ui-canvas); display: inline-flex; font: 600 14px var(--memoir-ui-sans); min-height: 44px; padding: 10px 18px; }
.memoir-add-story-banner__link:hover { background: var(--memoir-ui-brick-hover); border-color: var(--memoir-ui-brick-hover); }

/* Owner toolbar in review mode: the approval actions replace the Edit
   Chapter button so the page keeps a single owner bar. */
.memoir-owner-toolbar--review { border-bottom: 3px solid var(--memoir-ui-brick); min-height: 64px; }
.memoir-owner-toolbar__review { align-items: center; display: flex; flex: 1 1 auto; flex-wrap: wrap; gap: 12px; justify-content: center; }
.memoir-owner-toolbar__review-message { font: 700 14px/1.3 var(--memoir-ui-sans); }
.memoir-owner-toolbar__review button { border-radius: 8px; cursor: pointer; font: 700 14px var(--memoir-ui-sans); min-height: 44px; padding: 11px 20px; }
.memoir-owner-toolbar__review .memoir-review-approve { background: var(--memoir-ui-brick); border: 1px solid var(--memoir-ui-brick); color: var(--memoir-ui-canvas); }
.memoir-owner-toolbar__review .memoir-review-approve:hover { background: var(--memoir-ui-brick-hover); border-color: var(--memoir-ui-brick-hover); }
.memoir-owner-toolbar__review .memoir-review-make-changes { background: transparent; border: 1px solid var(--toolbar-border); color: var(--memoir-ui-canvas); }
.memoir-owner-toolbar__review .memoir-review-make-changes:hover { border-color: var(--memoir-ui-canvas); }
.memoir-owner-toolbar--review .memoir-owner-toolbar__status { flex: 0 1 auto; }

.memoir-call-started-notice { align-items: center; background: var(--memoir-ui-success-soft); border-bottom: 3px solid var(--memoir-ui-success); color: var(--memoir-ui-success); display: flex; font: 700 16px/1.4 var(--memoir-ui-sans); gap: 10px; justify-content: center; min-height: 64px; padding: 16px 64px; position: relative; text-align: center; width: 100%; }
.memoir-call-started-notice svg { flex: 0 0 auto; height: 22px; width: 22px; }
.memoir-call-started-notice .memoir-call-started-notice__dismiss { align-items: center; background: transparent; border: 0; color: inherit; cursor: pointer; display: flex; height: 44px; justify-content: center; padding: 0; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 44px; }
.memoir-call-started-notice__dismiss:hover { opacity: .72; }
.memoir-call-started-notice__dismiss:focus-visible { outline: 2px solid currentColor; outline-offset: -4px; }
.memoir-call-started-notice__dismiss svg { height: 20px; width: 20px; }

/* Feedback for a review-token reader, who has no owner toolbar to show the
   equivalent `@notice` status text in. */
.memoir-review-notice { background: var(--memoir-ui-canvas-muted); border-bottom: 1px solid var(--memoir-ui-rule); color: var(--memoir-ui-ink); font: 600 13px/1.4 var(--memoir-ui-sans); padding: 10px 20px; }
.memoir-review-notice[role="alert"] { background: var(--memoir-ui-danger-soft); color: var(--memoir-ui-danger); }
.memoir-nav-title { min-width: 0; }
.memoir-nav-title > .memoir-editable-field__controls { left: calc(100% + 8px); right: auto; top: 50%; transform: translateY(-50%); }

.memoir-editable-image { position: relative; }
.memoir-editable-image__controls { display: flex; gap: 5px; opacity: 0; pointer-events: none; position: absolute; right: 12px; top: 12px; transition: opacity .15s ease; z-index: 4; }
.memoir-editable-image:hover > .memoir-editable-image__controls, .memoir-editable-image:focus-within > .memoir-editable-image__controls { opacity: 1; pointer-events: auto; }
.memoir-editable-image__controls button { background: var(--memoir-ui-canvas); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; box-shadow: 0 2px 8px rgb(41 42 44 / .14); color: var(--memoir-ui-brick); cursor: pointer; font: 600 11px var(--memoir-ui-sans); padding: 8px 11px; }
.memoir-editable-image__controls button:disabled { cursor: default; opacity: .55; }
.memoir-expandable-image { cursor: zoom-in; display: block; }
.memoir-abstract-illustration { aspect-ratio: 16 / 10; background: rgb(216 199 178); overflow: hidden; position: relative; }
.memoir-abstract-illustration > img { display: block; height: 100%; object-fit: cover; width: 100%; }
.memoir-image-placeholder { min-height: 220px; }
.memoir-image-upload-root { display: contents; }
.memoir-image-upload-backdrop { align-items: center; background: rgb(0 0 0 / .62); display: flex; inset: 0; justify-content: center; padding: 24px; position: fixed; z-index: 1000; }
.memoir-image-upload { background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 12px; box-shadow: 0 24px 70px rgb(41 42 44 / .28); color: var(--memoir-ui-ink); display: grid; font: 14px/1.4 var(--memoir-ui-sans); gap: 18px; margin: 0; max-height: calc(100dvh - 48px); max-width: 820px; overflow: auto; padding: 24px; position: relative; width: 100%; }
.memoir-image-upload__header { align-items: flex-start; display: flex; gap: 20px; justify-content: space-between; }
.memoir-image-upload__header span { color: var(--memoir-ui-brick); display: block; font: 700 10px var(--memoir-ui-mono); letter-spacing: .08em; margin-bottom: 6px; text-transform: uppercase; }
.memoir-image-upload__header h2 { color: var(--memoir-ui-ink); font: 500 27px/1.1 var(--memoir-ui-serif); letter-spacing: -.02em; margin: 0; }
.memoir-image-upload__header p { color: var(--memoir-ui-ink-muted); font: 13px/1.4 var(--memoir-ui-sans); margin: 7px 0 0; }
.memoir-image-upload__close { align-items: center; background: var(--memoir-ui-canvas-muted); border: 0; border-radius: 8px; color: var(--memoir-ui-ink); cursor: pointer; display: flex; flex: 0 0 auto; height: 34px; justify-content: center; padding: 0; width: 34px; }
.memoir-image-upload__close:hover { background: var(--memoir-ui-canvas); }
.memoir-image-upload__close svg { height: 18px; width: 18px; }
.memoir-image-upload__current { align-items: center; background: var(--memoir-ui-canvas); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; display: grid; gap: 13px; grid-template-columns: 72px minmax(0, 1fr); padding: 10px; }
.memoir-image-upload__current img { aspect-ratio: 1; border-radius: 7px; height: 72px; object-fit: cover; width: 72px; }
.memoir-image-upload__current strong, .memoir-image-upload__current span { display: block; }
.memoir-image-upload__current strong { font-size: 13px; margin-bottom: 3px; }
.memoir-image-upload__current span { color: var(--memoir-ui-ink-muted); font-size: 12px; }
.memoir-image-upload__choices { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); }
.memoir-image-upload__choices.has-revision { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.memoir-image-upload__revision, .memoir-image-upload__replacement { background: var(--memoir-ui-canvas); border: 1px solid var(--memoir-ui-rule); border-radius: 12px; display: grid; gap: 8px; min-width: 0; padding: 16px; }
.memoir-image-upload__revision h3, .memoir-image-upload__replacement h3 { font: 500 20px/1.2 var(--memoir-ui-serif); margin: 0; }
.memoir-image-upload__revision p, .memoir-image-upload__replacement > p { color: var(--memoir-ui-ink-muted); font-size: 13px; margin: 0 0 4px; }
.memoir-image-upload__revision label { font-size: 13px; font-weight: 600; }
.memoir-image-upload__revision textarea { border: 1px solid var(--memoir-ui-rule); border-radius: 8px; font: 14px/1.45 var(--memoir-ui-sans); min-height: 92px; padding: 10px 12px; resize: vertical; width: 100%; }
.memoir-image-upload__revision button { justify-self: start; margin-top: 4px; }
.memoir-image-upload__revision small:not([role="alert"]) { color: var(--memoir-ui-ink-muted); }
.memoir-editable-image__revision-status { background: var(--memoir-ui-info-soft); border-radius: 8px; color: var(--memoir-ui-info); display: inline-block; font: 600 12px var(--memoir-ui-sans); margin-top: 8px; padding: 6px 10px; }
.memoir-editable-image__revision-status.is-loading { align-items: center; background: rgb(41 42 44 / .92); border: 1px solid rgb(255 255 255 / .38); border-radius: 12px; box-shadow: 0 14px 34px rgb(41 42 44 / .24), inset 0 1px 0 rgb(255 255 255 / .12); box-sizing: border-box; color: white; display: grid; font-family: var(--memoir-ui-sans); gap: 12px; grid-template-columns: auto minmax(0, 1fr); left: 50%; margin: 0; padding: 14px 16px; pointer-events: none; position: absolute; top: 45%; transform: translate3d(-50%, -50%, 0); width: min(320px, calc(100% - 32px)); z-index: 3; }
.memoir-editable-image__revision-spinner { animation: memoir-revision-spin .85s cubic-bezier(.5, 0, .5, 1) infinite; border: 3px solid rgb(255 255 255 / .32); border-radius: 999px; border-top-color: white; display: block; height: 24px; width: 24px; }
.memoir-editable-image__revision-copy { display: grid; gap: 2px; min-width: 0; }
.memoir-editable-image__revision-copy strong { color: white; font-size: 15px; font-weight: 800; line-height: 1.2; }
.memoir-editable-image__revision-copy > span { color: rgb(255 255 255 / .8); font-size: 12px; font-weight: 500; line-height: 1.35; }
.memoir-editable-image__revision-status.is-error { background: var(--memoir-ui-danger-soft); color: var(--memoir-ui-danger); }
@keyframes memoir-revision-spin { to { transform: rotate(360deg); } }
.memoir-image-upload__picker { align-items: center; border: 1px dashed var(--memoir-ui-rule); border-radius: 12px; cursor: pointer; display: flex; flex-direction: column; gap: 5px; justify-content: center; min-height: 180px; overflow: hidden; padding: 28px; position: relative; text-align: center; }
.memoir-image-upload__picker.is-hidden { border: 0; height: 0; min-height: 0; overflow: hidden; padding: 0; position: absolute; width: 0; }
.memoir-image-upload__picker:hover, .memoir-image-upload__picker:focus-within { background: var(--memoir-ui-canvas); border-color: var(--memoir-ui-brick); }
.memoir-image-upload__picker input[type="file"] { cursor: pointer; inset: 0; opacity: 0; position: absolute; width: 100%; }
.memoir-image-upload__picker > svg { color: var(--memoir-ui-brick); height: 30px; margin-bottom: 5px; width: 30px; }
.memoir-image-upload__picker strong { font-size: 14px; }
.memoir-image-upload__picker span { color: var(--memoir-ui-ink-muted); font-size: 12px; }
.memoir-image-upload__entry { display: grid; gap: 14px; grid-template-columns: 150px minmax(0, 1fr); }
.memoir-image-upload__entry img { aspect-ratio: 4 / 3 !important; border-radius: 9px; height: 112px !important; object-fit: cover; width: 150px !important; }
.memoir-image-upload__entry-details { align-self: center; min-width: 0; }
.memoir-image-upload__entry-details strong, .memoir-image-upload__entry-details span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.memoir-image-upload__entry-details strong { font-size: 13px; }
.memoir-image-upload__entry-details span { color: var(--memoir-ui-ink-muted); font-size: 12px; margin-top: 4px; }
.memoir-image-upload__entry-details button { background: transparent; border: 0; color: var(--memoir-ui-brick); cursor: pointer; font: 600 12px var(--memoir-ui-sans); margin-top: 13px; padding: 0; text-decoration: underline; text-underline-offset: 3px; }
.memoir-image-upload__entry progress { accent-color: var(--memoir-ui-brick); grid-column: 1 / -1; width: 100%; }
.memoir-image-upload__entry > small { grid-column: 1 / -1; }
.memoir-image-upload__errors { background: var(--memoir-ui-danger-soft); border: 1px solid var(--memoir-ui-danger); border-radius: 8px; display: grid; gap: 4px; padding: 10px 12px; }
.memoir-image-upload small { color: var(--memoir-ui-danger); }
.memoir-image-upload__actions { border-top: 1px solid var(--memoir-ui-rule); display: flex; gap: 8px; justify-content: flex-end; padding-top: 17px; }
.memoir-image-upload__actions button { background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; color: var(--memoir-ui-ink); cursor: pointer; font: 600 13px var(--memoir-ui-sans); padding: 9px 14px; }
.memoir-image-upload__actions button:hover { background: var(--memoir-ui-canvas-muted); border-color: var(--memoir-ui-ink-muted); }
.memoir-image-upload button.is-primary { background: var(--memoir-ui-brick); border: 1px solid var(--memoir-ui-brick); border-radius: 8px; color: var(--memoir-ui-canvas); cursor: pointer; font: 600 13px var(--memoir-ui-sans); padding: 9px 14px; transition: background .15s ease, transform .15s ease; }
.memoir-image-upload button.is-primary:hover { background: var(--memoir-ui-brick-hover); }
.memoir-image-upload button.is-primary:active { transform: scale(.98); }
.memoir-image-upload__actions button:disabled, .memoir-image-upload button.is-primary:disabled { cursor: default; opacity: .5; }
.chapter-gallery { border-top: 1px solid currentColor; margin: clamp(52px, 7vw, 92px) 0 0; padding-top: 20px; }
.chapter-gallery__owner-header { align-items: center; display: flex; font: 12px/1.3 var(--memoir-ui-sans); gap: 20px; justify-content: space-between; margin-bottom: 20px; }
.chapter-gallery__owner-header span, .chapter-gallery__owner-header strong { display: block; }
.chapter-gallery__owner-header span { font-size: 10px; letter-spacing: .07em; margin-bottom: 3px; text-transform: uppercase; }
.chapter-gallery__owner-header button { background: var(--memoir-ui-brick); border: 1px solid var(--memoir-ui-brick); border-radius: 8px; color: var(--memoir-ui-canvas); cursor: pointer; font: 600 11px var(--memoir-ui-sans); padding: 8px 12px; }
.chapter-gallery__owner-header button:disabled { cursor: default; opacity: .48; }
.chapter-gallery__login { display: flex; font: 600 13px var(--memoir-ui-sans); justify-content: flex-end; margin-top: 20px; }
.chapter-gallery__login:first-child { margin-top: 0; }
.chapter-gallery__login a { color: var(--memoir-ui-brick); text-decoration: underline; text-underline-offset: 3px; }
.chapter-gallery__items { display: grid; gap: clamp(24px, 3vw, 42px); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.chapter-gallery__item { break-inside: avoid; margin: 0; min-width: 0; position: relative; }
.chapter-gallery__image { background: rgb(0 0 0 / .05); display: block; overflow: hidden; }
.chapter-gallery__image img { aspect-ratio: 4 / 3; height: auto; object-fit: cover; width: 100%; }
.chapter-gallery__item figcaption { font: 13px/1.45 var(--serif); margin-top: 10px; }
.chapter-gallery__controls { display: flex; flex-wrap: wrap; gap: 5px; justify-content: flex-end; left: 9px; opacity: 0; pointer-events: none; position: absolute; right: 9px; top: 9px; transition: opacity .15s ease; z-index: 4; }
.chapter-gallery__item:hover .chapter-gallery__controls, .chapter-gallery__item:focus-within .chapter-gallery__controls { opacity: 1; pointer-events: auto; }
.chapter-gallery__controls button { align-items: center; background: var(--memoir-ui-canvas); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; box-shadow: 0 2px 8px rgb(41 42 44 / .14); color: var(--memoir-ui-brick); cursor: pointer; display: flex; font: 600 10px/1 var(--memoir-ui-sans); height: 32px; justify-content: center; padding: 0 10px; white-space: nowrap; }
.chapter-gallery__controls button:disabled { cursor: default; opacity: .45; }
.chapter-gallery-upload { max-width: 720px; }
.chapter-gallery-upload__entries { display: grid; gap: 18px; }
.chapter-gallery-upload__picker { min-height: 130px; }

.memoir-inline-editor { background: var(--memoir-ui-canvas); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; color: var(--memoir-ui-ink); display: grid; font: 14px/1.4 var(--memoir-ui-sans); gap: 8px; margin: 12px 0 24px; max-width: 760px; padding: 14px; position: relative; z-index: 2; }
.memoir-inline-editor > label { font: 700 11px var(--memoir-ui-mono); letter-spacing: .06em; text-transform: uppercase; }
.memoir-inline-editor input, .memoir-inline-editor textarea { background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; color: var(--memoir-ui-ink); font: 16px/1.45 var(--memoir-ui-sans); padding: 10px 11px; width: 100%; }
.memoir-inline-editor textarea { min-height: 110px; resize: vertical; }
.memoir-inline-editor small { color: var(--memoir-ui-danger); font: 12px var(--memoir-ui-sans); }
.memoir-inline-editor__actions { display: flex; flex-wrap: wrap; gap: 7px; }
.memoir-inline-editor__actions button { background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; color: var(--memoir-ui-ink); cursor: pointer; font: 600 12px var(--memoir-ui-sans); padding: 8px 12px; }
.memoir-inline-editor__actions button:first-child { background: var(--memoir-ui-brick); border-color: var(--memoir-ui-brick); color: var(--memoir-ui-canvas); }
.memoir-inline-editor__actions button:disabled { cursor: default; opacity: .55; }
.memoir-inline-editor--rich { max-width: 900px; }
.memoir-inline-editor--rich [data-content-input-id] { min-height: 300px; }
.memoir-inline-editor--rich [phx-hook="TiptapEditor"] > div:first-child { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 8px; }
.memoir-inline-editor--rich [phx-hook="TiptapEditor"] button { background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 6px; color: var(--memoir-ui-ink); cursor: pointer; font: 600 12px var(--memoir-ui-sans); padding: 6px 8px; }
.memoir-inline-editor--rich [phx-hook="TiptapEditor"] > div:last-child { background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; font: 17px/1.55 var(--memoir-ui-serif); min-height: 320px; padding: 15px; }

@media print {
  .memoir-owner-sticky-tools, .memoir-owner-toolbar, .memoir-add-story-banner, .memoir-editable-field__controls, .memoir-inline-editor, .memoir-image-upload-backdrop, .chapter-gallery__owner-header, .chapter-gallery__controls { display: none; }
  .chapter-gallery__item { break-inside: avoid; }
}

/* Gate pages (password unlock / members only) */
.gate-page { align-items: center; background: var(--memoir-ui-canvas); color: var(--memoir-ui-ink); display: flex; font-family: var(--memoir-ui-sans); justify-content: center; min-height: 100cqh; padding: 24px; }
.gate-card { background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 12px; box-shadow: 0 20px 60px rgb(41 42 44 / .08); max-width: 460px; padding: 40px 38px; width: 100%; }
.gate-brand { align-items: center; color: var(--memoir-ui-ink); display: inline-flex; font: 600 24px/1 var(--memoir-ui-serif); gap: 8px; letter-spacing: -.02em; margin-bottom: 52px; }
.gate-brand span { color: var(--memoir-ui-brick); font: 600 13px/1 var(--memoir-ui-sans); }
.gate-eyebrow { color: var(--memoir-ui-ink-muted); font: 600 10px/1.2 var(--memoir-ui-mono); letter-spacing: .09em; margin: 0 0 14px; text-transform: uppercase; }
.gate-card h1 { font: 500 38px/.98 var(--memoir-ui-serif); letter-spacing: -.035em; margin: 0 0 18px; }
.gate-card p { color: var(--memoir-ui-ink-muted); font: 15px/1.5 var(--memoir-ui-sans); margin: 0 0 14px; }
.gate-card .gate-error { background: var(--memoir-ui-danger-soft); border: 1px solid var(--memoir-ui-danger); border-radius: 8px; color: var(--memoir-ui-danger); font-size: 14px; padding: 10px 12px; }
.gate-card form { display: grid; gap: 10px; margin-top: 24px; }
.gate-card label { font: 600 13px/1.35 var(--memoir-ui-sans); }
.gate-card input[type="password"] { background: var(--memoir-ui-paper); border: 1px solid var(--memoir-ui-rule); border-radius: 8px; color: var(--memoir-ui-ink); font: 16px var(--memoir-ui-sans); min-height: 46px; padding: 12px 14px; }
.gate-card input[type="password"]:focus { border-color: var(--memoir-ui-brick); outline-color: var(--memoir-ui-brick); }
.gate-card button, .gate-button { background: var(--memoir-ui-brick); border: 1px solid var(--memoir-ui-brick); border-radius: 8px; color: var(--memoir-ui-canvas); cursor: pointer; display: inline-block; font: 600 14px var(--memoir-ui-sans); min-height: 44px; padding: 12px 22px; text-align: center; }
.gate-card button:hover, .gate-button:hover { background: var(--memoir-ui-brick-hover); border-color: var(--memoir-ui-brick-hover); }
.gate-button { margin-top: 16px; }

/* 01 — The Hearth Book */
.hearth-page { background: #f6f5f0; color: #292a2c; }
.hearth-topline { align-items: center; border-bottom: 1px solid #292a2c; display: grid; grid-template-columns: 1fr auto 1fr; font: 500 11px var(--sans); padding: 18px 28px; }
.hearth-topline p { margin: 0; font: 500 10px var(--mono); text-transform: uppercase; letter-spacing: .07em; }
.hearth-topline > :last-child { justify-self: end; }
.hearth-topline span { font-size: 16px; margin-left: 6px; }
.hearth-topline__actions { align-items: center; display: inline-flex; gap: 16px; }
.hearth-topline .memoir-language-toggle__option { color: #6f6e66; }
.hearth-topline .memoir-language-toggle__option.is-active { background: #292a2c; color: #f6f5f0; }
.hearth-layout { display: grid; grid-template-columns: minmax(270px, 29vw) minmax(0, 1fr); }
.hearth-toc { border-right: 1px solid #292a2c; min-height: calc(100cqh - 55px); padding: 7.5vh 28px 25px; position: sticky; top: 0; align-self: start; }
.hearth-toc h1 { font: 500 clamp(36px, 4.5vw, 65px)/.79 var(--serif); letter-spacing: -.075em; margin: 20px 0 23px -4px; overflow-wrap: anywhere; }
.toc-byline { font: 16px/1.2 var(--serif); margin: 0 0 7vh; }
.toc-empty { font: 15px/1.4 var(--serif); max-width: 280px; }
.hearth-toc ol { counter-reset: toc; list-style: none; margin: 0; padding: 0; }
.hearth-toc li { border-top: 1px solid #b7b6af; font: 14px/1.2 var(--sans); }
.hearth-toc li:last-child { border-bottom: 1px solid #b7b6af; }
.hearth-toc li a { display: grid; grid-template-columns: 32px 1fr; gap: 5px; padding: 10px 0; transition: padding-left .2s; }
.hearth-toc li a:hover { padding-left: 7px; }
.hearth-toc li span { font: 10px var(--mono); padding-top: 3px; }
.hearth-story { max-width: 1060px; padding: 11vh 7vw 13vh; }
.hearth-story > h2 { font: 500 clamp(33px, 4.875vw, 72px)/.86 var(--serif); letter-spacing: -.075em; margin: 26px 0 30px -7px; }
.hearth-dek { font: 21px/1.3 var(--serif); max-width: 550px; margin: 0 0 75px; }
.hearth-photo { margin: 0; }
.hearth-photo img { height: auto; width: 100%; object-fit: cover; }
.hearth-photo figcaption { font: 10px/1.35 var(--mono); margin-top: 9px; max-width: 320px; }
.hearth-photo figcaption span { color: #6f6e66; }
.hearth-quote { border-left: 1px solid #292a2c; font: 500 29px/1.13 var(--serif); letter-spacing: -.025em; margin: 53px 0 0 8vw; max-width: 575px; padding: 6px 0 6px 25px; }
.hearth-prose { font: 20px/1.52 var(--serif); margin: 10vh 0 10vh 8vw; max-width: 575px; }
.hearth-prose h1, .hearth-prose h2, .hearth-prose h3 { border-top: 1px solid #b7b6af; font: 500 11px var(--mono); letter-spacing: .07em; margin: 58px 0 21px; padding-top: 11px; text-transform: uppercase; }
.hearth-prose h1:first-child, .hearth-prose h2:first-child, .hearth-prose h3:first-child { margin-top: 0; }
.hearth-prose p { margin: 0 0 27px; }
.hearth-prose > p:first-of-type::first-letter { float: left; font-size: 4.2em; line-height: .7; padding: .13em .12em 0 0; }
.hearth-prose blockquote { border-left: 1px solid #292a2c; font: 500 29px/1.13 var(--serif); letter-spacing: -.025em; margin: 53px 0; padding: 6px 0 6px 25px; }
.hearth-pair { border-top: 1px solid #292a2c; display: grid; grid-template-columns: 1.2fr .8fr; gap: 48px; margin-top: 12vh; padding-top: 20px; }
.hearth-pair img { aspect-ratio: 1.25; }
.hearth-pair > div { padding-top: 2.5vw; }
.hearth-pair h3 { font: 500 clamp(32px, 3.8vw, 54px)/.92 var(--serif); letter-spacing: -.06em; margin: 24px 0; }
.hearth-pair > div > p:not(.eyebrow) { font: 16px/1.4 var(--sans); }
.text-link { border-bottom: 1px solid #292a2c; display: inline-flex; font: 12px var(--mono); gap: 18px; margin-top: 22px; padding-bottom: 7px; text-transform: uppercase; }

/* 02 — The Family Album */
.album-page { background: #eee4d5; color: #2c2824; font-family: var(--sans); }
.album-nav { align-items: center; border-bottom: 1px solid #b9aa96; display: grid; font: 11px var(--mono); grid-template-columns: 1fr auto 1fr; letter-spacing: .04em; padding: 18px 3vw; text-transform: uppercase; }
.album-nav p { margin: 0; }
.album-nav > :last-child { justify-self: end; }
.album-nav__actions { align-items: center; display: inline-flex; gap: 16px; }
.album-nav .memoir-language-toggle__option { color: #766a5d; }
.album-nav .memoir-language-toggle__option.is-active { background: #2c2824; color: #eee4d5; }
.album-label { color: #766a5d; font: 10px var(--mono); letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.album-archive { background: #f8f4ec; margin: 0 auto; padding: clamp(28px, 4vw, 58px) 4vw 11vw; }
.album-archive__heading { margin: 0 auto clamp(28px, 4vw, 54px); max-width: 1360px; }
.album-archive__heading h1 { font: 500 clamp(25px, 3.35vw, 46px)/.9 var(--serif); letter-spacing: -.05em; margin: 0; }
.album-archive__byline { color: #766a5d; font: 10px var(--mono); letter-spacing: .08em; margin: 18px 0 0; text-transform: uppercase; }
.album-grid { display: grid; gap: 6vw 2.2vw; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: auto; max-width: 1360px; }
.album-card { margin: 0; min-width: 0; }
.album-card:nth-child(6n + 1), .album-card:nth-child(6n + 6) { grid-column: span 2; }
.album-card__media > a { background: #d7c5af; display: block; overflow: hidden; }
.album-card__media > a > img, .album-card__placeholder { aspect-ratio: 4 / 5; height: 100%; object-fit: cover; transition: transform .35s cubic-bezier(.16, 1, .3, 1); width: 100%; }
.album-card:nth-child(6n + 1) .album-card__media > a > img, .album-card:nth-child(6n + 1) .album-card__placeholder, .album-card:nth-child(6n + 6) .album-card__media > a > img, .album-card:nth-child(6n + 6) .album-card__placeholder { aspect-ratio: 1.6; }
.album-card__media > a:hover > img, .album-card__media > a:hover .album-card__placeholder { transform: scale(1.015); }
.album-card figcaption { border-top: 1px solid #b9aa96; margin-top: 13px; padding-top: 10px; }
.album-card figcaption > span { color: #766a5d; font: 10px var(--mono); text-transform: uppercase; }
.album-card h3 { font: 500 clamp(15px, 1.35vw, 20px)/1.02 var(--serif); letter-spacing: -.035em; margin: 10px 0; }
.album-card h3 a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.album-card figcaption p { color: #655d54; font: 13px/1.4 var(--sans); margin: 0; }
.album-card__read-link { display: none; }
.album-empty { border: 1px solid #b9aa96; display: grid; gap: 4vw; grid-template-columns: .55fr 2.4fr; margin: auto; max-width: 1360px; padding: 4vw; }
.album-empty span { font: 10px var(--mono); text-transform: uppercase; }
.album-empty p { font: 28px/1.2 var(--serif); margin: 0; max-width: 600px; }
.album-story { border-top: 1px solid #b9aa96; display: grid; gap: 8vw; grid-template-columns: minmax(300px, 1fr) minmax(0, .95fr); margin: auto; max-width: 1440px; padding: 11vw 4vw 13vw; }
.album-story--standalone { border-top: 0; min-height: calc(100cqh - 51px); padding-top: 8vw; }
.album-story__visual { align-self: start; position: sticky; top: 45px; }
.album-story__all { align-items: center; border: 1px solid #2c2824; display: inline-flex; font: 11px var(--mono); gap: 12px; letter-spacing: .05em; margin-bottom: 18px; padding: 13px 17px; text-transform: uppercase; transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.album-story__all:hover { background: #2c2824; color: #eee4d5; }
.album-story__all:active { transform: translateY(1px); }
.album-story__all:focus-visible, .album-story__previous:focus-visible, .album-story__next:focus-visible { outline: 2px solid #713a2e; outline-offset: 4px; }
.album-story__visual figure { margin: 0; }
.album-story__visual img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
.album-story__visual figcaption { color: #655d54; font: 11px/1.4 var(--sans); margin-top: 11px; }
.album-story__visual figcaption span { display: block; font: 10px var(--mono); margin-bottom: 4px; text-transform: uppercase; }
.album-story__placeholder { aspect-ratio: 4 / 5; }
.album-story article { min-width: 0; padding-top: 5vw; }
.album-story__meta { color: #766a5d; font: 10px var(--mono); letter-spacing: .05em; margin: 0 0 28px; text-transform: uppercase; }
.album-story h2 { font: 500 clamp(32px, 4.02vw, 57px)/.88 var(--serif); letter-spacing: -.065em; margin: 0 0 34px; overflow-wrap: anywhere; }
.album-story blockquote { border-bottom: 1px solid #a74f3b; border-top: 1px solid #a74f3b; color: #713a2e; font: 500 29px/1.15 var(--serif); letter-spacing: -.025em; margin: 55px 0; padding: 24px 0; }
.album-story__navigation { border-top: 1px solid #b9aa96; margin-top: 64px; padding-top: 18px; }
.album-story__previous { color: #655d54; display: inline-flex; font: 10px var(--mono); gap: 9px; letter-spacing: .05em; margin-bottom: 28px; text-transform: uppercase; text-underline-offset: 4px; }
.album-story__previous:hover { color: #2c2824; text-decoration: underline; }
.album-story__next { display: block; }
.album-story__next > span { color: #766a5d; display: block; font: 10px var(--mono); letter-spacing: .06em; margin-bottom: 15px; text-transform: uppercase; }
.album-story__next strong { align-items: baseline; display: flex; font: 500 clamp(24px, 2.5vw, 36px)/1.05 var(--serif); gap: 20px; justify-content: space-between; letter-spacing: -.035em; }
.album-story__next strong span { flex: 0 0 auto; }
.album-story__next:hover strong { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.album-prose p { font: 19px/1.58 var(--serif); margin: 0 0 28px; }
.album-prose h1, .album-prose h2, .album-prose h3 { color: #713a2e; font: 500 12px var(--mono); letter-spacing: .05em; margin: 45px 0 17px; text-transform: uppercase; }
.album-prose blockquote { font-size: 25px; margin: 45px 0; }
.album-footer { border-top: 1px solid #b9aa96; display: flex; font: 10px var(--mono); justify-content: space-between; margin: 0 3vw; padding: 18px 0 26px; text-transform: uppercase; }
.album-footer p { margin: 0; }

/* 03 — Open Book
   Reference: Paper — warm notebook surfaces, quiet hairlines, restrained ink. */
.open-book-page {
  --book-canvas: #efefe4;
  --book-paper: #fcfcf9;
  --book-ink: #181818;
  --book-copy: #434341;
  --book-muted: #666;
  --book-border: #d7d7d6;
  background: var(--book-canvas);
  color: var(--book-ink);
  font-family: var(--serif);
  min-height: 100cqh;
}
.open-book-nav { align-items: center; border-bottom: 1px solid var(--book-border); display: grid; font: 11px var(--sans); grid-template-columns: 1fr auto 1fr; padding: 18px 3vw; }
.open-book-nav p { color: var(--book-muted); margin: 0; }
.open-book-nav > :last-child { justify-self: end; }
.open-book-nav__actions { align-items: center; display: inline-flex; gap: 16px; }
.open-book-nav__actions > a { text-decoration: underline; text-underline-offset: 4px; }
.open-book-nav .memoir-language-toggle__option { color: var(--book-muted); }
.open-book-nav .memoir-language-toggle__option.is-active { background: var(--book-ink); color: var(--book-paper); }
.open-book-empty { margin: auto; max-width: 1320px; min-height: 78cqh; padding: 14vw 5vw; }
.open-book-empty > p { color: var(--book-muted); font: 11px var(--sans); letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.open-book-empty h1 { font: 400 clamp(62px, 10vw, 144px)/.9 var(--serif); letter-spacing: -.065em; margin: 35px 0; }
.open-book-empty span { color: var(--book-copy); font: 22px/1.45 var(--serif); }
.open-book-spread { display: flex; justify-content: center; padding: clamp(20px, 2.5vw, 36px) 2vw; scroll-margin-top: 20px; }
.open-book-spread + .open-book-spread { border-top: 1px solid var(--book-border); }
.open-book-sheet { animation: open-book-page-reveal .24s ease-out; background: linear-gradient(90deg, #fafaf6 0 50%, var(--book-paper) 50% 100%); box-shadow: 0 30px 78px rgb(24 24 24 / .16); margin: auto; max-width: 1240px; min-height: min(82cqh, 920px); position: relative; transform-origin: center; width: 100%; }
.open-book-sheet::after { background: linear-gradient(90deg, rgb(24 24 24 / 0), rgb(24 24 24 / .1), rgb(255 255 255 / .45), rgb(24 24 24 / 0)); content: ""; inset: 0 auto 0 50%; pointer-events: none; position: absolute; transform: translateX(-50%); width: 52px; z-index: 2; }
.open-book-sheet.is-paginated { aspect-ratio: 3 / 2; flex: 0 1 auto; height: clamp(720px, calc(100cqh - 90px), 840px); min-height: 0; width: auto; }
.open-book-sheet.is-paginated .open-book-chapter-label { margin-bottom: clamp(28px, 4vh, 38px); }
.open-book-sheet.is-paginated .open-book-image { margin: 0; width: 100%; }
.open-book-sheet.is-paginated .open-book-image img, .open-book-sheet.is-paginated .open-book-image__placeholder { aspect-ratio: 4 / 3; max-height: none; object-fit: cover; width: 100%; }
.open-book-opening-page { margin: 0 auto 80px; max-width: 620px; }
.open-book-chapter-label { border-top: 1px solid var(--book-border); display: flex; font: 11px var(--sans); justify-content: space-between; letter-spacing: .05em; margin: 0 0 9vh; padding-top: 11px; text-transform: uppercase; }
.open-book-chapter-label span { color: var(--book-muted); }
.open-book-opening-page h1 { font: 400 clamp(35px, 3.75vw, 59px)/.92 var(--serif); letter-spacing: -.055em; margin: 0 0 32px; overflow-wrap: anywhere; }
.open-book-image { margin: 0 0 48px; }
.open-book-image img, .open-book-image__placeholder { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.open-book-image figcaption { color: var(--book-muted); font: 12px/1.4 var(--sans); margin-top: 10px; }
.open-book-story-flow { margin: auto; max-width: 760px; }
.open-book-prose { color: var(--book-copy); }
.open-book-prose p { font: 19px/1.62 var(--serif); margin: 0 0 28px; }
.open-book-prose h1, .open-book-prose h2, .open-book-prose h3 { color: var(--book-muted); font: 600 11px var(--sans); letter-spacing: .08em; margin: 46px 0 18px; text-transform: uppercase; }
.open-book-prose blockquote { border-left: 1px solid var(--book-border); border-width: 0 0 0 1px; font-size: 25px; margin: 45px 0; padding: 4px 0 4px 22px; }
.open-book-opening-quote { border-bottom: 1px solid var(--book-border); color: var(--book-copy); font: 400 clamp(20px, 1.8vw, 25px)/1.3 var(--serif); letter-spacing: -.015em; margin: 0 0 40px; padding-bottom: 20px; }
.open-book-closing-quote { border-top: 1px solid var(--book-border); color: var(--book-copy); font: 400 clamp(20px, 1.8vw, 25px)/1.3 var(--serif); letter-spacing: -.015em; margin: 48px 0 18px; padding-top: 20px; }
.open-book-reader { display: flex; flex-direction: column; min-height: inherit; outline: none; padding: clamp(48px, 5.5vh, 60px) clamp(44px, 4vw, 64px); position: relative; z-index: 1; }
.open-book-reader:focus-visible { outline: 1px solid var(--book-muted); outline-offset: 12px; }
.open-book-reading-viewport { min-height: 0; }
.open-book-reader.is-paginated { height: 100%; padding-bottom: 12px; }
.open-book-reader.is-paginated .open-book-reading-viewport { column-count: 2; column-fill: auto; column-gap: 0; flex: 1; height: 0; min-height: 0; overflow: hidden; scroll-behavior: auto; }
/* Full-height opening leaves advance one column naturally; forcing another break inserts a blank page. */
.open-book-reader.is-paginated .open-book-opening-page { break-inside: avoid-column; display: flex; flex-direction: column; height: var(--open-book-page-height, 100%); margin: 0; max-width: none; padding: 0 clamp(24px, 3vw, 40px); }
.open-book-reader.is-paginated .open-book-image-page { break-inside: avoid-column; display: flex; flex-direction: column; height: var(--open-book-page-height, 100%); justify-content: center; padding: 0 clamp(24px, 3vw, 40px); }
.open-book-reader.is-paginated .open-book-story-flow { margin: 0; max-width: none; }
.open-book-reader.is-paginated .open-book-opening-quote, .open-book-reader.is-paginated .open-book-closing-quote { break-inside: avoid-column; }
.open-book-reader.is-paginated .chapter-gallery { margin-left: clamp(24px, 3vw, 40px); margin-right: clamp(24px, 3vw, 40px); }
.open-book-reader.is-paginated .chapter-gallery__items { grid-template-columns: 1fr; }
.open-book-reader.is-paginated .chapter-gallery__item { break-inside: avoid-column; }
.open-book-reader.is-paginated .open-book-prose p, .open-book-reader.is-paginated .open-book-prose li { orphans: 3; widows: 3; }
.open-book-reader.is-paginated .open-book-opening-quote, .open-book-reader.is-paginated .open-book-closing-quote, .open-book-reader.is-paginated .open-book-prose p, .open-book-reader.is-paginated .open-book-prose h1, .open-book-reader.is-paginated .open-book-prose h2, .open-book-reader.is-paginated .open-book-prose h3, .open-book-reader.is-paginated .open-book-prose blockquote, .open-book-reader.is-paginated .open-book-prose ul, .open-book-reader.is-paginated .open-book-prose ol { margin-left: clamp(24px, 3vw, 40px); margin-right: clamp(24px, 3vw, 40px); }
.open-book-reader.is-paginated .open-book-prose h1, .open-book-reader.is-paginated .open-book-prose h2, .open-book-reader.is-paginated .open-book-prose h3 { break-after: avoid-column; }
.open-book-reader.is-editing .open-book-reading-viewport { flex: 1; overflow: visible; }
.open-book-reading-viewport.is-turning-forward { animation: open-book-turn-forward .25s ease-out; transform-origin: left center; }
.open-book-reading-viewport.is-turning-back { animation: open-book-turn-back .25s ease-out; transform-origin: right center; }
.open-book-page-turn { align-items: center; border-top: 1px solid var(--book-border); display: none; flex: 0 0 auto; font: 11px var(--sans); justify-content: space-between; margin-top: 12px; min-height: 38px; padding-top: 6px; }
.open-book-reader.is-paginated .open-book-page-turn { display: flex; }
.open-book-reader.is-mobile-continuous .open-book-page-turn { display: flex; }
.open-book-page-turn button { background: transparent; border: 0; color: inherit; cursor: pointer; font: inherit; padding: 9px 0; text-decoration: underline; text-underline-offset: 4px; }
.open-book-page-turn button:hover { color: var(--book-muted); }
.open-book-page-turn button[hidden] { display: block; visibility: hidden; }
.open-book-page-turn button.phx-click-loading { opacity: .45; }
.open-book-page-turn__position { color: var(--book-muted); padding: 0 12px; text-align: center; }
@keyframes open-book-page-reveal {
  from { opacity: .45; transform: perspective(1400px) rotateY(-2deg) translateX(10px); }
  to { opacity: 1; transform: perspective(1400px) rotateY(0) translateX(0); }
}
@keyframes open-book-turn-forward {
  from { opacity: .55; transform: perspective(1400px) rotateY(-3deg) translateX(9px); }
  to { opacity: 1; transform: perspective(1400px) rotateY(0) translateX(0); }
}
@keyframes open-book-turn-back {
  from { opacity: .55; transform: perspective(1400px) rotateY(3deg) translateX(-9px); }
  to { opacity: 1; transform: perspective(1400px) rotateY(0) translateX(0); }
}

/* 04 — Story Blog
   Reference: Exhibition Magazine — editorial scale, sharp rules, serif reading copy. */
.story-blog-page {
  --blog-paper: #fff;
  --blog-ink: #000;
  --blog-rule: #e5e7eb;
  --blog-muted: #767676;
  --blog-placeholder: #a9a9a9;
  --blog-display: var(--memoir-ui-serif);
  background: var(--blog-paper);
  color: var(--blog-ink);
  font-family: var(--sans);
  min-height: 100cqh;
}
.story-blog-nav { align-items: center; border-bottom: 1px solid var(--blog-rule); display: grid; font: 500 11px var(--sans); grid-template-columns: 1fr auto 1fr; letter-spacing: .062em; padding: 18px 3vw; text-transform: uppercase; }
.story-blog-nav p { color: var(--blog-muted); margin: 0; }
.story-blog-nav > :last-child { justify-self: end; }
.story-blog-nav__actions { align-items: center; display: inline-flex; gap: 16px; }
.story-blog-nav__actions > a { text-decoration: underline; text-underline-offset: 4px; }
.story-blog-nav .memoir-language-toggle__option { color: var(--blog-muted); }
.story-blog-nav .memoir-language-toggle__option.is-active { background: var(--blog-ink); color: var(--blog-paper); }
.story-blog-home { margin: auto; max-width: 1440px; padding: 0 3vw 10vw; }
.story-blog-masthead { border-bottom: 1px solid var(--blog-ink); padding: 7vw 0 3vw; }
.story-blog-masthead p, .story-blog-meta { color: var(--blog-muted); font: 500 11px var(--sans); letter-spacing: .062em; text-transform: uppercase; }
.story-blog-masthead p { margin: 0 0 25px; }
.story-blog-masthead h1 { font: 400 clamp(40px, 6.2vw, 89px)/.78 var(--blog-display); letter-spacing: -.07em; margin: 0; overflow-wrap: anywhere; }
.story-blog-empty { border-bottom: 1px solid var(--blog-rule); padding: 8vw 0; }
.story-blog-empty > p { font: 500 11px var(--sans); letter-spacing: .062em; text-transform: uppercase; }
.story-blog-empty h2 { font: 400 clamp(48px, 7vw, 100px)/.86 var(--blog-display); letter-spacing: -.055em; margin: 30px 0; }
.story-blog-empty span { font: 24px/1.4 var(--serif); }
.story-blog-feature { border-bottom: 1px solid var(--blog-ink); display: grid; gap: 4vw; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .7fr); padding: 4vw 0; }
.story-blog-feature__copy { align-self: end; padding-bottom: 6px; }
.story-blog-card-image { margin: 0; min-width: 0; }
.story-blog-card-image > a > img, .story-blog-image-placeholder { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.story-blog-card-image figcaption, .story-blog-article__image figcaption { color: var(--blog-muted); font: 12px/1.4 var(--serif); margin-top: 9px; }
.story-blog-meta { margin: 0 0 18px; }
.story-blog-feature h2 { font: 400 clamp(35px, 4.35vw, 62px)/.85 var(--blog-display); letter-spacing: -.055em; margin: 0 0 28px; overflow-wrap: anywhere; }
.story-blog-card-blurb { font: 19px/1.45 var(--serif); margin: 0 0 30px; }
.story-blog-read-link { border-bottom: 1px solid var(--blog-ink); display: inline-block; font: 500 11px var(--sans); letter-spacing: .062em; padding-bottom: 5px; text-transform: uppercase; }
.story-blog-grid { display: grid; gap: 0 3vw; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.story-blog-card { border-bottom: 1px solid var(--blog-rule); padding: 4vw 0; }
.story-blog-card:nth-child(odd) { border-right: 1px solid var(--blog-rule); padding-right: 3vw; }
.story-blog-card:nth-child(even) { padding-left: 0; }
.story-blog-card .story-blog-card-image { margin-bottom: 26px; }
.story-blog-card h2 { font: 400 clamp(26px, 3vw, 42px)/.88 var(--blog-display); letter-spacing: -.05em; margin: 0 0 23px; overflow-wrap: anywhere; }
.story-blog-article { margin: auto; max-width: 1440px; padding: 8vw 3vw 5vw; }
.story-blog-article__header { margin: 0 auto 6vw; max-width: 1120px; text-align: center; }
.story-blog-article__header h1 { font: 400 clamp(41px, 5.4vw, 78px)/.88 var(--blog-display); letter-spacing: -.055em; margin: 0 0 45px; overflow-wrap: anywhere; }
.story-blog-article__image { margin: 0 auto 7vw; max-width: 1200px; }
.story-blog-article__image img, .story-blog-article__image .story-blog-image-placeholder { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; }
.story-blog-article__reading { margin: auto; max-width: 700px; }
.story-blog-prose p { font: 20px/1.6 var(--serif); margin: 0 0 30px; }
.story-blog-prose h1, .story-blog-prose h2, .story-blog-prose h3 { border-top: 1px solid var(--blog-rule); font: 500 12px var(--sans); letter-spacing: .062em; margin: 50px 0 20px; padding-top: 12px; text-transform: uppercase; }
.story-blog-prose blockquote, .story-blog-article__reading > blockquote { border-bottom: 1px solid var(--blog-ink); border-top: 1px solid var(--blog-ink); font: 400 clamp(28px, 3.4vw, 46px)/1.14 var(--serif); margin: 65px 0; padding: 30px 0; }
.story-blog-article__footer { border-bottom: 1px solid var(--blog-rule); margin-top: 8vw; padding-bottom: 24px; }
.story-blog-article__chapter-links { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.story-blog-article__chapter-link { border: 1px solid var(--blog-ink); display: flex; flex-direction: column; justify-content: space-between; min-height: 150px; padding: 23px; transition: background-color .2s ease, color .2s ease, transform .2s ease; }
.story-blog-article__chapter-link:only-child { grid-column: 1 / -1; }
.story-blog-article__chapter-link > span { color: var(--blog-muted); font: 500 11px var(--sans); letter-spacing: .062em; text-transform: uppercase; }
.story-blog-article__chapter-link strong { font: 400 clamp(28px, 3.3vw, 46px)/.92 var(--blog-display); letter-spacing: -.04em; margin-top: 35px; overflow-wrap: anywhere; }
.story-blog-article__chapter-link--next { text-align: right; }
.story-blog-article__chapter-link:hover { background: var(--blog-ink); color: var(--blog-paper); }
.story-blog-article__chapter-link:hover > span { color: var(--blog-paper); }
.story-blog-article__chapter-link:active { transform: translateY(1px); }
.story-blog-article__chapter-link:focus-visible, .story-blog-article__all:focus-visible { outline: 2px solid var(--blog-ink); outline-offset: 4px; }
.story-blog-article__all { display: table; font: 500 11px var(--sans); letter-spacing: .062em; margin: 25px auto 0; padding-bottom: 4px; text-transform: uppercase; }
.story-blog-article__all:hover { border-bottom: 1px solid var(--blog-ink); }
.story-blog-footer { background: var(--blog-ink); color: var(--blog-paper); display: flex; font: 500 11px var(--sans); justify-content: space-between; letter-spacing: .062em; padding: 25px 3vw; text-transform: uppercase; }
.story-blog-footer p { margin: 0; }

/* 05 — Chapter Reader
   Reference: the homepage Living Memoir sample — compact rail and focused story pane. */
.chapter-reader-page {
  --reader-paper: #f6f4ee;
  --reader-ink: #292a2c;
  --reader-muted: #6f6e66;
  --reader-rule: #c9c4b9;
  --reader-accent: #a74f3b;
  background: var(--reader-paper);
  color: var(--reader-ink);
  font-family: var(--memoir-ui-sans);
  min-height: 100cqh;
}
.chapter-reader-masthead { align-items: center; border-bottom: 1px solid var(--reader-rule); display: grid; gap: 24px; grid-template-columns: 1fr auto 1fr; min-height: 58px; padding: 10px 28px; }
.chapter-reader-masthead__label { color: var(--reader-accent); font: 600 10px var(--memoir-ui-mono); letter-spacing: .1em; text-transform: uppercase; }
.chapter-reader-masthead__title { font: 500 19px/1.15 var(--memoir-ui-serif); justify-self: center; min-width: 0; text-align: center; }
.chapter-reader-masthead__meta { display: grid; gap: 6px; justify-items: end; }
.chapter-reader-masthead__subtitle { color: var(--reader-muted); font: 12px/1.35 var(--memoir-ui-sans); margin: 0; max-width: 320px; text-align: right; }
.chapter-reader-masthead .memoir-language-toggle__option { color: var(--reader-muted); font: 600 10px var(--memoir-ui-mono); letter-spacing: .06em; text-transform: uppercase; }
.chapter-reader-masthead .memoir-language-toggle__option.is-active { background: var(--reader-accent); color: var(--reader-paper); }
.chapter-reader-mobile-toc { display: none; }
.chapter-reader-layout { display: grid; grid-template-columns: minmax(230px, 25vw) minmax(0, 1fr); margin: auto; max-width: 1500px; min-height: calc(100cqh - 58px); }
.chapter-reader-rail { align-self: start; border-right: 1px solid var(--reader-rule); max-height: 100cqh; overflow-y: auto; padding: 36px clamp(20px, 2.6vw, 38px); position: sticky; top: 0; }
.memoir-live-shell:has(> .memoir-owner-sticky-tools) .chapter-reader-rail { max-height: calc(100cqh - 56px); top: 56px; }
/* The confirmation banner sits inside the same sticky wrapper, so the rail has
   to clear the toolbar and the banner together while it is showing. */
.memoir-live-shell:has(> .memoir-owner-sticky-tools .memoir-call-started-notice) .chapter-reader-rail { max-height: calc(100cqh - 120px); top: 120px; }
.chapter-reader-rail__label { color: var(--reader-muted); display: block; font: 600 10px var(--memoir-ui-mono); letter-spacing: .11em; margin-bottom: 24px; text-transform: uppercase; }
.chapter-reader-rail__empty { color: var(--reader-muted); font: 15px/1.55 var(--memoir-ui-serif); margin: 0; }
.chapter-reader-rail ol { list-style: none; margin: 0; padding: 0; }
.chapter-reader-rail li { border-top: 1px solid var(--reader-rule); position: relative; }
.chapter-reader-rail li:last-child { border-bottom: 1px solid var(--reader-rule); }
.chapter-reader-rail li.is-current::before { background: var(--reader-accent); bottom: 12px; content: ""; left: calc(-1 * clamp(20px, 2.6vw, 38px)); position: absolute; top: 12px; width: 4px; }
.chapter-reader-rail a { align-items: start; display: grid; gap: 12px; grid-template-columns: clamp(56px, 5vw, 68px) minmax(0, 1fr); padding: 16px 0; transition: color .2s ease, transform .2s ease; }
.chapter-reader-rail a:hover { color: var(--reader-accent); transform: translateX(3px); }
.chapter-reader-rail__thumbnail { align-self: center; aspect-ratio: 4 / 3; background: var(--reader-rule); display: block; overflow: hidden; }
.chapter-reader-rail__thumbnail > img, .chapter-reader-rail__thumbnail-placeholder, .chapter-reader-rail__thumbnail-placeholder img { height: 100%; object-fit: cover; width: 100%; }
.chapter-reader-rail__copy { display: grid; gap: 7px; min-width: 0; }
.chapter-reader-rail__heading { align-items: baseline; display: flex; gap: 8px; min-width: 0; }
.chapter-reader-rail__number { color: var(--reader-accent); flex: 0 0 auto; font: 400 15px/1 var(--memoir-ui-serif); }
.chapter-reader-rail__title { font: 500 16px/1.15 var(--memoir-ui-serif); min-width: 0; overflow-wrap: anywhere; }
.chapter-reader-rail__blurb { -webkit-box-orient: vertical; -webkit-line-clamp: 3; color: var(--reader-muted); display: -webkit-box; font: 11px/1.4 var(--memoir-ui-sans); overflow: hidden; overflow-wrap: anywhere; }
.chapter-reader-feed { min-width: 0; }
.chapter-reader-story { margin: 0 auto; max-width: 980px; min-width: 0; padding: clamp(58px, 7vw, 104px) clamp(28px, 6vw, 86px) 90px; scroll-margin-top: 24px; width: 100%; }
.chapter-reader-story + .chapter-reader-story { border-top: 1px solid var(--reader-rule); }
.chapter-reader-story__header { margin-bottom: 34px; }
.chapter-reader-story__meta { align-items: center; display: flex; margin-bottom: 20px; }
.chapter-reader-story__meta p, .chapter-reader-story__empty-label { color: var(--reader-accent); font: 600 10px var(--memoir-ui-mono); letter-spacing: .12em; margin: 0; text-transform: uppercase; }
.chapter-reader-story h1 { font: 400 clamp(38px, 4.725vw, 69px)/.93 var(--memoir-ui-serif); letter-spacing: -.04em; margin: 0; overflow-wrap: anywhere; }
.chapter-reader-image { margin: 0 0 34px; }
.chapter-reader-image > .memoir-expandable-image img, .chapter-reader-image__placeholder { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; }
.chapter-reader-image figcaption { color: var(--reader-muted); font: italic 12px/1.45 var(--memoir-ui-serif); margin-top: 10px; }
.chapter-reader-quote { border-left: 3px solid var(--reader-accent); color: var(--reader-muted); font: 400 clamp(21px, 2.2vw, 28px)/1.3 var(--memoir-ui-serif); margin: 48px auto; max-width: 720px; padding-left: 24px; }
.chapter-reader-prose { font: 19px/1.72 var(--memoir-ui-serif); margin: 0 auto; max-width: 720px; }
.chapter-reader-prose p { margin: 0 0 28px; }
.chapter-reader-prose h1, .chapter-reader-prose h2, .chapter-reader-prose h3 { font: 500 26px/1.2 var(--memoir-ui-serif); margin: 52px 0 20px; }
.chapter-reader-prose blockquote { border-left: 3px solid var(--reader-accent); color: var(--reader-muted); font-size: 24px; margin: 45px 0; padding-left: 24px; }
.chapter-reader-prose ul, .chapter-reader-prose ol { padding-left: 1.4em; }
.chapter-reader-story > .chapter-gallery { margin-left: auto; margin-right: auto; max-width: 720px; }
.chapter-reader-story--empty { align-self: start; }
.chapter-reader-story--empty h1 { margin: 20px 0 28px; }
.chapter-reader-story--empty > p:last-child { color: var(--reader-muted); font: 21px/1.55 var(--memoir-ui-serif); max-width: 580px; }

@media (max-width: 800px) {
  .memoir-brand-bar__inner { align-items: flex-start; flex-wrap: wrap; gap: 10px 18px; min-height: 0; padding: 12px 16px; }
  .memoir-brand-bar__logo img { width: 118px; }
  .memoir-brand-bar__nav { flex: 1 1 100%; font-size: 12px; gap: clamp(8px, 3vw, 18px); justify-content: space-between; }
  .memoir-brand-bar__cta { padding: 8px 10px; }

  .memoir-chapter-byline { margin: 4px 0 14px; }

  .memoir-owner-toolbar { align-items: center; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 12px; padding: 7px 10px; }
  .memoir-owner-toolbar__back { grid-column: 1; grid-row: 1; }
  .memoir-owner-toolbar__formats { grid-column: 2; grid-row: 1; min-width: 0; }
  .memoir-owner-toolbar__preview { grid-column: 1 / -1; }
  .memoir-owner-toolbar__back { min-height: 30px; }
  .memoir-owner-toolbar__formats { justify-content: space-between; }
  .memoir-owner-toolbar__select-wrap { flex: 1 1 auto; }
  .memoir-owner-toolbar__select-wrap select { min-width: 0; width: 100%; }
  .memoir-owner-toolbar__status { grid-column: 1 / -1; grid-row: 3; min-height: 0; text-align: left; }
  .memoir-owner-toolbar__status:not(:has(> *)) { display: none; }
  .memoir-owner-toolbar__sharing { grid-column: 2; grid-row: 2; justify-self: end; }
  .memoir-owner-toolbar:not(:has(.memoir-chapter-call-action)) .memoir-owner-toolbar__sharing { grid-column: 1 / -1; justify-self: start; }
  .memoir-owner-toolbar .memoir-chapter-call-action { grid-column: 1; grid-row: 2; justify-self: start; }
  .memoir-owner-toolbar .memoir-chapter-call-action { left: auto; position: static; top: auto; transform: none; }
  .memoir-call-started-notice { justify-content: flex-start; min-height: 58px; padding: 14px 60px 14px 16px; text-align: left; }
  .memoir-share-menu { position: static; }
  .memoir-share-menu__panel { left: 10px; position: fixed; right: 10px; top: 120px; width: auto; }
  .memoir-editable-field__controls, .memoir-editable-image__controls { opacity: 1; pointer-events: auto; }
  .memoir-inline-editor { margin-left: 0; margin-right: 0; }
  .memoir-image-upload-backdrop { padding: 12px; }
  .memoir-image-upload { max-height: calc(100dvh - 24px); padding: 19px; }
  .memoir-image-upload__choices.has-revision { grid-template-columns: minmax(0, 1fr); }
  .memoir-image-upload__entry { grid-template-columns: 96px minmax(0, 1fr); }
  .memoir-image-upload__entry img { height: 76px !important; width: 96px !important; }
  .chapter-gallery__items { grid-template-columns: 1fr; }
  .chapter-gallery__controls { opacity: 1; pointer-events: auto; }

  .hearth-topline { grid-template-columns: 1fr auto; padding: 15px 18px; }
  .hearth-topline p { display: none; }
  .hearth-layout { display: block; }
  .hearth-toc { border-bottom: 1px solid #292a2c; border-right: 0; min-height: 0; padding: 55px 19px 20px; position: static; }
  .hearth-toc h1 { font-size: 47px; }
  .hearth-toc ol { margin-top: 50px; }
  .hearth-story { padding: 70px 20px; }
  .hearth-story > h2 { font-size: 39px; }
  .hearth-dek { font-size: 19px; margin-bottom: 45px; }
  .hearth-quote { font-size: 24px; margin: 45px 0 0; }
  .hearth-prose { font-size: 19px; margin: 70px 0; }
  .hearth-pair { display: block; }
  .hearth-pair > div { padding-top: 35px; }

  .album-nav { grid-template-columns: 1fr auto; padding: 16px 19px; }
  .album-nav p { display: none; }
  .album-archive { padding: 34px 19px 90px; }
  .album-archive__heading { display: block; margin-bottom: 34px; }
  .album-archive__heading h1 { font-size: 32px; margin-top: 20px; }
  .album-grid { display: block; }
  .album-card { margin-bottom: 58px; }
  .album-card__media > a > img, .album-card__placeholder, .album-card:nth-child(6n + 1) .album-card__media > a > img, .album-card:nth-child(6n + 1) .album-card__placeholder, .album-card:nth-child(6n + 6) .album-card__media > a > img, .album-card:nth-child(6n + 6) .album-card__placeholder { aspect-ratio: 4 / 5; }
  .album-card h3 { font-size: 19px; }
  .album-card__read-link { border-bottom: 1px solid #2c2824; display: inline-flex; font: 600 10px var(--mono); gap: 9px; letter-spacing: .06em; margin-top: 18px; padding-bottom: 5px; text-transform: uppercase; }
  .album-card__read-link:active { transform: translateY(1px); }
  .album-card__read-link:focus-visible { outline: 2px solid #713a2e; outline-offset: 4px; }
  .album-empty { display: block; padding: 35px 25px; }
  .album-empty p { font-size: 24px; margin-top: 45px; }
  .album-story { display: block; padding: 85px 19px 100px; }
  .album-story__visual { position: static; }
  .album-story__all { box-sizing: border-box; justify-content: center; width: 100%; }
  .album-story article { padding-top: 75px; }
  .album-story h2 { font-size: 34px; }
  .album-story blockquote { font-size: 25px; }
  .album-footer { margin: 0 19px; }

  .open-book-nav { grid-template-columns: 1fr auto; padding: 16px 19px; }
  .open-book-nav p { display: none; }
  .open-book-spread { padding: 35px 14px; }
  .open-book-sheet { background: var(--book-paper); }
  .open-book-sheet::after { display: none; }
  .open-book-sheet.is-paginated { aspect-ratio: auto; height: clamp(680px, 82cqh, 820px); min-height: 680px; width: 100%; }
  .open-book-reader { padding: 48px 24px 65px; }
  .open-book-reader.is-paginated { padding-bottom: 16px; }
  .open-book-reader.is-paginated .open-book-reading-viewport { column-count: 1; }
  .open-book-reader.is-paginated .open-book-opening-page { padding: 0 10px; }
  .open-book-reader.is-paginated .open-book-image-page { padding: 0 10px; }
  .open-book-reader.is-paginated .chapter-gallery { margin-left: 10px; margin-right: 10px; }
  .open-book-reader.is-paginated .open-book-opening-quote, .open-book-reader.is-paginated .open-book-closing-quote, .open-book-reader.is-paginated .open-book-prose p, .open-book-reader.is-paginated .open-book-prose h1, .open-book-reader.is-paginated .open-book-prose h2, .open-book-reader.is-paginated .open-book-prose h3, .open-book-reader.is-paginated .open-book-prose blockquote, .open-book-reader.is-paginated .open-book-prose ul, .open-book-reader.is-paginated .open-book-prose ol { margin-left: 10px; margin-right: 10px; }
  .open-book-chapter-label { margin-bottom: 42px; }
  .open-book-opening-page h1 { font-size: 37px; }
  .open-book-prose p { font-size: 19px; }
  .open-book-page-turn { font-size: 10px; }
  .open-book-page-turn__position { max-width: 48%; }
  .open-book-reader.is-mobile-continuous .open-book-page-turn { margin-top: 28px; }

  .story-blog-nav { grid-template-columns: 1fr auto; padding: 16px 19px; }
  .story-blog-nav p { display: none; }
  .story-blog-home { padding: 0 19px 90px; }
  .story-blog-masthead { padding: 75px 0 35px; }
  .story-blog-masthead h1 { font-size: 10.7vw; }
  .story-blog-feature { display: block; padding: 38px 0 55px; }
  .story-blog-feature__copy { padding-top: 29px; }
  .story-blog-feature h2 { font-size: 36px; }
  .story-blog-grid { display: block; }
  .story-blog-card, .story-blog-card:nth-child(odd) { border-right: 0; padding: 48px 0; }
  .story-blog-card h2 { font-size: 30px; }
  .story-blog-article { padding: 80px 19px 50px; }
  .story-blog-article__header { margin-bottom: 55px; text-align: left; }
  .story-blog-article__header h1 { font-size: 9.75vw; margin-bottom: 35px; }
  .story-blog-article__image { margin-bottom: 65px; }
  .story-blog-prose p { font-size: 19px; }
  .story-blog-article__chapter-links { grid-template-columns: 1fr; }
  .story-blog-article__chapter-link, .story-blog-article__chapter-link:only-child { grid-column: auto; min-height: 132px; padding: 20px; }
  .story-blog-article__chapter-link strong { font-size: 31px; }
  .story-blog-footer { padding: 23px 19px; }

  .chapter-reader-masthead { gap: 18px; grid-template-columns: minmax(0, 1fr) auto; min-height: 54px; padding: 12px 18px; position: relative; }
  .chapter-reader-masthead__label { display: none; }
  .chapter-reader-masthead__title { justify-self: start; max-width: 100%; overflow: hidden; text-align: left; }
  .chapter-reader-masthead__title > a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .chapter-reader-masthead__meta { align-items: center; display: flex; gap: 12px; }
  .chapter-reader-masthead__subtitle { display: none; }
  .chapter-reader-mobile-toc { display: block; }
  .chapter-reader-mobile-toc summary { cursor: pointer; list-style: none; }
  .chapter-reader-mobile-toc summary::-webkit-details-marker { display: none; }
  .chapter-reader-mobile-toc summary:focus-visible { outline: 2px solid var(--reader-accent); outline-offset: 4px; }
  .chapter-reader-mobile-toc__menu-label { border-bottom: 1px solid var(--reader-accent); color: var(--reader-accent); font: 600 10px/1.3 var(--memoir-ui-mono); letter-spacing: .06em; padding-bottom: 2px; text-transform: uppercase; white-space: nowrap; }
  .chapter-reader-mobile-toc__menu-close { display: none; }
  .chapter-reader-mobile-toc details[open] .chapter-reader-mobile-toc__menu-open { display: none; }
  .chapter-reader-mobile-toc details[open] .chapter-reader-mobile-toc__menu-close { display: inline; }
  .chapter-reader-mobile-toc ol { background: var(--reader-paper); border-bottom: 1px solid var(--reader-rule); border-top: 1px solid var(--reader-rule); left: 0; list-style: none; margin: 0; max-height: min(52dvh, 430px); overflow-y: auto; padding: 0 18px; position: absolute; right: 0; top: 100%; z-index: 2; }
  .chapter-reader-mobile-toc li + li { border-top: 1px solid var(--reader-rule); }
  .chapter-reader-mobile-toc a { align-items: center; display: grid; gap: 14px; grid-template-columns: 76px minmax(0, 1fr); padding: 15px 0; }
  .chapter-reader-mobile-toc__thumbnail { aspect-ratio: 4 / 3; display: block; overflow: hidden; }
  .chapter-reader-mobile-toc__thumbnail > img, .chapter-reader-mobile-toc__thumbnail-placeholder { height: 100%; object-fit: cover; width: 100%; }
  .chapter-reader-mobile-toc__copy { display: grid; gap: 6px; min-width: 0; }
  .chapter-reader-mobile-toc__heading { align-items: baseline; display: flex; gap: 8px; min-width: 0; }
  .chapter-reader-mobile-toc__number { color: var(--reader-accent); flex: 0 0 auto; font: 400 14px/1 var(--memoir-ui-serif); }
  .chapter-reader-mobile-toc__heading > strong { font: 500 16px/1.25 var(--memoir-ui-serif); }
  .chapter-reader-mobile-toc__blurb { color: var(--reader-muted); display: -webkit-box; font: 400 12px/1.4 var(--memoir-ui-sans); overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
  .chapter-reader-mobile-toc li.is-current .chapter-reader-mobile-toc__heading > strong { text-decoration: underline; text-decoration-color: var(--reader-accent); text-underline-offset: 4px; }
  .chapter-reader-layout { display: block; min-height: 0; }
  .chapter-reader-rail, .memoir-live-shell:has(> .memoir-owner-sticky-tools) .chapter-reader-rail { display: none; }
  .chapter-reader-story { padding: 55px 19px 75px; }
  .chapter-reader-story__header { margin-bottom: 28px; }
  .chapter-reader-story h1 { font-size: clamp(35px, 10.5vw, 51px); }
  .chapter-reader-image { margin-bottom: 30px; }
  .chapter-reader-image > .memoir-expandable-image img, .chapter-reader-image__placeholder { aspect-ratio: 4 / 3; }
  .chapter-reader-quote { font-size: 21px; margin: 40px auto; }
  .chapter-reader-prose { font-size: 18px; }
}

@media print {
  body { display: block; height: auto; }
  .memoir-brand-bar, .album-nav, .open-book-nav, .story-blog-nav, .album-footer, .story-blog-footer, .chapter-reader-rail { display: none; }
  .memoir-site-content { container-type: normal; }
  .memoir-live-shell, .gate-page, .open-book-page, .story-blog-page, .chapter-reader-page { min-height: 0; }
  .album-page, .open-book-page, .story-blog-page, .album-archive, .chapter-reader-page { background: #fff; color: #1f201e; }
  .album-card, figure, blockquote { break-inside: avoid; }
  .album-story { display: block; }
  .album-story__visual { margin-bottom: 45px; position: static; }
  .open-book-spread { break-before: page; padding: 0; }
  .open-book-sheet { box-shadow: none; }
  .story-blog-card, .story-blog-feature { break-inside: avoid; }
  .chapter-reader-layout { display: block; }
  .chapter-reader-story { break-before: page; max-width: none; padding: 48px 0; }
  .chapter-reader-story:first-child { break-before: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .album-card__media > a > img, .album-card__placeholder, .chapter-reader-rail a { transition: none; }
  .memoir-editable-image__revision-spinner { animation: none; }
  .open-book-sheet, .open-book-reading-viewport { animation: none !important; }
  .open-book-reader.is-paginated .open-book-reading-viewport { scroll-behavior: auto; }
}