body{margin:0}*{box-sizing:border-box;margin:0;padding:0}:root{--cream:#faf8f3;--warm-white:#fff;--warm-black:#1a1614;--warm-dark:#2a2520;--warm-gray:#6b6560;--light-gray:#a09890;--border:#e8e2d8;--sage:#7a8e6e;--sage-light:#e8ede4;--terracotta:#c27750;--gold:#c9a96e;--gold-light:#f5edd8;--spacing-xs:.5rem;--spacing-sm:.75rem;--spacing-md:1.25rem;--spacing-lg:2rem;--spacing-xl:3.5rem;--spacing-2xl:5.5rem;--radius:4px;--shadow-sm:0 1px 3px #1a161414;--shadow-md:0 4px 12px #1a16141f;--shadow-lg:0 8px 24px #1a161429;--transition:.25s cubic-bezier(.4, 0, .2, 1)}body{background:var(--cream);color:var(--warm-black);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Charter,Iowan Old Style,Palatino Linotype,Palatino,Georgia,serif;line-height:1.65}.app{flex-direction:column;min-height:100vh;display:flex}.header{background:var(--warm-black);color:var(--cream);padding:clamp(3rem, 8vw, 6rem) var(--spacing-lg) clamp(2.5rem, 6vw, 5rem);text-align:center;border-bottom:1px solid #c9a96e4d;position:relative}.header:after{content:"";background:var(--gold);width:60px;height:1px;box-shadow:0 0 20px var(--gold);display:block;position:absolute;bottom:-1px;left:50%;transform:translate(-50%)}.header h1{letter-spacing:.05em;color:var(--cream);margin-bottom:clamp(.875rem,2vw,1.5rem);font-family:Playfair Display,Palatino Linotype,Palatino,Georgia,serif;font-size:clamp(2.25rem,5.5vw,3.75rem);font-style:normal;font-weight:400;line-height:1.1}.header p{color:#c8c2b8e6;letter-spacing:.015em;max-width:600px;margin:0 auto;font-size:clamp(.9375rem,1.8vw,1.0625rem);font-weight:400;line-height:1.75}.controls{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:clamp(1.5rem, 3vw, 2rem) var(--spacing-lg);z-index:100;background:#faf8f3f7;border-bottom:1px solid #e8e2d899;position:sticky;top:0;box-shadow:0 2px 8px #1a16140a}.controls-inner{max-width:1200px;margin:0 auto}.search-box{margin-bottom:var(--spacing-md)}.search-box input{border:1px solid var(--border);background:var(--warm-white);width:100%;color:var(--warm-black);letter-spacing:.005em;border-radius:4px;padding:.9375rem 1.125rem;font-family:Charter,Iowan Old Style,Georgia,serif;font-size:.9375rem;transition:all .25s}.search-box input:focus{border-color:var(--sage);background:var(--warm-white);outline:none;box-shadow:0 0 0 3px #7a8e6e14,0 2px 8px #1a16140f}.search-box input::placeholder{color:var(--light-gray);font-style:italic}.filters{gap:var(--spacing-md);margin-bottom:var(--spacing-md);flex-direction:column;display:flex}@media (width>=768px){.filters{align-items:flex-end;gap:var(--spacing-lg);flex-direction:row}}.filter-group{width:100%}.filter-group label{color:var(--warm-black);letter-spacing:.01em;margin-bottom:.625rem;font-family:Charter,Georgia,serif;font-size:.875rem;font-weight:500;display:block}.age-slider-group{max-width:480px}.age-highlight{color:var(--terracotta);text-align:center;min-width:1.75rem;padding:0 .25rem;font-family:Avenir Next,-apple-system,sans-serif;font-size:1.375rem;font-weight:600;display:inline-block}.dual-slider-container{padding:1.25rem 0 .75rem;position:relative}.slider-track{background:var(--border);border-radius:2px;height:4px;margin-bottom:.5rem;position:relative}.slider-range{background:var(--terracotta);border-radius:2px;height:100%;transition:all .15s;position:absolute}.age-range-slider{appearance:none;cursor:pointer;pointer-events:none;background:0 0;outline:none;width:100%;height:4px;position:absolute;top:0;left:0}.age-range-slider::-webkit-slider-thumb{appearance:none;background:var(--terracotta);border:3px solid var(--warm-white);cursor:pointer;pointer-events:auto;z-index:3;border-radius:50%;width:20px;height:20px;transition:transform .2s,box-shadow .2s;position:relative;box-shadow:0 2px 8px #c277504d}.age-range-slider::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 4px 12px #c2775066}.age-range-slider::-moz-range-thumb{background:var(--terracotta);border:3px solid var(--warm-white);cursor:pointer;pointer-events:auto;z-index:3;border-radius:50%;width:20px;height:20px;transition:transform .2s,box-shadow .2s;box-shadow:0 2px 8px #c277504d}.age-range-slider::-moz-range-thumb:hover{transform:scale(1.15);box-shadow:0 4px 12px #c2775066}.slider-max{z-index:4}.slider-labels{color:var(--warm-gray);justify-content:space-between;margin-top:.375rem;font-family:Avenir Next,-apple-system,sans-serif;font-size:.6875rem;font-weight:600;display:flex}.format-buttons{flex-wrap:wrap;gap:.5rem;display:flex}.format-btn{border:1px solid var(--border);background:var(--warm-white);color:var(--warm-gray);cursor:pointer;white-space:nowrap;letter-spacing:.02em;border-radius:3px;padding:.5rem 1rem;font-family:Avenir Next,-apple-system,BlinkMacSystemFont,sans-serif;font-size:.8125rem;font-weight:500;transition:all .25s}.format-btn:hover{border-color:var(--sage);color:var(--warm-black);background:#7a8e6e0f;transform:translateY(-1px)}.format-btn.active{background:var(--sage);border-color:var(--sage);color:#fff;box-shadow:0 2px 4px #7a8e6e40}.theme-group{margin-top:var(--spacing-sm)}.theme-chips{flex-wrap:wrap;gap:.5rem;display:flex}.theme-chip{border:1px solid var(--border);background:var(--warm-white);color:var(--warm-gray);cursor:pointer;letter-spacing:.015em;border-radius:20px;padding:.4375rem .875rem;font-family:Avenir Next,-apple-system,sans-serif;font-size:.75rem;font-weight:500;transition:all .25s}.theme-chip:hover{border-color:var(--gold);color:var(--warm-dark);background:var(--gold-light);transform:translateY(-1px)}.theme-chip.active{background:var(--gold);border-color:var(--gold);color:var(--warm-black);box-shadow:0 2px 4px #c9a96e40}.results-count{color:var(--warm-gray);letter-spacing:.01em;margin-top:.625rem;font-size:.8125rem;font-style:italic}.book-grid{max-width:1200px;padding:clamp(2.5rem, 5vw, 4rem) var(--spacing-lg) clamp(3rem, 6vw, 5rem);flex:1;grid-template-columns:repeat(2,1fr);gap:clamp(2.5rem,4vw,3rem) clamp(1rem,2.5vw,1.5rem);margin:0 auto;display:grid}@media (width>=560px){.book-grid{grid-template-columns:repeat(3,1fr)}}@media (width>=768px){.book-grid{grid-template-columns:repeat(4,1fr);gap:clamp(3rem,5vw,3.5rem) clamp(1.5rem,3vw,2rem)}}@media (width>=1024px){.book-grid{grid-template-columns:repeat(5,1fr)}}@media (width>=1280px){.book-grid{grid-template-columns:repeat(6,1fr)}}.book-card{color:inherit;flex-direction:column;text-decoration:none;transition:transform .3s cubic-bezier(.4,0,.2,1);display:flex}.book-card.clickable{cursor:pointer}.book-card.clickable:hover{transform:translateY(-4px)}.book-card.non-clickable{cursor:default}.book-cover-container{background:#ebe7dd;border-radius:3px;width:100%;margin-bottom:clamp(.75rem,1.5vw,1rem);padding-bottom:150%;transition:box-shadow .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:0 2px 8px #1a16141f,0 1px 2px #1a161414}.book-card.clickable:hover .book-cover-container{box-shadow:0 8px 24px #1a161429,0 2px 6px #1a161414}.book-cover{object-fit:contain;background:#ebe7dd;width:100%;height:100%;padding:6px;position:absolute;top:0;left:0}.book-cover-placeholder{text-align:center;background:linear-gradient(135deg,#ebe7dd 0%,#ddd8cc 100%);border:1px solid #1a16140f;justify-content:center;align-items:center;width:100%;height:100%;padding:clamp(1rem,2.5vw,1.5rem);display:flex;position:absolute;top:0;left:0}.book-cover-placeholder-title{color:var(--warm-gray);letter-spacing:.01em;font-family:Playfair Display,Palatino,Georgia,serif;font-size:clamp(.8125rem,1.8vw,1rem);font-style:italic;font-weight:500;line-height:1.35}.book-year-badge{color:var(--gold-light);letter-spacing:.05em;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:2;background:#1a1614d9;border-radius:3px;padding:.25rem .5rem;font-family:Avenir Next,-apple-system,sans-serif;font-size:clamp(.625rem,1.4vw,.6875rem);font-weight:600;position:absolute;top:8px;right:8px;box-shadow:0 2px 8px #0003}.book-info{flex-direction:column;flex:1;padding:0 3px;display:flex}.book-title{-webkit-line-clamp:2;letter-spacing:-.005em;color:var(--warm-black);-webkit-box-orient:vertical;margin-bottom:.3125rem;font-family:Playfair Display,Palatino,Georgia,serif;font-size:clamp(.9375rem,2vw,1.0625rem);font-weight:600;line-height:1.3;display:-webkit-box;overflow:hidden}.book-author{color:var(--warm-gray);-webkit-line-clamp:2;letter-spacing:.005em;-webkit-box-orient:vertical;margin-bottom:clamp(.5rem,1vw,.625rem);font-size:clamp(.75rem,1.6vw,.8125rem);line-height:1.4;display:-webkit-box;overflow:hidden}.illustrator{color:var(--light-gray);font-style:italic}.book-description{color:var(--warm-gray);-webkit-line-clamp:3;letter-spacing:.005em;-webkit-box-orient:vertical;margin-bottom:clamp(.5rem,1vw,.625rem);font-size:clamp(.75rem,1.5vw,.8125rem);font-style:italic;line-height:1.5;display:-webkit-box;overflow:hidden}.book-meta{flex-wrap:wrap;gap:.3125rem;margin-top:auto;font-size:0;display:flex}.book-badge{letter-spacing:.025em;white-space:nowrap;border-radius:2px;padding:.25rem .5rem;font-family:Avenir Next,-apple-system,sans-serif;font-size:clamp(.625rem,1.4vw,.6875rem);font-weight:600}.badge-age{color:#7a6335;background:#c9a96e26;border:1px solid #c9a96e33}.badge-type{color:#4a5e3e;background:#7a8e6e1f;border:1px solid #7a8e6e2e}.empty-state{text-align:center;padding:clamp(3rem, 8vw, 6rem) var(--spacing-lg);color:var(--warm-gray);flex:1;justify-content:center;align-items:center;display:flex}.empty-state p{letter-spacing:.01em;font-size:1.0625rem;font-style:italic;line-height:1.6}.loading{text-align:center;color:var(--warm-gray);letter-spacing:.01em;padding:clamp(3rem,8vw,6rem);font-size:1.0625rem;font-style:italic}.footer{background:var(--warm-black);color:#a09890cc;padding:clamp(2rem, 4vw, 3rem) var(--spacing-lg);text-align:center;letter-spacing:.01em;border-top:1px solid #c9a96e33;font-family:Charter,Georgia,serif;font-size:.8125rem;position:relative}.footer:before{content:"";background:var(--gold);width:60px;height:1px;box-shadow:0 0 20px var(--gold);display:block;position:absolute;top:-1px;left:50%;transform:translate(-50%)}.footer p{margin-bottom:.5rem;line-height:1.7}.footer p:last-child{margin-bottom:0}.footer a{color:var(--gold);border-bottom:1px solid #0000;text-decoration:none;transition:color .25s}.footer a:hover{color:#ddc48e;border-bottom-color:#c9a96e66}
