.reading-page{background:var(--bg);min-height:100vh;color:var(--ink);padding-top:80px;padding-bottom:100px}.reading-container{max-width:1080px;margin:0 auto;padding:0 40px}.reading-breadcrumb{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-light);align-items:center;gap:8px;padding:32px 0 12px;font-size:.7rem;display:flex}.reading-breadcrumb a{color:var(--ink-light);text-decoration:none}.reading-breadcrumb a:hover{color:var(--ink)}.reading-hero{border-bottom:1px solid var(--border);padding:24px 0 32px}.reading-eyebrow{font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent-text);margin-bottom:16px;font-size:.7rem}.reading-h1{font-family:var(--font-serif);letter-spacing:-.025em;color:var(--ink);margin:0 0 16px;font-size:clamp(36px,5vw,56px);font-weight:700;line-height:1.05}.reading-sub{font-family:var(--font-sans);color:var(--ink-mid);max-width:640px;margin:0 0 32px;font-size:clamp(15px,2vw,17px);line-height:1.7}.reading-pills{flex-wrap:wrap;gap:6px;display:flex}.reading-pill{border:1px solid var(--border-mid);background:var(--bg);font-family:var(--font-sans);color:var(--ink-mid);cursor:pointer;transition:border-color .15s var(--ease), color .15s var(--ease), background .15s var(--ease);border-radius:100px;align-items:center;gap:8px;padding:6px 12px;font-size:.78rem;font-weight:500;display:inline-flex}.reading-pill:hover{border-color:var(--ink);color:var(--ink)}.reading-pill--active{background:var(--ink);color:#fff;border-color:var(--ink)}.reading-pill-num{font-family:var(--font-mono);letter-spacing:.04em;opacity:.65;font-size:.66rem}.reading-pill--active .reading-pill-num{opacity:.85}.reading-section{padding:56px 0 8px}.reading-section-head{border-bottom:1px solid var(--border-mid);align-items:baseline;gap:16px;margin-bottom:16px;padding-bottom:16px;display:flex}.reading-section-head h2{font-family:var(--font-serif);letter-spacing:-.02em;color:var(--ink);margin:0;font-size:clamp(22px,3vw,30px);font-weight:700}.reading-section-count{font-family:var(--font-mono);letter-spacing:.06em;color:var(--ink-light);font-size:.72rem}.reading-list{grid-template-columns:repeat(2,1fr);gap:16px;margin:0;padding:0;list-style:none;display:grid}@media (width<=720px){.reading-list{grid-template-columns:1fr}}.reading-list li{list-style:none}.reading-card{border:1px solid var(--border-mid);border-radius:var(--r-lg);background:var(--bg);color:var(--ink);transition:border-color .18s var(--ease), transform .18s var(--ease), box-shadow .18s var(--ease);box-sizing:border-box;grid-template-columns:1fr auto;align-items:start;gap:16px;height:100%;padding:22px 24px;text-decoration:none;display:grid}.reading-card:hover{border-color:var(--ink);transform:translateY(-2px);box-shadow:0 12px 30px #1118270f}.reading-card-meta{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-light);grid-column:1/-1;align-items:center;gap:10px;margin-bottom:4px;font-size:.66rem;display:flex}.reading-card-kind{color:var(--ink);font-weight:600}.reading-card-meta-sep{background:var(--border-mid);border-radius:50%;width:3px;height:3px;display:inline-block}.reading-card-price--free{color:var(--accent-text);font-weight:600}.reading-card-price--paid,.reading-card-price--freemium{color:var(--ink-mid)}.reading-card-body{flex-direction:column;gap:6px;min-width:0;display:flex}.reading-card-title{font-family:var(--font-serif);letter-spacing:-.01em;color:var(--ink);margin:0;font-size:1.1rem;font-weight:700;line-height:1.3}.reading-card-author{font-family:var(--font-sans);color:var(--ink-light);margin-bottom:4px;font-size:.82rem}.reading-card-desc{font-family:var(--font-sans);color:var(--ink-mid);margin:0;font-size:.92rem;line-height:1.6}.reading-card-why{font-family:var(--font-sans);color:var(--ink);border-top:1px solid var(--border);margin:8px 0 0;padding-top:10px;font-size:.85rem;font-style:italic;line-height:1.55}.reading-card-arrow{color:var(--ink-light);transition:color .18s var(--ease), transform .18s var(--ease);flex-shrink:0;align-self:start}.reading-card:hover .reading-card-arrow{color:var(--ink);transform:translate(2px,-2px)}@media (width<=720px){.reading-container{padding:0 20px}.reading-card{padding:20px}}