/* Writing index and long-form reading layouts. Shared tokens live in site.css. */
.writing-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(ellipse at 90% 0,#4dd0c40a,transparent 65%)}.writing-hero .wrap{position:relative;display:grid;grid-template-columns:1fr 280px;align-items:end;gap:60px;padding-top:76px;padding-bottom:60px}.writing-hero h1{font-size:clamp(42px,5.5vw,70px);letter-spacing:-.065em;line-height:1.08;margin:22px 0 0;font-weight:800;max-width:740px}.writing-hero .intro{font-size:14px;color:var(--muted);line-height:1.8}.writing-hero .edition{font:10px var(--mono);color:var(--a1);letter-spacing:.09em;margin-top:24px}.writing-library{padding-top:36px;padding-bottom:80px}.library-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:30px}.filters{display:flex;flex-wrap:wrap;gap:8px}.filter{border:1px solid transparent;color:var(--muted);background:transparent;border-radius:30px;padding:8px 13px;font:500 11px var(--font);transition:color .2s,border-color .2s}.filter:hover{color:var(--ink);border-color:var(--line)}.filter[aria-pressed=true]{background:#4dd0c412;color:var(--a1);border-color:#4dd0c445}.filter span{margin-left:7px;opacity:.7;font:9px var(--mono)}.result-count{font:10px var(--mono);color:var(--muted);white-space:nowrap}.postlist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.post{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:linear-gradient(140deg,#141c2680,#10161e);color:var(--ink);transition:transform .25s,border-color .25s,box-shadow .25s}.post:hover{color:var(--ink);text-decoration:none;border-color:#4dd0c46b;transform:translateY(-4px);box-shadow:0 14px 40px #0003}.post-image{position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:#101820}.post-image img{display:block;width:100%;height:210px;object-fit:cover;transition:transform .5s}.post:hover .post-image img{transform:scale(1.035)}.post-index{position:absolute;top:16px;left:18px;font:9px var(--mono);letter-spacing:.12em;color:var(--muted)}.post-featured{grid-column:span 2}.post-featured .post-image img{object-fit:cover;object-position:center 51%}.post-featured .post-image::after{content:'START HERE';position:absolute;right:18px;top:16px;border:1px solid #4dd0c433;color:var(--a1);background:#0b0f14cc;border-radius:30px;padding:4px 9px;font:9px var(--mono);letter-spacing:.1em}.post-body{padding:24px;display:flex;flex-direction:column;flex:1}.post .k{font:9px var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--a2)}.post h2{font-size:22px;font-weight:650;line-height:1.3;letter-spacing:-.04em;margin:12px 0}.post-featured h2{font-size:29px;max-width:540px}.post p{font-size:13px;line-height:1.8;color:var(--muted);margin:0 0 22px}.post-bottom{display:flex;justify-content:space-between;gap:14px;align-items:end;margin-top:auto}.keywords{display:flex;flex-wrap:wrap;gap:6px}.keyword{border:1px solid var(--line);border-radius:5px;padding:3px 7px;font:9px var(--mono);color:var(--muted)}.read-time{font:9px var(--mono);color:var(--muted);white-space:nowrap}.post-arrow{color:var(--a1);font-size:17px;margin-left:8px}.reading-note{display:flex;justify-content:space-between;gap:24px;margin-top:42px;border-top:1px solid var(--line);padding-top:26px;font:11px/1.8 var(--mono);color:var(--muted)}
/* Article pages */
.article-page .hero{border-bottom:1px solid var(--line);background:radial-gradient(ellipse at 80% 20%,#4dd0c40a,transparent 70%)}.article-page .hero .wrap{max-width:1120px;padding-top:56px;padding-bottom:40px}.article-breadcrumb{display:inline-flex;color:var(--muted);font:10px var(--mono);margin-bottom:26px;gap:14px}.article-breadcrumb:hover{color:var(--a1);text-decoration:none}.article-page .kick{color:var(--a2)}.article-page h1{font-size:clamp(35px,4.5vw,58px);letter-spacing:-.055em;line-height:1.14;font-weight:750;margin:20px 0 22px;max-width:950px}.article-page .byline{font:11px var(--mono);line-height:1.8;color:var(--muted)}.article-page .article-meta{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.article-cover{max-width:1056px;margin:0 auto 12px;padding:0 32px}.article-cover img{display:block;width:100%;aspect-ratio:2.6;object-fit:cover;border:1px solid var(--line);border-radius:14px}.article-cover figcaption{padding:10px 0 0;color:var(--muted);font:9px var(--mono);letter-spacing:.06em}.article-layout{max-width:1120px;padding-top:50px;padding-bottom:36px;display:grid;grid-template-columns:205px minmax(0,720px);gap:56px;align-items:start}.article-toc{position:sticky;top:110px;border-top:1px solid var(--line);padding-top:20px;max-height:calc(100vh - 140px);overflow:auto}.toc-label{font:10px var(--mono);color:var(--a1);letter-spacing:.12em;text-transform:uppercase;margin:0 0 18px}.article-toc ol{list-style:none;margin:0;padding:0;counter-reset:toc}.article-toc li{margin-bottom:14px;counter-increment:toc}.article-toc a{display:flex;gap:9px;font-size:11px;line-height:1.6;color:var(--muted)}.article-toc a::before{content:counter(toc,decimal-leading-zero);font:9px var(--mono);color:var(--a2);padding-top:3px}.article-toc a:hover{color:var(--a1);text-decoration:none}.article-page article{font-size:16px;line-height:1.9;min-width:0}.article-page article h2{font-size:28px;letter-spacing:-.04em;line-height:1.25;margin:46px 0 18px}.article-page article h3{font-size:20px;letter-spacing:-.03em;line-height:1.4;margin:28px 0 12px}.article-page article p{margin:0 0 22px;color:#c4ceda}.article-page article .lede{font-size:20px;line-height:1.75;color:var(--ink);margin-bottom:30px}.article-page article ul,.article-page article ol{padding-left:22px;margin:0 0 24px;color:#c4ceda}.article-page article li{margin:9px 0}.article-page article strong{color:var(--ink)}.article-page article a:not(.back){text-decoration:underline;text-underline-offset:4px}.article-page blockquote{border-left:2px solid var(--a1);background:linear-gradient(100deg,#4dd0c40c,transparent);margin:32px 0;padding:22px 28px;font-size:20px;line-height:1.6;color:var(--ink);border-radius:0 12px 12px 0}.article-page .card{background:linear-gradient(140deg,#141c26,#10161e);border:1px solid var(--line);border-radius:14px;padding:24px;margin:24px 0}.article-page .card .k{font:10px var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--a2)}.article-page .card h3{margin:10px 0;font-size:20px}.article-page .card p:last-child{margin-bottom:0}.article-page .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:24px}.article-page .two .col{background:#111820;border:1px solid var(--line);border-radius:12px;padding:20px}.article-page .two h4{font-size:14px;margin:0 0 12px}.article-page .two .bad h4{color:var(--warm)}.article-page .two .good h4{color:var(--a1)}.article-page .two p{font-size:13px;line-height:1.85;margin-bottom:0}.article-page .back{display:inline-flex;border:1px solid var(--line);padding:10px 16px;border-radius:7px;margin:20px 0;font-size:12px}.article-page .back:hover{border-color:var(--a1);text-decoration:none}.article-page .demolink{font-weight:600}.article-page pre{overflow:auto;border:1px solid var(--line);border-radius:10px;background:#080c11;padding:20px;font:12px/1.8 var(--mono)}.article-page code{font-size:.85em;overflow-wrap:anywhere}.related{padding:48px 0 72px;border-top:1px solid var(--line)}.related-heading{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:26px}.related-heading h2{margin:0;font-size:28px;letter-spacing:-.04em}.related-heading a{font-size:12px}.related .postlist{grid-template-columns:repeat(2,minmax(0,1fr))}.related .post-image img{height:210px}.reading-progress{height:2px;position:fixed;top:0;left:0;z-index:80;width:0;background:linear-gradient(90deg,var(--a1),var(--a2));pointer-events:none}
@media(max-width:1000px){.writing-hero .wrap{grid-template-columns:1fr 230px;gap:30px}.postlist{gap:18px}.post-body{padding:20px}.post h2{font-size:20px}.post-featured h2{font-size:25px}.post-bottom{align-items:start;flex-direction:column;gap:14px}.article-layout{grid-template-columns:170px minmax(0,1fr);gap:32px}}
@media(max-width:820px){.writing-hero .wrap{grid-template-columns:1fr;padding-top:54px;padding-bottom:40px;gap:18px}.writing-hero .intro{max-width:540px}.writing-hero .edition{margin-top:12px}.postlist{grid-template-columns:repeat(2,minmax(0,1fr))}.post-featured{grid-column:auto}.post-featured h2{font-size:22px}.library-toolbar{align-items:start;flex-direction:column;gap:16px}.article-layout{grid-template-columns:1fr;gap:32px;padding-top:32px}.article-toc{position:static;max-height:none;border-bottom:1px solid var(--line);padding-bottom:8px}.article-toc ol{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.article-cover img{aspect-ratio:2}.article-page h1{font-size:42px}.article-page .hero .wrap{padding-top:38px}.reading-note{flex-direction:column;gap:10px}.post-image img{height:auto;aspect-ratio:1.65}}
@media(max-width:540px){.writing-hero h1{font-size:43px}.writing-hero .wrap{padding-top:44px}.writing-library{padding-top:24px;padding-bottom:48px}.filters{gap:6px}.filter{padding:8px 10px;font-size:10px;border-color:var(--line)}.filter span{margin-left:4px}.postlist,.related .postlist{grid-template-columns:1fr}.post-body{padding:24px}.post h2,.post-featured h2{font-size:24px}.post p{font-size:14px}.post-bottom{flex-direction:row;align-items:center}.post-image img{aspect-ratio:1.7}.article-page h1{font-size:35px}.article-cover{padding:0 22px}.article-cover img{aspect-ratio:1.6}.article-cover figcaption{font-size:8px}.article-toc ol{grid-template-columns:1fr}.article-page article{font-size:15px;line-height:1.9}.article-page article .lede{font-size:18px}.article-page article h2{font-size:25px}.article-page blockquote{padding:20px;font-size:18px}.article-page .two{grid-template-columns:1fr}.article-page .article-meta{gap:10px}.related{padding:36px 0 50px}.related-heading h2{font-size:24px}.related-heading a{font-size:11px}}

@media(max-width:540px){.filter{min-height:40px}.post-bottom{flex-wrap:wrap}}
