.masthead { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 26px; border-bottom: 2px solid var(--edge); }
.masthead__name { display: inline-flex; align-items: center; gap: 14px; min-height: 48px; font-size: 1.15rem; font-weight: 800; text-decoration: none; color: var(--ink); }
.masthead__mark { display: grid; grid-template-columns: repeat(2, 10px); grid-template-rows: 10px 10px; gap: 4px; padding: 7px; background: var(--wash); border-radius: 6px; }
.masthead__mark span { display: block; background: var(--blue); border-radius: 2px; }
.masthead__mark span:last-child { background: transparent; border: 2px solid var(--blue); }
.masthead__note { color: var(--muted); margin: 0; font-size: 1rem; }
.reading-dock { position: fixed; z-index: 10; bottom: max(18px, env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); width: min(630px, calc(100% - 28px)); padding: 6px; border-radius: 8px; background: #fff; border: 2px solid var(--edge); box-shadow: 0 9px 32px #1d315024; }
.reading-dock__list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; list-style: none; padding: 0; margin: 0; }
.reading-dock__list li { margin: 0; min-width: 0; }
.reading-dock__link { min-height: 54px; display: flex; align-items: center; justify-content: center; font-weight: 700; text-decoration: none; border-radius: var(--curve); font-size: 1rem; }
.reading-dock__link:hover { background: var(--wash); }
.reading-dock__link[aria-current="page"] { background: var(--blue); color: #fff; }
.reading-dock__link--near { background: var(--wash); }
.colophon { display: grid; grid-template-columns: 1.3fr 1fr; gap: 42px; padding-block: 36px 22px; margin-top: 58px; border-top: 2px solid var(--edge); }
.colophon__line { max-width: 62ch; font-size: 1rem; color: var(--muted); }
.colophon__links { display: flex; justify-content: flex-end; align-items: start; flex-wrap: wrap; gap: 4px 24px; }
.colophon__link { display: inline-flex; align-items: center; min-height: 46px; font-size: 1rem; }
.reading-link { display: inline-flex; align-items: center; min-height: 48px; padding-block: 6px; gap: 12px; font-weight: 700; }
.reading-link::after { content: "↗"; text-decoration: none; }
.blue-button { display: inline-flex; align-items: center; justify-content: space-between; min-height: 52px; padding: .65rem 1rem; gap: 28px; border-radius: var(--curve); color: #fff; background: var(--blue); text-decoration: none; font-weight: 700; }
.blue-button:hover { background: var(--blue-deep); }
.blue-button::after { content: "→"; }
.back-link { display: inline-flex; min-height: 44px; align-items: center; gap: 12px; margin-top: 26px; }
.next-shelf { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 42px; }
.next-shelf__item { padding: 22px; border-radius: var(--curve); background: var(--quiet); }
.next-shelf__item p { margin-bottom: .2rem; color: var(--muted); }
@media (max-width: 700px) {
  .masthead { padding-block: 17px; }
  .masthead__note { display: none; }
  .colophon { grid-template-columns: 1fr; gap: 10px; margin-top: 36px; }
  .colophon__links { justify-content: flex-start; }
  .next-shelf { grid-template-columns: 1fr; }
}