.blog-shell{--bg:#fcfbfa;--ink:#0b0a0f;--muted:#5b5762;--line:#0b0a0f1a;--brand:#7c3aed;--brand-400:#8b5cf6;background:var(--bg);min-height:100vh;color:var(--ink)}.blog-nav,.blog-foot{border-bottom:1px solid var(--line)}.blog-foot{border-top:1px solid var(--line);border-bottom:none;margin-top:5rem}.blog-nav-inner,.blog-foot-inner{justify-content:space-between;align-items:center;gap:1.5rem;max-width:72rem;margin:0 auto;padding:1rem 1.5rem;display:flex}.blog-foot-inner{flex-wrap:wrap;padding:2.5rem 1.5rem}.blog-nav-links{gap:1.5rem;font-size:.9rem;font-weight:600;display:flex}@media (max-width:640px){.blog-nav-links{display:none}}.blog-nav-links a:hover{color:var(--brand)}.blog-btn{background:var(--brand);color:#fff;border-radius:999px;align-items:center;gap:.4rem;padding:.7rem 1.4rem;font-weight:700;display:inline-flex;box-shadow:0 12px 30px -12px #7c3aedbf}.blog-btn:hover{background:var(--brand-400)}.blog-hero{max-width:72rem;margin:0 auto;padding:4rem 1.5rem 1.5rem}.blog-kicker{font-family:var(--font-mono), monospace;text-transform:uppercase;letter-spacing:.16em;color:var(--brand);background:#7c3aed14;border:1px solid #7c3aed33;border-radius:999px;align-items:center;gap:.5rem;padding:.45rem .95rem;font-size:.72rem;font-weight:700;display:inline-flex}.blog-hero h1{font-family:var(--font-soft), system-ui, sans-serif;letter-spacing:-.025em;max-width:18ch;margin:1.4rem 0 .7rem;font-size:clamp(2.5rem,6vw,4rem);font-weight:800;line-height:1.02}.blog-hero h1 .accent{color:var(--brand)}.blog-hero-sub{color:var(--muted);max-width:38rem;font-size:1.05rem}.category-filter{flex-wrap:wrap;gap:.5rem;max-width:72rem;margin:0 auto;padding:.5rem 1.5rem 0;display:flex}.category-pill{border:2px solid var(--line);color:var(--muted);background:#fff;border-radius:999px;padding:.45rem 1rem;font-size:.8rem;font-weight:700;transition:all .2s}.category-pill:hover{border-color:#0b0a0f4d}.category-pill.is-active{background:var(--brand);border-color:var(--brand);color:#fff}.post-grid{grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:1.5rem;max-width:72rem;margin:0 auto;padding:2rem 1.5rem;display:grid}.blog-empty{max-width:72rem;color:var(--muted);margin:0 auto;padding:3rem 1.5rem}.post-card{border:2px solid var(--line);background:#fff;border-radius:1.5rem;flex-direction:column;transition:transform .2s,box-shadow .2s;display:flex;overflow:hidden}.post-card:hover{transform:translateY(-4px);box-shadow:0 22px 50px -24px #0b0a0f66}.post-card-media,.post-card-placeholder{aspect-ratio:16/9;background:linear-gradient(135deg,#ede9fe,#f5f3ff);display:block}.post-card-media img{object-fit:cover;width:100%;height:100%}.post-card-body{flex-direction:column;flex:1;gap:.5rem;padding:1.25rem 1.4rem 1.5rem;display:flex}.post-card-category{text-transform:uppercase;letter-spacing:.08em;color:var(--brand);font-size:.72rem;font-weight:800}.post-card-body h2{font-family:var(--font-soft), system-ui, sans-serif;letter-spacing:-.01em;font-size:1.3rem;font-weight:800;line-height:1.2}.post-card-body h2 a:hover{color:var(--brand)}.post-card-excerpt{color:var(--muted);flex:1;font-size:.95rem}.post-card-meta{color:var(--muted);margin-top:.25rem;font-size:.8rem}.blog-pagination{justify-content:space-between;align-items:center;gap:1rem;max-width:72rem;margin:0 auto;padding:0 1.5rem 4rem;font-weight:700;display:flex}.blog-pagination a:hover{color:var(--brand)}.blog-page-count{color:var(--muted);font-weight:600}
.post-page{max-width:66rem;margin:0 auto;padding:2.5rem 1.5rem 1rem}.post-breadcrumb{color:var(--muted);margin-bottom:1.5rem;font-size:.8rem}.post-breadcrumb a:hover{color:var(--brand)}.post-hero-tag{text-transform:uppercase;letter-spacing:.08em;color:var(--brand);margin-bottom:.75rem;font-size:.72rem;font-weight:800;display:inline-block}.post-page h1{font-family:var(--font-soft), system-ui, sans-serif;letter-spacing:-.02em;font-size:clamp(2rem,4.5vw,3rem);font-weight:800;line-height:1.1}.post-meta{color:var(--muted);flex-wrap:wrap;align-items:center;gap:.6rem;margin-top:1rem;font-size:.9rem;display:flex}.post-meta-dot{background:currentColor;border-radius:999px;width:3px;height:3px}.post-cover{border:1px solid var(--line);border-radius:1.25rem;margin:1.75rem 0 0;overflow:hidden}.post-cover img{width:100%;height:auto;display:block}.post-layout{margin-top:2rem}.post-main{min-width:0}.post-rail{display:none}@media (min-width:1024px){.post-layout{grid-template-columns:minmax(0,1fr) 14rem;align-items:start;gap:3rem;display:grid}.post-rail{display:block;position:sticky;top:6rem}}.post-body{color:#221f29;font-size:1.06rem;line-height:1.75}.post-body>*+*{margin-top:1.1rem}.post-body h2{font-family:var(--font-soft), system-ui, sans-serif;letter-spacing:-.01em;margin-top:2.5rem;scroll-margin-top:5rem;font-size:1.6rem;font-weight:800}.post-body h3{font-family:var(--font-soft), system-ui, sans-serif;margin-top:1.75rem;scroll-margin-top:5rem;font-size:1.25rem;font-weight:700}.post-body a{color:var(--brand);text-underline-offset:2px;text-decoration:underline}.post-body ul,.post-body ol{padding-left:1.4rem}.post-body li+li{margin-top:.35rem}.post-body img{border-radius:.9rem;max-width:100%;height:auto}.post-body code{color:#5b21b6;background:#7c3aed1a;border-radius:.4em;padding:.15em .4em;font-size:.9em}.post-body pre{color:#ededed;background:#0b0a0f;border-radius:.9rem;padding:1rem 1.2rem;overflow-x:auto}.post-body pre code{color:inherit;background:0 0;padding:0}.post-body blockquote{border-left:3px solid var(--brand);color:var(--muted);padding:.4rem 0 .4rem 1.1rem;font-style:italic}.post-body .post-callout{border:1px solid var(--line);border-left:4px solid var(--brand);color:#221f29;background:#7c3aed0d;border-radius:1rem;padding:1rem 1.25rem;font-style:normal}.post-body .post-callout.is-warning{background:#f59e0b17;border-left-color:#f59e0b}.post-body .post-callout.is-tip,.post-body .post-callout.is-fast{border-left-color:var(--brand-400);background:#8b5cf60f}.post-body .post-callout>:first-child{margin-top:0}.post-body .post-callout>:last-child{margin-bottom:0}.post-table-wrap{overflow-x:auto}.post-body table{border-collapse:collapse;width:100%;font-size:.95rem}.post-body th,.post-body td{border:1px solid var(--line);text-align:left;padding:.6rem .8rem}.post-body hr{border:none;border-top:1px solid var(--line)}.post-cta{text-align:center;background:var(--brand);color:#fff;border-radius:1.5rem;max-width:66rem;margin:3rem auto 0;padding:2.25rem 1.5rem}.post-cta h2{font-family:var(--font-soft), system-ui, sans-serif;font-size:1.6rem;font-weight:800}.post-cta p{opacity:.9;margin:.5rem 0 1.25rem}.post-cta .blog-btn{color:var(--brand);background:#fff}
.post-toc{border:1px solid color-mix(in srgb, var(--brand) 16%, var(--line));background:color-mix(in srgb, var(--brand) 4%, #fff);border-radius:18px;margin:1.75rem 0;padding:1.1rem 1.4rem}.post-toc-summary{text-transform:uppercase;letter-spacing:.09em;color:var(--brand);justify-content:space-between;align-items:center;gap:.5rem;margin:0;font-size:.72rem;font-weight:800;display:flex}.post-toc--inline>summary{cursor:pointer;list-style:none}.post-toc--inline>summary::-webkit-details-marker{display:none}.post-toc-chevron{color:var(--muted);flex:none;transition:transform .2s}.post-toc--inline[open] .post-toc-chevron{transform:rotate(180deg)}.post-toc-list{counter-reset:toc;flex-direction:column;gap:.5rem;margin:.85rem 0 0;padding:0;list-style:none;display:flex}.post-toc-list li{align-items:baseline;gap:.65rem;display:flex}.post-toc-list li:before{counter-increment:toc;content:counter(toc, decimal-leading-zero);font-variant-numeric:tabular-nums;min-width:1.4em;color:var(--brand);opacity:.75;flex:none;font-size:.72rem;font-weight:800}.post-toc-list a{color:var(--ink);font-size:.92rem;font-weight:600;line-height:1.4;transition:color .15s}.post-toc-list a:hover{color:var(--brand)}.post-toc--rail{margin:0;padding:1rem 1.15rem}.post-toc--rail .post-toc-list a{color:var(--muted);font-size:.85rem}.post-toc--rail .post-toc-list a:hover{color:var(--brand)}@media (min-width:1024px){.post-toc--inline{display:none}}
