@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--blog-primary: #2563eb;--blog-primary-light: #3b82f6;--blog-secondary: #64748b;--blog-accent: #0ea5e9;--blog-bg: #ffffff;--blog-surface: #f8fafc;--blog-border: #e2e8f0;--blog-border-light: #f1f5f9;--blog-text-primary: #0f172a;--blog-text-secondary: #475569;--blog-text-muted: #64748b;--blog-success: #059669;--blog-warning: #d97706;--blog-error: #dc2626;--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace;--radius: .75rem;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1)}.dark{--blog-primary: #3b82f6;--blog-primary-light: #60a5fa;--blog-secondary: #94a3b8;--blog-accent: #38bdf8;--blog-bg: #0f172a;--blog-surface: #1e293b;--blog-border: #334155;--blog-border-light: #475569;--blog-text-primary: #f8fafc;--blog-text-secondary: #cbd5e1;--blog-text-muted: #94a3b8;--blog-success: #10b981;--blog-warning: #f59e0b;--blog-error: #ef4444}.blog-container{background:var(--blog-bg);color:var(--blog-text-primary);min-height:100vh;font-family:var(--font-sans);line-height:1.6}.blog-heading{font-weight:700;color:var(--blog-text-primary);letter-spacing:-.025em}.blog-heading-xl{font-size:clamp(2rem,5vw,3.5rem);line-height:1.1}.blog-heading-lg{font-size:clamp(1.75rem,4vw,2.5rem);line-height:1.2}.blog-heading-md{font-size:clamp(1.25rem,3vw,1.875rem);line-height:1.3}.blog-heading-sm{font-size:clamp(1rem,2.5vw,1.25rem);line-height:1.4}.blog-text-primary{color:var(--blog-text-primary)}.blog-text-secondary{color:var(--blog-text-secondary)}.blog-text-muted{color:var(--blog-text-muted)}.blog-card{background:var(--blog-bg);border:1px solid var(--blog-border);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:all .2s ease-in-out;overflow:hidden}.blog-card:hover{border-color:var(--blog-primary-light);box-shadow:var(--shadow-md);transform:translateY(-2px)}.blog-card-surface{background:var(--blog-surface);border:1px solid var(--blog-border-light)}.blog-button{background:var(--blog-primary);color:#fff;font-weight:500;padding:.75rem 1.5rem;border-radius:calc(var(--radius) - .25rem);border:none;cursor:pointer;transition:all .2s ease-in-out;display:inline-flex;align-items:center;gap:.5rem}.blog-button:hover{background:var(--blog-primary-light);transform:translateY(-1px);box-shadow:var(--shadow-md)}.blog-button:active{transform:translateY(0)}.blog-button-secondary{background:var(--blog-surface);color:var(--blog-text-primary);border:1px solid var(--blog-border)}.blog-button-secondary:hover{background:var(--blog-border-light);border-color:var(--blog-primary)}.blog-badge{background:var(--blog-primary);color:#fff;font-size:.75rem;font-weight:500;padding:.25rem .75rem;border-radius:calc(var(--radius) - .25rem);display:inline-flex;align-items:center}.blog-badge-secondary{background:var(--blog-surface);color:var(--blog-text-secondary)}.blog-badge-success{background:var(--blog-success);color:#fff}.blog-badge-warning{background:var(--blog-warning);color:#fff}.blog-input{background:var(--blog-bg);border:1px solid var(--blog-border);color:var(--blog-text-primary);font-family:var(--font-sans);padding:.75rem 1rem;border-radius:calc(var(--radius) - .25rem);font-size:.95rem;transition:all .2s ease-in-out;width:100%}.blog-input:focus{outline:none;border-color:var(--blog-primary);box-shadow:0 0 0 3px #2563eb1a}.blog-input::placeholder{color:var(--blog-text-muted)}.blog-grid{display:grid;gap:1.5rem;padding:1.5rem}.blog-grid-1{grid-template-columns:1fr}.blog-grid-2{grid-template-columns:repeat(2,1fr)}.blog-grid-3{grid-template-columns:repeat(3,1fr)}.blog-grid-4{grid-template-columns:repeat(4,1fr)}.blog-grid-responsive{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}@media (max-width: 768px){.blog-grid{grid-template-columns:1fr;gap:1rem;padding:1rem}}.blog-grid.blog-grid-no-x-padding{padding-left:0;padding-right:0}@media (max-width: 768px){.blog-grid.blog-grid-no-x-padding{padding-left:1rem;padding-right:1rem}}.blog-section{padding:3rem 0}.blog-section-sm{padding:2rem 0}.blog-section-lg{padding:4rem 0}.blog-status{display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500}.blog-status-success{color:var(--blog-success)}.blog-status-warning{color:var(--blog-warning)}.blog-status-error{color:var(--blog-error)}.blog-status-info{color:var(--blog-primary)}.blog-code{font-family:var(--font-mono);background:var(--blog-surface);border:1px solid var(--blog-border);border-radius:calc(var(--radius) - .25rem);padding:1rem;font-size:.875rem;overflow-x:auto}.blog-code-inline{font-family:var(--font-mono);background:var(--blog-surface);padding:.125rem .375rem;border-radius:.25rem;font-size:.875rem}.blog-link{color:var(--blog-primary);text-decoration:none;transition:color .2s ease-in-out}.blog-link:hover{color:var(--blog-primary-light)}.prose pre{border:1px solid var(--blog-border);border-radius:calc(var(--radius) - .25rem);padding:.75rem .5rem;margin:1rem -.5rem;overflow-x:auto;overflow-y:hidden;box-shadow:var(--shadow-sm);position:relative;width:calc(100% + 1rem);max-width:100%;white-space:pre}@media (min-width: 768px){.prose pre{margin:1rem -1rem;width:calc(100% + 2rem);padding:1rem 1.5rem;max-width:100%;white-space:pre}}.prose pre.shiki{background:var(--shiki-light-bg, var(--blog-surface))!important}.dark .prose pre.shiki{background:var(--shiki-dark-bg, var(--blog-surface))!important}.prose pre:not(.shiki){background:var(--blog-surface)}.prose pre code[class*=language-]{color:var(--blog-text-primary)}.prose pre code[class*=language-tsx] .token-keyword,.prose pre code[class*=language-typescript] .token-keyword,.prose pre pre code[class*=language-javascript] .token-keyword{color:#d73a49;font-weight:600}.prose pre code[class*=language-tsx] .token-string,.prose pre code[class*=language-typescript] .token-string,.prose pre code[class*=language-javascript] .token-string{color:#032f62}.prose pre code[class*=language-tsx] .token-function,.prose pre code[class*=language-typescript] .token-function,.prose pre code[class*=language-javascript] .token-function{color:#6f42c1}.prose pre code[class*=language-tsx] .token-comment,.prose pre code[class*=language-typescript] .token-comment,.prose pre code[class*=language-javascript] .token-comment{color:#6a737d;font-style:italic}.prose pre[class*=language-]:before{content:attr(data-language);position:absolute;top:.5rem;right:.75rem;font-size:.75rem;color:var(--blog-text-muted);text-transform:uppercase;font-weight:600;letter-spacing:.05em}.prose pre code,.prose pre code *,.prose pre.shiki code,.prose pre.shiki code *,.prose pre[class*=language-] code,.prose pre[class*=language-] code *{font-family:var(--font-mono);font-size:.9rem;line-height:1.4!important;tab-size:2;white-space:pre;word-wrap:break-word;overflow-wrap:break-word}.prose pre{position:relative}.prose pre code{display:block;padding-left:0;overflow-x:visible;white-space:pre;word-wrap:break-word;overflow-wrap:break-word}.prose pre code:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3.7rem;background:var(--blog-surface);border-right:1px solid var(--blog-border);opacity:.8}@media (max-width: 480px){.prose pre code:before{width:2.5rem}}@media (min-width: 481px) and (max-width: 768px){.prose pre code:before{width:2.75rem}}.prose pre code .line{display:block;position:relative;padding-left:3.5rem;padding-right:1rem;line-height:1.4;white-space:pre;word-wrap:break-word;overflow-wrap:break-word;min-width:max-content}.prose pre:not(.shiki) code{color:var(--blog-text-primary)}.prose pre code>span,.prose pre.shiki code>span,.prose pre[class*=language-] code>span,.prose pre code .line,.prose pre.shiki code .line,.prose pre[class*=language-] code .line{display:block;position:relative;padding-left:3.5rem;margin-left:0;margin-right:0;line-height:1.2!important;white-space:pre;word-wrap:break-word;overflow-wrap:break-word;min-width:max-content}.prose pre code>span.line{display:flex;align-items:center;position:relative;margin-right:0;line-height:1.2!important;min-height:1.2em}.prose pre code>span.line>.ln{position:absolute;left:.5rem;top:50%;transform:translateY(-50%);width:2.5rem;text-align:right;padding-right:.5rem;color:var(--blog-text-muted);opacity:.65;-webkit-user-select:none;user-select:none;font-size:.875rem;font-family:var(--font-mono);line-height:1.2;display:inline-block;z-index:1;height:1.2em}.prose pre code>span:before,.prose pre code .line:before{content:none!important;display:none!important}.prose pre code span[data-line-number]>.ln,.prose pre code span.line .ln{position:absolute;left:-.5rem;top:50%;transform:translateY(-50%);width:2.5rem;text-align:right;padding-right:.5rem;color:var(--blog-text-muted);opacity:.65;-webkit-user-select:none;user-select:none;font-size:.9rem;font-family:var(--font-mono);line-height:1.2;display:inline-block;z-index:1}.prose pre code>span.line>span:not(.ln){flex:1;display:flex;align-items:center}.prose pre:not(.shiki):not([class*=language-]) code{color:var(--blog-text-primary)}.prose pre:not(.shiki):not([class*=language-]) code span{color:var(--blog-text-primary)}.prose pre.shiki code,.prose pre[class*=language-] code{font-variant-ligatures:normal}html.dark .prose pre code span[style*=--shiki-dark],.dark .prose pre code span[style*=--shiki-dark],html.dark .prose pre.shiki code span[style*=--shiki-dark],html.dark .prose pre[class*=language-] code span[style*=--shiki-dark],.dark .prose pre.shiki code span[style*=--shiki-dark],.dark .prose pre[class*=language-] code span[style*=--shiki-dark],html.dark .prose pre code span[style*="color:"][style*=--shiki-dark],.dark .prose pre code span[style*="color:"][style*=--shiki-dark]{color:var(--shiki-dark)!important}.prose pre:not(.shiki):not([class*=language-]):not([data-theme]) code span:not([style]){color:var(--blog-text-primary)}.prose pre code{counter-reset:none}.prose pre code>span.line[data-empty-line=true]{min-height:1.2em;height:1.2em}.prose pre code>span.line[data-empty-line=true]>.ln{left:-.2rem;display:block}.prose pre code>span>span,.prose pre.shiki code>span>span,.prose pre[class*=language-] code>span>span,.prose pre code .line>span,.prose pre.shiki code .line>span,.prose pre[class*=language-] code .line>span{line-height:1.2!important}@media (max-width: 480px){.prose pre code>span,.prose pre.shiki code>span,.prose pre[class*=language-] code>span,.prose pre code .line,.prose pre.shiki code .line,.prose pre[class*=language-] code .line{padding-left:3rem;margin-left:0;font-size:.8rem;white-space:pre;word-wrap:break-word;overflow-wrap:break-word;min-width:max-content}.prose pre code>span.line{padding-left:3rem;margin-left:0;font-size:.8rem}.prose pre code>span.line>.ln{left:.25rem;width:2.5rem;font-size:.8rem}.prose pre code span[data-line-number]>.ln,.prose pre code span.line .ln{left:-.2rem;width:2.5rem;font-size:.8rem}.prose pre{padding:.5rem .25rem;margin:1rem -.25rem;width:calc(100% + .5rem)}.prose pre code,.prose pre code *,.prose pre.shiki code,.prose pre.shiki code *,.prose pre[class*=language-] code,.prose pre[class*=language-] code *{font-size:.8rem!important}}@media (min-width: 481px) and (max-width: 768px){.prose pre code>span,.prose pre.shiki code>span,.prose pre[class*=language-] code>span,.prose pre code .line,.prose pre.shiki code .line,.prose pre[class*=language-] code .line{padding-left:2.75rem;margin-left:0;font-size:.85rem;white-space:pre;word-wrap:break-word;overflow-wrap:break-word;min-width:max-content}.prose pre code>span.line{padding-left:2.75rem;margin-left:0;font-size:.85rem}.prose pre code>span.line>.ln{left:.25rem;width:2.25rem;font-size:.8rem}.prose pre code span[data-line-number]>.ln,.prose pre code span.line .ln{left:.25rem;width:2.25rem;font-size:.8rem}.prose pre code,.prose pre code *,.prose pre.shiki code,.prose pre.shiki code *,.prose pre[class*=language-] code,.prose pre[class*=language-] code *{font-size:.85rem!important}}.prose{max-width:none;color:var(--blog-text-primary)}.prose h1{font-size:clamp(2rem,5vw,2.5rem);line-height:1.2;font-weight:800;margin:2rem 0 1rem;color:var(--blog-text-primary);letter-spacing:-.025em}.prose h2{font-size:clamp(1.5rem,4vw,1.875rem);line-height:1.3;font-weight:700;margin:2rem 0 1rem;color:var(--blog-text-primary);letter-spacing:-.02em;padding-bottom:.5rem;border-bottom:1px solid var(--blog-border-light)}.prose h3{font-size:clamp(1.25rem,3vw,1.5rem);line-height:1.4;font-weight:600;margin:1.5rem 0 .75rem;color:var(--blog-text-primary);letter-spacing:-.015em}.prose h4{font-size:1.125rem;line-height:1.4;font-weight:600;margin:1.5rem 0 .5rem;color:var(--blog-text-primary)}.prose h5{font-size:1rem;line-height:1.4;font-weight:600;margin:1.25rem 0 .5rem;color:var(--blog-text-primary)}.prose h6{font-size:.875rem;line-height:1.4;font-weight:600;margin:1rem 0 .5rem;color:var(--blog-text-secondary);text-transform:uppercase;letter-spacing:.05em}.prose p{margin:1rem 0;color:var(--blog-text-secondary);line-height:1.7;font-size:1rem}.prose strong{font-weight:600;color:var(--blog-text-primary)}.prose em{font-style:italic;color:var(--blog-text-secondary)}.prose ul,.prose ol{margin:1rem 0;padding-left:1.5rem}.prose ul{list-style-type:disc}.prose ol{list-style-type:decimal}.prose li{margin:.5rem 0;line-height:1.6;color:var(--blog-text-secondary)}.prose li::marker{color:var(--blog-text-muted)}.prose a{color:var(--blog-primary);text-decoration:none;border-bottom:1px solid transparent;transition:all .2s ease;overflow-wrap:anywhere;word-break:break-word}.prose a:hover{color:var(--blog-primary-light);border-bottom-color:var(--blog-primary-light)}.prose h1 a,.prose h2 a,.prose h3 a,.prose h4 a,.prose h5 a,.prose h6 a{color:inherit;text-decoration:none;border-bottom:none;transition:none}.prose h1 a:hover,.prose h2 a:hover,.prose h3 a:hover,.prose h4 a:hover,.prose h5 a:hover,.prose h6 a:hover{color:inherit;border-bottom:none}.prose blockquote{border-left:4px solid var(--blog-primary);padding-left:1.5rem;color:var(--blog-text-secondary);margin:1.5rem 0;font-style:italic;background:var(--blog-surface);padding:1rem 1.5rem;border-radius:0 calc(var(--radius) - .25rem) calc(var(--radius) - .25rem) 0}.prose blockquote p{margin:.5rem 0}.prose hr{border:none;height:1px;background:var(--blog-border);margin:2rem 0}.prose table{width:100%;margin:1.5rem 0;border-collapse:collapse;border:1px solid var(--blog-border);border-radius:var(--radius);overflow:hidden}.prose th{background:var(--blog-surface);color:var(--blog-text-primary);font-weight:600;padding:.75rem 1rem;text-align:left;border-bottom:1px solid var(--blog-border)}.prose td{padding:.75rem 1rem;border-bottom:1px solid var(--blog-border-light);color:var(--blog-text-secondary)}.prose tr:last-child td{border-bottom:none}.prose code:not(pre code){background:var(--blog-surface);color:var(--blog-text-primary);padding:.125rem .375rem;border-radius:.25rem;font-size:.875rem;font-family:var(--font-mono);border:1px solid var(--blog-border-light);font-weight:500}.prose input[type=checkbox]{appearance:none;-webkit-appearance:none;width:1rem;height:1rem;border:2px solid var(--blog-border);border-radius:.25rem;background:var(--blog-bg);margin-right:.2rem;margin-top:-3px;vertical-align:middle;position:relative;cursor:pointer;transition:all .2s ease}.prose input[type=checkbox]:hover{border-color:var(--blog-primary)}.prose input[type=checkbox]:checked{background:var(--blog-primary);border-color:var(--blog-primary)}.prose input[type=checkbox]:checked:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:.75rem;font-weight:700}.prose li:has(input[type=checkbox]){list-style:none;margin-left:-1.5rem;padding-left:0}.prose ul:has(li input[type=checkbox]){padding-left:1.5rem}.dark .prose blockquote{border-left-color:var(--blog-primary);background:var(--blog-surface)}.prose pre code>span:before{content:counter(line);position:absolute;left:4px;width:2rem;text-align:left;padding-right:1rem;color:var(--blog-text-muted);opacity:.65;-webkit-user-select:none;user-select:none}.blog-divider{border:none;height:1px;background:var(--blog-border);margin:2rem 0}.blog-fade-in{animation:fadeIn .5s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.blog-scrollbar::-webkit-scrollbar{width:6px;height:6px}.blog-scrollbar::-webkit-scrollbar-track{background:var(--blog-surface)}.blog-scrollbar::-webkit-scrollbar-thumb{background:var(--blog-border);border-radius:3px}.blog-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--blog-text-muted)}.line-clamp-2{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}.line-clamp-3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}