:root{--bg:#fff;--fg:#15171a;--muted:#6b7280;--line:#e5e7eb;--accent:#1e9e5a;--code:#f4f5f7;--card:#fff}@media (prefers-color-scheme:dark){:root{--bg:#131416;--fg:#e8e8e8;--muted:#9aa0a6;--line:#2a2c30;--accent:#3ccf7d;--code:#1d1f22;--card:#18191c}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--fg);margin:0;font:17px/1.65 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}a{color:inherit}a:hover{color:var(--accent)}.wrap{max-width:1100px;margin:0 auto;padding:0 20px}.site-header{border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(8px);z-index:5;position:sticky;top:0}.bar{justify-content:space-between;align-items:center;gap:16px;height:60px;display:flex}.brand{letter-spacing:-.02em;font-size:1.25rem;font-weight:800;text-decoration:none}.bar nav{gap:18px;font-size:.9rem;font-weight:600;display:flex}.bar nav a{text-decoration:none}.intro{max-width:720px;padding:48px 0 24px}.intro h1{letter-spacing:-.03em;margin:0 0 8px;font-size:2.4rem;line-height:1.15}.intro p{color:var(--muted);margin:0}.intro a{color:var(--accent);text-decoration:none}.grid{grid-template-columns:repeat(3,1fr);gap:28px;padding:16px 0 56px;display:grid}.card{background:var(--card);flex-direction:column;display:flex}.card.big{grid-column:1/-1;grid-template-columns:3fr 2fr;align-items:center;gap:28px;display:grid}.thumb{aspect-ratio:16/9;background:var(--code);border-radius:6px;display:block;position:relative;overflow:hidden}.thumb img{object-fit:cover;width:100%;height:100%;transition:transform .3s}.thumb:hover img{transform:scale(1.03)}.badge{color:#fff;text-transform:uppercase;letter-spacing:.04em;background:#1a237e;border-radius:3px;padding:3px 7px;font-size:.65rem;font-weight:700;position:absolute;top:10px;right:10px}.card h2{letter-spacing:-.01em;margin:12px 0 6px;font-size:1.15rem;line-height:1.3}.card.big h2{margin-top:0;font-size:2rem}.card h2 a{text-decoration:none}.excerpt{color:var(--muted);-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0 0 8px;font-family:Georgia,serif;font-size:.95rem;display:-webkit-box;overflow:hidden}.meta{color:var(--muted);margin:0;font-size:.8rem}.meta a{color:inherit}.post{max-width:740px;margin:0 auto;padding:40px 0 16px}.post-head h1{letter-spacing:-.03em;margin:6px 0 12px;font-size:2.5rem;line-height:1.15}.tags{flex-wrap:wrap;gap:10px;margin:0;display:flex}.tags a{color:var(--accent);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:700;text-decoration:none}.feature{margin:28px 0}.feature img{border-radius:6px;width:100%}.content{overflow-wrap:break-word;font-family:Georgia,Times New Roman,serif;font-size:1.12rem;line-height:1.75}.content h2,.content h3,.content h4{margin:2em 0 .6em;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.3}.content a{color:var(--accent)}.content img{border-radius:4px;max-width:100%;height:auto}.content figure{margin:1.8em 0}.content figcaption{color:var(--muted);text-align:center;margin-top:8px;font-family:system-ui,sans-serif;font-size:.85rem}.content iframe{aspect-ratio:16/9;border:0;width:100%;max-width:100%;height:auto}.content pre{background:var(--code);border-radius:6px;padding:16px;font-size:.85rem;line-height:1.5;overflow-x:auto}.content code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.88em}.content :not(pre)>code{background:var(--code);border-radius:3px;padding:1px 5px}.content blockquote{border-left:3px solid var(--accent);color:var(--muted);margin:1.5em 0;padding:.2em 1.2em}.content hr{border:0;border-top:1px solid var(--line);margin:2.5em 0}.author-box{border-top:1px solid var(--line);max-width:740px;color:var(--muted);margin:24px auto;padding:18px 0;font-size:.95rem}.author-box a{color:var(--accent)}.prevnext{justify-content:space-between;gap:20px;max-width:740px;margin:0 auto 56px;font-size:.95rem;font-weight:600;display:flex}.prevnext a{text-decoration:none}.site-footer{border-top:1px solid var(--line);color:var(--muted);padding:28px 0;font-size:.85rem}.site-footer p{margin:4px 0}.site-footer a{color:inherit}@media (width<=860px){.grid{grid-template-columns:1fr 1fr}.card.big{grid-template-columns:1fr}}@media (width<=560px){.grid{grid-template-columns:1fr}.post-head h1{font-size:1.9rem}.intro h1{font-size:2rem}.bar nav{gap:12px;font-size:.8rem}}
