.writings-page { font-family: Inter, var(--sans); }
.writings-page .field-shade { background: #111112dd; }
.writings-page .site-dock { position:fixed; bottom:0; left:0; right:0; background:linear-gradient(0deg,#111112 40%,#111112f2 65%,#11111200); padding-top:44px; }
.journal-label,.back-link,.article-meta,.read-link,.writing-footer { font:12px/1.7 var(--mono); }
.journal-label { color:var(--muted); text-decoration:none; }
.writings-index,.article-shell { max-width:1440px; padding:55px var(--gutter) 0; margin:auto; }
.writings-heading { display:flex; justify-content:space-between; gap:60px; align-items:end; margin-bottom:70px; }
.writings-heading .eyebrow { color:var(--accent); margin-bottom:24px; }
.writings-heading h1 { font:300 clamp(48px,6.8vw,98px)/1.15 var(--mono); letter-spacing:-.065em; margin:0; }
.writings-heading>p { max-width:330px; color:var(--muted); font-size:17px; }
.writing-card { display:grid; grid-template-columns:1.08fr 1fr; gap:clamp(32px,5vw,72px); padding:42px 0; border-top:1px solid var(--line); align-items:center; }
.card-art { overflow:hidden; display:block; aspect-ratio:4/3; background:#19191a; }
.card-art img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .6s; }
.card-art:hover img { transform:scale(1.025); }
.cover-fallback { display:grid; place-items:center; height:100%; font:50px var(--mono); color:var(--accent); }
.card-copy .eyebrow { color:var(--accent); font-size:11px; letter-spacing:.025em; }
.card-copy .eyebrow span { color:var(--muted); }
.card-copy h2 { font:400 clamp(25px,2.8vw,40px)/1.28 var(--mono); letter-spacing:-.055em; margin:24px 0; }
.card-copy h2 a { text-decoration:none; }
.card-copy h2 a:hover { color:var(--accent); }
.card-excerpt { font-size:16px; line-height:1.85; color:var(--muted); }
.read-link { display:flex; align-items:center; gap:14px; margin-top:32px; text-decoration:none; color:var(--accent); }
.reading-time { margin-left:auto; color:var(--muted); }
.writing-footer { max-width:1440px; padding:60px var(--gutter) 140px; margin:auto; color:var(--muted); display:flex; justify-content:space-between; gap:24px; }
.writing-footer a { color:var(--fg); }
.back-link { color:var(--muted); text-decoration:none; }
.article-header { max-width:1020px; margin:50px 0 48px; }
.article-header>.eyebrow { color:var(--accent); margin-bottom:24px; }
.article-header h1 { font:300 clamp(31px,4.2vw,62px)/1.18 var(--mono); letter-spacing:-.055em; margin:0; }
.article-deck { max-width:800px; font-size:clamp(18px,1.7vw,23px); line-height:1.65; color:#b5b5bb; margin-top:30px; }
.author-byline { display:flex; align-items:center; gap:14px; margin-top:30px; }
.author-portrait { display:block; flex:0 0 auto; width:52px; height:52px; border-radius:50%; object-fit:cover; object-position:center 30%; }
.author-details { min-width:0; }
.author-name { display:block; font:500 14px/1.5 Inter,var(--sans); color:var(--fg); }
.article-meta { display:flex; flex-wrap:wrap; gap:4px 20px; color:var(--muted); margin-top:4px; }
.card-copy .author-byline { margin-top:24px; gap:10px; }
.card-copy .author-portrait { width:32px; height:32px; }
.card-copy .author-name { font-size:12px; }
.article-hero { margin:0 0 70px; aspect-ratio:2.1/1; background:#171718; overflow:hidden; }
.article-hero img { width:100%; height:100%; object-fit:cover; display:block; }
.reading-layout { display:grid; grid-template-columns:230px minmax(0,740px); gap:clamp(32px,6vw,100px); justify-content:space-between; }
.contents { min-width:0; align-self:start; position:sticky; top:36px; font-size:12px; line-height:1.65; }
.contents .eyebrow { color:var(--accent); margin-bottom:22px; }
.contents a { display:block; white-space:normal; overflow-wrap:anywhere; text-decoration:none; color:var(--muted); margin:0 0 17px; padding-left:14px; border-left:1px solid var(--line); }
.contents a:hover { color:var(--fg); border-color:var(--accent); }
.article-body { min-width:0; font:400 18px/1.95 Inter,var(--sans); overflow-wrap:anywhere; }
.article-body>p:first-child { font-size:21px; color:var(--fg); }
.article-body p,.article-body ul,.article-body ol,.article-body blockquote,.article-body pre { margin:0 0 26px; color:#c1c1c7; }
.article-body h2 { font:400 clamp(23px,2.3vw,31px)/1.45 var(--mono); letter-spacing:-.04em; margin:64px 0 25px; scroll-margin-top:40px; }
.article-body h3,.article-body h4 { font:500 21px/1.5 Inter,var(--sans); margin:38px 0 20px; }
.article-body li { padding-left:8px; margin-bottom:14px; }
.article-body li::marker { color:var(--accent); }
.article-body a { color:var(--accent); text-decoration-color:#d4a02470; }
.article-body strong { color:var(--fg); font-weight:600; }
.article-body blockquote { border-left:2px solid var(--accent); padding:8px 0 8px 28px; font-size:23px; }
.article-body img { display:block; max-width:100%; height:auto; margin:36px auto 16px; }
.article-body figure { margin:36px 0; }
.article-body p:has(>img) { margin-bottom:12px; }
.article-body p>img { margin-bottom:0; }
.article-body figcaption,.article-body p:has(>img)+p:has(>em:only-child) { font-size:14px; line-height:1.6; color:var(--muted); text-align:center; }
.article-body pre { white-space:pre-wrap; background:#1d1d20; padding:24px; font-family:var(--mono); font-size:14px; }
.article-body table { width:100%; border-collapse:collapse; font-size:15px; }
.article-body td,.article-body th { padding:12px; border:1px solid var(--line); text-align:left; }
.article-body .article-disclosures,.article-body .article-disclosures :is(h2,h3,h4,p,ul,ol,blockquote,pre,table) { font-size:12px; line-height:1.8; }
.article-body .article-disclosures h2 { margin-bottom:12px; }
.preview-notice { padding:10px var(--gutter); background:#d4a024; color:#111; font:12px var(--mono); }
@media(max-width:900px) { .reading-layout { grid-template-columns:minmax(0,740px); justify-content:center; } .contents { display:none; } .writing-card { gap:30px; } }
@media(max-width:620px) { .writings-index,.article-shell { padding-top:30px; } .writings-heading { display:block; margin-bottom:40px; } .writings-heading>p { margin-top:24px; } .writing-card { grid-template-columns:1fr; padding-block:28px; } .card-art { aspect-ratio:1.6; } .card-copy h2 { margin-block:18px; } .article-header { margin-top:34px; } .article-hero { aspect-ratio:1.5; margin-bottom:38px; } .article-body { font-size:16px; } .article-body>p:first-child { font-size:18px; } .writing-footer { flex-direction:column; } .article-meta { font-size:11px; gap:10px 18px; } }