.blog-page{--blue: var(--color-info);--blue-soft: rgb(from var(--color-info) r g b / .09);--violet-soft: rgb(from var(--violet-bright) r g b / .11)}.blog-page .hero-meta{margin-top:25px;display:flex;flex-wrap:wrap;gap:10px 18px;color:var(--muted-2);font-size:.84rem}.blog-page .hero-meta b{color:var(--ink);font-weight:760}.blog-page .console{background:linear-gradient(180deg,var(--surface),var(--page-2))}.blog-page .editor{padding:21px;font:500 .77rem/1.72 SFMono-Regular,Consolas,Liberation Mono,monospace;color:var(--muted)}.blog-page .editor-line{display:block;white-space:pre-wrap}.blog-page .terminal-foot{padding:12px 16px;border-top:1px solid var(--line-soft);display:flex;justify-content:space-between;color:var(--muted-2);font-size:.74rem}.blog-page .pulse{display:inline-flex;align-items:center;gap:7px}.blog-page .pulse:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 rgb(from var(--mint) r g b / .45);animation:blog-pulse 2.4s infinite}@keyframes blog-pulse{70%{box-shadow:0 0 0 8px rgb(from var(--mint) r g b / 0)}to{box-shadow:0 0 rgb(from var(--mint) r g b / 0)}}@media(prefers-reduced-motion:reduce){.blog-page .pulse:before{animation:none}}.blog-page .c-section-head.split{max-width:none;display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:32px}.blog-page .section-title{max-width:720px}.blog-page .section-link{color:var(--violet);font-size:.86rem;font-weight:750;white-space:nowrap}.blog-page .section-link:hover{color:var(--violet-3)}.concept-page .blog-page .tag{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;border:1px solid var(--line);color:var(--muted);font-size:.72rem;font-weight:700;background:var(--surface-2)}.blog-page .tag.tutorial{color:var(--violet);background:var(--violet-soft)}.blog-page .tag.analysis{color:var(--mint);background:var(--mint-soft)}.blog-page .tag.guide{color:var(--gold);background:var(--gold-soft)}.blog-page .tag.developer{color:var(--blue);background:var(--blue-soft)}.blog-page .tag-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:18px}.blog-page .featured-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:16px}.blog-page .featured-main,.blog-page .featured-side{border:1px solid var(--line);background:var(--surface);border-radius:22px;overflow:hidden;transition:transform .18s ease,border-color .18s ease}.blog-page .featured-main:hover,.blog-page .featured-side:hover,.blog-page .article-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--violet) 50%,var(--line))}@media(prefers-reduced-motion:reduce){.blog-page .featured-main,.blog-page .featured-side,.blog-page .article-card{transition:none}.blog-page .featured-main:hover,.blog-page .featured-side:hover,.blog-page .article-card:hover{transform:none}}.blog-page .featured-main{display:grid;grid-template-columns:1.05fr .95fr;min-height:400px}.blog-page .featured-copy{padding:32px;display:flex;flex-direction:column}.blog-page .featured-copy h3{font-size:clamp(1.65rem,3vw,2.5rem);line-height:1.02;letter-spacing:-.045em;margin:0 0 14px}.blog-page .featured-copy p{margin:0;color:var(--muted);font-size:.96rem}.blog-page .article-meta{margin-top:auto;padding-top:28px;color:var(--muted-2);font-size:.78rem;display:flex;flex-wrap:wrap;gap:8px 13px}.blog-page .article-meta strong{color:var(--ink);font-weight:700}.blog-page .feature-art{position:relative;min-height:100%;background:linear-gradient(145deg,var(--surface-3),var(--page-2));display:grid;place-items:center;overflow:hidden;border-left:1px solid var(--line-soft)}.blog-page .feature-art:before{content:"";position:absolute;width:280px;height:280px;border-radius:50%;background:rgb(from var(--violet-bright) r g b / .14);filter:blur(50px);right:-80px;top:-70px}.blog-page .feature-art svg{width:85%;position:relative;z-index:2}.blog-page .side-stack{display:grid;grid-template-rows:1fr 1fr;gap:16px}.blog-page .featured-side{padding:24px;display:flex;flex-direction:column;min-height:192px;position:relative;overflow:hidden}.blog-page .featured-side:after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:-46px;bottom:-50px;background:rgb(from var(--mint) r g b / .08)}.blog-page .featured-side:nth-child(2):after{background:rgb(from var(--gold) r g b / .08)}.blog-page .featured-side h3{font-size:1.2rem;line-height:1.15;letter-spacing:-.028em;margin:0 0 9px;max-width:88%}.blog-page .featured-side p{color:var(--muted);font-size:.84rem;margin:0;max-width:92%}.blog-page .featured-side .article-meta{padding-top:18px}.blog-page .topics-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.blog-page .topic-card{border:1px solid var(--line);border-radius:17px;background:var(--surface);padding:19px;min-height:145px;position:relative;overflow:hidden;text-align:left;color:inherit;font:inherit}.blog-page button.topic-card{cursor:pointer}.blog-page button.topic-card:hover{border-color:color-mix(in srgb,var(--violet) 50%,var(--line))}.blog-page .topic-card .count{font-size:.72rem;color:var(--muted-2);text-transform:uppercase;letter-spacing:.08em}.blog-page .topic-card strong{display:block;font-size:1.04rem;margin:12px 0 5px;color:var(--ink)}.blog-page .topic-card p{font-size:.83rem;color:var(--muted);margin:0;max-width:90%}.blog-page .topic-mark{position:absolute;right:14px;top:14px;width:34px;height:34px;border-radius:11px;background:var(--surface-3);border:1px solid var(--line);display:grid;place-items:center}.blog-page .tool-row{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:24px}.concept-page .blog-page .filters{display:flex;gap:8px;flex-wrap:wrap;padding:0;border-bottom:0}.blog-page .filter-btn{border:1px solid var(--line);background:var(--surface);color:var(--muted);padding:8px 11px;border-radius:999px;font-size:.76rem;font-weight:700;cursor:pointer}.blog-page .filter-btn[aria-pressed=true]{background:var(--violet-soft);border-color:rgb(from var(--violet-bright) r g b / .48);color:var(--violet)}.blog-page .search-wrap{position:relative;min-width:290px}.blog-page .search-wrap svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted-2);pointer-events:none}.blog-page .search-wrap input{width:100%;height:42px;border-radius:11px;border:1px solid var(--color-line-strong);background:var(--surface);color:var(--ink);padding:0 14px 0 39px;outline:none}.blog-page .search-wrap input:focus-visible{border-color:var(--violet);box-shadow:0 0 0 3px rgb(from var(--violet) r g b / .18)}.blog-page .articles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.blog-page .article-card{border:1px solid var(--line);border-radius:19px;background:var(--surface);overflow:hidden;display:flex;flex-direction:column;min-height:365px;transition:transform .18s ease,border-color .18s ease}.blog-page .thumb{height:155px;border-bottom:1px solid var(--line-soft);position:relative;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,var(--surface-2),var(--page-2))}.blog-page .thumb:before{content:"";position:absolute;width:170px;height:170px;border-radius:50%;right:-35px;top:-55px;background:rgb(from var(--violet-bright) r g b / .13);filter:blur(10px)}.blog-page .thumb.mint:before{background:rgb(from var(--mint) r g b / .13)}.blog-page .thumb.gold:before{background:rgb(from var(--gold) r g b / .13)}.blog-page .thumb.rose:before{background:rgb(from var(--rose) r g b / .13)}.blog-page .thumb.blue:before{background:rgb(from var(--blue) r g b / .13)}.blog-page .thumb svg{width:75%;height:105px;position:relative;z-index:2}.blog-page .article-body{padding:20px;display:flex;flex:1;flex-direction:column}.blog-page .article-body h3{font-size:1.08rem;line-height:1.2;letter-spacing:-.025em;margin:10px 0 9px}.blog-page .article-body p{margin:0;color:var(--muted);font-size:.86rem}.blog-page .article-body .article-meta{padding-top:18px}.blog-page .article-card[hidden]{display:none}.blog-page .results-note{margin-top:18px;color:var(--muted-2);font-size:.8rem;text-align:center}.blog-page .series-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.blog-page .series-card{border:1px solid var(--line);border-radius:22px;padding:27px;background:var(--surface);display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center;overflow:hidden;position:relative}.blog-page .series-card:before{content:"";position:absolute;width:190px;height:190px;border-radius:50%;right:-85px;bottom:-90px;background:rgb(from var(--violet-bright) r g b / .09)}.blog-page .series-card:nth-child(2):before{background:rgb(from var(--mint) r g b / .08)}.blog-page .series-card:hover{border-color:color-mix(in srgb,var(--violet) 50%,var(--line))}.blog-page .series-card h3{font-size:1.35rem;line-height:1.1;letter-spacing:-.035em;margin:7px 0 9px}.blog-page .series-card p{margin:0;color:var(--muted);font-size:.89rem;max-width:490px}.blog-page .series-icon{width:64px;height:64px;border-radius:18px;background:var(--surface-2);border:1px solid var(--line);display:grid;place-items:center;position:relative;z-index:2}.blog-page .newsletter{border:1px solid color-mix(in srgb,var(--violet) 32%,var(--line));border-radius:27px;background:linear-gradient(135deg,rgb(from var(--violet-bright) r g b / .1),rgb(from var(--mint) r g b / .05) 48%,var(--surface));padding:45px;display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;position:relative;overflow:hidden}.blog-page .newsletter:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-100px;top:-100px;background:rgb(from var(--violet-bright) r g b / .12);filter:blur(2px)}.blog-page .newsletter h2{font-size:clamp(2rem,4vw,3.4rem);margin:8px 0 10px;line-height:1;letter-spacing:-.055em;max-width:680px}.blog-page .newsletter p{margin:0;color:var(--muted);max-width:630px}.blog-page .subscribe{display:flex;gap:8px;position:relative;z-index:2}.blog-page .subscribe input{height:46px;min-width:260px;border-radius:11px;border:1px solid var(--color-line-strong);background:var(--surface);color:var(--ink);padding:0 13px;outline:none}.blog-page .subscribe input:focus-visible{border-color:var(--violet);box-shadow:0 0 0 3px rgb(from var(--violet) r g b / .18)}.blog-page .cta-strip{display:flex;align-items:center;justify-content:space-between;gap:34px;padding:34px 0}.blog-page .cta-strip h2{font-size:1.45rem;letter-spacing:-.035em;margin:0 0 5px}.blog-page .cta-strip p{color:var(--muted);margin:0;font-size:.9rem}@media(max-width:1050px){.blog-page .featured-grid{grid-template-columns:1fr}.blog-page .featured-main{min-height:360px}.blog-page .side-stack{grid-template-columns:1fr 1fr;grid-template-rows:auto}.blog-page .topics-grid,.blog-page .articles-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.blog-page .featured-main{grid-template-columns:1fr}.blog-page .feature-art{min-height:250px;border-left:0;border-top:1px solid var(--line-soft)}.blog-page .side-stack,.blog-page .topics-grid,.blog-page .articles-grid,.blog-page .series-grid{grid-template-columns:1fr}.blog-page .c-section-head.split{display:block}.blog-page .section-link{display:inline-block;margin-top:12px}.blog-page .tool-row{align-items:stretch;flex-direction:column}.blog-page .search-wrap{min-width:0;width:100%}.blog-page .newsletter{grid-template-columns:1fr;padding:30px 22px}.blog-page .subscribe{flex-direction:column}.blog-page .subscribe input{min-width:0;width:100%}.blog-page .subscribe .concept-btn{width:100%;justify-content:center}.blog-page .cta-strip{align-items:flex-start;flex-direction:column}.blog-page .cta-strip .concept-btn{width:100%;justify-content:center}}.blog-post{--code-bg: #0c0a09;--code-line: rgba(255, 255, 255, .08)}.blog-post .progress{position:fixed;left:0;top:0;height:2px;width:0;background:linear-gradient(90deg,var(--violet-bright),var(--mint));z-index:90}.concept-page .blog-post .hero h1{font-size:clamp(2.3rem,4.4vw,3.85rem);line-height:1.02;letter-spacing:-.045em;margin:4px 0 20px}.blog-post .hero .article-meta{margin-top:0;padding-top:26px}.blog-post .post-card{position:relative;border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:var(--shadow);overflow:hidden;padding:18px}.blog-post .post-top{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted-2);font-size:.73rem;border-bottom:1px solid var(--line);padding:0 2px 12px;margin-bottom:13px}.blog-post .post-rows{display:grid;gap:9px}.blog-post .post-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:11px;align-items:center;border:1px solid var(--line-soft);border-radius:14px;padding:11px 12px;background:var(--surface-2);transition:border-color .18s ease,background .18s ease}.blog-post .post-row:hover{border-color:var(--violet);background:var(--surface-3)}.blog-post .post-num{font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.82rem;font-weight:800;color:var(--violet);letter-spacing:-.03em}.blog-post .post-row:nth-child(2) .post-num{color:var(--mint)}.blog-post .post-row:nth-child(3) .post-num{color:var(--gold)}.blog-post .post-row:nth-child(4) .post-num{color:var(--blue)}.blog-post .post-row:nth-child(5) .post-num{color:var(--rose)}.blog-post .post-row.more .post-num{color:var(--muted-2)}.blog-post .post-row-copy b{display:block;font-size:.81rem;line-height:1.3;color:var(--ink);font-weight:700}.blog-post .post-row-tag{font-size:.6rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2);border:1px solid var(--line);border-radius:999px;padding:4px 8px;white-space:nowrap}.blog-post .post-note{margin-top:13px;padding:12px 2px 0;border-top:1px solid var(--line);font-size:.78rem;color:var(--muted)}.blog-post .post-note b{color:var(--ink)}.concept-page .blog-post .metric strong{font-size:1.22rem;line-height:1.15}.blog-post .post-wrap{display:grid;grid-template-columns:260px minmax(0,1fr);gap:46px;align-items:start;padding:72px 0 96px;border-top:1px solid var(--line-soft)}.blog-post .toc{position:sticky;top:98px;max-height:calc(100vh - 130px);overflow:auto;border:1px solid var(--line);border-radius:20px;background:var(--surface);padding:17px}.blog-post .toc-title{font-size:.78rem;font-weight:780;text-transform:uppercase;letter-spacing:.09em;color:var(--muted-2);margin:0 0 12px}.blog-post .toc a{display:flex;align-items:baseline;gap:9px;padding:8px 9px;border-radius:9px;color:var(--muted);font-size:.78rem;line-height:1.3;transition:background .15s ease,color .15s ease}.blog-post .toc a:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--color-line-strong);flex:0 0 auto;transform:translateY(-2px)}.blog-post .toc a:hover,.blog-post .toc a.active{background:var(--surface-2);color:var(--ink)}.blog-post .toc a.active:before{background:var(--mint)}.blog-post .toc-divider{height:1px;background:var(--line);margin:12px 0}.blog-post .toc-meta{display:grid;gap:8px}.blog-post .toc-meta div{display:flex;justify-content:space-between;gap:12px;font-size:.7rem;color:var(--muted-2)}.blog-post .toc-meta b{color:var(--ink);text-align:right}.blog-post .toc-back{display:inline-block;margin-top:14px;font-size:.76rem}.blog-post .article{min-width:0}.blog-post .article-section{scroll-margin-top:96px;padding:0 0 56px;margin:0 0 56px;border-bottom:1px solid var(--line-soft)}.blog-post .section-label{display:inline-flex;align-items:center;gap:9px;color:var(--violet);font-size:.72rem;font-weight:780;letter-spacing:.1em;text-transform:uppercase}.blog-post .section-label:before{content:"";width:20px;height:1px;background:var(--violet)}.blog-post .article h2{font-size:clamp(1.75rem,3.4vw,2.7rem);line-height:1.04;letter-spacing:-.045em;margin:12px 0 18px;padding-top:0;border-top:0;color:var(--ink)}.blog-post .article h2:before{content:none}.blog-post .article h3{font-size:1.18rem;letter-spacing:-.025em;padding-left:0;margin:30px 0 10px;border-left:0;color:var(--ink)}.blog-post .article .card h3,.blog-post .article .card h4{margin-top:0}.blog-post .article h4{font-size:1rem;margin:22px 0 8px;color:var(--ink)}.blog-post .article p{color:var(--muted);font-size:1rem;line-height:1.72;margin:0 0 18px}.blog-post .article ul,.blog-post .article ol{color:var(--muted);font-size:1rem}.blog-post .article table{font-size:.88rem}.blog-post .post-lede p:first-child{font-size:1.1rem;color:color-mix(in srgb,var(--muted) 78%,var(--ink))}.blog-post .post-code{border:1px solid var(--line);border-radius:18px;background:var(--code-bg);overflow:hidden;margin:22px 0 26px;box-shadow:var(--shadow-md)}.blog-post .code-head{min-height:45px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:8px 13px 8px 15px;border-bottom:1px solid var(--code-line);color:#c6c0d2;font-size:.7rem}.blog-post .code-head-left{display:flex;align-items:center;gap:9px;min-width:0}.blog-post .code-head strong{color:#f4f0ff;font-size:.74rem;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:480px){.blog-post .code-head strong{white-space:normal;overflow:visible}}.blog-post .code-lang{color:#8edbc7;text-transform:uppercase;letter-spacing:.08em;font-weight:800;font-size:.61rem;white-space:nowrap}.blog-post .copy-btn{border:1px solid #6b6875;background:transparent;color:#c6c0d2;border-radius:8px;padding:6px 9px;font-size:.65rem;font-weight:700;cursor:pointer;white-space:nowrap}.blog-post .copy-btn:hover{color:#fff;border-color:#bcaeff}.blog-post .post-code .claw-codeblock{border:0;border-radius:0;box-shadow:none;background:transparent}.concept-page .blog-post .post-code pre.astro-code{padding:18px 20px;font-size:.78rem;line-height:1.7}.blog-post .post-inline-cta{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;border:1px solid color-mix(in srgb,var(--violet) 32%,var(--line));border-radius:22px;background:linear-gradient(135deg,rgb(from var(--violet-bright) r g b / .1),rgb(from var(--mint) r g b / .05) 48%,var(--surface));padding:28px}.blog-post .article .post-inline-cta h2{font-size:1.45rem;line-height:1.12;letter-spacing:-.035em;margin:0 0 6px}.blog-post .article .post-inline-cta p{margin:0;font-size:.92rem;max-width:46ch}.blog-post .article .post-inline-cta a.concept-btn{text-decoration:none}.blog-post .next-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.blog-post .next-card{border:1px solid var(--line);border-radius:19px;background:var(--surface);padding:22px;display:flex;flex-direction:column;transition:transform .18s ease,border-color .18s ease}.blog-post .next-card:hover{transform:translateY(-2px);border-color:var(--violet)}.blog-post .next-card .tag-row{margin-bottom:14px}.blog-post .next-card h3{font-size:1.08rem;line-height:1.2;letter-spacing:-.025em;margin:0 0 9px;color:var(--ink)}.blog-post .next-card p{color:var(--muted);font-size:.86rem;margin:0}.blog-post .next-card .article-meta{padding-top:16px}.blog-post .next-card .go{padding-top:14px;color:var(--violet);font-size:.76rem;font-weight:760}@media(prefers-reduced-motion:reduce){.blog-post .post-row,.blog-post .next-card,.blog-post .toc a{transition:none}.blog-post .next-card:hover{transform:none}}@media(max-width:1050px){.blog-post .post-wrap{grid-template-columns:220px minmax(0,1fr);gap:28px}.blog-post .next-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.blog-post .post-wrap{grid-template-columns:minmax(0,1fr);padding:44px 0 64px}.blog-post .toc{display:none}.blog-post .next-grid{grid-template-columns:1fr}.blog-post .post-row{grid-template-columns:34px minmax(0,1fr)}.blog-post .post-row-tag{display:none}.blog-post .article-section{padding-bottom:44px;margin-bottom:44px}.blog-post .post-inline-cta{padding:22px}.concept-page .blog-post .post-code pre.astro-code{padding:16px;font-size:.72rem}}
