.blog-post{max-width:800px;margin:0 auto;padding:120px 24px;display:flex;flex-direction:column;gap:48px}.blog-post__header{display:flex;flex-direction:column;gap:20px;text-align:center;align-items:center}.blog-post__meta{display:flex;align-items:center;justify-content:center;gap:12px;font-size:var(--text-body-md)}.blog-post__date{color:var(--color-ink-mute)}.blog-post__category{color:var(--color-primary-deep);background:color-mix(in srgb,var(--color-primary) 15%,transparent);padding:4px 14px;border-radius:var(--radius-full);font-weight:600;font-size:var(--text-caption);letter-spacing:.05em;text-transform:uppercase}.blog-post__title{font-size:var(--text-display-lg);font-family:var(--font-display);font-weight:700;color:var(--color-ink);letter-spacing:-.04em;line-height:1.1;margin:0}.blog-post__desc{font-size:1.25rem;color:var(--color-ink-secondary);margin:0;line-height:1.6;max-width:600px}.blog-post__author{font-size:var(--text-body-md);font-weight:500;color:var(--color-ink);display:flex;align-items:center;gap:8px}.blog-post__author:before{content:"";display:block;width:32px;height:32px;background:linear-gradient(135deg,var(--color-primary),var(--color-accent-violet));border-radius:var(--radius-full)}.blog-post__tags{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:16px}.blog-post__tag{font-size:var(--text-caption);color:var(--color-ink-secondary);background:var(--color-canvas-soft);border:1px solid var(--color-hairline);padding:6px 14px;border-radius:var(--radius-full);transition:all .2s ease}.blog-post__tag:hover{border-color:var(--color-primary);background:var(--color-canvas)}.blog-post__content{font-size:1.125rem;color:var(--color-ink-secondary);line-height:1.8;font-family:var(--font-sans)}.blog-post__content h2,.blog-post__content h3,.blog-post__content h4{font-family:var(--font-display);color:var(--color-ink)}.blog-post__content h2{font-size:var(--text-display-md);font-weight:700;margin:64px 0 24px;letter-spacing:-.03em;line-height:1.3}.blog-post__content h3{font-size:var(--text-heading-lg);font-weight:600;margin:48px 0 20px;line-height:1.4}.blog-post__content h4{font-size:var(--text-heading-md);font-weight:600;margin:32px 0 16px}.blog-post__content p{margin:0 0 24px}.blog-post__content ul,.blog-post__content ol{margin:0 0 24px;padding-left:24px}.blog-post__content li{margin-bottom:12px;padding-left:8px}.blog-post__content li::marker{color:var(--color-primary)}.blog-post__content code{font-family:var(--font-mono);font-size:.9em;color:var(--color-accent-violet);background:color-mix(in srgb,var(--color-accent-violet) 8%,transparent);border-radius:var(--radius-sm);padding:3px 6px;word-break:break-word}.blog-post__content pre{margin:40px 0;padding:24px;background:#111;border-radius:var(--radius-xl);overflow-x:auto;box-shadow:0 20px 40px -12px #0003;border:1px solid rgba(255,255,255,.1);position:relative}.blog-post__content pre code{background:none;padding:0;font-size:.9em;color:#e2e8f0;line-height:1.7;display:block}.copy-code-btn{position:absolute;top:12px;right:12px;background:#ffffff14;color:#fffc;border:1px solid rgba(255,255,255,.15);border-radius:var(--radius-sm);padding:4px 10px;font-size:var(--text-micro);font-family:var(--font-sans);font-weight:500;cursor:pointer;transition:all .2s ease;z-index:10;opacity:0}.blog-post__content pre:hover .copy-code-btn,.copy-code-btn:focus-visible{opacity:1}.copy-code-btn:hover{background:#ffffff26;border-color:#ffffff4d;color:#fff}.copy-code-btn.copied{background:#3ecf8e26;border-color:#3ecf8e66;color:var(--color-primary);opacity:1}.blog-post__content a{color:var(--color-primary-deep);text-decoration:none;border-bottom:2px solid color-mix(in srgb,var(--color-primary) 30%,transparent);transition:all .2s ease}.blog-post__content a:hover{color:var(--color-primary);border-bottom-color:var(--color-primary)}.blog-post__content hr{border:none;border-top:1px solid var(--color-hairline);margin:48px 0}.blog-post__content strong{color:var(--color-ink);font-weight:600}.blog-post__content blockquote{margin:40px 0;padding:24px 32px;border-left:4px solid var(--color-primary);background:linear-gradient(90deg,color-mix(in srgb,var(--color-primary) 8%,transparent) 0%,transparent 100%);border-radius:0 var(--radius-lg) var(--radius-lg) 0;color:var(--color-ink-secondary);font-size:1.25rem;font-style:italic}.blog-post__content blockquote p:last-child{margin:0}.blog-post__content table{width:100%;border-collapse:separate;border-spacing:0;margin:40px 0;font-size:1rem;border:1px solid var(--color-hairline);border-radius:var(--radius-lg);overflow:hidden}.blog-post__content th{text-align:left;font-weight:600;color:var(--color-ink);background:var(--color-canvas-soft);padding:16px;border-bottom:1px solid var(--color-hairline)}.blog-post__content th:not(:last-child){border-right:1px solid var(--color-hairline)}.blog-post__content td{padding:16px;border-bottom:1px solid var(--color-hairline);color:var(--color-ink-secondary)}.blog-post__content td:not(:last-child){border-right:1px solid var(--color-hairline)}.blog-post__content tr:last-child td{border-bottom:none}.blog-post__content img{max-width:100%;height:auto;border-radius:var(--radius-xl);margin:48px 0;box-shadow:0 12px 32px #00000014;border:1px solid var(--color-hairline)}.blog-post__footer{display:flex;align-items:center;justify-content:space-between;padding-top:32px;border-top:1px solid var(--color-hairline);margin-top:32px}.blog-post__back{font-size:var(--text-body-md);font-weight:500;color:var(--color-ink-secondary);text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:color .2s ease}.blog-post__back:hover{color:var(--color-primary)}@media(max-width:768px){.blog-post{padding:64px 20px;gap:32px}.blog-post__title{font-size:var(--text-display-md)}.blog-post__desc{font-size:1.125rem}.blog-post__content{font-size:1rem}.blog-post__content pre{margin:32px -20px;border-radius:0;border-left:none;border-right:none}.blog-post__footer{flex-direction:column;gap:24px;align-items:stretch;text-align:center}}