.blog-hero{text-align:left;padding:calc(var(--header-clearance) + var(--header-gap)) 0 3rem;max-width:900px;margin:0 auto}.blog-hero .section-tag{font-family:var(--font-mono);font-size:.78rem;color:#c084fc;letter-spacing:.02em;margin-bottom:1rem;display:block}.blog-hero h1{font-size:clamp(2rem,4vw,3rem);font-weight:700;margin-bottom:.25rem}.blog-hero .hero-sub{font-size:.95rem;color:var(--text-secondary);max-width:800px;line-height:1.7}:root{--blog-card-media: 340px;--blog-card-gap: 24px;--blog-card-text: 576px;--blog-cover-ratio: 1200 / 630;--blog-notch: 14px;--blog-notch-inner: calc(var(--blog-notch) - 1.415px)}.blog-list{display:flex;flex-direction:column;gap:2rem;padding-bottom:12rem;max-width:calc(var(--blog-card-media) + var(--blog-card-gap) + var(--blog-card-text));margin:0 auto}.blog-card{display:flex;flex-direction:row;gap:var(--blog-card-gap);text-decoration:none}.blog-card:hover{text-decoration:none}.blog-card-media{width:var(--blog-card-media);flex-shrink:0;padding:1px;background:var(--border-color);clip-path:polygon(0 0,calc(100% - var(--blog-notch)) 0,100% var(--blog-notch),100% 100%,0 100%);transition:filter .2s}.blog-card-image,.blog-card-image-placeholder{display:block;width:100%;aspect-ratio:var(--blog-cover-ratio);object-fit:cover;clip-path:polygon(0 0,calc(100% - var(--blog-notch-inner)) 0,100% var(--blog-notch-inner),100% 100%,0 100%)}.blog-card-image-placeholder{background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center}.blog-card-image-placeholder svg{width:40px;height:40px;color:var(--text-tertiary);opacity:.3}.blog-card-body{min-width:0;flex:1;align-self:center}.blog-card-date{display:block;font-family:var(--font-mono);font-size:.72rem;color:var(--text-tertiary);letter-spacing:.02em;margin-bottom:.6rem}.blog-card-title{font-family:var(--font-main);font-size:1.375rem;font-weight:500;color:var(--text-color);line-height:1.3;margin-bottom:.5rem;transition:color .2s}.blog-card-desc{font-size:.95rem;color:var(--text-secondary);line-height:1.6}.blog-card-title,.blog-card-desc{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}.blog-card:hover .blog-card-title{color:#c084fc}.blog-card:hover .blog-card-media{filter:brightness(1.08)}.blog-empty{text-align:center;padding:4rem 0 6rem;color:var(--text-tertiary);font-size:.9rem}:root{--article-measure: 760px;--article-body-size: 1.03125rem;--article-media-width: 860px;--header-clearance: 56px;--header-gap: 1.5rem}.article-header{max-width:var(--article-measure);margin:0 auto;padding:calc(var(--header-clearance) + var(--header-gap)) 0 2rem}.article-breadcrumb{font-family:var(--font-mono);font-size:.75rem;color:var(--text-tertiary);margin-bottom:1.5rem;display:flex;align-items:center;gap:.4rem}.article-breadcrumb a{color:#c084fc;text-decoration:none}.article-breadcrumb a:hover{text-decoration:underline}.article-breadcrumb .sep{color:var(--text-tertiary);opacity:.5}.article-tags{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1rem}.article-tag{font-family:var(--font-mono);font-size:.65rem;color:#c084fc;background:#c084fc14;padding:.15rem .5rem;clip-path:polygon(0 0,calc(100% - 5px) 0,100% 5px,100% 100%,5px 100%,0 calc(100% - 5px))}.article-title{font-size:clamp(1.75rem,3.5vw,2.5rem);font-weight:700;line-height:1.25;margin-bottom:1rem}.article-description{font-size:var(--article-body-size);color:var(--text-secondary);line-height:1.7;margin-bottom:1.5rem}.article-meta{display:flex;align-items:center;gap:.75rem;padding-top:1.5rem;border-top:1px solid var(--border-color)}.article-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover}.article-meta-text{display:flex;flex-direction:column}.article-author-name{font-size:.85rem;color:var(--text-color);font-weight:500}.article-date{font-family:var(--font-mono);font-size:.72rem;color:var(--text-tertiary);letter-spacing:.02em}.article-cover{max-width:var(--article-media-width);margin:0 auto 2.5rem}.article-cover img{width:100%;display:block;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}.article-content{max-width:var(--article-measure);margin:0 auto;padding-bottom:4rem;overflow-wrap:break-word;word-break:break-word;font-size:var(--article-body-size);line-height:1.75;color:var(--text-color);letter-spacing:normal}.article-content h2{font-size:1.4rem;font-weight:700;margin-top:2.5rem;margin-bottom:1rem;line-height:1.3}.article-content h3{font-family:var(--font-main);font-size:1.15rem;font-weight:700;margin-top:2rem;margin-bottom:.75rem;line-height:1.35}.article-content p{font-size:var(--article-body-size);line-height:1.75;color:var(--text-color);margin-bottom:1.25rem}.article-content a{color:#c084fc;text-decoration:underline;text-underline-offset:2px}.article-content a:hover{color:var(--text-color)}.article-content ul,.article-content ol{padding-left:1.5rem;margin-bottom:1.25rem}.article-content li{font-size:var(--article-body-size);line-height:1.75;color:var(--text-color);margin-bottom:.35rem}.article-content strong{color:var(--text-color);font-weight:600}.article-content blockquote{border-left:3px solid #c084fc;padding:.75rem 1.25rem;margin:1.5rem auto;background:var(--bg-secondary)}.article-content blockquote p{color:var(--text-color);margin-bottom:0}.article-content .code-block{background:var(--bg-tertiary);overflow-x:auto;margin:1.5rem 0;filter:drop-shadow(0 0 1px rgba(192,132,252,.15))}.article-content .code-block,.article-content .code-block pre,.article-content>pre,.article-content table{scrollbar-width:thin;scrollbar-color:rgba(192,132,252,.8) var(--scrollbar-track)}.article-content .code-block::-webkit-scrollbar,.article-content .code-block pre::-webkit-scrollbar,.article-content>pre::-webkit-scrollbar,.article-content table::-webkit-scrollbar{width:12px;height:14px}.article-content .code-block::-webkit-scrollbar-track,.article-content .code-block pre::-webkit-scrollbar-track,.article-content>pre::-webkit-scrollbar-track,.article-content table::-webkit-scrollbar-track{background:linear-gradient(90deg,rgba(12,5,34,.2),var(--scrollbar-track) 18%,var(--scrollbar-track) 82%,rgba(12,5,34,.2));border-top:1px solid var(--scrollbar-track-edge)}.article-content .code-block::-webkit-scrollbar-thumb,.article-content .code-block pre::-webkit-scrollbar-thumb,.article-content>pre::-webkit-scrollbar-thumb,.article-content table::-webkit-scrollbar-thumb{background:linear-gradient(90deg,var(--scrollbar-thumb-start),var(--scrollbar-thumb-end));border:3px solid var(--scrollbar-track);border-radius:999px;box-shadow:0 0 0 1px #ffffff0d,0 0 18px #483df82e}.article-content .code-block::-webkit-scrollbar-thumb:hover,.article-content .code-block pre::-webkit-scrollbar-thumb:hover,.article-content>pre::-webkit-scrollbar-thumb:hover,.article-content table::-webkit-scrollbar-thumb:hover{background:linear-gradient(90deg,var(--scrollbar-thumb-hover-start),var(--scrollbar-thumb-hover-end))}.article-content .code-block::-webkit-scrollbar-corner,.article-content .code-block pre::-webkit-scrollbar-corner,.article-content>pre::-webkit-scrollbar-corner,.article-content table::-webkit-scrollbar-corner{background:transparent}.article-content .code-block-header{padding:.5rem 1.5rem;background:#ffffff08;border-bottom:1px solid rgba(255,255,255,.05);display:flex;align-items:center;justify-content:space-between}.article-content .code-block-lang{font-family:var(--font-mono);font-size:.7rem;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.05em}.article-content .code-block pre{margin:0;padding:1.25rem 1.5rem;clip-path:none;background:none;overflow-x:auto;font-family:var(--font-mono);font-size:.875rem;line-height:1.7}.article-content>pre{background:var(--bg-tertiary);padding:1.25rem 1.5rem;margin:1.5rem 0;overflow-x:auto;font-family:var(--font-mono);font-size:.875rem;line-height:1.65;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}.article-content code{font-family:var(--font-mono);font-size:.9em;background:var(--bg-tertiary);padding:.15rem .4rem;border-radius:var(--radius-sm)}.article-content pre code{background:none;padding:0;font-size:inherit}.article-content .t-key{color:#ddd0ff}.article-content .t-str{color:#4ade80}.article-content .t-num{color:#fbbf24}.article-content .t-bool{color:#fb7dbe}.article-content .t-comment{color:#9990b0}.article-content .t-brace,.article-content .t-punct{color:#8a8499}.article-content .t-keyword{color:#c084fc}.article-content img{max-width:100%;display:block;margin:1.5rem 0;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}.article-content .blog-stream-video{position:relative;width:100%;aspect-ratio:16 / 9;margin:1.5rem 0;overflow:hidden;background:var(--bg-tertiary);clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}.article-content .blog-stream-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.article-content .image-placeholder{width:100%;aspect-ratio:16 / 9;background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;margin:1.5rem 0;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);color:var(--text-tertiary);font-family:var(--font-mono);font-size:.78rem}.article-content table{width:100%;border-collapse:collapse;margin:1.5rem 0;font-size:.875rem;background:var(--bg-tertiary);filter:drop-shadow(0 0 1px rgba(192,132,252,.15))}.article-content th{text-align:left;padding:.6rem .75rem;background:#ffffff08;border-bottom:1px solid rgba(255,255,255,.05);color:var(--text-tertiary);font-family:var(--font-mono);font-size:.7rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em}.article-content td{padding:.5rem .75rem;border-bottom:1px solid rgba(255,255,255,.05);color:var(--text-color)}.article-content hr{border:none;height:1px;background:var(--border-color);margin:2rem auto}.article-content>img,.article-content>figure,.article-content>.image-placeholder,.article-content>.blog-stream-video,.article-content>.code-block,.article-content>pre,.article-content>table{width:var(--article-media-width);max-width:var(--article-media-width);margin-inline:calc((var(--article-measure) - var(--article-media-width)) / 2)}@media(max-width:924px){.article-content>img,.article-content>figure,.article-content>.image-placeholder,.article-content>.blog-stream-video,.article-content>.code-block,.article-content>pre,.article-content>table{width:100%;max-width:100%;margin-inline:0}}.section-cta{text-align:center;padding:8rem 0;position:relative;overflow:hidden;background:transparent}.cta-texture{position:absolute;inset:0;background:url(/gears.png) center center / cover no-repeat;background:image-set(url(/gears.avif) type("image/avif"),url(/gears.png) type("image/png")) center center / cover no-repeat;background-attachment:fixed;filter:brightness(.2) saturate(.6);opacity:.35;pointer-events:none}.cta-inner{position:relative;z-index:1}.cta-headline{font-size:clamp(2rem,4vw,3.2rem);font-weight:700;letter-spacing:0;line-height:1.15;margin-bottom:1rem}.cta-sub{font-size:1.0625rem;color:var(--text-secondary);max-width:460px;margin:0 auto 2rem;line-height:1.7}.cta-actions{display:flex;align-items:center;justify-content:center;gap:.75rem}.btn-hero{padding:.75rem 1.75rem;font-size:.9rem;font-family:var(--font-mono);font-weight:500;letter-spacing:-.02em}.btn-outline{display:inline-block;padding:.75rem 1.75rem;color:#ffffffe6;text-decoration:none;clip-path:var(--clip-corner-btn);filter:drop-shadow(0 0 1px rgba(255,255,255,.28));font-family:var(--font-mono);font-weight:500;font-size:.9rem;letter-spacing:-.02em;transition:all .15s;background:#ffffff0f}.btn-outline:hover{color:#fff;background:#ffffff1a;filter:drop-shadow(0 0 1px rgba(255,255,255,.45));text-decoration:none}@media(max-width:768px){.blog-card{flex-direction:column}.blog-card-media{width:100%}.article-header,.article-cover,.article-content{padding-left:0;padding-right:0;max-width:100%}.article-content p,.article-content li{line-height:1.8}.article-content h2{font-size:1.35rem}.article-content h3{font-size:1.1rem}.article-content>pre,.article-content .code-block pre{font-size:.78rem}.article-content code{font-size:.9em}.article-content table{font-size:.8rem;display:block;overflow-x:auto}.article-content .code-block{margin-left:-12px;margin-right:-12px}}@media(max-width:640px){:root{--header-gap: 1rem}.blog-hero{padding-bottom:2rem}.section-cta{padding:4rem 0}.cta-actions{flex-direction:column}.article-header{padding-bottom:1.5rem}}
