.reading-page{padding-block:42px 88px}
.reading-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:36px}
.reading-title{display:flex;align-items:baseline;gap:20px}
.reading-title h1{font-size:52px;line-height:1.1;letter-spacing:-1.6px}
#reading-count{font-size:12px;color:var(--muted);white-space:nowrap}
.reading-search{display:flex;align-items:center;gap:10px;max-width:300px;border-bottom:1px solid var(--rule);padding:10px 0;color:var(--muted)}
.reading-search svg{width:17px;height:17px}
.reading-search input{border:0;outline:0;background:none;min-width:0;width:240px;font:13px var(--sans);color:var(--ink)}
.reading-search:focus-within{border-color:var(--accent)}
.reading-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));column-gap:36px;row-gap:42px}
.reading-card{min-width:0;align-self:start}
.reading-cover{display:flex;align-items:flex-end;justify-content:center;width:100%;height:250px;padding:12px 10px 15px;background:#edeae1;border-radius:2px;overflow:hidden}
.reading-cover img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;box-shadow:3px 5px 9px #262c2533;transition:transform .22s ease,box-shadow .22s ease}
.reading-cover:hover img,.reading-cover:focus-visible img{transform:translateY(-4px) rotate(-1deg);box-shadow:5px 9px 12px #262c2533}
.reading-meta{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin:16px 0 9px;min-height:16px}
.reading-status{display:inline-flex;align-items:center;gap:7px;font-size:11px;color:#52604b;line-height:1.3}
.reading-status::before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}
.reading-rating{color:#777548;font-size:13px;letter-spacing:1px;white-space:nowrap;line-height:1}
.reading-rating .unfilled{color:#929181}
.reading-meta time{font-size:10px;color:var(--muted);white-space:nowrap}
.reading-card h2{font:500 15px/1.4 var(--sans);letter-spacing:-.25px}
.reading-author{font:12px/1.6 var(--sans);color:var(--muted);margin-top:5px}
.reading-notes-link{display:inline-flex;gap:14px;background:none;padding:0;margin-top:11px;font:11px var(--sans);color:#64684e}
.reading-notes-link:hover{color:var(--ink)}
.reading-empty{padding:60px 0 120px;color:var(--muted)}
.reading-dialog{width:min(860px,calc(100% - 48px));max-height:calc(100dvh - 64px);border:1px solid var(--rule);padding:44px;background:var(--paper);color:var(--ink);box-shadow:0 28px 100px #0004;overscroll-behavior:contain}
.reading-dialog::backdrop{background:#1d221db3;backdrop-filter:blur(6px)}
.reading-close{position:absolute;right:14px;top:12px;display:grid;place-items:center;width:32px;height:32px;background:transparent;font-size:18px}
.reading-detail-content{display:grid;grid-template-columns:220px 1fr;align-items:start;gap:36px}
.reading-detail-cover{padding-top:6px}
.reading-detail-cover img{width:auto;max-width:100%;max-height:350px;box-shadow:4px 7px 15px #0003}
.reading-detail-copy .reading-meta{margin:0 0 18px;justify-content:flex-start;gap:20px}
.reading-detail-copy h2{font-size:40px;line-height:1.05;letter-spacing:-.6px}
.reading-subtitle{font-size:15px;line-height:1.6;margin-top:10px}
.reading-detail-copy .reading-author{font-size:13px;margin-top:12px}
.reading-notes{margin-top:26px;border-top:1px solid var(--rule);padding-top:22px;font-size:14px;line-height:1.85}
.reading-notes p+p{margin-top:18px}
body.reading-dialog-open{overflow:hidden}
@media(min-width:1450px){.reading-cover{height:280px}}
@media(max-width:1100px){.reading-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 28px}.reading-cover{height:240px}}
@media(max-width:800px){.reading-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 22px}.reading-cover{height:230px}.reading-heading{gap:18px}.reading-title{gap:12px}.reading-title h1{font-size:44px}.reading-search{max-width:230px}.reading-detail-content{grid-template-columns:160px 1fr;gap:26px}.reading-dialog{padding:40px 28px}}
@media(max-width:560px){.reading-page{padding-top:28px}.reading-heading{align-items:stretch;flex-direction:column;margin-bottom:28px;gap:20px}.reading-search{max-width:none}.reading-search input{width:100%}.reading-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 20px}.reading-cover{height:220px;padding:10px 8px 12px}.reading-meta{gap:5px;margin-top:12px}.reading-rating{font-size:11px; color:#777548; }.reading-meta time{font-size:9px}.reading-card h2{font-size:13px}.reading-author{font-size:11px}.reading-dialog{width:calc(100% - 28px);max-height:calc(100dvh - 28px);padding:44px 24px 30px}.reading-detail-content{grid-template-columns:1fr;gap:26px}.reading-detail-cover img{max-height:210px;margin-inline:auto}.reading-detail-copy h2{font-size:34px}}
@media(max-width:380px){.reading-cover{height:190px}.reading-grid{column-gap:14px}}
@media(prefers-reduced-motion:reduce){.reading-cover img{transition:none}.reading-cover:hover img{transform:none}}