:root{--ink:#1e2923;--muted:#7f887f;--cream:#f6f3eb;--paper:#fffcf6;--line:#e4e0d7;--sage:#dce8d2;--dark-sage:#55725d;--coral:#e77b63;--yellow:#f0bf4d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:Manrope,Arial,sans-serif}.app-shell{display:grid;grid-template-columns:252px 1fr;min-height:100vh}.sidebar{background:#f0eee7;border-right:1px solid var(--line);padding:28px 20px 18px;display:flex;flex-direction:column;position:fixed;width:252px;height:100vh}.brand{display:flex;gap:11px;align-items:center;color:var(--ink);text-decoration:none;font-family:Fraunces,serif;font-size:20px;line-height:.78;letter-spacing:-.7px;margin:0 10px 46px}.brand em{font-weight:500}.brand-mark{width:35px;height:35px;border-radius:50%;background:var(--coral);color:#fff;display:grid;place-items:center;font-size:22px;font-weight:600;font-style:italic}.nav{display:grid;gap:5px}.nav-item,.rating-filter{border:0;background:transparent;color:#516057;font:600 13px Manrope;cursor:pointer;text-align:left;border-radius:8px;transition:.2s}.nav-item{display:flex;gap:12px;align-items:center;padding:10px}.nav-item span{font-size:19px;width:18px;color:#69776d}.nav-item b{margin-left:auto;font:500 11px DM Mono;color:#9aa198}.nav-item:hover,.nav-item.active{background:#e3e8dc;color:#314638}.nav-item.active span{color:var(--dark-sage)}.shelf-nav{margin:42px 10px}.eyebrow{font:500 10px DM Mono,monospace;letter-spacing:1.1px;color:#899188;margin:0 0 14px}.rating-filter{width:100%;padding:8px 0;display:flex;align-items:center;gap:2px}.rating-filter:hover,.rating-filter.active{color:var(--coral)}.rating-filter .stars{font-size:12px;letter-spacing:0;color:#e6a72b}.rating-filter i{font-style:normal;color:#b0b7af;font-size:11px}.rating-filter b{margin-left:auto;font:500 11px DM Mono;color:#9aa198}.sidebar-footer{margin-top:auto;border-top:1px solid var(--line);padding:18px 8px 0;display:flex;align-items:center;gap:10px}.avatar{width:30px;height:30px;border-radius:50%;background:#b5c5aa;display:grid;place-items:center;font:500 10px DM Mono;color:#fff}.sidebar-footer strong{display:block;font-size:11px}.sidebar-footer span{display:block;color:#959c94;font-size:9px;margin-top:2px}.more{margin-left:auto;border:0;background:transparent;color:#768078;cursor:pointer}.content{grid-column:2;padding:0 6.2vw 60px;max-width:1500px;width:100%}.topbar{height:87px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.search{display:flex;align-items:center;gap:10px;color:#7f8980;font-size:24px}.search input{border:0;outline:0;background:transparent;width:240px;color:var(--ink);font:500 13px Manrope}.search input::placeholder{color:#9ca49c}.header-actions{display:flex;align-items:center;gap:15px}.icon-button{border:0;background:transparent;font-size:20px;color:#627167;cursor:pointer}.add-button,.save-button{border:0;border-radius:7px;background:var(--ink);color:#fff;font:700 12px Manrope;padding:12px 16px;cursor:pointer;transition:transform .15s,background .15s}.add-button:hover,.save-button:hover{transform:translateY(-1px);background:#3b5042}.add-button span{font-size:17px;vertical-align:-1px;margin-right:5px}.hero{padding:64px 0 58px;display:flex;justify-content:space-between;align-items:end}.hero h1{font:600 clamp(38px,5vw,64px)/.96 Fraunces,serif;letter-spacing:-2.7px;margin:0;color:#233128}.hero h1 em{color:var(--coral);font-weight:500}.hero-copy{color:#738077;font-size:13px;margin:17px 0 0}.reading-stat{display:flex;align-items:center;gap:12px;background:#e8eee0;border-radius:50%;height:104px;width:104px;justify-content:center;transform:rotate(8deg);margin:0 21px 4px 0}.reading-stat span{font:600 29px Fraunces}.reading-stat small{font:500 8px/1.35 DM Mono;color:#607162;text-transform:uppercase}.shelf-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:26px}.shelf-head h2{font:600 24px Fraunces;margin:0;letter-spacing:-.5px}.shelf-head p{font-size:11px;color:var(--muted);margin:5px 0 0}.sort-wrap{font-size:10px;color:#8b938b}.sort-wrap select{font:600 11px Manrope;color:#536158;border:1px solid var(--line);background:var(--paper);border-radius:6px;padding:8px;margin-left:7px;outline:none}.book-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:34px 24px}.book-card{min-width:0;cursor:pointer;position:relative}.cover-wrap{aspect-ratio:2/2.9;border-radius:3px;overflow:hidden;background:#dad6cd;box-shadow:0 10px 16px -12px #73736a;position:relative;transition:transform .25s,box-shadow .25s}.book-card:hover .cover-wrap{transform:translateY(-5px);box-shadow:0 17px 23px -14px #4a514c}.cover-wrap img{width:100%;height:100%;object-fit:cover;display:block}.cover-fallback{width:100%;height:100%;padding:18px 12px;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(145deg,#d68c6e,#7a975f);color:#fff;font:600 17px/1.1 Fraunces}.cover-fallback small{font:500 8px Manrope;text-transform:uppercase;letter-spacing:1px}.book-favorite{position:absolute;right:9px;top:9px;width:27px;height:27px;border-radius:50%;border:0;background:#fffdfbdd;color:var(--coral);font-size:15px;cursor:pointer;z-index:2}.book-info{padding:12px 2px}.book-title{font:700 12px/1.3 Manrope;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.book-author{font-size:10px;color:#7d877e;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rating{display:flex;align-items:center;gap:5px;margin-top:8px}.rating .stars{font-size:11px;letter-spacing:-1px;color:#e5a72c}.rating small{font:500 9px DM Mono;color:#9aa299}.empty-state{text-align:center;padding:80px 0}.empty-state span{color:var(--coral);font-size:36px}.empty-state h3{font:600 24px Fraunces;margin:12px 0 4px}.empty-state p{font-size:12px;color:var(--muted);margin:0 0 22px}.book-dialog,.detail-dialog{border:0;padding:0;background:var(--paper);color:var(--ink);border-radius:12px;box-shadow:0 30px 80px #26342955;max-width:680px;width:calc(100% - 32px)}dialog::backdrop{background:#2131277a;backdrop-filter:blur(4px)}.book-dialog form{padding:38px}.book-dialog h2{font:600 32px Fraunces;margin:0 0 25px}.close{border:0;background:transparent;font:400 30px/1 Arial;color:#7c887e;cursor:pointer;position:absolute;right:19px;top:17px}.form-layout{display:grid;grid-template-columns:155px 1fr;gap:24px;margin-bottom:19px}.cover-input{border:1.5px dashed #cfd6c9;border-radius:7px;height:190px;display:flex!important;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;position:relative;color:#7b897d}.cover-input span{font-size:42px}.cover-input small{font-size:9px;margin-top:12px}.cover-input input{position:absolute;opacity:0;inset:0;cursor:pointer}.form-fields{display:grid;gap:13px}.book-dialog label{display:grid;gap:6px;font:700 10px Manrope;color:#55645b}.book-dialog input:not([type=checkbox]),.book-dialog textarea,.book-dialog select{border:1px solid #d9ddd5;border-radius:6px;padding:10px;background:#fffdf9;color:#263329;font:500 12px Manrope;outline-color:#9bad9d;width:100%;resize:vertical}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.check{display:flex!important;align-items:center;gap:8px;margin:18px 0}.check input{accent-color:var(--dark-sage)}.save-button{width:100%;padding:14px}.save-button span{float:right;font-size:18px;line-height:10px}.detail-dialog{max-width:720px}.detail-dialog #detailContent{padding:44px}.detail-layout{display:grid;grid-template-columns:210px 1fr;gap:36px}.detail-cover{aspect-ratio:2/2.9;border-radius:4px;overflow:hidden;background:#d9d5cc;box-shadow:0 14px 25px -17px #333}.detail-cover img{width:100%;height:100%;object-fit:cover}.detail-cover .cover-fallback{font-size:22px}.detail-meta .eyebrow{margin-top:3px}.detail-meta h2{font:600 34px/1.02 Fraunces;letter-spacing:-1px;margin:0}.detail-meta .author{font-size:13px;color:#768078;margin:9px 0 22px}.detail-note{border-top:1px solid var(--line);margin-top:22px;padding-top:18px;font:500 13px/1.7 Manrope;color:#445047}.detail-note h3{font:600 15px Fraunces;margin:0 0 7px}.detail-note p{margin:0;white-space:pre-wrap}.detail-actions{display:flex;gap:10px;margin-top:24px}.text-button{border:1px solid var(--line);border-radius:6px;background:#fffdfa;padding:9px 12px;color:#5b6b60;font:700 10px Manrope;cursor:pointer}.text-button.danger{color:#b86151}.mobile-menu{display:none}
@media(max-width:760px){.app-shell{display:block}.sidebar{display:none}.content{padding:0 22px}.topbar{height:68px}.mobile-menu{display:block;border:0;background:none;font-size:19px}.search input{width:130px}.icon-button{display:none}.add-button{padding:10px 11px;font-size:11px}.hero{padding:45px 0 39px}.hero h1{font-size:45px}.reading-stat{width:77px;height:77px;margin-right:0}.reading-stat span{font-size:23px}.reading-stat small{font-size:6px}.book-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}.shelf-head{align-items:start}.sort-wrap{display:grid;gap:5px}.sort-wrap select{margin:0}.form-layout,.detail-layout{grid-template-columns:1fr}.cover-input{height:125px}.book-dialog form,.detail-dialog #detailContent{padding:29px 22px}.detail-cover{max-width:180px}.detail-meta h2{font-size:30px}}
.recommendation-link{text-decoration:none}.hero{padding-bottom:42px}.recommendations{background:#e7eee0;border-radius:13px;padding:32px;display:grid;grid-template-columns:230px minmax(0,1fr);gap:30px;margin:0 0 56px;overflow:hidden;position:relative}.recommendations:after{content:'✦';position:absolute;right:-16px;bottom:-46px;font:180px Fraunces;color:#d5e2ca;opacity:.8}.recommendation-copy,.recommendation-grid{position:relative;z-index:1;min-width:0}.recommendations h2{font:600 30px/1 Fraunces;letter-spacing:-1px;margin:0}.recommendations h2 em{color:var(--coral);font-weight:500}.recommendations p:not(.eyebrow){font-size:11px;line-height:1.65;color:#657764;margin:14px 0}.refresh-picks{padding:0;border:0;background:transparent;color:#45614d;font:700 10px Manrope;cursor:pointer}.refresh-picks span{font-size:17px;vertical-align:-2px;margin-right:3px}.recommendation-grid{display:flex;gap:14px;overflow-x:auto;padding:2px 2px 10px;scroll-snap-type:x mandatory;scrollbar-width:thin}.recommendation-card{background:#fdfbf5;border-radius:8px;padding:12px;display:grid;grid-template-columns:82px minmax(0,1fr);gap:13px;min-width:0;flex:0 0 280px;scroll-snap-align:start;box-shadow:0 6px 14px -15px #2d3e30;cursor:pointer;transition:transform .2s}.recommendation-card:hover{transform:translateY(-3px)}.recommendation-cover{height:118px;border-radius:4px;overflow:hidden;background:#b5c6ac}.recommendation-cover img{height:100%;width:100%;object-fit:cover;display:block}.recommendation-cover .cover-fallback{font-size:10px;padding:8px}.recommendation-cover .cover-fallback small{font-size:5px}.recommendation-text{min-width:0}.recommendation-card h3{font:700 12px/1.3 Manrope;margin:3px 0 4px;overflow-wrap:anywhere}.recommendation-card .rec-author{font-size:9px;color:#778376;margin:0;overflow-wrap:anywhere}.match-note{font:500 8px/1.5 DM Mono;color:#61735e;margin:9px 0 0;overflow-wrap:anywhere}@media(max-width:1050px){.recommendations{grid-template-columns:1fr}}@media(max-width:760px){.recommendations{grid-template-columns:1fr;padding:25px;margin-bottom:42px}.recommendation-card{flex-basis:270px;grid-template-columns:78px minmax(0,1fr)} }
.recommendation-link{text-decoration:none}.hero{padding-bottom:42px}.recommendations{background:#e7eee0;border-radius:13px;padding:32px;display:grid;grid-template-columns:minmax(250px,.75fr) minmax(0,1.25fr);gap:30px;margin:0 0 56px;overflow:hidden;position:relative}.recommendations[hidden]{display:none!important}.recommendations:after{content:'✦';position:absolute;right:-16px;bottom:-46px;font:180px Fraunces;color:#d5e2ca;opacity:.8}.recommendation-copy,.recommendation-grid{position:relative;z-index:1;min-width:0}.recommendations h2{font:600 30px/1 Fraunces;letter-spacing:-1px;margin:0}.recommendations h2 em{color:var(--coral);font-weight:500}.recommendations p:not(.eyebrow){font-size:11px;line-height:1.65;color:#657764;margin:14px 0}.refresh-picks{padding:0;border:0;background:transparent;color:#45614d;font:700 10px Manrope;cursor:pointer}.refresh-picks span{font-size:17px;vertical-align:-2px;margin-right:3px}.recommendation-grid{display:grid;grid-template-columns:1fr;gap:12px;overflow:visible}.recommendation-card{background:#fdfbf5;border-radius:8px;padding:12px;display:grid;grid-template-columns:86px minmax(0,1fr);gap:14px;min-width:0;min-height:132px;box-shadow:0 6px 14px -15px #2d3e30;cursor:pointer;transition:transform .2s}.recommendation-card:hover{transform:translateY(-3px)}.recommendation-cover{height:118px;border-radius:4px;overflow:hidden;background:#b5c6ac}.recommendation-cover img{height:100%;width:100%;object-fit:cover;display:block}.recommendation-cover .cover-fallback{font-size:10px;padding:8px}.recommendation-cover .cover-fallback small{font-size:5px}.recommendation-text{min-width:0;padding-right:3px}.recommendation-card h3{font:700 13px/1.28 Manrope;margin:4px 0 5px;overflow-wrap:anywhere}.recommendation-card .rec-author{font-size:10px;color:#778376;margin:0;overflow-wrap:anywhere}.match-note{font:500 9px/1.55 DM Mono;color:#61735e;margin:11px 0 0;overflow-wrap:anywhere}@media(max-width:1050px){.recommendations{grid-template-columns:1fr}.recommendation-grid{grid-template-columns:1fr}}@media(max-width:760px){.recommendations{grid-template-columns:1fr;padding:25px;margin-bottom:42px}.recommendation-card{grid-template-columns:76px minmax(0,1fr);min-height:120px}.recommendation-cover{height:106px}}
