.blog-shell{padding-bottom:clamp(60px,9vw,120px)}.blog-head,.blog-tools,.blog-count,.blog-grid,.blog-pager,.blog-state,.blog-related{z-index:5;width:min(1180px,90vw);margin-inline:auto;position:relative}.blog-head{margin-top:clamp(40px,7vw,84px)}.blog-head .article-kicker b{color:var(--hl-red);margin-left:8px}.blog-title{font-family:var(--font-display);letter-spacing:-.01em;color:var(--foreground);margin:0 0 clamp(26px,3vw,38px);font-size:clamp(64px,13vw,168px);line-height:.9;animation:.62s cubic-bezier(.22,1,.36,1) 60ms both article-in;position:relative}.blog-title:after{content:"";background:var(--hl-grad);width:64px;height:2px;margin-top:clamp(14px,2vw,22px);display:block}.blog-sub{max-width:560px;color:var(--muted-foreground);margin:0 0 clamp(28px,4vw,44px);font-size:clamp(15px,1.3vw,18px);line-height:1.7;animation:.6s cubic-bezier(.22,1,.36,1) .16s both article-in}.blog-tools{border-block:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:14px 22px;padding:18px 0;display:flex}.blog-search{border:1px solid var(--border);max-width:420px;color:var(--muted-foreground);flex:260px;align-items:center;gap:10px;padding:0 14px;transition:border-color .2s,box-shadow .2s;display:flex}.blog-search:focus-within{border-color:var(--hl-blue);box-shadow:0 0 0 3px #4f86ff29}.blog-search input{min-width:0;color:var(--foreground);font-family:var(--font-sans);background:0 0;border:0;outline:none;flex:1;padding:13px 0;font-size:15px}.blog-search input::-webkit-search-cancel-button{display:none}.blog-search button{width:24px;height:24px;color:var(--muted-foreground);cursor:pointer;place-items:center;display:grid}.blog-search button:hover{color:var(--foreground)}.blog-chips{flex-wrap:wrap;gap:8px;display:flex}.blog-chip{border:1px solid var(--border);letter-spacing:.2em;color:var(--muted-foreground);padding:9px 13px;font-size:10px;transition:color .2s,border-color .2s,background .2s}.blog-chip:hover,.blog-chip:focus-visible{color:var(--foreground);border-color:var(--hero-line)}.blog-chip.is-on{color:var(--foreground);border-color:var(--hl-blue);background:#4f86ff1a}.blog-active-tag{letter-spacing:.2em;color:var(--hl-blue);align-items:center;gap:8px;margin:0;font-size:10px;display:inline-flex}.blog-active-tag a{width:22px;height:22px;color:var(--muted-foreground);place-items:center;display:grid}.blog-browse-btn{border:1px solid var(--border);letter-spacing:.2em;color:var(--muted-foreground);align-items:center;gap:8px;padding:9px 13px;font-size:10px;transition:color .2s,border-color .2s,background .2s;display:inline-flex}.blog-browse-btn:hover,.blog-browse-btn:focus-visible{color:var(--foreground);border-color:var(--hero-line)}.blog-browse-btn.is-on{color:var(--foreground);border-color:var(--hl-blue);background:#4f86ff1a}.blog-browse-panel{z-index:5;border:1px solid var(--border);background:var(--card,#ffffff05);flex-direction:column;gap:16px;width:min(1180px,90vw);margin:0 auto 18px;padding:18px clamp(16px,2vw,22px);animation:.32s cubic-bezier(.22,1,.36,1) both article-in;display:flex;position:relative}.blog-browse-group{flex-direction:column;gap:8px;display:flex}.blog-browse-label{letter-spacing:.26em;color:var(--muted-foreground);font-size:10px}.blog-count{letter-spacing:.26em;color:var(--muted-foreground);margin-top:18px;margin-bottom:22px;font-size:10px}.blog-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:clamp(16px,2vw,28px);padding:0;list-style:none;transition:opacity .2s;display:grid}.blog-grid.is-loading{opacity:.55}.blog-card-item{min-width:0;display:flex}.blog-card{border:1px solid var(--border);background:color-mix(in oklab, var(--background) 82%, transparent);flex:1;transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .25s,box-shadow .25s;animation:.56s cubic-bezier(.22,1,.36,1) both article-in;display:flex;position:relative}.blog-card-item:nth-child(3n+2) .blog-card{animation-delay:70ms}.blog-card-item:nth-child(3n) .blog-card{animation-delay:.14s}.blog-card:hover,.blog-card:focus-within{border-color:var(--hl-blue);transform:translateY(-4px);box-shadow:0 18px 40px -24px #4f86ff80}.blog-card-item:nth-child(2n) .blog-card:hover,.blog-card-item:nth-child(2n) .blog-card:focus-within{border-color:var(--hl-red);box-shadow:0 18px 40px -24px #ff455773}.blog-card-link{flex-direction:column;flex:1;min-width:0;display:flex}.blog-card-media{aspect-ratio:16/10;border-bottom:1px solid var(--border);background:var(--muted);position:relative;overflow:hidden}.blog-card-media img{object-fit:cover;width:100%;height:100%;transition:transform .7s cubic-bezier(.16,1,.3,1);position:absolute;inset:0}.blog-card:hover .blog-card-media img{transform:scale(1.045)}.blog-card-fallback{color:#ff455747;background:radial-gradient(closest-side at 30% 40%, #4f86ff33, transparent 70%), radial-gradient(closest-side at 75% 65%, #ff455724, transparent 70%), var(--muted);place-items:center;font-size:clamp(64px,9vw,104px);font-weight:700;display:grid;position:absolute;inset:0}.blog-card-body{flex-direction:column;flex:1;gap:12px;padding:clamp(18px,2vw,24px);display:flex}.blog-card-meta{letter-spacing:.2em;color:var(--muted-foreground);flex-wrap:wrap;gap:6px 14px;font-size:9px;display:flex}.blog-card-meta b{color:var(--hl-blue);letter-spacing:.1em}.blog-card-title{font-family:var(--font-display);letter-spacing:.005em;color:var(--foreground);margin:0;font-size:clamp(24px,2.2vw,30px);line-height:1.08}.blog-card-excerpt{color:var(--muted-foreground);-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0;font-size:15px;line-height:1.65;display:-webkit-box;overflow:hidden}.blog-card-open{letter-spacing:.24em;color:var(--foreground);margin-top:auto;padding-top:6px;font-size:10px}.blog-pager{border-top:1px solid var(--border);letter-spacing:.24em;color:var(--muted-foreground);justify-content:space-between;align-items:center;margin-top:clamp(30px,4vw,48px);padding-top:22px;font-size:10px;display:flex}.blog-pager a{border:1px solid var(--border);color:var(--foreground);padding:12px 16px;transition:border-color .2s,transform .25s cubic-bezier(.16,1,.3,1)}.blog-pager a:hover,.blog-pager a:focus-visible{border-color:var(--hl-blue);transform:translateY(-2px)}.blog-state{text-align:center;color:var(--muted-foreground);padding:clamp(40px,8vw,90px) 0}.blog-state p{max-width:460px;margin:0 auto 10px;line-height:1.65}.blog-state-title{font-family:var(--font-display);color:var(--foreground);font-size:clamp(28px,4vw,44px);line-height:1.05}.blog-btn{border:1px solid var(--foreground);background:var(--foreground);color:var(--primary-foreground);letter-spacing:.16em;cursor:pointer;margin-top:18px;padding:13px 22px;font-size:10px;font-weight:700;transition:background .2s,color .2s,border-color .2s;display:inline-flex}.blog-btn:hover,.blog-btn:focus-visible{background:var(--hl-red);border-color:var(--hl-red);color:#fff}.blog-skeleton .blog-card-media{background:var(--muted)}.sk{background:linear-gradient(90deg, var(--muted), #f2f2ee17, var(--muted));background-size:220% 100%;border-radius:2px;height:12px;animation:1.4s linear infinite sk-shimmer;display:block}.sk-s{width:38%}.sk-m{width:72%}.sk-l{width:92%;height:22px}@keyframes sk-shimmer{to{background-position:-220% 0}}.blog-preview{z-index:6;border:1px dashed var(--hl-red);letter-spacing:.22em;width:min(720px,90vw);color:var(--hl-red);margin:22px auto 0;padding:10px 14px;font-size:10px;position:relative}.article-kicker b{color:var(--hl-red);margin-left:8px}.article-tags{flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0;list-style:none;display:flex}.article-tags a{border:1px solid var(--border);letter-spacing:.14em;color:var(--muted-foreground);padding:6px 10px;font-size:10px;transition:color .2s,border-color .2s;display:inline-block}.article-tags a:hover,.article-tags a:focus-visible{color:var(--foreground);border-color:var(--hl-blue)}.article-cover{aspect-ratio:16/9;border:1px solid var(--border);background:var(--muted);margin:clamp(28px,4vw,44px) 0 0;position:relative;overflow:hidden}.article-cover img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.prose h2,.prose h3,.prose h4{color:var(--foreground);scroll-margin-top:90px}.prose h2{margin:clamp(34px,5vw,52px) 0 16px}.prose>:first-child{margin-top:0}.prose h3{font-family:var(--font-display);letter-spacing:.03em;margin:32px 0 12px;font-size:clamp(20px,2.3vw,27px)}.prose h4{font-family:var(--font-display);letter-spacing:.04em;color:color-mix(in oklab, var(--foreground) 86%, transparent);margin:26px 0 10px;font-size:clamp(17px,1.8vw,21px)}.prose a{transition:color .2s}.prose a:hover,.prose a:focus-visible{color:var(--hl-blue)}.prose strong{color:var(--foreground);font-weight:700}.prose ul,.prose ol{color:color-mix(in oklab, var(--foreground) 78%, transparent);margin:0 0 22px;padding-left:1.3em;font-size:clamp(16px,1.25vw,18px);line-height:1.8}.prose li{margin:6px 0;padding-left:4px}.prose li>p{margin:0}.prose li::marker{color:var(--hl-blue)}.prose blockquote{border-left:2px solid var(--hl-red);color:color-mix(in oklab, var(--foreground) 88%, transparent);margin:28px 0;padding:4px 0 4px 22px;font-size:clamp(17px,1.5vw,20px);font-style:italic}.prose blockquote p{color:inherit;font-size:inherit;margin-bottom:12px}.prose code{font-family:var(--font-mono);color:var(--foreground);background:#f2f2ee12;border-radius:3px;padding:2px 6px;font-size:.86em}.prose pre{border:1px solid var(--border);tab-size:2;background:#0f1218;margin:28px 0;padding:20px 18px 18px;font-size:13px;line-height:1.75;position:relative;overflow-x:auto}.prose pre[data-lang]:before{content:attr(data-lang);font-family:var(--font-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--hl-blue);font-size:9px;position:absolute;top:6px;right:10px}.prose pre code{font-size:inherit;color:color-mix(in oklab, var(--foreground) 88%, transparent);background:0 0;border-radius:0;padding:0}.prose hr{border:0;border-top:1px solid var(--hero-line);margin:44px 0}.prose figure{margin:30px 0}.prose figure img{border:1px solid var(--border);background:var(--muted);width:100%;height:auto;display:block}.prose figcaption{font-family:var(--font-mono);letter-spacing:.14em;text-align:center;color:var(--muted-foreground);margin-top:10px;font-size:10px}.prose .table-wrap{border:1px solid var(--border);margin:28px 0;overflow-x:auto}.prose table{border-collapse:collapse;width:100%;min-width:480px;font-size:15px}.prose th,.prose td{border:1px solid var(--border);text-align:left;vertical-align:top;color:color-mix(in oklab, var(--foreground) 82%, transparent);padding:11px 14px}.prose th{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--foreground);background:#f2f2ee0a;font-size:11px}.prose td p,.prose th p{font-size:inherit;margin:0}.prose .ta-center{text-align:center}.prose .ta-right{text-align:right}.prose .ta-justify{text-align:justify}.article-end{gap:26px;display:grid}.author-card{align-items:center;gap:18px;display:flex}.author-card .hanko{flex:none}.author-name{font-family:var(--font-display);letter-spacing:.04em;color:var(--foreground);margin:0;font-size:26px}.author-role{letter-spacing:.22em;color:var(--muted-foreground);margin:4px 0 8px;font-size:9px}.author-links{flex-wrap:wrap;gap:2px;display:flex}.author-links a{width:30px;height:30px;color:var(--muted-foreground);place-items:center;transition:color .2s,transform .25s cubic-bezier(.16,1,.3,1);display:grid}.author-links a:hover,.author-links a:focus-visible{color:var(--hl-blue);transform:translateY(-2px)}.share-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.share-label{letter-spacing:.26em;color:var(--muted-foreground);margin-right:6px;font-size:9px}.share-btn{border:1px solid var(--border);letter-spacing:.16em;color:var(--muted-foreground);cursor:pointer;background:0 0;align-items:center;gap:8px;padding:9px 13px;font-size:10px;transition:color .2s,border-color .2s;display:inline-flex}.share-btn:hover,.share-btn:focus-visible{color:var(--foreground);border-color:var(--hl-blue)}.blog-related{margin-top:clamp(56px,8vw,100px)}.blog-related-title{font-family:var(--font-display);letter-spacing:.02em;color:var(--foreground);margin:0 0 22px;font-size:clamp(30px,4vw,48px)}.blog-related-title b{color:var(--hl-red);letter-spacing:.2em;margin-left:10px;font-size:.4em}@media (width<=640px){.blog-tools{gap:12px}.blog-search{max-width:none}.author-card{align-items:flex-start}}@media (prefers-reduced-motion:reduce){.blog-title,.blog-sub,.blog-card,.sk{animation:none}.blog-card,.blog-card-media img{transition:none}}