/* /library (library.mjs): the site's paper and type, as wide as the front page, on graph paper that fades out. */
:root{--paper:#f4efe9;--paper2:#ece5dc;--ink:#1b1916;--muted:#5f5a52;--line:#d9d1c6;--accent:#e5532f;--accent-ink:#b4381a;--card:#fffaf3;--shadow:0 1px 0 rgba(27,25,22,.04),0 14px 30px -18px rgba(60,35,10,.4)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--paper:#151412;--paper2:#1c1a17;--ink:#eeeae3;--muted:#aaa296;--line:#36322c;--card:#1f1c19;--accent-ink:#ff8a63;--shadow:0 1px 0 rgba(0,0,0,.2),0 18px 40px -18px rgba(0,0,0,.7)}}
:root[data-theme=dark]{--paper:#151412;--paper2:#1c1a17;--ink:#eeeae3;--muted:#aaa296;--line:#36322c;--card:#1f1c19;--accent-ink:#ff8a63}
*{box-sizing:border-box}html{overflow-x:clip}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 'DM Sans',system-ui,sans-serif;position:relative;isolation:isolate}
body::before{content:'';position:absolute;inset:0 0 auto;height:1100px;z-index:-1;pointer-events:none;background:linear-gradient(color-mix(in srgb,var(--ink) 7%,transparent) 1px,transparent 1px) 0 0/28px 28px,linear-gradient(90deg,color-mix(in srgb,var(--ink) 7%,transparent) 1px,transparent 1px) 0 0/28px 28px;-webkit-mask-image:linear-gradient(#000,rgba(0,0,0,.5) 45%,transparent);mask-image:linear-gradient(#000,rgba(0,0,0,.5) 45%,transparent)}
a{color:inherit}img{max-width:100%}[hidden]{display:none!important}
.wrap{max-width:1440px;margin:0 auto;padding:0 clamp(16px,4vw,56px)}
.shell-header .bar{display:flex;justify-content:space-between;align-items:center;padding:18px 0}.shell-header .logo{font:30px/1 'Instrument Serif',Georgia,serif;text-decoration:none}.shell-header nav a{margin-left:14px;font-weight:600;text-decoration:none}
.lib-hero{padding:clamp(36px,6vw,72px) 0 12px;max-width:900px}
.k{margin:0 0 12px;font:700 12px/1 'DM Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink)}
h1{font:400 clamp(44px,6.4vw,84px)/.98 'Instrument Serif',Georgia,serif;letter-spacing:-.01em;margin:0 0 18px}h1 em{color:var(--accent)}
.lead{font-size:clamp(17px,1.6vw,20px);color:var(--muted);margin:0 0 26px;max-width:720px}
.lib-search{display:flex;gap:8px;max-width:720px;padding:7px;border-radius:999px;background:var(--card);box-shadow:var(--shadow),inset 0 0 0 1px var(--line)}
.lib-search input{flex:1;min-width:0;border:0;background:none;font:16px 'DM Sans',sans-serif;color:inherit;padding:10px 16px;outline:none}
.lib-search button{border:0;border-radius:999px;background:var(--accent);color:#fff;font:700 15px 'DM Sans',sans-serif;padding:0 22px;cursor:pointer}
.lib-jump{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0}.lib-jump a{padding:7px 13px;border-radius:999px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);text-decoration:none;font-size:14px;font-weight:600}.lib-jump a:hover{box-shadow:inset 0 0 0 1px var(--accent)}
.lib-langs{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0}.lib-langs button{border:0;border-radius:999px;padding:7px 13px;background:transparent;box-shadow:inset 0 0 0 1px var(--line);font:600 13.5px 'DM Sans',sans-serif;color:inherit;cursor:pointer}.lib-langs button span{opacity:.6;font-weight:500;margin-left:3px}.lib-langs button[aria-pressed=true]{background:var(--ink);color:var(--paper);box-shadow:none}
.shelf,.lib-results{margin:clamp(34px,4vw,52px) 0 0;scroll-margin-top:80px}
.shelf-h{display:flex;align-items:baseline;gap:14px;margin:0 0 14px}.shelf-h h2{font:400 clamp(28px,3vw,40px)/1.05 'Instrument Serif',Georgia,serif;margin:0}.shelf-h h2 span{font:600 14px 'DM Sans',sans-serif;color:var(--muted);margin-left:4px;vertical-align:middle}
.more{margin-left:auto;font-weight:700;font-size:14.5px;color:var(--accent-ink);text-decoration:none;background:none;border:0;cursor:pointer;font-family:inherit}
.arrows{display:flex;gap:6px;margin-left:auto}.more+.arrows{margin-left:0}.shelf.fits .arrows{display:none}.arrows button{width:34px;height:34px;border-radius:50%;border:0;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);color:inherit;cursor:pointer;font-size:15px}.arrows button:hover{box-shadow:inset 0 0 0 1px var(--accent)}
.row{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 4*18px)/5);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 14px;scrollbar-width:none}.row::-webkit-scrollbar{display:none}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:22px 18px}
.lc{display:flex;flex-direction:column;gap:6px;text-decoration:none;scroll-snap-align:start;min-width:0}
.lc-th{position:relative;display:block;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:linear-gradient(135deg,#2a241d,#4a3426);box-shadow:var(--shadow)}
.lc-th img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}.lc:hover .lc-th img{transform:scale(1.04)}
.lc-badge{position:absolute;left:8px;bottom:8px;padding:4px 8px;border-radius:7px;background:rgba(0,0,0,.72);color:#fff;font:700 11.5px/1 'DM Sans',sans-serif}
.lc-k{margin-top:4px;font:700 10.5px/1.2 'DM Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink)}
.lc b{font:600 15.5px/1.3 'DM Sans',sans-serif;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.lc small{font-size:13px;color:var(--muted);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.none{color:var(--muted)}
.cc{display:flex;flex-direction:column;gap:6px;text-decoration:none;scroll-snap-align:start;min-width:0}
.cc-th{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:3px;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:linear-gradient(135deg,#2a241d,#4a3426);box-shadow:var(--shadow)}
.cc-th img{width:100%;height:100%;object-fit:cover;display:block}.cc-th img:first-child{grid-row:span 2}.cc-th img:only-child{grid-column:span 2}
.cc b{font:400 22px/1.15 'Instrument Serif',Georgia,serif}.cc:hover .cc-th{outline:2px solid var(--accent);outline-offset:2px}
.grid.path{counter-reset:step}
.count{margin:-14px 0 22px;font-weight:600;color:var(--muted);font-size:14.5px}.k a{text-decoration:none}.k a:hover{text-decoration:underline}
.grid.three{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.start .lc b{font-size:18px}@media (max-width:700px){.grid.three{grid-template-columns:1fr}}
.foot{padding:40px 0;color:var(--muted);font-size:14px}.beyond-footer{margin-top:72px}
@media (max-width:1100px){.row{grid-auto-columns:calc((100% - 3*18px)/4)}}
@media (max-width:800px){.row{grid-auto-columns:calc((100% - 2*16px)/2.4);gap:16px}.arrows{display:none}}
@media (max-width:520px){.lib-jump{flex-wrap:nowrap;overflow-x:auto;margin-right:-16px;padding-right:16px;scrollbar-width:none}.lib-jump::-webkit-scrollbar{display:none}.lib-jump a{white-space:nowrap}.row{grid-auto-columns:62%;margin:0 -16px;padding:4px 16px 14px;scroll-padding:0 16px}.lib-search button{padding:0 16px}}
