.blog-article img,.article-content img{max-width:100%;height:auto;display:block;margin:2rem auto;border-radius:.75rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;border:1px solid var(--sl-color-gray-5);object-fit:contain}.blog-article,.article-content{overflow-x:hidden;width:100%}.blog-article p img,.article-content p img{display:inline-block;margin:0 .25rem;vertical-align:middle;max-height:1.5em;width:auto;border:none;box-shadow:none;border-radius:0}.blog-article figure,.article-content figure{margin:2rem 0;text-align:center;max-width:100%}.blog-article figure img,.article-content figure img{margin-bottom:.5rem;max-width:100%}.blog-article figcaption,.article-content figcaption{font-size:.9rem;color:var(--sl-color-text-muted);font-style:italic;margin-top:.5rem;padding:0 1rem}.blog-article pre,.article-content pre{overflow-x:auto;max-width:100%;white-space:pre-wrap;word-wrap:break-word}.blog-article .table-wrapper,.article-content .table-wrapper,.blog-article .overflow-x-auto,.article-content .overflow-x-auto{overflow-x:auto;max-width:100%;margin:1.5rem 0}.blog-article table,.article-content table{min-width:100%;width:max-content}.blog-article .callout,.article-content .callout{margin:1.5rem 0;max-width:100%;overflow:hidden}.blog-article video,.article-content video,.blog-article iframe,.article-content iframe{max-width:100%;height:auto;border-radius:.75rem;margin:2rem auto;display:block}.blog-article .video-wrapper,.article-content .video-wrapper,.blog-article .embed-wrapper,.article-content .embed-wrapper{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;max-width:100%;margin:2rem 0;border-radius:.75rem}.blog-article .video-wrapper iframe,.article-content .video-wrapper iframe,.blog-article .embed-wrapper iframe,.article-content .embed-wrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;margin:0}.blog-article .emoji,.article-content .emoji,.blog-article span[role=img],.article-content span[role=img]{display:inline-block;vertical-align:middle;font-size:1.2em;line-height:1}.blog-article ul li:before,.article-content ul li:before{content:none}.blog-article ul.icon-list li,.article-content ul.icon-list li{list-style:none;position:relative;padding-left:1.5rem}.blog-article ul.icon-list li:before,.article-content ul.icon-list li:before{position:absolute;left:0;top:.25em}:global(.dark) .blog-article img,:global(.dark) .article-content img{box-shadow:0 4px 6px -1px #0000004d,0 2px 4px -1px #0003;border-color:var(--sl-color-gray-6)}@media (max-width: 768px){.blog-article img,.article-content img{border-radius:.5rem;margin:1.5rem auto}.blog-article figure,.article-content figure{margin:1.5rem 0}.blog-article figcaption,.article-content figcaption{font-size:.85rem;padding:0 .5rem}.blog-article,.article-content{padding-left:.5rem;padding-right:.5rem}.blog-article pre,.article-content pre{border-radius:.5rem;font-size:.85rem}}@media (max-width: 480px){.blog-article img,.article-content img{border-radius:.375rem;margin:1rem auto}.blog-article figure,.article-content figure{margin:1rem 0}}.blog-article img[loading=lazy],.article-content img[loading=lazy]{background:linear-gradient(90deg,var(--sl-color-gray-5) 0%,var(--sl-color-gray-4) 50%,var(--sl-color-gray-5) 100%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.blog-article .image-gallery,.article-content .image-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;margin:2rem 0}.blog-article .image-gallery img,.article-content .image-gallery img{margin:0;width:100%;height:100%;object-fit:cover}.blog-article .image-row,.article-content .image-row{display:flex;gap:1rem;margin:2rem 0;flex-wrap:wrap}.blog-article .image-row img,.article-content .image-row img{flex:1;min-width:0;margin:0}.blog-article .full-width-image,.article-content .full-width-image{margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%);max-width:100vw;width:100vw}.blog-article .full-width-image img,.article-content .full-width-image img{width:100%;max-width:1400px;margin-left:auto;margin-right:auto;border-radius:0}.blog-article .screenshot,.article-content .screenshot{box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;border:1px solid var(--sl-color-gray-4)}.blog-article .terminal-screenshot,.article-content .terminal-screenshot{border-radius:.5rem;overflow:hidden;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.blog-article .image-comparison,.article-content .image-comparison{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:2rem 0}.blog-article .image-comparison img,.article-content .image-comparison img{margin:0}.blog-article .image-comparison figcaption,.article-content .image-comparison figcaption{grid-column:1 / -1;text-align:center;margin-top:1rem}@media (max-width: 640px){.blog-article .image-comparison,.article-content .image-comparison{grid-template-columns:1fr}.blog-article .image-row,.article-content .image-row{flex-direction:column}}.blog-article img.error,.article-content img.error{display:flex;align-items:center;justify-content:center;min-height:200px;background:var(--sl-color-gray-5);position:relative}.blog-article img.error:after,.article-content img.error:after{content:"🖼️ Image not found";position:absolute;color:var(--sl-color-text-muted);font-size:.875rem}@media print{.blog-article img,.article-content img{max-width:100%;page-break-inside:avoid;border:1px solid #ddd;box-shadow:none}}.image-error-placeholder:where(.astro-4sn4zg3r){display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;background:var(--sl-color-gray-6);border:2px dashed var(--sl-color-gray-5);border-radius:.75rem;padding:2rem;margin:2rem auto;max-width:100%;text-align:center}.image-error-placeholder:where(.astro-4sn4zg3r) .error-icon:where(.astro-4sn4zg3r){font-size:3rem;margin-bottom:1rem;opacity:.5}.image-error-placeholder:where(.astro-4sn4zg3r) .error-text:where(.astro-4sn4zg3r){color:var(--sl-color-text-muted);font-size:1rem;margin-bottom:.5rem}.image-error-placeholder:where(.astro-4sn4zg3r) .error-path:where(.astro-4sn4zg3r){color:var(--sl-color-text-muted);font-size:.75rem;font-family:monospace;opacity:.7;word-break:break-all;max-width:300px}.article-content:where(.astro-4sn4zg3r) img:where(.astro-4sn4zg3r).loading,.blog-article:where(.astro-4sn4zg3r) img:where(.astro-4sn4zg3r).loading{opacity:0;transition:opacity .3s ease}.article-content:where(.astro-4sn4zg3r) img:where(.astro-4sn4zg3r).loaded,.blog-article:where(.astro-4sn4zg3r) img:where(.astro-4sn4zg3r).loaded{opacity:1;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.dark .image-error-placeholder:where(.astro-4sn4zg3r){background:var(--sl-color-gray-7);border-color:var(--sl-color-gray-6)}@media (max-width: 768px){.image-error-placeholder:where(.astro-4sn4zg3r){min-height:150px;padding:1.5rem;margin:1.5rem auto}.image-error-placeholder:where(.astro-4sn4zg3r) .error-icon:where(.astro-4sn4zg3r){font-size:2rem}.image-error-placeholder:where(.astro-4sn4zg3r) .error-text:where(.astro-4sn4zg3r){font-size:.9rem}}.blog-post:where(.astro-4sn4zg3r){min-height:100vh;background:var(--sl-color-bg);color:var(--sl-color-text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}.blog-article:where(.astro-4sn4zg3r){max-width:800px;margin:0 auto;padding:2rem 1rem}.back-link:where(.astro-4sn4zg3r){margin-bottom:2rem}.back-link:where(.astro-4sn4zg3r) a:where(.astro-4sn4zg3r){color:var(--sl-color-text-muted);text-decoration:none;font-size:.9rem;transition:color .2s ease}.back-link:where(.astro-4sn4zg3r) a:where(.astro-4sn4zg3r):hover{color:var(--sl-color-accent)}.article-header:where(.astro-4sn4zg3r){margin-bottom:3rem;text-align:center}.article-meta:where(.astro-4sn4zg3r){display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:1rem;font-size:.9rem;color:var(--sl-color-text-muted)}.article-date:where(.astro-4sn4zg3r){display:flex;align-items:center}.article-category:where(.astro-4sn4zg3r){background:var(--sl-color-accent);color:#fff;padding:.25rem .75rem;border-radius:1rem;font-size:.8rem;font-weight:500;text-transform:capitalize}.article-title:where(.astro-4sn4zg3r){font-size:2.5rem;font-weight:700;line-height:1.2;margin-bottom:1rem;color:var(--sl-color-text)}.article-description:where(.astro-4sn4zg3r){font-size:1.2rem;color:var(--sl-color-text-muted);line-height:1.6;margin-bottom:1.5rem}.article-tags:where(.astro-4sn4zg3r){display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap}.tag:where(.astro-4sn4zg3r){background:var(--sl-color-bg-sidebar);color:var(--sl-color-text);padding:.375rem .75rem;border-radius:1rem;font-size:.8rem;border:1px solid var(--sl-color-gray-5)}.article-content:where(.astro-4sn4zg3r){line-height:1.7;font-size:1.1rem;overflow-wrap:break-word;word-wrap:break-word}.article-content:where(.astro-4sn4zg3r) img{max-width:100%;height:auto;display:block;margin:2rem auto;border-radius:.75rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;border:1px solid var(--sl-color-gray-5)}.article-content:where(.astro-4sn4zg3r) p img{display:inline-block;margin:0 .25rem;vertical-align:middle;max-height:1.5em;width:auto;border:none;box-shadow:none;border-radius:0}.article-content:where(.astro-4sn4zg3r) figure{margin:2rem 0;text-align:center}.article-content:where(.astro-4sn4zg3r) figure img{margin-bottom:.5rem}.article-content:where(.astro-4sn4zg3r) figcaption{font-size:.9rem;color:var(--sl-color-text-muted);font-style:italic;margin-top:.5rem}.article-content:where(.astro-4sn4zg3r) h1,.article-content:where(.astro-4sn4zg3r) h2,.article-content:where(.astro-4sn4zg3r) h3,.article-content:where(.astro-4sn4zg3r) h4{color:var(--sl-color-text);margin-top:2rem;margin-bottom:1rem;line-height:1.3}.article-content:where(.astro-4sn4zg3r) h1{font-size:2rem;font-weight:700}.article-content:where(.astro-4sn4zg3r) h2{font-size:1.6rem;font-weight:600}.article-content:where(.astro-4sn4zg3r) h3{font-size:1.4rem;font-weight:600}.article-content:where(.astro-4sn4zg3r) p{margin-bottom:1.5rem;color:var(--sl-color-text)}.article-content:where(.astro-4sn4zg3r) a{color:var(--sl-color-accent);text-decoration:none;font-weight:500}.article-content:where(.astro-4sn4zg3r) a:hover{text-decoration:underline}.article-content:where(.astro-4sn4zg3r) ul,.article-content:where(.astro-4sn4zg3r) ol{margin-bottom:1.5rem;padding-left:2rem}.article-content:where(.astro-4sn4zg3r) li{margin-bottom:.5rem}.article-content:where(.astro-4sn4zg3r) blockquote{border-left:4px solid var(--sl-color-accent);background:var(--sl-color-bg-sidebar);padding:1rem 1.5rem;margin:2rem 0;border-radius:.5rem;font-style:italic}.article-content:where(.astro-4sn4zg3r) code{background:var(--sl-color-bg-inline-code, var(--sl-color-gray-6));padding:.125rem .375rem;border-radius:.25rem;font-family:Fira Code,SF Mono,Monaco,Inconsolata,Roboto Mono,monospace;font-size:.875em;color:var(--sl-color-text-code)}.article-content:where(.astro-4sn4zg3r) pre{background:var(--sl-color-bg-sidebar);padding:1.5rem;border-radius:.75rem;overflow-x:auto;margin:1.5rem 0;border:1px solid var(--sl-color-gray-5);max-width:100%;text-align:left;font-family:Fira Code,SF Mono,Monaco,Inconsolata,Roboto Mono,monospace;font-size:.9rem;line-height:1.6}.article-content:where(.astro-4sn4zg3r) pre code{background:transparent;padding:0;font-size:.875rem}.article-content:where(.astro-4sn4zg3r) table{width:100%;border-collapse:collapse;margin:2rem 0;border:1px solid var(--sl-color-gray-5);border-radius:.5rem;overflow:hidden}.article-content:where(.astro-4sn4zg3r) th,.article-content:where(.astro-4sn4zg3r) td{padding:.75rem;text-align:left;border-bottom:1px solid var(--sl-color-gray-5)}.article-content:where(.astro-4sn4zg3r) th{background:var(--sl-color-bg-sidebar);font-weight:600}.article-content:where(.astro-4sn4zg3r) tbody tr:last-child td{border-bottom:none}.article-content:where(.astro-4sn4zg3r) .table-wrapper,.article-content:where(.astro-4sn4zg3r) .overflow-x-auto{overflow-x:auto;margin:1.5rem 0}.article-content:where(.astro-4sn4zg3r) .callout,.article-content:where(.astro-4sn4zg3r) .note,.article-content:where(.astro-4sn4zg3r) .warning,.article-content:where(.astro-4sn4zg3r) .tip{padding:1rem 1.25rem;margin:1.5rem 0;border-radius:.5rem;border-left:4px solid var(--sl-color-accent);background:var(--sl-color-bg-sidebar)}.article-content:where(.astro-4sn4zg3r) ul ul,.article-content:where(.astro-4sn4zg3r) ol ol,.article-content:where(.astro-4sn4zg3r) ul ol,.article-content:where(.astro-4sn4zg3r) ol ul{margin-bottom:.5rem;margin-top:.5rem}.article-content:where(.astro-4sn4zg3r) strong{font-weight:600;color:var(--sl-color-text)}.article-content:where(.astro-4sn4zg3r) em{font-style:italic}.article-content:where(.astro-4sn4zg3r) hr{border:none;border-top:1px solid var(--sl-color-gray-5);margin:2rem 0}.article-content:where(.astro-4sn4zg3r) video{max-width:100%;height:auto;border-radius:.75rem;margin:2rem 0}.article-content:where(.astro-4sn4zg3r) iframe{max-width:100%;border-radius:.75rem;margin:2rem 0}.article-content:where(.astro-4sn4zg3r) .mdx-component{margin:2rem 0}.article-footer:where(.astro-4sn4zg3r){margin-top:4rem;padding-top:3rem;border-top:1px solid var(--sl-color-gray-5)}.footer-cta:where(.astro-4sn4zg3r){background:linear-gradient(135deg,var(--sl-color-accent) 0%,#6366f1 100%);padding:2rem;border-radius:1rem;text-align:center;margin-bottom:2rem;color:#fff}.footer-cta:where(.astro-4sn4zg3r) h3:where(.astro-4sn4zg3r){font-size:1.5rem;font-weight:600;margin-bottom:.5rem}.footer-cta:where(.astro-4sn4zg3r) p:where(.astro-4sn4zg3r){margin-bottom:1.5rem;opacity:.9}.cta-button:where(.astro-4sn4zg3r){display:inline-block;background:#fff3;color:#fff!important;padding:.75rem 2rem;border-radius:.5rem;text-decoration:none!important;font-weight:600;transition:all .2s ease;backdrop-filter:blur(10px)}.cta-button:where(.astro-4sn4zg3r):hover{background:#ffffff4d;transform:translateY(-1px)}.back-to-blog:where(.astro-4sn4zg3r){text-align:center}.back-button:where(.astro-4sn4zg3r){color:var(--sl-color-text-muted);text-decoration:none;font-weight:500;transition:color .2s ease}.back-button:where(.astro-4sn4zg3r):hover{color:var(--sl-color-accent)}@media (max-width: 768px){.blog-article:where(.astro-4sn4zg3r){padding:1.5rem 1rem}.article-title:where(.astro-4sn4zg3r){font-size:2rem}.article-description:where(.astro-4sn4zg3r){font-size:1.1rem}.article-content:where(.astro-4sn4zg3r){font-size:1rem}.article-meta:where(.astro-4sn4zg3r){flex-direction:column;gap:.5rem}.footer-cta:where(.astro-4sn4zg3r){padding:1.5rem}}@media (max-width: 480px){.blog-article:where(.astro-4sn4zg3r){padding:1rem .75rem}.article-title:where(.astro-4sn4zg3r){font-size:1.75rem}.article-content:where(.astro-4sn4zg3r) pre{padding:1rem;font-size:.8rem}.article-content:where(.astro-4sn4zg3r) img{border-radius:.5rem}.article-content:where(.astro-4sn4zg3r) table{font-size:.9rem}}
