/* Article listing and standalone reading pages share the portfolio palette. */
.writing-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.writing-card { background:#fdfcf9; border:1px solid var(--line); border-radius:25px; overflow:hidden; display:flex; flex-direction:column; }
.writing-cover { height:185px; display:flex; align-items:center; background:#eeeee6; padding:20px; border-bottom:1px solid var(--line); }
.writing-cover img { width:100%; height:100%; object-fit:contain; }
.writing-cover.photo { padding:0; }
.writing-cover.photo img { object-fit:cover; }
.writing-card-content { padding:25px; display:flex; flex-direction:column; flex:1; }
.writing-category { font-size:11px; letter-spacing:1px; margin-bottom:12px; font-weight:600; }
.writing-card h3 { font:500 23px/1.4 'Poppins',sans-serif; letter-spacing:-.6px; margin-bottom:15px; }
.writing-card-content>p:not(.writing-category) { font-size:15px; line-height:1.75; margin-bottom:25px; }
.writing-read { margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:17px; border-top:1px solid var(--line); font-size:14px; font-weight:600; }
.writing-read>span { font-size:12px; color:var(--muted); font-weight:400; white-space:nowrap; }
.writing-read>span>span { margin-left:10px; }
.reading-page .nav-links [aria-current] { color:#52623b; text-decoration:underline; text-underline-offset:7px; }
.reading-header { padding:35px 0 50px; max-width:880px; }
.back-link { font-size:14px; display:inline-block; margin-bottom:40px; }
.reading-header h1 { font:500 clamp(32px,4.4vw,57px)/1.17 'Poppins',sans-serif; letter-spacing:-1.8px; margin-bottom:22px; }
.reading-header .eyebrow { font-size:12px; }
.reading-deck { max-width:740px; font-size:18px; line-height:1.7; }
.reading-meta { margin-top:25px; font-size:13px; }
.reading-meta>span { margin:0 10px; color:#b6b9ad; }
.reading-layout { display:grid; grid-template-columns:235px minmax(0,1fr); gap:55px; align-items:start; border-top:1px solid var(--line); padding-top:35px; }
.article-sidebar { position:sticky; top:28px; min-width:0; }
.article-toc { border-bottom:1px solid var(--line); padding-bottom:22px; }
.article-toc summary { font-weight:600; font-size:15px; cursor:pointer; padding:4px 0; }
.article-toc ol { list-style:none; padding:16px 0 0; display:grid; gap:12px; max-height:65vh; overflow:auto; }
.article-toc a { font-size:14px; line-height:1.5; display:block; color:var(--muted); }
.article-toc a:hover { color:var(--ink); }
.sidebar-back { display:inline-block; margin-top:20px; font-size:13px; }
.article-body { min-width:0; font-size:17px; line-height:1.85; color:#363a32; }
.article-body p { color:inherit; margin:0 0 22px; }
.article-body h2 { font:500 29px/1.35 'Poppins',sans-serif; letter-spacing:-.7px; margin:54px 0 24px; scroll-margin-top:28px; }
.article-body h3 { font-size:22px; line-height:1.45; margin:35px 0 17px; scroll-margin-top:28px; }
.article-body h4 { font-size:18px; margin:28px 0 15px; }
.article-body>h2:first-child { margin-top:0; }
.article-body ul,.article-body ol { padding-left:25px; margin-bottom:24px; }
.article-body li { padding-left:4px; margin-bottom:10px; }
.article-body strong { font-weight:700; }
.article-body a:not(.article-image-link) { text-decoration:underline; text-underline-offset:3px; overflow-wrap:anywhere; }
.article-body blockquote { border-left:3px solid var(--accent); background:#eeeee6; padding:22px 26px; margin:28px 0; border-radius:0 10px 10px 0; }
.article-body blockquote p:last-child { margin-bottom:0; }
.article-body hr { border:0; border-top:1px solid var(--line); margin:40px 0; }
.article-body .article-image-link { display:block; background:white; border:1px solid var(--line); border-radius:12px; overflow:hidden; margin:26px 0; }
.article-image-link img { display:block; width:100%; height:auto; }
.article-body code { font-size:.86em; background:#eeeee6; padding:2px 5px; border-radius:4px; overflow-wrap:anywhere; }
.article-body pre { padding:22px; overflow-x:auto; background:#272c29; color:#edf0e6; border-radius:12px; margin:25px 0; line-height:1.65; }
.article-body pre code { padding:0; background:none; color:inherit; overflow-wrap:normal; }
.table-scroll { overflow-x:auto; margin:25px 0; border:1px solid var(--line); border-radius:10px; }
.article-body table { border-collapse:collapse; min-width:100%; font-size:14px; line-height:1.7; text-align:left; }
.article-body th { background:#eeeee6; font-weight:600; }
.article-body td,.article-body th { padding:13px 16px; border-bottom:1px solid var(--line); min-width:110px; vertical-align:top; }
.article-body tr:last-child td { border-bottom:0; }
.math-block { overflow-x:auto; overflow-y:hidden; padding:15px 4px; margin:20px 0; }
.article-body .katex { font-size:1.05em; }
.article-end { display:flex; justify-content:space-between; align-items:center; gap:15px; border-top:1px solid var(--line); margin-top:50px; padding-top:25px; font-size:13px; }
.article-end>span { font-size:11px; letter-spacing:1.5px; color:var(--muted); }
.related-articles { margin:90px 0 70px; border-top:1px solid var(--line); padding-top:35px; }
.related-articles h2 { font-size:30px; margin-bottom:28px; }
.related-articles>div { display:grid; grid-template-columns:1fr 1fr; gap:25px; }
.related-articles>div>a { padding:25px; border:1px solid var(--line); border-radius:18px; }
.related-articles a>span { display:block; font-size:12px; color:var(--muted); margin-bottom:12px; }
.related-articles strong { display:block; font-size:18px; font-weight:500; line-height:1.5; }
@media(max-width:1050px) { .writing-grid { gap:16px; } .writing-card-content { padding:20px; } .writing-card h3 { font-size:20px; } .nav-links { gap:23px; } .reading-layout { grid-template-columns:190px minmax(0,1fr); gap:30px; } }
@media(max-width:800px) { .reading-layout { grid-template-columns:1fr; gap:30px; } .article-sidebar { position:static; } .article-toc { background:#eeeee6; padding:18px 22px; border:1px solid var(--line); border-radius:12px; } .article-toc ol { max-height:260px; } .sidebar-back { display:none; } }
@media(max-width:700px) { .writing-grid { grid-template-columns:1fr; gap:22px; } .writing-cover { height:210px; } .writing-card h3 { font-size:24px; } .writing-card-content { padding:25px; } .reading-header { padding:20px 0 30px; } .back-link { margin-bottom:28px; } .reading-header h1 { font-size:34px; letter-spacing:-1px; } .reading-deck { font-size:16px; } .reading-meta { font-size:12px; } .reading-meta>span { margin:0 5px; } .article-body { font-size:16px; } .article-body h2 { font-size:25px; } .article-body h3 { font-size:21px; } .article-body blockquote { padding:20px; } .article-body pre { padding:16px; } .related-articles>div { grid-template-columns:1fr; } .related-articles { margin:60px 0 45px; } }
@media print { header,.article-sidebar,.related-articles,.back-link,footer,.article-end,.skip-link { display:none; } .container { width:100%; } .reading-layout { display:block; } .reading-header { padding:0 0 20px; } .article-body { font-size:11pt; } .article-body h2,.article-body h3 { break-after:avoid; } .article-image-link { break-inside:avoid; } }