:root{--color-bg:#fff;--color-text:#1f2937;--color-text-muted:#6b7280;--color-accent:#2563eb;--color-accent-dark:#1d4ed8;--color-border:#e5e7eb;--color-code-bg:#f3f4f6;--font-sans:ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--max-width:760px}*{box-sizing:border-box}body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);margin:0;line-height:1.7}a{color:var(--color-accent);text-decoration:none}a:hover{color:var(--color-accent-dark);text-decoration:underline}.container{max-width:var(--max-width);margin:0 auto;padding:0 1.5rem}.site-header{border-bottom:1px solid var(--color-border);padding:1rem 0}.site-header .container{justify-content:space-between;align-items:center;display:flex}.site-title{color:var(--color-text);font-size:1.25rem;font-weight:700}.site-nav a{color:var(--color-text-muted);margin-left:1.5rem;font-size:.95rem}.site-nav a:hover{color:var(--color-text)}.hero{border-bottom:1px solid var(--color-border);padding:4rem 0 2rem}.hero h1{letter-spacing:-.02em;margin:0 0 .75rem;font-size:2.5rem}.hero p{color:var(--color-text-muted);margin:0;font-size:1.15rem}.post-list{padding:3rem 0}.post-list h2{color:var(--color-text-muted);margin-bottom:1.5rem;font-size:1.25rem;font-weight:500}.post-list ul{margin:0;padding:0;list-style:none}.post-card{border-bottom:1px solid var(--color-border);padding:1.5rem 0}.post-card:last-child{border-bottom:none}.post-card-title{color:var(--color-text);margin-bottom:.5rem;font-size:1.35rem;font-weight:700;display:block}.post-card-description{color:var(--color-text-muted);margin:0 0 .75rem}.post-card-meta{color:var(--color-text-muted);margin:0;font-size:.875rem}.blog-post{padding:3rem 0}.post-header{border-bottom:1px solid var(--color-border);margin-bottom:2.5rem;padding-bottom:2rem}.post-header h1{letter-spacing:-.02em;margin:0 0 1rem;font-size:2.25rem;line-height:1.2}.post-meta{color:var(--color-text-muted);margin:0 0 1rem;font-size:.95rem}.post-content h1,.post-content h2,.post-content h3,.post-content h4{margin-top:2.5rem;margin-bottom:1rem;line-height:1.3}.post-content h2{border-bottom:1px solid var(--color-border);padding-bottom:.5rem;font-size:1.75rem}.post-content h3{font-size:1.35rem}.post-content p,.post-content ul,.post-content ol{margin:1rem 0}.post-content ul,.post-content ol{padding-left:1.5rem}.post-content li{margin:.35rem 0}.post-content img{border:1px solid var(--color-border);border-radius:.5rem;max-width:100%;height:auto;margin:1.5rem 0;display:block}.post-content blockquote{border-left:4px solid var(--color-accent);background-color:var(--color-code-bg);color:var(--color-text-muted);margin:1.5rem 0;padding:.75rem 1.25rem;font-style:italic}.post-content code{font-family:var(--font-mono);background-color:var(--color-code-bg);border-radius:.25rem;padding:.15rem .35rem;font-size:.875em}.post-content pre{background-color:var(--color-code-bg);border-radius:.5rem;margin:1.5rem 0;padding:1rem;overflow-x:auto}.post-content pre code{background-color:#0000;padding:0}.post-content table{border-collapse:collapse;width:100%;margin:1.5rem 0}.post-content th,.post-content td{border:1px solid var(--color-border);text-align:left;padding:.75rem}.post-content th{background-color:var(--color-code-bg);font-weight:600}.tags{flex-wrap:wrap;gap:.5rem;margin-top:1rem;display:flex}.tag{background-color:var(--color-code-bg);color:var(--color-text-muted);border-radius:9999px;padding:.25rem .6rem;font-size:.75rem}.site-footer{border-top:1px solid var(--color-border);text-align:center;color:var(--color-text-muted);margin-top:3rem;padding:2rem 0;font-size:.9rem}.site-footer a{color:var(--color-text-muted);text-decoration:underline}.lang-switch{border:1px solid var(--color-border);border-radius:.375rem;padding:.25rem .5rem;font-weight:600}.mermaid-diagram{text-align:center;margin:1.5rem 0;overflow-x:auto}.mermaid-diagram svg{max-width:100%;height:auto}.mermaid-error{color:var(--color-danger,#dc2626);background-color:var(--color-code-bg);border-radius:.5rem;padding:1rem}@media (width<=640px){.hero h1{font-size:2rem}.post-header h1{font-size:1.75rem}.site-header .container{flex-direction:column;align-items:flex-start;gap:.75rem}.site-nav a{margin-left:0;margin-right:1rem}}