/* Leather spines, close-set on a walnut shelf. */
:root { --paper:#f0e8d9; --ink:#3b332a; --muted:#7a6d59; --line:#d4c5ad; --accent:#735636; --soft:#e7ddca; --page:#f9f0df; }
html[data-theme='dark'] { --paper:#181c19; --ink:#dad8cf; --muted:#a0a69b; --line:#363c34; --accent:#b9aa88; --soft:#222721; --page:#252a23; }
.wordmark,.intro h1,.page-heading h1 { font-family:var(--serif); }
nav { font-family:var(--serif); font-size:14px; }
.library-stamp { color:#866e46; border-color:#a58b60; outline-color:#a58b60; transform:rotate(-3deg); }
.intro { padding-top:43px; padding-bottom:34px; }
.intro h1 { font-weight:400; letter-spacing:-2.8px; }
.view-switch button { font-family:var(--serif); font-size:12px; }
.shelf-room { margin:24px -4px 0; padding:0; }
.bookshelf { display:block; margin:0; padding:0; list-style:none; }
.shelf-bay { position:relative; margin:0 0 36px; border:8px solid #50351f; border-bottom:0; border-radius:3px 3px 1px 1px; background:url('/paper-grain.svg'),repeating-linear-gradient(90deg,transparent 0 79px,#130d071c 80px,#bc8d5010 81px,transparent 82px 163px),linear-gradient(90deg,#352518,#4b3422 35%,#503825 75%,#392719); box-shadow:inset 0 18px 23px #0b070850,inset 9px 0 18px #130b0445,inset -9px 0 18px #130b0455,0 10px 19px -13px #241407bb; }
.shelf-bay { width:max-content; max-width:100%; min-width:min(100%,520px); margin-left:auto; margin-right:auto; }
.shelf-bay::before { content:''; position:absolute; inset:-8px -8px auto; height:9px; background:linear-gradient(#7b5735,#67472b 35%,#342318 80%,#825f3970); box-shadow:0 5px 8px #130b0440; pointer-events:none; }
.shelf-volumes { display:flex; align-items:flex-end; gap:3px; height:349px; overflow-x:auto; overflow-y:hidden; list-style:none; padding:25px 26px 0; margin:0; scrollbar-width:thin; scrollbar-color:#957849 #352519; overscroll-behavior-inline:contain; }
.shelf-volumes::before,.shelf-volumes::after { content:''; display:block; flex:0 0 13px; height:116px; margin:0 7px 0 0; border-left:5px solid #877040; border-bottom:7px solid #a88b51; border-radius:12px 2px 0 0; box-shadow:inset 2px 0 1px #d2ad6290,2px 0 3px #08050270; background:linear-gradient(90deg,#62502c,#8d794930,transparent); }
.shelf-volumes::after { transform:scaleX(-1); margin:0 0 0 9px; }
.shelved-volume { position:relative; display:flex; align-items:flex-end; flex:0 0 auto; min-width:0; padding:0; margin:0; }
.leather-volume { --leather:#453d29; --gilt:#d7bb79; position:relative; display:block; flex:0 0 auto; width:72px; height:295px; border-radius:7px 7px 3px 3px; text-decoration:none; color:var(--gilt); background:#21160f; box-shadow:3px 0 5px #0b080775,-1px 0 1px #b28a4545,0 -2px 1px #b8a37c55; transition:transform 200ms ease,filter 200ms ease; transform-origin:center bottom; }
.leather-oxblood { --leather:#5a302b; --gilt:#d9b477; }
.leather-moss { --leather:#38402e; --gilt:#c9b57d; }
.leather-ochre { --leather:#68472d; --gilt:#dfbe7c; }
.leather-indigo { --leather:#2d3838; --gilt:#d2ba80; }
.volume-size-0 { height:291px; width:70px; }
.volume-size-1 { height:311px; width:77px; }
.volume-size-2 { height:278px; width:64px; }
.leather-volume:hover,.leather-volume:focus-visible { transform:translateY(-10px); filter:brightness(1.13); text-decoration:none; z-index:4; }
.leather-volume:focus-visible { outline-color:#e9d199; outline-offset:4px; }
.leather-spine { position:absolute; inset:0; overflow:hidden; border-radius:7px 7px 3px 3px; background:linear-gradient(90deg,#080603a8,#ffffff02 8%,#ffe8bb1f 19%,#ffe8bb07 44%,#00000013 66%,#08040370 90%,#c7a67629 96%,#0a05036b),url('/leather-grain.svg'),var(--leather); box-shadow:inset 0 2px 2px #d0af6850,inset 0 -3px 2px #160b0380,inset 2px 0 1px #120904bb,inset -2px 0 2px #170d0880; }
.leather-spine::after { content:''; position:absolute; inset:9px 7px; border:1px solid #c6a36345; border-radius:4px; pointer-events:none; box-shadow:inset 1px 0 0 #140b0645,1px 0 0 #12080355; }
.spine-rule { position:absolute; z-index:1; left:1px; right:1px; height:7px; background:linear-gradient(0deg,#160b0390,transparent 25%,#c69d5730 62%,#e7c18d4a 76%,#170c036b); border-top:1px solid #aa88593d; border-bottom:1px solid #100b0740; box-shadow:0 2px 2px #11080455; }
.spine-rule::after { content:''; position:absolute; inset:2px 7px; border-top:1px solid #d6b77580; border-bottom:1px solid #d6b77570; }
.spine-rule-top { top:13px; }
.spine-rule-upper { top:48px; }
.spine-rule-lower { bottom:45px; }
.spine-rule-bottom { bottom:12px; }
.spine-fleur { position:absolute; top:24px; width:100%; text-align:center; font:19px/1 Georgia,serif; opacity:.9; text-shadow:0 1px 1px #170a01; }
.spine-title { position:absolute; inset:66px 12px 61px; display:block; writing-mode:vertical-rl; text-orientation:mixed; text-align:center; text-wrap:balance; overflow:hidden; font:19px/1.1 var(--serif); letter-spacing:.35px; text-shadow:0 1px 1px #170a01; }
.long-spine-title .spine-title { left:8px; right:8px; font-size:14px; line-height:1.07; letter-spacing:.1px; }
.spine-format { position:absolute; left:5px; right:5px; bottom:26px; text-align:center; text-transform:uppercase; font:8px/1 var(--serif); letter-spacing:1.4px; text-shadow:0 1px 1px #170a01; }
.ribbon-marked::before { content:''; position:absolute; z-index:3; top:-3px; right:14px; width:8px; height:30px; background:linear-gradient(90deg,#722c25,#a1543d 50%,#65271e); clip-path:polygon(0 0,100% 0,100% 100%,50% 84%,0 100%); }
.shelf-fascia { position:relative; z-index:5; height:28px; margin:0 -12px -4px; border-radius:2px; border-bottom:2px solid #3d2716; background:url('/paper-grain.svg'),repeating-linear-gradient(0deg,transparent 0 2px,#1c0e0830 3px,transparent 4px 6px),linear-gradient(0deg,#50351e,#705030 28%,#4a2e19 48%,#8b6840 56%,#b58c53 65%,#6d4b29 88%,#c39c6670); box-shadow:0 3px 2px #20110750,0 14px 15px -8px #2a190c65; }
.shelf-brass-label { position:absolute; top:8px; right:34px; min-width:82px; padding:2px 10px; color:#3e2c15; background:linear-gradient(8deg,#8f733e,#c4a164 45%,#a3884d); border:1px solid #6f562e; border-radius:1px; box-shadow:0 1px 2px #160d0850,inset 0 1px 0 #e4c59165; font:6px var(--serif); letter-spacing:1.4px; text-align:center; }
.shelf-brass-label span { padding:0 5px; }
.shelf-foot { margin-top:23px; }
.desk-notebook { color:#e3c790 !important; background:linear-gradient(90deg,#110b08aa 0 13px,#d0a46530 14px,transparent 17px),url('/leather-grain.svg'),#573b2e; box-shadow:2px 2px 0 #e7d6b5,3px 3px 0 #79603e,5px 8px 14px #463a2520; }
.notebook-label { border-color:#b9995a85; box-shadow:inset 0 0 0 3px #0000000c; }
.reading-dialog { border-left:5px solid #65452c; }
@media(max-width:620px) {
  .shelf-room { margin-left:0; margin-right:0; }
  .shelf-bay { border-width:5px; }
  .shelf-bay::before { inset:-5px -5px auto; height:6px; }
  .shelf-volumes { height:312px; padding:23px 9px 0; gap:2px; }
  .shelf-volumes::before,.shelf-volumes::after { flex-basis:5px; border-left-width:3px; border-bottom-width:5px; height:93px; margin-right:3px; }
  .shelf-volumes::after { margin-left:3px; margin-right:0; }
  .leather-volume { height:267px; width:62px; }
  .volume-size-0 { height:266px; width:61px; }
  .volume-size-1 { height:282px; width:65px; }
  .volume-size-2 { height:255px; width:57px; }
  .spine-title { inset:62px 10px 57px; font-size:16px; }
  .long-spine-title .spine-title { font-size:12.5px; line-height:1.05; }
  .spine-format { font-size:7px; letter-spacing:1px; }
  .shelf-fascia { margin-left:-8px; margin-right:-8px; height:25px; }
  .shelf-brass-label { right:19px; top:6px; }
  .reading-dialog { border-left-width:3px; }
}
@media(prefers-reduced-motion:reduce) { .leather-volume { transition:none; } }

/* A printed catalogue: one type family, small capitals and ruled entries. */
body { background:var(--paper); font:19px/1.5 var(--serif); }
.shell { max-width:880px; padding:0 44px; }
.site-header { display:flex; flex-direction:column; align-items:center; gap:15px; padding:28px 0 18px; border-bottom:3px double var(--line); }
.wordmark { font-size:32px; letter-spacing:2.5px; font-weight:400; font-variant-caps:all-small-caps; }
nav { gap:29px; font-family:var(--serif); font-size:18px; line-height:1.4; }
nav a { color:var(--ink); }
.intro { display:block; padding:31px 0 30px; text-align:center; }
.intro h1 { font-size:46px; line-height:1.15; letter-spacing:0; margin:0 0 8px; }
.intro .lede { font:italic 21px/1.5 var(--serif); margin:0; max-width:none; }
.section-heading { padding-top:13px; }
.section-heading h2 { font:400 23px/1.3 var(--serif); font-variant-caps:small-caps; letter-spacing:.8px; }
.view-switch { gap:18px; }
.view-switch button { font:17px/1.4 var(--serif); padding:2px 0; }
.view-switch button[aria-pressed='true'] { box-shadow:none; text-decoration:underline; text-underline-offset:5px; }
.archive-tools { margin:16px 0 3px; gap:20px; align-items:baseline; }
.search-field { min-width:0; }
.search-field input { font:18px/1.4 var(--serif); padding:7px 0; }
.search-field input::placeholder { color:var(--muted); font-style:italic; opacity:1; }
.outline-button { font:17px/1.4 var(--serif); white-space:nowrap; padding:7px 0 7px 4px; }
.outline-button span { margin-left:5px; }
.archive-filters { gap:4px 18px; }
.archive-filters select { font:16px/1.4 var(--serif); max-width:180px; padding:7px 13px 7px 0; }
.result-count { font:italic 15px/1.4 var(--serif); }
.shelf-invitation { font:italic 16px/1.5 var(--serif); }
.shelf-foot { margin-top:18px; }
.shelf-foot .text-link { font-size:16px; text-decoration:underline; white-space:nowrap; }
.shelf-room { margin-top:27px; }
.shelf-bay { border-color:#35291e; background:repeating-linear-gradient(90deg,transparent 0 97px,#0a080520 98px,#8e70510a 99px,transparent 100px 198px),linear-gradient(90deg,#241e17,#2d251d 40%,#30271e 80%,#241e17); box-shadow:inset 0 15px 25px #07060480,inset 8px 0 17px #07060445,inset -8px 0 17px #07060455,0 12px 22px -12px #0008; }
.shelf-bay::before { background:linear-gradient(#624b32,#493721 38%,#251b13 80%,#795d3860); }
.shelf-fascia { border-bottom-color:#251b13; background:repeating-linear-gradient(0deg,transparent 0 2px,#120b0820 3px,transparent 4px 6px),linear-gradient(0deg,#352718,#493820 30%,#302218 48%,#654e31 58%,#886b43 65%,#493521 88%,#9f80544d); box-shadow:0 3px 2px #0005,0 14px 15px -8px #0007; }
.shelf-brass-label { background:linear-gradient(8deg,#78633c,#a28b58 45%,#806d43); color:#251e12; box-shadow:0 1px 2px #160d0850; }
.leather-spine { background:linear-gradient(90deg,#080603a8,#ffffff02 8%,#ffe8bb12 19%,#ffe8bb04 44%,#00000013 66%,#08040370 90%,#c7a67619 96%,#0a05036b),url('/leather-grain.svg'),var(--leather); }
.spine-fleur { opacity:.6; }
.draft-banner { border-top-style:solid; gap:20px; margin-top:24px; }
.draft-banner p,.draft-banner .text-button { font-size:15px; line-height:1.5; }
.text-button,.collection-tools { font-size:15px; }
.local-help { font-size:15px; }
.collection-tools { margin-top:9px; }
.collection-tools summary { padding:5px 0; }
.library-index { display:grid; grid-template-columns:1fr 1fr; margin-top:38px; border-top:3px double var(--line); padding:23px 0 0; gap:35px; }
.library-index h2 { margin:0 0 5px; font:400 24px/1.3 var(--serif); font-variant-caps:small-caps; letter-spacing:.7px; }
.library-index h2 a { color:var(--ink); text-decoration:none; }
.library-index h2 a:hover { text-decoration:underline; }
.library-index p { font-size:18px; margin:0 0 10px; }
.index-status { font-size:16px; font-style:italic; color:var(--muted); }
.reading-spread { background:linear-gradient(90deg,transparent 47%,#080c061c 49.8%,#ffffff03 50%,#080c061a 51%,transparent 54%); }
.reading-dialog { border-left-color:#4b3927; border-radius:1px; box-shadow:0 25px 80px #0008,3px 3px 0 #4b4434; }
.close-reading { font-size:16px; }
.card-label { font-size:16px; font-variant-caps:all-small-caps; text-transform:none; letter-spacing:1px; }
.reading-card-title h2 { font-size:36px; line-height:1.15; letter-spacing:0; }
.card-author { font-size:19px; }
.card-progress,.source-link { font-size:17px; }
.card-note { font-size:21px; line-height:1.55; }
.card-subjects { font-size:16px; }
.card-date { font-size:15px; }
.archive-list .archive-entry { background:none; border:0; border-top:1px solid var(--line); padding:23px 0; }
.archive-list .archive-entry:last-child { border-bottom:1px solid var(--line); }
.entry-margin { font-size:15px; }
.entry-type { font-size:16px; text-transform:none; font-variant-caps:all-small-caps; letter-spacing:.6px; }
.entry-body h3 { font-size:25px; }
.source-line { font-size:17px; }
.reading-note { font-size:19px; line-height:1.55; }
.tag { font-size:16px; }
.page-heading { padding:37px 0 34px; }
.page-heading h1 { font-size:43px; letter-spacing:0; margin-bottom:9px; }
.page-heading .lede { font-size:22px; font-style:italic; }
.empty-page { font-size:21px; }
.empty-page .secondary { font-size:18px; }
.eyebrow,.small-label { font-size:16px; text-transform:none; font-variant-caps:all-small-caps; letter-spacing:1px; }
.prose { font-size:22px; line-height:1.65; }
.prose h2 { font:400 29px/1.3 var(--serif); letter-spacing:0; }
.standfirst { font-size:23px; }
.article-heading h1 { letter-spacing:0; }
.about-footnote p { font-size:18px; }
.article-back,.article-end { font-size:16px; }
.site-footer { margin-top:38px; padding-top:18px; font-size:16px; }
.theme-button,.preview-note { font-size:15px; }
.entry-dialog { border-radius:0; }
.form-intro,.form-error { font-size:18px; }
.entry-dialog label,.entry-dialog label span { font-size:16px; }
.entry-dialog input:not([type=hidden]),.entry-dialog textarea,.entry-dialog select { font-size:18px; border-radius:0; }
.solid-button { font-size:18px; border-radius:0; }
.backup-dialog textarea { font-family:monospace; font-size:12px; }
@media(max-width:620px) {
  .shell { padding:0 22px; }
  .site-header { padding:23px 0 17px; gap:14px; }
  nav { gap:21px; font-size:17px; }
  .intro { padding:27px 0 24px; }
  .intro h1 { font-size:40px; }
  .intro .lede { font-size:20px; }
  .section-heading h2 { font-size:21px; }
  .view-switch { gap:14px; }
  .view-switch button { font-size:16px; }
  .archive-tools { gap:14px; }
  .archive-filters { gap:2px 14px; }
  .archive-filters select { max-width:150px; }
  .result-count { margin-left:auto; width:auto; }
  .shelf-foot { align-items:baseline; flex-wrap:wrap; gap:8px; }
  .draft-banner { flex-wrap:wrap; gap:7px; }
  .draft-banner p { max-width:none; }
  .library-index { grid-template-columns:1fr; gap:22px; padding-top:20px; }
  .library-index > div + div { border-top:1px solid var(--line); padding-top:20px; }
  .reading-spread { background:none; }
  .reading-card-title,.reading-card-notes { padding-left:23px; padding-right:23px; }
  .reading-card-title h2 { font-size:31px; }
  .card-note { font-size:20px; }
  .archive-list .archive-entry { padding:20px 0; }
  .prose { font-size:21px; }
  .form-pair { grid-template-columns:1fr; gap:0; }
}
@media(max-width:370px) {
  .shell { padding:0 18px; }
  nav { gap:17px; }
  .archive-filters { gap:2px 8px; }
  .archive-filters select { padding-right:5px; }
}
