.blog-shell{--background:#fff;--foreground:#172334;--muted-foreground:#526176;--border:#dce3ed;--primary:#1763d9;--ring:#1763d9;color:#172334;background:#fff;min-height:100svh;font-family:Geist,sans-serif;line-height:1.6}.blog-shell *{border-color:#dce3ed}.blog-shell a,.blog-shell button{-webkit-tap-highlight-color:transparent}.blog-shell :is(a,button,input,textarea,select):focus-visible{outline-offset:4px;outline:2px solid #1763d9}.blog-header{border-bottom:1px solid #e6ebf2;justify-content:space-between;align-items:center;gap:24px;max-width:1200px;margin:auto;padding:24px 36px;display:flex}.blog-brand{letter-spacing:-.035em;align-items:center;gap:12px;font-size:18px;font-weight:650;display:flex}.blog-brand-icon{color:#fff;background:#1763d9;border-radius:6px;place-items:center;width:30px;height:30px;font-family:Geist Mono,monospace;font-size:16px;display:grid}.blog-brand-label{color:#64748b;font-weight:400}.blog-header nav{align-items:center;gap:28px;font-size:13px;font-weight:550;display:flex}.blog-header nav a:hover,.blog-playground-link{color:#1763d9}.blog-index{max-width:1040px;min-height:65svh;margin:auto;padding:76px 36px 100px}.blog-eyebrow{color:#1763d9;letter-spacing:.08em;text-transform:uppercase;font-family:Geist Mono,monospace;font-size:11px}.blog-index h1{letter-spacing:-.055em;margin:16px 0 20px;font-size:clamp(36px,6vw,58px);font-weight:650;line-height:1.1}.blog-intro{color:#526176;max-width:540px;font-size:18px}.blog-post-list{border-top:1px solid #dce3ed;margin-top:56px}.blog-post-card{border-bottom:1px solid #dce3ed;align-items:center;gap:28px;padding:30px 0;display:grid}.blog-post-card-with-image{grid-template-columns:minmax(0,260px) minmax(0,1fr)}.blog-post-thumbnail{aspect-ratio:8/5;background:#101923;border-radius:8px;width:100%;position:relative;overflow:hidden}.blog-post-thumbnail img{object-fit:cover}.blog-post-summary{min-width:0}.blog-post-card h2{letter-spacing:-.035em;margin:10px 0;font-size:26px;font-weight:600;line-height:1.3}.blog-post-card:hover h2{color:#1763d9}.blog-post-card p{color:#526176;max-width:660px}.blog-meta{color:#607087;flex-wrap:wrap;align-items:center;gap:12px;font-size:12px;display:flex}.blog-tag{color:#1763d9;text-transform:uppercase;letter-spacing:.05em;font-family:Geist Mono,monospace;font-size:10px}.blog-article{max-width:816px;margin:auto;padding:52px 36px 96px}.blog-back{color:#607087;margin-bottom:36px;font-size:12px;display:inline-block}.blog-back:hover{color:#1763d9}.blog-article h1{letter-spacing:-.045em;margin:20px 0;font-size:clamp(34px,5vw,50px);font-weight:650;line-height:1.13}.blog-deck{color:#526176;font-size:19px;line-height:1.65}.blog-byline{border-bottom:1px solid #dce3ed;margin-top:22px;padding-bottom:32px}.blog-prose{overflow-wrap:anywhere;margin-top:38px;font-size:16px;line-height:1.85}.blog-prose p{margin:20px 0}.blog-prose :is(h2,h3){color:#172334;letter-spacing:-.025em;scroll-margin-top:24px;font-weight:600;line-height:1.3}.blog-prose h2{margin:52px 0 18px;font-size:27px}.blog-prose h3{margin:32px 0 14px;font-size:21px}.blog-prose :is(ul,ol){margin:20px 0;padding-left:24px}.blog-prose ul{list-style:outside}.blog-prose ol{list-style:decimal}.blog-prose li{margin:9px 0;padding-left:4px}.blog-prose a{color:#1763d9;text-underline-offset:3px;text-decoration:underline}.blog-prose :not(pre)>code{color:#234d80;background:#edf2f8;border-radius:3px;padding:2px 5px;font-family:Geist Mono,monospace;font-size:.85em}.blog-prose blockquote{color:#526176;border-left:3px solid #1763d9;margin:30px 0;padding-left:22px}.blog-figure{margin:32px 0}.blog-figure img{border:1px solid #dce3ed;border-radius:8px;width:100%;height:auto}.blog-figure figcaption{color:#607087;text-align:center;margin-top:10px;font-size:12px}.blog-code{color:#dce7f5;background:#111c2c;border-radius:8px;margin:28px 0;font-size:12px;overflow:hidden}.blog-code-label{color:#8ba3bf;letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid #2a394c;padding:10px 18px;font-family:Geist Mono,monospace;font-size:10px}.blog-code pre{white-space:pre;margin:0;padding:18px;font-family:Geist Mono,monospace;line-height:1.8;overflow-x:auto}.blog-example{--editor-text:#dce7f5;--editor-text-dim:#a7bbd3;--editor-divider:#2a394c;--editor-header-bg:#111c2c;--editor-accent:#80b6ff;--editor-accent-dim:#23486b;color:#dce7f5;background:#111c2c;border:1px solid #2a394c;border-radius:8px;margin:32px 0;line-height:1.5;overflow:hidden}.blog-example *{border-color:#2a394c}.blog-example-heading{border-bottom:1px solid #2a394c;justify-content:space-between;gap:12px;padding:14px 18px;font-size:13px;font-weight:550;display:flex}.blog-example-heading span{color:#80b6ff;text-transform:uppercase;letter-spacing:.04em;font-family:Geist Mono,monospace;font-size:10px}.blog-example .blog-code{border-radius:0;margin:0}.blog-example-actions{border-top:1px solid #2a394c;flex-wrap:wrap;align-items:center;gap:8px;padding:14px 18px;display:flex}.blog-example button,.blog-example .example-open-link{color:#dce7f5;cursor:pointer;background:0 0;border:1px solid #3d5069;border-radius:4px;padding:7px 11px;font-family:Geist,sans-serif;font-size:12px;text-decoration:none}.blog-example button:hover,.blog-example .example-open-link:hover{background:#233449}.blog-example button.example-primary{color:#fff;background:#1763d9;border-color:#1763d9}.blog-example button:disabled{opacity:.5;cursor:default}.example-workbench{min-width:0}.example-workbench:focus{outline:none}.example-script-heading{border-bottom:1px solid #2a394c;justify-content:space-between;align-items:center;gap:12px;padding-right:18px;display:flex}.example-script-heading .blog-code-label{border:0}.blog-example .example-script-heading button{color:#80b6ff;align-items:center;gap:6px;padding:5px 9px;font-size:11px;display:flex}.blog-example .debug-toolbar-inline button{color:#80b6ff;border-color:#0000;justify-content:center;align-items:center;width:30px;height:30px;padding:0;display:flex}.blog-example .debug-toolbar-inline button:hover:enabled{background:#2b425e}.blog-example .example-debug-hint{color:#a7bbd3;border-top:1px solid #2a394c;margin:0;padding:10px 18px;font-size:11px}.example-inspector [data-testid=debug-inspector]{border-top:1px solid #2a394c;border-bottom:0;max-height:440px;padding:16px 18px;font-family:Geist Mono,monospace;font-size:11px;overflow:auto}.blog-example .example-inspector h2{color:#dce7f5;letter-spacing:.06em;margin:0;font-size:11px}.blog-example .example-inspector h3{color:#a7bbd3;letter-spacing:0;margin:12px 0 6px;font-size:11px}.blog-example .example-inspector p{margin:0 0 10px}.example-inspector input{color:#dce7f5;padding:7px 10px;font-size:12px}.blog-example .example-inspector button{padding:4px 7px;font-family:Geist Mono,monospace;font-size:11px}.blog-example .example-inspector button[aria-label^=Expand\ ],.blog-example .example-inspector button[aria-label^=Collapse\ ]{border:0;flex-shrink:0;width:20px;padding:0}.blog-example .example-inspector button[aria-label^=Expand\ ]:disabled{opacity:0}.blog-example .example-inspector button[aria-pressed]{overflow-wrap:anywhere;gap:16px}.blog-example .example-output{white-space:pre-wrap;overflow-wrap:anywhere;max-height:320px;margin:0;padding:16px 18px;font-family:Geist Mono,monospace;font-size:12px;overflow-y:auto}.blog-example .example-status{color:#a7bbd3;margin:0;padding:0 18px 12px;font-size:12px}.blog-example .example-error{color:#fda4af}.example-input-label{color:#a7bbd3;border-top:1px solid #2a394c;justify-content:space-between;align-items:center;gap:12px;padding:10px 18px;font-size:11px;display:flex}.example-input-label input{color:#dce7f5;border:1px solid #3d5069;border-radius:3px;width:180px;max-width:50%;padding:4px 6px;font-family:Geist Mono,monospace}.example-context{color:#a7bbd3;padding:12px 18px;font-size:12px}.example-context textarea{color:#dce7f5;background:#172334;width:100%;margin:6px 0 12px;padding:10px;font-family:Geist Mono,monospace;display:block}.blog-empty{color:#526176;padding:32px 0}.blog-empty h2{color:#172334;margin-bottom:8px;font-size:22px;font-weight:550}.blog-preview-banner{color:#12488f;z-index:50;background:#eef5ff;border:1px solid #b9d4fb;border-radius:6px;justify-content:space-between;align-items:center;gap:18px;width:fit-content;max-width:calc(100% - 32px);margin:12px auto;padding:12px 18px;font-size:12px;display:flex;position:sticky;bottom:12px}.blog-preview-banner button{cursor:pointer;text-decoration:underline}.blog-footer{color:#607087;border-top:1px solid #e6ebf2;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;max-width:1128px;margin:auto;padding:24px 0;font-size:12px;display:flex}@media (max-width:640px){.blog-header{gap:12px;padding:18px 20px}.blog-header nav{gap:12px;font-size:11px}.blog-header nav>a:first-child{display:none}.blog-brand{gap:8px;font-size:15px}.blog-brand-label{display:none}.blog-index{padding:48px 20px 70px}.blog-post-card-with-image{grid-template-columns:minmax(0,1fr);gap:20px}.blog-article{padding:30px 20px 60px}.blog-article h1{font-size:36px}.blog-deck{font-size:17px}.blog-footer{margin:0 20px;padding:24px 0}.blog-footer span{display:none}.blog-prose{font-size:15px}.blog-example-heading{flex-direction:column;gap:4px}}