:root {
  --color-paper: #F6F2E9;
  --color-surface: #E6E9DE;
  --color-ink: #23332C;
  --color-muted: #526259;
  --color-green: #173D35;
  --color-copper: #934E2B;
  --color-rule: #CCCFC2;
  --color-control-border: #64746A;
  --color-inverse: #F6F2E9;
  --color-inverse-muted: #D5DFD5;
  --color-focus: #235C96;
  --color-danger: #8C312B;
  --font-editorial: Georgia, 'Times New Roman', serif;
  --font-interface: Arial, Helvetica, sans-serif;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --width-page: 72rem;
  --width-reading: 66ch;
  --radius-control: 2px;
  --motion-feedback: 120ms;
  --motion-emphasis: 180ms;
  --ease-out: cubic-bezier(0.2, 0, 0, 1);
  --shadow-jacket: 0 4px 12px rgb(23 61 53 / 8%);
}
/* Tokens are prepended from design-system/alderwake-press/tokens.json. */
* { box-sizing: border-box; }
html { color-scheme: light; scroll-padding-block: 1rem; }
body { margin: 0; background: var(--color-paper); color: var(--color-ink); font: 1rem/1.65 var(--font-interface); }
[hidden] { display: none !important; }
img, svg { max-width: 100%; }
img { display: block; height: auto; }
button, input { font: inherit; }
button, summary { cursor: pointer; }
a { color: var(--color-green); text-decoration-thickness: 1px; text-underline-offset: .23em; }
a:hover { color: var(--color-copper); text-decoration-thickness: 2px; }
a, button, summary { touch-action: manipulation; }
:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 4px; }
:target { scroll-margin-block-start: 1.5rem; }
::selection { background: var(--color-green); color: var(--color-inverse); }
h1, h2, h3, h4, p, ul, ol, dl, figure { margin: 0; }
h1, h2, h3, h4 { font-family: var(--font-editorial); font-weight: 400; line-height: 1.12; text-wrap: balance; overflow-wrap: anywhere; }
h1 { font-size: clamp(2.4rem, 4.8vw, 4.5rem); letter-spacing: -.045em; }
h2 { font-size: clamp(1.9rem, 3vw, 2.7rem); letter-spacing: -.025em; }
h3 { font-size: 1.5rem; }
p, li, a, dd { overflow-wrap: anywhere; }
.container { max-width: var(--width-page); margin-inline: auto; padding-inline: clamp(1.25rem, 3.5vw, 3rem); }
.section { padding-block: var(--space-8); }
.stack > * + * { margin-block-start: var(--space-5); }
.prose { max-width: var(--width-reading); }
.prose > * + * { margin-block-start: 1.3rem; }
.prose h2 { margin-block-start: 2.4rem; }
.prose ul, .prose ol { padding-inline-start: 1.4rem; }
.prose li + li { margin-block-start: .7rem; }
.small { font-size: .875rem; line-height: 1.6; color: var(--color-muted); }
.eyebrow { color: var(--color-copper); font-size: .75rem; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; }
.skip-link { position: absolute; top: .5rem; left: 1rem; transform: translateY(-220%); background: var(--color-paper); padding: 1rem; z-index: 100; }
.skip-link:focus { transform: none; }
.preview { padding: .4rem 1rem; text-align: center; background: var(--color-surface); border-block-end: 1px solid var(--color-rule); font-size: .8rem; }
.masthead { border-block-end: 1px solid var(--color-rule); }
.header-inner { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; padding-block: 1.4rem; }
.brand { display: inline-flex; gap: .9rem; align-items: center; text-decoration: none; font: 1.7rem/1 var(--font-editorial); letter-spacing: -.035em; }
.brand span { min-width: 0; }
.brand small { display: block; margin-block-start: .6rem; font: .65rem/1 var(--font-interface); letter-spacing: .3em; text-transform: uppercase; }
.mark { width: 2rem; height: 2.8rem; flex: 0 0 auto; }
.primary-nav { display: flex; flex-wrap: wrap; gap: .3rem 1.1rem; }
.primary-nav a { display: inline-flex; align-items: center; min-height: 44px; padding: .35rem .25rem; text-decoration: none; font-size: .9rem; border-block-end: 2px solid transparent; }
.primary-nav a[aria-current] { border-color: var(--color-copper); font-weight: 700; }
.menu-button { min-height: 44px; padding: .5rem 1rem; border: 1px solid var(--color-control-border); border-radius: var(--radius-control); background: transparent; color: var(--color-green); }
.hero { padding-block: var(--space-8) var(--space-7); }
.hero h1 { max-width: 15ch; margin-block: var(--space-5); }
.hero h1 em { display: block; color: var(--color-copper); font-weight: 400; }
.hero-bottom { display: grid; gap: var(--space-6); align-items: end; }
.hero .lede { max-width: 34ch; font-size: 1.2rem; }
.hero-aside { border-block-start: 1px solid var(--color-copper); padding-block-start: 1rem; max-width: 16rem; }
.hero-aside h2 { font-size: 1.4rem; margin-block-end: .75rem; }
.hero-copy { min-width: 0; }
/* Four real jackets, quietly off-axis. Later jackets overlap earlier ones; hover or focus lifts one. */
.hero-shelf { display: flex; max-width: 30rem; margin: var(--space-7) 0 0; padding: 0 0 1rem; list-style: none; }
.hero-shelf li { flex: 1 1 0; min-width: 0; }
.hero-shelf li + li { margin-inline-start: -5%; }
.hero-shelf li:nth-child(1) { transform: rotate(-3deg) translateY(.8rem); }
.hero-shelf li:nth-child(2) { transform: rotate(-1deg); }
.hero-shelf li:nth-child(3) { transform: rotate(1.5deg) translateY(.5rem); }
.hero-shelf li:nth-child(4) { transform: rotate(3deg) translateY(-.3rem); }
.hero-shelf li:is(:hover, :focus-within) { z-index: 1; }
.hero-shelf a { display: block; border: 1px solid var(--color-rule); background: var(--color-surface); box-shadow: 0 6px 16px rgb(23 61 53 / 16%); }
.hero-shelf img { width: 100%; }
.hero-art { position: relative; min-width: 0; margin-block-start: var(--space-7); padding-block-end: 2rem; }
.hero-art .hero-shelf { position: relative; margin-block-start: 0; }
.hero-wake { position: absolute; inset: auto 0 -1.5rem; width: 100%; height: auto; color: var(--color-copper); opacity: .35; stroke-width: 1.2; pointer-events: none; }
.hero h1 em { width: fit-content; position: relative; }
.hero h1 em::after { content: ""; position: absolute; inset: auto 0 -.12em; height: 2px; background: var(--color-copper); transform-origin: left; opacity: .7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.button { display: inline-flex; gap: .8rem; align-items: center; justify-content: center; min-height: 48px; padding: .7rem 1.15rem; max-width: 100%; border: 1px solid var(--color-green); border-radius: var(--radius-control); background: var(--color-green); color: var(--color-inverse); font-weight: 600; font-size: .9rem; text-decoration: none; line-height: 1.5; white-space: normal; }
.button:hover { background: var(--color-ink); color: var(--color-inverse); }
.button:active { box-shadow: inset 0 0 0 2px var(--color-inverse); }
.button.secondary { background: transparent; color: var(--color-green); }
.button.secondary:hover { background: var(--color-surface); }
.button:hover .arrow, .text-link:hover .arrow, .resource-row:hover .arrow { transform: translateX(3px); }
.arrow { display: inline-block; flex-shrink: 0; width: 1rem; height: 1rem; vertical-align: middle; }
.text-link { display: inline-flex; align-items: center; gap: .8rem; min-height: 44px; font-size: .9rem; font-weight: 600; }
.section-head { display: flex; align-items: baseline; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1.5rem; border-block-start: 1px solid var(--color-rule); padding-block: 1.2rem 2rem; }
.section-head h2 { font: 1rem/1.5 var(--font-interface); letter-spacing: .02em; }
.lines { display: grid; gap: var(--space-8); padding-block-end: var(--space-8); }
.line { display: flex; flex-direction: column; gap: var(--space-5); min-width: 0; }
.line h3 { font-size: clamp(1.85rem, 2.7vw, 2.3rem); max-width: 19ch; }
.line > p { max-width: 38ch; color: var(--color-muted); }
.line .mini-shelf { margin-block-start: auto; }
.line-label { display: flex; justify-content: space-between; gap: 1rem; }
.mini-shelf { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.book-card { min-width: 0; }
.book-card a { display: block; text-decoration: none; }
.book-card a:hover h3 { text-decoration: underline; text-underline-offset: .2em; }
.book-card h3 { margin-block-start: 1rem; font-size: 1.15rem; line-height: 1.22; letter-spacing: -.02em; }
.book-card .small { margin-block-start: .5rem; }
.jacket { width: 100%; aspect-ratio: 2/3; background: var(--color-surface); border: 1px solid var(--color-rule); color: var(--color-green); box-shadow: var(--shadow-jacket); }
.jacket img { width: 100%; height: 100%; object-fit: contain; }
.jacket.pending { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; padding: 1rem; text-align: center; }
.jacket.pending .mark { width: 1.5rem; height: 2.3rem; }
.jacket.pending span { font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; }
.jacket.fiction { background: var(--color-green); color: var(--color-inverse-muted); border-color: var(--color-green); }
.perspective { background: var(--color-green); color: var(--color-inverse); padding-block: var(--space-8); }
.perspective .container { display: grid; gap: var(--space-6); }
.perspective .eyebrow, .perspective p { color: var(--color-inverse-muted); }
.perspective h2 { max-width: 14ch; margin-block-start: 1rem; }
.perspective a { color: var(--color-inverse); }
.perspective :focus-visible { outline-color: var(--color-inverse); }
.resource-row { border-block-end: 1px solid var(--color-rule); padding-block: 1.4rem; display: grid; gap: .75rem; color: inherit; text-decoration: none; }
.resource-row:first-of-type { border-block-start: 1px solid var(--color-rule); }
.resource-row h3 { font-size: 1.45rem; }
.resource-row p { margin-block-start: .5rem; max-width: 55ch; }
.resource-row:hover h3 { text-decoration: underline; text-underline-offset: .2em; }
.breadcrumbs { padding-block: 1.5rem; font-size: .8rem; color: var(--color-muted); }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: .4rem .75rem; list-style: none; padding: 0; }
.breadcrumbs li { min-width: 0; }
.breadcrumbs li + li::before { content: '/'; padding-inline-end: .75rem; color: var(--color-muted); }
.page-head { padding-block: var(--space-6) var(--space-7); }
.page-head p { max-width: 52ch; margin-block-start: 1.3rem; font-size: 1.12rem; color: var(--color-muted); }
.collection-nav { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; border-block: 1px solid var(--color-rule); padding-block: .7rem; }
.collection-nav a { min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; }
.collection-nav [aria-current] { font-weight: 700; text-decoration: underline; text-decoration-color: var(--color-copper); }
.search-controls { margin-block: 1.8rem; max-width: 34rem; }
.search-controls label { display: block; margin-block-end: .4rem; font-weight: 600; }
input[type='search'] { width: 100%; min-height: 48px; border: 1px solid var(--color-control-border); border-radius: var(--radius-control); background: var(--color-paper); color: var(--color-ink); padding: .6rem .75rem; }
.result-count { margin-block: 1.3rem; }
.shelf { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.8rem 1rem; }
.empty-state { padding-block: 2rem; }
.book-hero { display: grid; gap: var(--space-6); padding-block: 1.5rem 3rem; }
.book-intro { min-width: 0; }
.book-intro h1 { font-size: clamp(2.1rem, 4vw, 3.4rem); margin-block: 1rem; }
.book-intro .subtitle { font-size: 1.12rem; max-width: 48ch; }
.byline { margin-block: 1.25rem; }
.book-intro .hook { font: 1.5rem/1.4 var(--font-editorial); max-width: 36ch; margin-block: 1.7rem; }
.book-art { width: min(12rem, 65%); }
.commerce-note { margin-block-start: .8rem; max-width: 46ch; }
.buy-box { margin-block-start: var(--space-6); padding: 1.2rem 1.25rem 1.3rem; background: var(--color-surface); border-block-start: 3px solid var(--color-green); }
.buy-box > * + * { margin-block-start: .8rem; }
.buy-title { font: 1.3rem/1.3 var(--font-editorial); color: var(--color-ink); }
.notice { border-inline-start: 2px solid var(--color-copper); padding-inline-start: 1rem; font-size: .9rem; color: var(--color-muted); }
.book-body { border-block-start: 1px solid var(--color-rule); padding-block: 3rem 4rem; display: grid; gap: 3rem; }
.book-body aside { border-block-start: 1px solid var(--color-copper); padding-block-start: 1.2rem; }
.topic-list { list-style: none; padding: 0; }
.topic-list li { padding-block: .65rem; border-block-end: 1px solid var(--color-rule); }
.book-details { display: grid; gap: .75rem; padding-block: .4rem; }
.book-details div { display: grid; gap: .1rem; }
.book-details dt { color: var(--color-muted); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.book-details dd { margin: 0; }
.companion-links { list-style: none; padding: 0; }
.companion-links li + li { border-block-start: 1px solid var(--color-rule); }
.companion-links .text-link { padding-block: .65rem; }
.article-layout { display: grid; gap: 2.5rem; padding-block-end: 4rem; }
.article-layout aside { padding-block-start: 1rem; border-block-start: 1px solid var(--color-copper); }
.article-layout aside a { min-height: 44px; display: block; padding-block: .45rem; }
.article-head { padding-block-end: var(--space-6); }
.article-head .article-meta { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; font-size: .8rem; }
.article-answer { max-width: var(--width-reading); margin-block-start: 2rem; padding: 1.2rem 1.3rem; background: var(--color-surface); border-inline-start: 3px solid var(--color-copper); }
.article-answer p { margin: 0; color: var(--color-ink); font: 1.2rem/1.55 var(--font-editorial); }
.reading { max-width: var(--width-reading); }
.reading p, .reading li { font-size: 1.12rem; line-height: 1.75; }
.reading h2 { margin-block: 2rem 1rem; }
.reading p + p { margin-block-start: 1.3rem; }
.reading ol, .reading ul { padding-inline-start: 1.5rem; }
.reading li + li { margin-block-start: 1rem; }
.article-list li::marker { color: var(--color-copper); }
.article-steps { counter-reset: article-step; list-style: none; padding: 0 !important; }
.article-steps li { counter-increment: article-step; display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: .75rem; }
.article-steps li::before { content: counter(article-step); display: grid; place-items: center; width: 1.8rem; height: 1.8rem; margin-block-start: .15rem; border: 1px solid var(--color-copper); border-radius: 50%; color: var(--color-green); font: 700 .8rem/1 var(--font-interface); }
.article-note { margin-block: 1.5rem; padding: 1rem 1.1rem; border-inline-start: 2px solid var(--color-copper); color: var(--color-muted); font-size: .95rem !important; }
.sources { margin-block-start: 3rem; padding-block-start: 1rem; border-block-start: 1px solid var(--color-rule); }
.sources ul { padding-inline-start: 1.2rem; }
.sources li, .sources a { font-size: .95rem; }
.book-callout { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: flex-start; margin-block-start: 2.5rem; padding-block-start: 1.5rem; border-block-start: 1px solid var(--color-rule); }
.book-callout h2 { margin-block-start: 0; }
.book-callout > .prose { flex: 1 1 14rem; min-width: 0; }
.callout-jacket { flex: 0 0 5.5rem; border: 1px solid var(--color-rule); box-shadow: var(--shadow-jacket); }
.inline-author { max-width: 52ch; }
.site-footer { margin-block-start: 3rem; padding-block: 2rem 1.2rem; border-block-start: 1px solid var(--color-rule); }
.footer-top { display: flex; flex-wrap: wrap; gap: 1.5rem; justify-content: space-between; align-items: start; }
.footer-nav { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; }
.footer-nav a { display: inline-flex; align-items: center; min-height: 44px; }
.footer-follow { align-items: center; }
.footer-follow .small { font-weight: 600; letter-spacing: .08em; text-transform: uppercase; font-size: .75rem; }
.footer-bottom { display: flex; flex-wrap: wrap; gap: .5rem 2rem; justify-content: space-between; border-block-start: 1px solid var(--color-rule); margin-block-start: 2rem; padding-block-start: 1rem; }
.swatches { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.swatch { border: 1px solid var(--color-rule); padding: 1rem; min-height: 7rem; }
.token-table { display: block; width: 100%; border-collapse: collapse; overflow-wrap: anywhere; }
.token-table tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 1rem; padding-block: .5rem; border-block-end: 1px solid var(--color-rule); }
.token-table td, .token-table th { min-width: 0; text-align: start; }
@media (prefers-reduced-motion: no-preference) {
  .button, a { transition: color var(--motion-feedback) var(--ease-out), background-color var(--motion-feedback) var(--ease-out); }
  /* Motion is decoration only: every animation starts from, or settles to, the resting layout above. */
  .arrow { transition: transform var(--motion-emphasis) var(--ease-out); }
  .book-card img { transition: transform var(--motion-emphasis) var(--ease-out), box-shadow var(--motion-emphasis) var(--ease-out); }
  .book-card a:hover img { transform: translateY(-4px); box-shadow: 0 12px 24px rgb(23 61 53 / 18%); }
  .hero-shelf li { transition: transform .4s var(--ease-out); }
  .hero-shelf li:is(:hover, :focus-within) { transform: translateY(-.6rem); }
  .resource-row { transition: background-color var(--motion-emphasis) var(--ease-out); }
  .resource-row:hover { background: linear-gradient(90deg, transparent, var(--color-surface) 20%, var(--color-surface) 80%, transparent); }
  .mark-wake { transition: transform .5s var(--ease-out); }
  .brand:hover .w1 { transform: translateY(-1.5px); }
  .brand:hover .w2 { transform: translateY(1px); transition-delay: 60ms; }
  .brand:hover .w3 { transform: translateY(-.5px); transition-delay: 120ms; }
  .is-home .live-mark path { stroke-dasharray: 1; animation: aw-draw 1.1s var(--ease-out) backwards; }
  .is-home .mark-bar { animation-delay: .55s; }
  .is-home .w1 { animation-delay: .8s; }
  .is-home .w2 { animation-delay: .95s; }
  .is-home .w3 { animation-delay: 1.1s; }
  .hero-copy > * { animation: aw-rise .8s var(--ease-out) backwards; }
  .hero h1 { animation-delay: .12s; }
  .hero-bottom { animation-delay: .28s; }
  .hero h1 em::after { animation: aw-line 1s .7s var(--ease-out) backwards; }
  .hero-shelf li { animation: aw-deal .9s var(--ease-out) backwards; }
  .hero-shelf li:nth-child(1) { animation-delay: .35s; }
  .hero-shelf li:nth-child(2) { animation-delay: .47s; }
  .hero-shelf li:nth-child(3) { animation-delay: .59s; }
  .hero-shelf li:nth-child(4) { animation-delay: .71s; }
  .hero-shelf a { animation: aw-float 7s 2s ease-in-out infinite alternate; }
  .hero-shelf li:nth-child(even) a { animation-delay: 3.2s; animation-direction: alternate-reverse; }
  .hero-wake path { stroke-dasharray: 1; animation: aw-draw 1.8s var(--ease-out) backwards, aw-swell 9s 2s ease-in-out infinite alternate; }
  .hero-wake path:nth-child(2) { animation-delay: .3s, 3s; }
  .hero-wake path:nth-child(3) { animation-delay: .6s, 4s; }
  @keyframes aw-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
  @keyframes aw-rise { from { opacity: 0; transform: translateY(14px); } }
  @keyframes aw-line { from { transform: scaleX(0); } }
  @keyframes aw-deal { from { opacity: 0; transform: translate(-30%, 1.5rem) rotate(-8deg); } }
  @keyframes aw-float { to { transform: translateY(-5px); } }
  @keyframes aw-swell { to { transform: translateY(-6px); } }
}
@media (max-width: 35.99rem) {
  .primary-nav { width: 100%; justify-content: space-between; gap: .25rem; }
  .header-inner { padding-block: 1rem; }
  .hero { padding-block-start: 2.5rem; }
  .hero-aside { max-width: none; }
  .book-hero { padding-block-start: 0; }
  .book-art { margin-block-end: 1rem; }
}
@media (min-width: 36rem) {
  .resource-row { grid-template-columns: minmax(8rem, .7fr) minmax(0, 3fr) 1rem; gap: 1.5rem; }
  .shelf { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3rem 1.5rem; }
}
@media (min-width: 48rem) {
  .lines, .perspective .container { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3rem; }
  .hero { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: var(--space-7); align-items: center; }
  .hero-shelf { max-width: none; margin: 0; padding-block: 1rem 2rem; }
  .hero-shelf li + li { margin-inline-start: -12%; }
  .book-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); align-items: start; gap: 3.5rem; }
  .book-intro { grid-column: 2; grid-row: 1; }
  .book-art { grid-column: 1; grid-row: 1; width: 100%; max-width: 22rem; }
  .book-body { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 4rem; }
  .article-layout { grid-template-columns: minmax(0, 1fr) 13rem; gap: 3rem; }
  .swatches { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 64rem) {
  .shelf { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3rem 1.7rem; }
}
@media print {
  .preview, .primary-nav, .menu-button, .search-controls, .site-footer { display: none !important; }
  body { background: white; color: black; }
  .container { max-width: none; padding-inline: 0; }
  .jacket { box-shadow: none; }
  a { color: inherit; }
  h2, h3 { break-after: avoid; }
  .book-card { break-inside: avoid; }
}
.book-card :is(h2, h3, h4) { margin-block-start: 1rem; font-size: 1.15rem; line-height: 1.22; letter-spacing: -.02em; }
.book-card a:hover :is(h2, h3, h4) { text-decoration: underline; text-underline-offset: .2em; }
