nav .links a.on{color:var(--ink);background:var(--ash)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--faint);display:inline-block}.dot.on{background:var(--grn);box-shadow:0 0 0 3px #DCEFE3;animation:pulse 2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 5px #EAF5EE}}
.stkr{position:absolute;z-index:3;background:#fff;border:3px solid #fff;outline:1px solid var(--line2);border-radius:10px;padding:7px 12px;font:600 22px/1 'Caveat',cursive;color:var(--ink);box-shadow:0 10px 24px -10px rgba(28,26,22,.35);white-space:nowrap}
.sh{padding:96px 0 0}.sh .lab{margin-bottom:24px}
.sh h1{font-size:clamp(44px,6.4vw,80px);line-height:1.02;letter-spacing:-.03em;max-width:16ch}
.sh .lede{margin-top:24px;font-size:19px}
.sec.s2{padding-top:72px}
.h3s{font:500 13px/1 var(--mono);color:var(--muted);letter-spacing:.02em}
.rowh{display:flex;justify-content:space-between;align-items:center;padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:20px}
.rd{display:inline-flex;align-items:center;gap:8px;font-weight:500;font-size:14px;color:var(--ink)}
.cat{font:500 11.5px/1 var(--mono);color:var(--org);letter-spacing:.04em;text-transform:uppercase}
/* blog */
.feat{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);border:1px solid var(--line);border-radius:16px;background:#fff;overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--shadow-lg);transition:transform .2s}
.feat:hover{color:var(--ink);transform:translateY(-3px)}
.fvis{position:relative;background:radial-gradient(circle,var(--line2) 1px,transparent 1.2px) 0 0/22px 22px,#F6F4EF;border-right:1px solid var(--line);display:flex;align-items:center;justify-content:center;padding:56px 40px;min-height:380px}
.feed{width:100%;max-width:400px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-lg);transform:rotate(-1.5deg);transition:transform .3s}
.feat:hover .feed{transform:rotate(0)}
.fdh{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line);font:500 11.5px/1 var(--mono);color:var(--muted)}.fdh b{font-weight:500;color:var(--ink)}
.fdh span{display:flex;gap:8px;align-items:center;color:var(--grn)}
.fdr{display:grid;grid-template-columns:40px 18px minmax(0,1fr);gap:8px;align-items:baseline;padding:12px 16px;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--body)}
.fdr em{font:500 11px/1 var(--mono);font-style:normal;color:var(--faint)}.fdr i{font-style:normal;color:var(--grn);font-size:12px}.fdr b{color:var(--ink);font-weight:500}
.fdf{padding:11px 16px;font:500 11px/1.4 var(--mono);color:var(--muted);background:#FBFBF9;border-radius:0 0 12px 12px}
.stkr.fs{top:28px;left:28px;transform:rotate(-4deg);background:#FFF4D6;outline-color:#F0DFAE}
.ftx{padding:48px 44px;display:flex;flex-direction:column;gap:18px;justify-content:center}
.ftx h2{font-size:clamp(30px,3.4vw,42px);line-height:1.08}
.ftx p{color:var(--body);font-size:16.5px}
.meta{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--muted)}.meta img{width:28px;height:28px;border-radius:50%;object-fit:cover}.meta b{color:var(--ink);font-weight:500}
.tops{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.top{border:1px solid var(--line);border-radius:10px;padding:14px 14px 16px;background:#fff;display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--ink);min-height:112px}
.top em{font:500 11px/1 var(--mono);font-style:normal;color:var(--faint)}
.top b{font-weight:500;font-size:14.5px;margin-top:auto;line-height:1.25}
.top span{font-size:12px;color:var(--faint)}
.top.on{border-color:var(--ink);box-shadow:var(--shadow)}.top.on span{color:var(--grn)}.top.on:hover{color:var(--ink);background:var(--ash)}
.top:not(.on){background:transparent;border-style:dashed}.top:not(.on) b{color:var(--muted)}
.posts{display:grid}
.tf{display:flex;gap:6px;flex-wrap:wrap}.tf button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;font:500 13px/1 var(--sans);color:var(--muted);cursor:pointer}.tf button:hover{color:var(--ink);border-color:var(--line2)}.tf button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.rowh{gap:16px;flex-wrap:wrap}
.post{display:grid;grid-template-columns:240px minmax(0,1fr) auto;grid-template-areas:"th meta rd" "th body rd";gap:6px 28px;align-items:start;padding:28px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.post:hover{color:var(--ink)}.post:hover h3{color:var(--org)}
.pd{font:500 13px/1 var(--mono);color:var(--muted)}
.pth{grid-area:th;aspect-ratio:16/10;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:var(--ash);transition:transform .2s}.post:hover .pth{transform:translateY(-2px)}
.post .pd{grid-area:meta;display:inline}.post .cat{grid-area:meta;justify-self:start;margin-left:72px;line-height:13px}.post>div:not(.pth){grid-area:body;margin-top:8px}.post .pr{grid-area:rd;align-self:center}
.post h3{font:400 26px/1.15 var(--serif);letter-spacing:-.02em;transition:color .15s}
.post p{color:var(--muted);font-size:15px;margin-top:8px}
.pr{display:flex;gap:8px;align-items:center;font:500 12px/1 var(--mono);color:var(--muted);white-space:nowrap}
.band{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:56px 0;margin-bottom:120px}
.band .lede{margin-top:12px}
/* follow */
.fhg{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:64px;align-items:end}
.hs{position:relative;justify-self:end;width:100%;max-width:320px}
.hs img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:14px;border:1px solid var(--line);box-shadow:var(--shadow-lg);transform:rotate(2deg)}
.stkr.hs1{left:-24px;bottom:28px;transform:rotate(-4deg)}
.chs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden}
.chn{display:flex;flex-direction:column;gap:10px;padding:28px;border-left:1px solid var(--line);text-decoration:none;color:var(--ink);transition:background .15s;min-height:300px}
.chn:first-child{border-left:none}.chn:hover{background:#FBFBF9;color:var(--ink)}.chn:hover .rd{color:var(--org)}
.cht{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.cht img{width:36px;height:36px;border-radius:9px}
.fq2{font:500 11px/1 var(--mono);color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:5px 9px}
.chm{font:500 12px/1 var(--mono);color:var(--muted)}
.chn h3{font:400 30px/1.1 var(--serif);letter-spacing:-.02em}
.chn p{color:var(--body);font-size:15px}
.chn .rd{margin-top:auto;padding-top:20px}
/* affiliates */
.afg{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:64px;align-items:center}
.afg h1{font-size:clamp(40px,5.4vw,68px);max-width:18ch}
.afg .cta{display:flex;align-items:center;gap:16px;margin-top:32px;flex-wrap:wrap}
.wcard{position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-lg);transform:rotate(1.5deg)}
.wch{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);font-size:14px}.wch b{font-weight:500}
.wch span{display:flex;align-items:center;gap:8px;font:500 11.5px/1 var(--mono);color:var(--grn)}
.wcard ul{list-style:none}
.wcard li{display:flex;gap:12px;align-items:center;padding:16px 18px;border-bottom:1px solid var(--line);font:400 22px/1.1 var(--serif);letter-spacing:-.015em;animation:wk 5.6s var(--d) infinite}
.wcard li:last-child{border-bottom:none}
.wcard li i{width:22px;height:22px;border-radius:50%;background:#EAF5EE;color:var(--grn);font:600 11px/22px var(--sans);text-align:center;font-style:normal;flex:none}
@keyframes wk{0%,4%{background:transparent}8%,20%{background:#FBFAF6}30%,100%{background:transparent}}
.stkr.b8{left:-40px;bottom:-34px;white-space:normal;width:220px;font:400 13px/1.35 var(--sans);color:var(--body);padding:12px 14px;transform:rotate(-4deg);background:#FFF4D6;outline-color:#F0DFAE}
.stkr.b8 b{display:block;font:600 30px/1 'Caveat',cursive;color:var(--org);margin-bottom:4px}
.strip.af3{grid-template-columns:repeat(3,minmax(0,1fr))}
.vf{position:relative;display:block;max-width:1000px;margin:0 auto;aspect-ratio:16/9;border-radius:16px;border:1px solid var(--line);background:repeating-linear-gradient(135deg,#ECE9E3 0 12px,#F4F2EE 12px 24px);box-shadow:var(--shadow-lg)}
.vf .vlab{position:absolute;left:18px;top:16px;font:500 12px/1 var(--mono);color:var(--muted)}
.vf .vbig{position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;background:var(--ink);display:flex;align-items:center;justify-content:center}
.vf .vbig svg{width:30px;height:30px;fill:#fff;margin-left:4px}
.nums3,.perks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--ink)}
.perks{grid-template-columns:repeat(4,minmax(0,1fr))}
.nums3>div,.perks>div{padding:28px 28px 0 0;display:flex;flex-direction:column;gap:12px}
.nums3>div+div,.perks>div+div{padding-left:28px;border-left:1px solid var(--line)}
.nums3 em,.perks em{font:500 12px/1 var(--mono);font-style:normal;color:var(--org)}
.nums3 h3,.perks h3{font:400 26px/1.15 var(--serif);letter-spacing:-.02em}
.nums3 p,.perks p{color:var(--body);font-size:15px}
/* changelog */
.clg{display:grid;grid-template-columns:240px minmax(0,1fr);gap:64px;align-items:start}
.clr{position:sticky;top:88px;display:flex;flex-direction:column;gap:28px}
.clf{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;background:#fff;padding:4px}
.clf button{display:flex;justify-content:space-between;border:none;background:none;padding:9px 12px;border-radius:7px;font:500 14px/1 var(--sans);color:var(--muted);cursor:pointer}
.clf button em{font:500 11.5px/1 var(--mono);font-style:normal}
.clf button.on{background:var(--ink);color:#fff}
.cll .lab,.cld .lab{margin-bottom:10px}
.cll a{font-weight:500;font-size:15px;text-decoration:none}.cll a em{display:block;font:400 12.5px/1.6 var(--sans);font-style:normal;color:var(--muted)}
.cld{display:flex;flex-direction:column;gap:2px}
.cld a{font-size:14px;color:var(--body);text-decoration:none;padding:5px 0}.cld a:hover{color:var(--org)}
.cldy{display:grid;grid-template-columns:120px minmax(0,1fr);gap:32px;padding:32px 0;border-top:1px solid var(--line);scroll-margin-top:80px}
.cldy:first-child{border-top-color:var(--ink);padding-top:28px}
.cldt b{display:block;font:400 26px/1 var(--serif);letter-spacing:-.02em}
.cldt span{display:block;font:500 12px/1 var(--mono);color:var(--muted);margin-top:6px}
.cldt em{display:block;font:500 11px/1 var(--mono);font-style:normal;color:var(--faint);margin-top:14px}
.cldy ul{list-style:none;display:grid;gap:22px}
.cldy li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:16px;align-items:baseline}
.tg{font:500 11px/1 var(--mono);padding:4px 0;border-radius:4px;text-align:center;border:1px solid}
.tg.n{color:var(--org);border-color:#F6C8B6;background:#FEF3EE}
.tg.f{color:var(--muted);border-color:var(--line);background:var(--ash)}
.cldy h3{font-weight:500;font-size:16.5px;line-height:1.35}
.cldy p{color:var(--body);font-size:15px;margin-top:4px;max-width:68ch}
footer .g.g4{grid-template-columns:minmax(0,1.6fr) repeat(4,minmax(0,1fr))}
footer .soc{display:flex;gap:16px}
@media(max-width:960px){
.feat,.fhg,.afg,.clg{grid-template-columns:minmax(0,1fr)}
.fvis{border-right:none;border-bottom:1px solid var(--line);min-height:0;padding:56px 24px}
.ftx{padding:28px 24px 32px}
.tops{grid-template-columns:repeat(2,minmax(0,1fr))}
.post{grid-template-columns:180px minmax(0,1fr);grid-template-areas:"th meta" "th body" "th rd";gap:6px 20px}.post .pr{align-self:start}.pr{margin-top:6px}
.hs{justify-self:start;max-width:260px}
.chs{grid-template-columns:minmax(0,1fr)}.chn{border-left:none;border-top:1px solid var(--line);min-height:0}.chn:first-child{border-top:none}
.wcard{transform:none;margin-bottom:24px}.stkr.b8{left:auto;right:-6px}
.strip.af3{grid-template-columns:minmax(0,1fr)}.strip.af3>div{border-left:none;border-top:1px solid var(--line)}.strip.af3>div:first-child{border-top:none}
.nums3,.perks{grid-template-columns:minmax(0,1fr)}.nums3>div+div,.perks>div+div{padding-left:0;border-left:none;border-top:1px solid var(--line)}.nums3>div,.perks>div{padding-bottom:24px}
.clr{position:static}.cld{display:none}.clf{flex-direction:row}.clf button{flex:1;justify-content:center;gap:8px}
.cldy{grid-template-columns:minmax(0,1fr);gap:16px}
footer .g.g4{grid-template-columns:repeat(2,minmax(0,1fr))}
.band{margin-bottom:80px}
}

@media(max-width:600px){.post{grid-template-columns:112px minmax(0,1fr);gap:4px 14px}.post h3{font-size:19px}.post p{display:none}}
/* blog: topic links + free resources (SEO fixes, Oct 10) */
.cats{margin-top:20px;font:500 13px/1.4 var(--mono);color:var(--muted)}.cats a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:3px}.cats a:hover{color:var(--org)}
.frg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.fr{display:flex;flex-direction:column;gap:10px;padding:24px 24px 22px;border:1px solid var(--line);border-radius:14px;background:#fff;text-decoration:none;color:var(--ink);transition:border-color .15s,transform .15s}
.fr:hover{border-color:var(--ink);color:var(--ink);transform:translateY(-2px)}
.fr .frc{font:500 11.5px/1 var(--mono);color:var(--org);letter-spacing:.04em;text-transform:uppercase}
.fr h3{font:400 22px/1.2 var(--serif);letter-spacing:-.02em;color:var(--ink)}
.fr p{color:var(--muted);font-size:14.5px;line-height:1.5;flex:1}
.fr .fra{font:500 13px/1 var(--sans);color:var(--ink)}.fr:hover .fra{color:var(--org)}
.fr:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
@media(max-width:720px){.frg{grid-template-columns:1fr}.fr h3{font-size:20px}}