/* The library has its own bindings and shelves; reading pages keep their paper layout. */
.book-library { --shelf-wood:#b6a087; --shelf-gap:30px; --library-serif:'Songti SC',STSong,'Noto Serif CJK SC',SimSun,serif; }
.library-welcome { position:relative; display:grid; grid-template-columns:1.15fr 1fr; align-items:center; min-height:330px; padding:30px 28px 42px; border-bottom:1px solid var(--book-line); }
.library-welcome-copy { position:relative; z-index:1; }
.library-eyebrow { display:flex; align-items:center; gap:12px; margin:0 0 24px; color:var(--book-muted); font-size:11px; letter-spacing:2px; }
.library-eyebrow > span { display:grid; place-items:center; width:27px; height:29px; background:#865c49; color:#f9f0da; font:18px/1 var(--library-serif); border-radius:2px; }
.library-eyebrow i { width:1px; height:12px; background:#d2cbbd; }
.book-library .library-welcome h1 { margin:0 0 16px; font:500 clamp(36px,4.5vw,55px)/1.35 var(--library-serif); letter-spacing:5px; }
.library-welcome h1 span { color:var(--book-accent); }
.library-welcome-lead { margin:0 0 13px; font:20px/1.7 var(--library-serif); letter-spacing:1px; }
.library-welcome-note { color:var(--book-muted); font-size:13px; line-height:2; margin:0; }
.library-welcome-actions { display:flex; align-items:center; gap:22px; margin-top:28px; font-size:11px; color:var(--book-muted); }
.library-browse { display:inline-flex; align-items:center; gap:26px; padding:11px 20px; border:1px solid #b6c0b2; color:var(--book-accent) !important; font-size:12px; border-radius:2px; background:#ffffff40; }
.library-browse:hover { background:#e9ece2; text-decoration:none; }
.library-still-life { position:relative; height:285px; margin-left:22px; pointer-events:none; }
.library-still-halo { position:absolute; inset:4px 0 30px; border-radius:50%; background:radial-gradient(ellipse,#d9d2bb66,transparent 70%); }
.library-still-life:after { content:''; position:absolute; bottom:32px; left:0; right:0; height:24px; background:radial-gradient(ellipse,#463c2945,transparent 68%); filter:blur(5px); }
.jacket-tone-0 { --jacket-cloth:#3f5c50; --jacket-shade:#243c32; }
.jacket-tone-1 { --jacket-cloth:#765443; --jacket-shade:#493527; }
.jacket-tone-2 { --jacket-cloth:#506471; --jacket-shade:#2d3e47; }
.jacket-tone-3 { --jacket-cloth:#7b6948; --jacket-shade:#4d422e; }
.jacket-tone-4 { --jacket-cloth:#6b555e; --jacket-shade:#423038; }
.library-display-book { position:absolute; width:140px; height:213px; bottom:47px; left:calc(50% - 70px); border-radius:2px 4px 4px 2px; background:var(--jacket-cloth); box-shadow:inset 6px 0 7px #0004,5px 8px 16px #342c252b; transform-origin:center bottom; }
.library-display-book:before { content:''; position:absolute; z-index:2; inset:0; border-radius:inherit; background:linear-gradient(90deg,#0004,transparent 7%,#fff2 9%,transparent 11%),linear-gradient(0deg,var(--jacket-shade),transparent 70%); }
.library-display-book:after { content:''; position:absolute; top:3px; bottom:3px; width:5px; right:-5px; background:repeating-linear-gradient(0deg,#d8d1bd 0 1px,#f5eddc 1px 3px); transform:skewY(-12deg); border-radius:0 2px 2px 0; }
.library-display-book img { width:100%; height:77%; object-fit:cover; border-radius:inherit; opacity:.8; }
.library-display-book-0 { z-index:3; transform:rotate(-8deg) translateX(-58px); }
.library-display-book-1 { z-index:2; transform:rotate(7deg) translateX(22px); height:226px; }
.library-display-book-2 { z-index:1; transform:rotate(17deg) translateX(72px); height:199px; }
.library-display-title { position:absolute; top:25px; right:17px; z-index:3; padding:11px 8px; max-height:155px; background:#f0e7d3; color:#343b31; border:1px solid #c7b99c; box-shadow:0 0 0 3px #eee4ccae; writing-mode:vertical-rl; text-orientation:upright; font:21px/1.1 var(--library-serif); letter-spacing:3px; overflow:hidden; }
.library-display-edition { position:absolute; z-index:3; bottom:13px; left:17px; color:#f8ecd4; font-size:7px; letter-spacing:3px; }
.library-still-caption { display:flex; justify-content:center; align-items:center; gap:15px; position:absolute; left:0; right:0; bottom:0; font:11px/1.5 var(--library-serif); letter-spacing:4px; color:#8c8778; }
.library-still-caption i { width:24px; height:1px; background:#cfc5b0; }
.library-collection { scroll-margin-top:86px; padding-top:34px; }
.library-collection-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:18px; margin:0 9px 12px; }
.library-section-label { margin:0 0 8px; color:var(--book-muted); font-size:9px; letter-spacing:3px; }
.library-collection-heading h2 { margin:0; font:500 25px/1.5 var(--library-serif); letter-spacing:2px; }
.library-collection-heading h2 span { display:inline-block; margin-left:8px; font:12px/1.5 Georgia,serif; color:var(--book-muted); vertical-align:middle; letter-spacing:0; }
.library-collection-heading > p { color:var(--book-muted); margin:0 0 4px; font:12px/1.5 var(--library-serif); }
.shelf-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:38px var(--shelf-gap); padding:0 10px 14px; overflow:hidden; }
.shelf-book { min-width:0; }
.shelf-book-stage { position:relative; display:flex; align-items:flex-end; justify-content:center; height:296px; padding:12px 16px 18px; perspective:1000px; }
.shelf-book-stage:before { content:''; position:absolute; bottom:9px; left:0; right:0; height:22px; background:radial-gradient(ellipse,#49361b35,transparent 65%); }
.shelf-book-stage:after { content:''; position:absolute; left:calc(-1 * var(--shelf-gap) / 2); right:calc(-1 * var(--shelf-gap) / 2); bottom:0; height:12px; background:linear-gradient(#d4c6b0,#e1d4bf 25%,#bba78c 30%,#ccb99d 65%,#b7a082); border-top:1px solid #e9dfcb; box-shadow:0 3px 0 #9d866a26,0 10px 14px #50351912; }
.book-jacket { display:block; position:relative; width:178px; max-width:100%; aspect-ratio:2 / 3; color:#f7ecd5 !important; transform:rotateY(-10deg) rotateZ(-1deg); transform-style:preserve-3d; transition:transform .35s cubic-bezier(.2,.65,.3,1),filter .35s; flex-shrink:0; outline-offset:8px !important; }
.book-jacket-front { position:absolute; display:block; inset:0; background:var(--jacket-cloth); border-radius:2px 4px 4px 2px; overflow:hidden; box-shadow:inset 0 0 0 1px #fff2,1px 2px 3px #34271136,7px 10px 16px #34271130; }
.book-jacket-front:before { content:''; position:absolute; z-index:3; top:0; bottom:0; left:0; width:15px; background:linear-gradient(90deg,#0005,#0001 40%,#fff2 58%,#0003 69%,transparent 92%); pointer-events:none; }
.book-jacket-front:after { content:''; position:absolute; inset:8px 7px 9px 17px; border:1px solid #e9dbb92b; border-radius:1px; pointer-events:none; z-index:2; }
.book-jacket-pages { position:absolute; inset:4px -7px 2px auto; width:9px; border-radius:0 3px 3px 0; background:repeating-linear-gradient(90deg,#ded4bc 0 1px,#f7efd9 1px 2px); box-shadow:2px 3px 2px #57402426; transform:skewY(-10deg); }
.book-jacket-art { position:absolute; inset:0; width:100%; height:78%; object-fit:cover; opacity:.88; mix-blend-mode:luminosity; }
.book-jacket-grain { position:absolute; inset:0; background:linear-gradient(0deg,var(--jacket-shade) 2%,var(--jacket-cloth) 18%,transparent 68%),repeating-linear-gradient(0deg,transparent 0 2px,#fff1 3px,transparent 4px); }
.book-jacket-series { position:absolute; z-index:2; left:22px; top:20px; font:9px/1.5 var(--library-serif); letter-spacing:3px; writing-mode:vertical-rl; text-shadow:0 1px 3px #0008; }
.book-jacket-label { position:absolute; z-index:2; top:22px; right:19px; display:block; writing-mode:vertical-rl; text-orientation:upright; padding:14px 9px; max-height:calc(100% - 65px); background:#f1e9d7; border:1px solid #cfbf9e; box-shadow:0 0 0 3px #efe3c88c,1px 3px 8px #241b1a22; }
.book-jacket-title { writing-mode:vertical-rl; text-orientation:upright; font:500 25px/1.3 var(--library-serif); letter-spacing:4px; color:#343a31; overflow-wrap:anywhere; }
.book-jacket-label-long .book-jacket-title { font-size:18px; line-height:1.15; letter-spacing:1px; }
.book-jacket-seal { position:absolute; z-index:2; left:24px; bottom:41px; border:1px solid #cfa58e; color:#ead4bc; padding:3px 4px; border-radius:2px; font:9px/1.05 var(--library-serif); opacity:.85; }
.book-jacket-edition { position:absolute; z-index:2; bottom:21px; left:23px; font:8px/1 var(--library-serif); letter-spacing:2px; color:#ede2c8; }
.book-jacket:hover,.book-jacket:focus-visible { transform:rotateY(-3deg) rotateZ(0) translateY(-7px); filter:brightness(1.05); }
.shelf-book-copy { padding:20px 9px 0; }
.shelf-book-meta { display:flex; align-items:center; gap:8px; color:var(--book-muted); font-size:10px; line-height:1.5; margin:0 0 9px; }
.shelf-book-meta span:last-child { color:#647762; border:1px solid #d6ddcd; padding:0 5px; border-radius:2px; font-size:9px; }
.shelf-book h3 { font:600 21px/1.5 var(--library-serif); letter-spacing:1px; margin:0 0 9px; overflow-wrap:anywhere; }
.shelf-book h3 a:hover { color:var(--book-accent); text-decoration:none; }
.shelf-book-summary { font-size:12px; line-height:1.85; color:var(--book-muted); margin:0 0 10px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:3.7em; }
.shelf-book-author { font-size:10px; line-height:1.6; color:var(--book-muted); margin:0 0 11px; }
.shelf-book-read { display:flex; align-items:center; justify-content:space-between; min-height:40px; padding:7px 0; color:var(--book-accent) !important; border-top:1px solid #dedbd0; font-size:12px; }
.shelf-book-read:hover { text-decoration:none; color:#283e31 !important; }.shelf-book-read span { font-size:17px; }
.library-pagination { border-top:1px solid var(--book-line); padding-top:27px; margin:20px 9px 0; align-items:center; font-size:12px; gap:35px; }
.library-pagination a { display:inline-flex; align-items:center; justify-content:center; gap:13px; border:1px solid #c9cbbd; border-radius:2px; padding:10px 18px; min-height:44px; color:var(--book-accent) !important; }
.library-pagination a:hover { background:#ebede3; text-decoration:none; }
.library-pagination > span { color:var(--book-muted); }.library-pagination b { font-weight:500; color:var(--book-ink); }
.library-pagination .library-pagination-disabled { opacity:.5; padding:10px 18px; }
.book-library > .book-library-note { margin-left:9px; margin-right:9px; }
@media(min-width:1400px) { .book-jacket { width:188px; }.shelf-book-stage { height:310px; } }
@media(max-width:991px) and (min-width:651px) {
 .library-welcome { padding:23px 10px 35px; grid-template-columns:1.2fr 1fr; }.library-eyebrow { gap:8px; font-size:9px; letter-spacing:1px; }.library-still-life { margin-left:0; transform:scale(.86); transform-origin:center; }
 .shelf-grid { --shelf-gap:24px; grid-template-columns:repeat(3,minmax(0,1fr)); }.book-jacket { width:162px; }.shelf-book-stage { height:273px; }.shelf-book h3 { font-size:20px; }
}
@media(max-width:650px) {
 .library-welcome { display:block; min-height:0; padding:24px 7px 30px; }.library-eyebrow { font-size:9px; letter-spacing:1px; margin-bottom:18px; gap:9px; }.library-eyebrow > span { width:23px; height:26px; font-size:16px; }
 .book-library .library-welcome h1 { font-size:37px; letter-spacing:3px; margin-bottom:12px; }.library-welcome-lead { font-size:17px; margin-bottom:10px; }.library-welcome-note { font-size:12px; line-height:1.95; }
 .library-welcome-actions { gap:18px; margin-top:22px; }.library-browse { padding:9px 14px; gap:18px; min-height:40px; }.library-welcome-actions > span { font-size:10px; }.library-still-life { display:none; }
 .library-collection { padding-top:25px; scroll-margin-top:78px; }.library-collection-heading { margin:0 5px 6px; gap:8px; }.library-collection-heading h2 { font-size:23px; }.library-section-label { font-size:8px; letter-spacing:2px; margin-bottom:6px; }.library-collection-heading > p { max-width:110px; font-size:10px; text-align:right; line-height:1.7; }
 .shelf-grid { --shelf-gap:22px; grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:24px; padding:0 5px 12px; }.shelf-book-stage { height:246px; padding:12px 12px 15px; }.book-jacket { width:145px; }.book-jacket-title { font-size:20px; letter-spacing:2px; }.book-jacket-label { top:20px; right:15px; padding:10px 7px; max-height:calc(100% - 45px); }.book-jacket-label-long .book-jacket-title { font-size:15px; }.book-jacket-series { top:19px; left:19px; font-size:8px; letter-spacing:2px; }.book-jacket-edition { bottom:18px; left:20px; font-size:7px; letter-spacing:1px; }.book-jacket-seal { bottom:36px; left:21px; font-size:8px; }
 .shelf-book-stage:after { height:10px; }.shelf-book-copy { padding:17px 3px 0; }.shelf-book-meta { font-size:9px; margin-bottom:7px; gap:6px; }.shelf-book h3 { font-size:18px; letter-spacing:.5px; margin-bottom:7px; }.shelf-book-summary { font-size:12px; margin-bottom:8px; }.shelf-book-author { font-size:10px; margin-bottom:8px; }.shelf-book-read { font-size:12px; min-height:44px; }.library-pagination { margin:16px 4px 0; gap:12px; font-size:11px; padding-top:22px; }.library-pagination a,.library-pagination .library-pagination-disabled { padding:9px 12px; gap:7px; }
}
@media(max-width:374px) {
 .shelf-grid { --shelf-gap:16px; }.shelf-book-stage { height:218px; padding-left:9px; padding-right:9px; }.book-jacket { width:127px; }.book-jacket-title { font-size:18px; letter-spacing:1px; }.book-jacket-label { right:12px; top:17px; padding:9px 6px; max-height:calc(100% - 40px); }.book-jacket-label-long .book-jacket-title { font-size:14px; }.shelf-book h3 { font-size:17px; }.book-jacket-series { font-size:7px; left:17px; top:17px; }.book-jacket-edition { font-size:6px; left:17px; }.book-jacket-seal { left:18px; }.library-welcome-actions { gap:12px; }.library-welcome-note br { display:none; }.library-pagination { gap:7px; }.library-pagination a,.library-pagination .library-pagination-disabled { padding:9px 8px; }
}
@media(hover:none),(prefers-reduced-motion:reduce) { .book-jacket { transition:none; }.book-jacket:hover { transform:rotateY(-10deg) rotateZ(-1deg); filter:none; } }
