/* Studio fieldnotes — quiet paper, generous type and a fixed reading rhythm. */
.book-running, .book-section, .book-colophon, .book-diagram__labels, .book-pagination {
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-variant-numeric: tabular-nums;
}
.book-running { display: flex; justify-content: space-between; gap: 16px; font-size: 11px; letter-spacing: .035em; padding-bottom: 18px; border-bottom: 1px solid #ffffff26; }
.book-diagram { color: #a8bfb1; margin: 26px 0 20px; }
.book-diagram svg { display: block; width: 100%; max-height: 185px; }
.book-diagram__labels { display: flex; justify-content: space-between; gap: 8px; font-size: 10px; line-height: 1.5; }
.book-colophon { font-size: 10px; line-height: 1.5; border-top: 1px solid #ffffff26; padding-top: 16px; }
.book-section { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; margin: 0 0 20px; }
.book-page__title { font-size: 29px; line-height: 1.13; letter-spacing: -.035em; font-weight: 600; margin: 0 0 28px; text-wrap: balance; }
.book-page[hidden] { display: none !important; }
.book-page { animation: book-copy-in .24s ease-out; }
.book-features { display: grid; gap: 25px; list-style: none; padding: 0; margin: 0; counter-reset: none; }
.book-features .features__item { display: block; position: relative; padding: 17px 0 0 35px; border-top: 1px solid #26383126; border-right: 0; }
.book-features .features__item::before { content: attr(data-number); position: absolute; left: 0; top: 19px; font: 11px/1.5 ui-monospace, monospace; color: #357566; }
.book-features .tick { display: none; }
.book-features .features__title { margin: 0 0 9px; font-size: 18px; font-weight: 600; line-height: 1.25; letter-spacing: -.02em; }
.book-features .features__desc { margin: 0; font-size: 16px; line-height: 1.6; }
.book-pagination { display: flex; justify-content: space-between; align-items: center; gap: 16px; border-top: 1px solid #26383126; padding: 10px 0; font-size: 12px; }
.book-pagination button { display: grid; place-items: center; width: 44px; height: 38px; border: 1px solid currentColor; border-radius: 3px; background: transparent; color: inherit; cursor: pointer; transition: background .18s ease; }
.book-pagination button:hover:not(:disabled) { background: #1a5c5012; }
.book-pagination button:disabled { opacity: .25; cursor: default; }
.book-sheet :is(a,button,[tabindex]):focus-visible { outline: 2px solid #398577; outline-offset: 4px; }

.book-spec dl { margin: 22px 0; display: grid; gap: 18px; }
.book-spec dl > div { border-top: 1px solid #3045352b; padding-top: 14px; }
.book-spec dt { font: 12px/1.5 ui-monospace,monospace; margin-bottom: 6px; color: #3c6350; }
.book-spec dd { margin: 0; font-size: 16px; line-height: 1.6; }

.ledger:not(.is-fallback) .page--cover .page__title { font-size: clamp(32px,calc(var(--page-w) * .092),62px); max-width: 10ch; text-wrap: balance; }
.ledger:not(.is-fallback) .page--cover + .page--right .page__lede { font-size: 16px; }
.book-features .features__item:nth-child(odd) { border-right: 0; }


/* Type, margins and controls scale with the actual projected page width. */
@media (min-width: 769px) {
  .sheet.book-sheet.is-page {
    --book-body: clamp(15px, calc(var(--page-w) * .034), 26px);
    --book-small: clamp(10px, calc(var(--page-w) * .021), 15px);
    --book-gap: calc(var(--page-w) * .038);
    --book-margin: calc(var(--page-w) * .073);
  }
  .sheet.book-sheet.is-page > .sheet__head {
    padding: var(--book-margin); justify-content: flex-start; gap: 0; overflow: hidden;
    background: linear-gradient(90deg,#14221f,#1a2925 88%,#101c19);
    color: #e9ece3; box-shadow: inset -8px 0 16px #00000025;
  }
  .sheet.book-sheet.is-page .book-running { margin-bottom: calc(var(--page-h) * .065); padding-bottom: var(--book-gap); font-size: var(--book-small); color: #b8c8bc; }
  .sheet.book-sheet.is-page > .sheet__head .sheet__kicker { font: var(--book-small)/1.4 ui-monospace,monospace; letter-spacing: .1em; color: #a5b8aa; margin: 0 0 var(--book-gap); }
  .sheet.book-sheet.is-page > .sheet__head .sheet__title { font-size: calc(var(--page-w) * .145); line-height: 1.02; letter-spacing: -.055em; font-weight: 500; margin: 0 0 var(--book-gap); }
  .sheet.book-sheet.is-page > .sheet__head .sheet__lede { font-size: calc(var(--book-body) * 1.15); line-height: 1.55; color: #d1dad0; margin: 0; }
  .sheet.book-sheet.is-page .book-diagram { margin: auto 0 var(--book-gap); width: 100%; }
  .sheet.book-sheet.is-page .book-diagram svg { height: calc(var(--page-h) * .32); max-height: none; }
  .sheet.book-sheet.is-page .book-diagram__labels { font-size: var(--book-small); gap: 5px; }
  .sheet.book-sheet.is-page .book-colophon { margin: 0; color: #9faea2; font-size: var(--book-small); padding-top: var(--book-gap); }
  .sheet.book-sheet.is-page > .sheet__leaf {
    display: flex; flex-direction: column; overflow: hidden;
    padding: calc(var(--book-margin) * .85) var(--book-margin) calc(var(--book-margin) * .55);
    background: linear-gradient(90deg,#c9cdbd 0,#e9e9db 3%,#eeede1 12%,#f1f0e6 96%,#e2e2d3);
    color: #25332e; box-shadow: inset 1px 0 #ffffff70, inset 9px 0 18px #18201810;
  }
  .sheet.book-sheet.is-page .book-content { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #80998a transparent; padding: 0 2px 12px 0; margin: 0; }
  .sheet.book-sheet .book-content > .book-page { margin: 0; }
  .sheet.book-sheet.is-page .sheet__leaf .book-section { color: #53685c; font-size: var(--book-small); line-height: 1.4; margin: 0 0 var(--book-gap); }
  .sheet.book-sheet.is-page .sheet__leaf .book-page__title,
  .sheet.book-sheet.is-page .sheet__leaf .slab__title { color: #23382e; font-size: calc(var(--page-w) * .075); font-weight: 500; line-height: 1.12; letter-spacing: -.045em; margin: 0 0 calc(var(--book-gap) * 1.2); }
  .sheet.book-sheet.is-page .sheet__leaf :is(p:not(.book-section),.features__desc),
  .sheet.book-sheet.is-page .book-spec dd { color: #46544a; font-size: var(--book-body); line-height: 1.5; }
  .sheet.book-sheet.is-page .book-features { gap: calc(var(--book-gap) * .65); }
  .sheet.book-sheet.is-page .book-features .features__item { padding: calc(var(--book-gap) * .7) 0 0 calc(var(--page-w) * .064); border-right: 0; }
  .sheet.book-sheet.is-page .book-features .features__item::before { font-size: var(--book-small); top: calc(var(--book-gap) * .8); }
  .sheet.book-sheet.is-page .sheet__leaf .features__title { color: #203a2e; font-size: calc(var(--book-body) * 1.12); margin: 0 0 calc(var(--book-gap) * .32); font-weight: 600; line-height: 1.25; }
  .sheet.book-sheet.is-page .book-pagination { flex-shrink: 0; color: #375648; font-size: var(--book-small); padding: calc(var(--book-gap) * .35) 0; }
  .sheet.book-sheet.is-page .book-pagination button { width: max(44px,calc(var(--page-w) * .09)); height: max(34px,calc(var(--page-w) * .075)); border: 0; background: #244e3c08; font-size: calc(var(--book-body) * 1.1); }
  .sheet.book-sheet.is-page .sheet__foot { position: static; flex: 0 0 auto; margin: 0; padding: calc(var(--book-gap) * .65) 0 0; background: none; border-top: 1px solid #26383126; gap: 10px; align-items: center; }
  .sheet.book-sheet.is-page .sheet__foot .pill { font: 600 var(--book-small)/1.3 var(--font-body); letter-spacing: .01em; min-height: 40px; padding: calc(var(--book-gap) * .6) calc(var(--book-gap) * .7); border: 0; border-radius: 3px; color: #f2f0e5; background: #254b3c; }
  .sheet.book-sheet.is-page .sheet__foot .sheet__next { font-size: var(--book-small); line-height: 1.4; letter-spacing: .02em; color: #375648; }
  .sheet.book-sheet.is-page .media-card { margin: 0; box-shadow: none; border: 1px solid #23382e30; border-radius: 3px; overflow: hidden; }
  .sheet.book-sheet.is-page .media-card__caption { font-size: var(--book-small); line-height: 1.5; background: #e0e3d7; color: #314638; padding: var(--book-gap); }
  .sheet.book-sheet.is-page .tags { gap: 8px; }
  .sheet.book-sheet.is-page .tags li { font-size: var(--book-small); letter-spacing: 0; color: #3d594c; border-color: #34583c33; }
  .sheet.book-sheet.is-page .book-spec dl { margin: var(--book-gap) 0 0; gap: var(--book-gap); }
  .sheet.book-sheet.is-page .book-spec dt { font-size: var(--book-small); }
}

/* The commission ledger uses the same ink scale and legible captions. */
.ledger:not(.is-fallback) .page { padding: calc(var(--page-h) * .065) calc(var(--page-w) * .075); --rule: #3045352b; }
.ledger:not(.is-fallback) .page__kicker { font: 11px/1.5 ui-monospace,monospace; letter-spacing: .07em; margin-bottom: 18px; }
.ledger:not(.is-fallback) .page__title { font-size: clamp(28px,calc(var(--page-w) * .075),54px); line-height: 1.08; margin-bottom: 16px; }
.ledger:not(.is-fallback) .page__lede { font-size: 17px; line-height: 1.55; color: #37483c; }
.ledger:not(.is-fallback) .page p:not([class]) { font-size: 15px; line-height: 1.65; color: #465348; }
.ledger:not(.is-fallback) .page__credits dd { font-size: 14px; line-height: 1.5; }
.ledger:not(.is-fallback) :is(.page__credits dt,.page__tags li,.page__link) { font-size: 11px; line-height: 1.5; letter-spacing: .04em; }
.ledger:not(.is-fallback) .page__caption { font-size: 13px; color: #536154; line-height: 1.5; }
.ledger:not(.is-fallback) .page__contents .page__link { font-size: 14px; letter-spacing: .01em; }
.ledger:not(.is-fallback) .page__plate { box-shadow: 0 5px 16px #0c21121a; }

@media (max-width: 768px) {
  .book-sheet .book-running, .book-sheet .book-diagram, .book-sheet .book-colophon { display: none; }
  .book-sheet .book-page__title { font-size: 25px; }
  .book-sheet .book-content { padding: 0 0 24px; }
  .book-sheet .book-pagination { border-color: #ffffff26; color: #d2dfd2; }
  .book-sheet .book-features .features__item { border-color: #ffffff26; }
  .book-sheet .book-section { color: #a9beb0; }
  .book-sheet .book-features .features__title { font-size: 18px; }
  .book-sheet .book-features .features__desc { font-size: 16px; }
}
@keyframes book-copy-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .book-page { animation: none; } }

