.blog-shell{min-height:100vh;padding-top:80px;position:relative;z-index:1}.blog-content-grid{max-width:1440px;width:100%;margin:0 auto;display:grid;grid-template-columns:260px minmax(0,1fr) 240px;gap:0;padding:0 20px}.blog-nav-rail{display:block;border-right:1px solid var(--color-border);background:color-mix(in srgb,var(--color-bg) 40%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.blog-nav-rail-sticky{position:sticky;top:80px;max-height:calc(100vh - 100px);overflow-y:auto;padding:var(--space-xl) var(--space-md) var(--space-lg) 0;scrollbar-width:none}.blog-nav-rail-sticky::-webkit-scrollbar{display:none}.blog-nav-back{display:block;font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--color-text-muted);text-decoration:none;padding:8px 12px;margin-bottom:12px;transition:color .2s ease}.blog-nav-back:hover{color:var(--color-accent)}.blog-nav-list{list-style:none;padding:0 12px;margin:0}.blog-nav-link{display:block;padding:6px 12px;margin:2px 0;font-family:var(--font-mono);font-size:12px;line-height:1.4;color:var(--color-text-muted);text-decoration:none;border-radius:6px;transition:all .2s var(--ease);border:1px solid transparent}.blog-nav-link:hover{color:var(--color-text-bright);background:#ffffff08}.blog-nav-link[aria-current=page]{color:var(--color-accent);background:var(--color-highlight-dim);border-color:var(--color-highlight-muted)}.blog-toc-rail{display:block;border-left:1px solid var(--color-border)}.blog-toc-rail-sticky{position:sticky;top:80px;max-height:calc(100vh - 100px);overflow-y:auto;padding:var(--space-xl) 0 var(--space-lg) var(--space-md);scrollbar-width:thin;scrollbar-color:var(--color-border-strong) transparent}.blog-toc-rail-sticky::-webkit-scrollbar{width:8px}.blog-toc-rail-sticky::-webkit-scrollbar-thumb{background:var(--color-border-strong);border-radius:999px}.blog-toc-rail-sticky::-webkit-scrollbar-track{background:transparent}.blog-toc-label{font-family:var(--font-display);font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--color-text-bright);margin-bottom:16px}.blog-toc-list{list-style:none;padding:0;margin:0}.blog-toc-list a{display:block;padding:4px 0;font-family:var(--font-mono);font-size:11px;color:var(--color-text-muted);text-decoration:none;transition:color .2s ease}.blog-toc-list a:hover{color:var(--color-accent)}.blog-toc-list a[data-active]{color:var(--color-accent);font-weight:600}.blog-main{min-width:0;padding:var(--space-xl) var(--space-2xl) var(--space-3xl);max-width:840px;width:100%;margin:0 auto}.blog-main--index{max-width:1100px;padding:var(--space-2xl) 20px var(--space-3xl)}.blog-hero-image{width:100%;height:auto;aspect-ratio:16 / 9;object-fit:cover;border-radius:12px;border:1px solid var(--color-border);margin-bottom:var(--space-xl);box-shadow:0 12px 40px #0000004d}.blog-article-header{margin-bottom:var(--space-2xl);padding-bottom:var(--space-lg);border-bottom:1px solid var(--color-border)}.blog-kicker{font-family:var(--font-mono);font-size:11px;color:var(--color-accent);letter-spacing:.15em;text-transform:uppercase;margin-bottom:16px}.blog-article-header h1{font-family:var(--font-display);font-size:clamp(32px,5vw,48px);font-weight:700;letter-spacing:-.02em;line-height:1.1;color:var(--color-text-bright)}.blog-meta{display:flex;align-items:center;gap:16px;margin-top:24px;font-family:var(--font-mono);font-size:12px;color:var(--color-text-muted)}.blog-index-header{margin-bottom:var(--space-2xl)}.blog-index-header h1{font-family:var(--font-display);font-size:clamp(40px,7vw,64px);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--color-text-bright)}.blog-featured{display:grid;grid-template-columns:1.4fr 1fr;text-decoration:none;border:1px solid var(--color-border);border-radius:16px;overflow:hidden;background:color-mix(in srgb,var(--color-surface) 30%,transparent);transition:all .3s var(--ease);margin-bottom:48px}.blog-featured:hover{border-color:var(--color-accent);background:color-mix(in srgb,var(--color-surface) 50%,transparent);box-shadow:0 16px 48px #0000004d}.blog-featured-image{width:100%;height:100%;object-fit:cover;display:block;min-height:280px}.blog-featured-body{display:flex;flex-direction:column;padding:36px 32px}.blog-featured-body h2{font-family:var(--font-display);font-size:24px;font-weight:700;color:var(--color-text-bright);line-height:1.2;margin-bottom:12px}.blog-featured-body p{font-size:15px;color:var(--color-text-muted);line-height:1.6}.blog-featured-meta{margin-top:auto;padding-top:24px}.blog-featured-meta time{font-family:var(--font-mono);font-size:11px;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em}.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.blog-grid-card{display:flex;flex-direction:column;text-decoration:none;border:1px solid var(--color-border);border-radius:12px;padding:28px 24px;background:color-mix(in srgb,var(--color-surface) 20%,transparent);transition:all .3s var(--ease)}.blog-grid-card:hover{border-color:var(--color-accent);background:color-mix(in srgb,var(--color-surface) 40%,transparent);transform:translateY(-3px);box-shadow:0 12px 32px #0000004d}.blog-grid-card-body{flex:1}.blog-grid-card h2{font-family:var(--font-display);font-size:18px;font-weight:600;color:var(--color-text-bright);line-height:1.3;margin-bottom:10px}.blog-grid-card p{font-size:14px;color:var(--color-text-muted);line-height:1.6}.blog-grid-card-footer{display:flex;align-items:center;justify-content:flex-end;padding-top:20px;margin-top:16px}.blog-grid-card-footer time{font-family:var(--font-mono);font-size:11px;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em}.blog-card-tags,.blog-tags{display:flex;flex-wrap:wrap;gap:6px}.blog-tag{font-family:var(--font-mono);font-size:11px;color:var(--color-text-muted);background:color-mix(in srgb,var(--color-surface) 50%,transparent);border:1px solid var(--color-border);border-radius:4px;padding:2px 8px;line-height:1.4}.blog-tags{margin-top:16px}.blog-share{display:flex;align-items:center;gap:12px;margin-top:32px;padding-top:24px;border-top:1px solid var(--color-border)}.blog-share-label{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.15em;color:var(--color-text-muted);margin-right:8px}.blog-share-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;background:color-mix(in srgb,var(--color-surface) 50%,transparent);backdrop-filter:blur(8px);border:1px solid var(--color-border-strong);color:var(--color-text-muted);transition:all .2s var(--ease);cursor:pointer}.blog-share-btn svg{width:18px;height:18px}.blog-share-btn:hover{border-color:var(--color-accent);color:var(--color-accent);background:var(--color-highlight-dim);transform:translateY(-2px);box-shadow:0 4px 12px #0003}.blog-share-btn.copied{color:var(--color-accent);border-color:var(--color-accent);background:var(--color-highlight-dim)}.blog-toc-inline{display:none;margin-bottom:48px;padding:24px;border:1px solid var(--color-border);border-radius:12px;background:color-mix(in srgb,var(--color-surface) 30%,transparent)}@media(max-width:1280px){.blog-content-grid{grid-template-columns:260px 1fr}.blog-toc-rail{display:none}.blog-toc-inline{display:block}}@media(max-width:1024px){.blog-content-grid{display:block}.blog-nav-rail{display:none}.blog-featured{grid-template-columns:1fr}.blog-featured-image{min-height:200px;max-height:300px}.blog-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.blog-main{padding:var(--space-xl) 20px}.blog-main--index{padding:var(--space-xl) 16px}.blog-grid{grid-template-columns:1fr}}