:root{--color-bg: #ffffff;--color-bg-subtle: #fafafa;--color-bg-card: #ffffff;--color-text: #0a0a0a;--color-text-muted: #6b7280;--color-text-subtle: #9ca3af;--color-accent: #3b82f6;--color-accent-hover: #2563eb;--color-accent-subtle: #dbeafe;--color-border: #e5e7eb;--color-border-strong: #d1d5db;--color-code-bg: #f9fafb;--color-code-text: #1f2937;--color-success: #10b981;--color-error: #ef4444;--color-warning: #f59e0b;--shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);--shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);--shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);--font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-family-code: "JetBrains Mono", "Fira Code", Consolas, monospace;--font-size-base: 16px;--font-size-small: 0.875rem;--font-size-large: 1.25rem;--line-height: 1.6;--spacing-xs: 0.25rem;--spacing-sm: 0.5rem;--spacing-md: 1rem;--spacing-lg: 2rem;--spacing-xl: 3rem;--border-radius-sm: 0.375rem;--border-radius-md: 0.5rem;--border-radius-lg: 0.75rem;--border-radius-xl: 1rem;--border-radius-full: 9999px;--max-width: 800px;--max-width-wide: 1200px;--transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);--transition-fast: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);--transition-slow: all 0.3s cubic-bezier(0.4, 0, 0.2, 1)}[data-theme=dark]{--color-bg: #0a0a0a;--color-bg-subtle: #111111;--color-bg-card: #141414;--color-text: #fafafa;--color-text-muted: #a1a1aa;--color-text-subtle: #71717a;--color-accent: #60a5fa;--color-accent-hover: #93bbfc;--color-accent-subtle: #1e3a8a;--color-border: #27272a;--color-border-strong: #3f3f46;--color-code-bg: #18181b;--color-code-text: #e4e4e7;--color-success: #34d399;--color-error: #f87171;--color-warning: #fbbf24;--shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.1);--shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.2), 0 1px 2px -1px rgb(0 0 0 / 0.2);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.3), 0 2px 4px -2px rgb(0 0 0 / 0.2);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.4), 0 4px 6px -4px rgb(0 0 0 / 0.3);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.5), 0 8px 10px -6px rgb(0 0 0 / 0.4);--shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.2)}*{box-sizing:border-box}html{font-size:var(--font-size-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}:focus{outline:2px solid var(--color-accent);outline-offset:2px}:focus:not(:focus-visible){outline:none}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;border-radius:var(--border-radius-sm)}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}@keyframes pulse{0%, 100%{opacity:1}50%{opacity:.8}}body{margin:0;padding:0;font-family:var(--font-family);line-height:var(--line-height);color:var(--color-text);background-color:var(--color-bg-subtle);transition:var(--transition);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}h1,h2,h3,h4,h5,h6{margin-top:var(--spacing-lg);margin-bottom:var(--spacing-md);font-weight:600;line-height:1.25}h1{font-size:2.5rem;margin-top:0;margin-bottom:var(--spacing-lg)}section h1,article h1,aside h1,nav h1{font-size:2.5rem;margin-top:0;margin-bottom:var(--spacing-lg)}h2{font-size:2rem}h3{font-size:1.5rem}h4{font-size:1.25rem}h5{font-size:1.125rem}h6{font-size:1rem}p{margin-top:0;margin-bottom:var(--spacing-md)}a{color:var(--color-accent);text-decoration:none;transition:var(--transition-fast);position:relative}a:hover{color:var(--color-accent-hover)}a.link-underline::after{content:"";position:absolute;bottom:-2px;left:0;width:0;height:2px;background-color:var(--color-accent);transition:width .3s ease}a.link-underline:hover::after{width:100%}code{font-family:var(--font-family-code);font-size:.875em;padding:.2em .4em;background-color:var(--color-code-bg);color:var(--color-code-text);border-radius:var(--border-radius-sm);border:1px solid var(--color-border);font-weight:500}pre{overflow-x:auto;padding:var(--spacing-lg);border-radius:var(--border-radius-lg);border:1px solid var(--color-border);box-shadow:var(--shadow-inner);position:relative;background-color:var(--color-code-bg);color:var(--color-code-text)}pre code{padding:0;background-color:rgba(0,0,0,0);border:none;font-weight:400;color:inherit}pre:hover .copy-button{opacity:1}.container{min-height:100vh;display:flex;flex-direction:column}.site-header{background-color:var(--color-bg-card);backdrop-filter:blur(10px);border-bottom:1px solid var(--color-border);box-shadow:var(--shadow-sm);padding:var(--spacing-md) 0;position:sticky;top:0;z-index:100}.site-header .site-nav{max-width:var(--max-width);margin:0 auto;padding:0 var(--spacing-md);display:flex;align-items:center;justify-content:space-between}.site-header .site-title{font-size:1.25rem;font-weight:700;color:var(--color-text);letter-spacing:-.025em}.site-header .site-title:hover{text-decoration:none;color:var(--color-accent)}.site-header .nav-links{display:flex;gap:var(--spacing-sm);align-items:center}.site-header .nav-links a{color:var(--color-text-muted);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius-md);transition:var(--transition-fast);font-weight:500}.site-header .nav-links a:hover{color:var(--color-text);background-color:var(--color-bg-subtle);text-decoration:none}.site-header .nav-links a.active{color:var(--color-accent);background-color:var(--color-accent-subtle)}.theme-toggle{background:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:var(--border-radius-md);cursor:pointer;padding:var(--spacing-sm);color:var(--color-text-muted);transition:var(--transition-fast);display:flex;align-items:center;justify-content:center}.theme-toggle:hover{color:var(--color-text);background-color:var(--color-bg);border-color:var(--color-border-strong);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.theme-toggle:active{transform:translateY(0);box-shadow:var(--shadow-xs)}.theme-toggle svg{display:block;width:20px;height:20px;fill:currentColor}.theme-toggle .icon-sun{display:none}.theme-toggle .icon-moon{display:block}[data-theme=dark] .theme-toggle .icon-sun{display:block}[data-theme=dark] .theme-toggle .icon-moon{display:none}.site-main{flex:1;max-width:var(--max-width);width:100%;margin:0 auto;padding:var(--spacing-xl) var(--spacing-md);animation:fadeIn .4s ease-out}.post .post-header{margin-bottom:var(--spacing-xl)}.post .post-title{margin-bottom:var(--spacing-md)}.post .post-meta{color:var(--color-text-muted);font-size:var(--font-size-small)}.post .post-meta .separator{margin:0 var(--spacing-sm)}.post .post-tags{margin-top:var(--spacing-md);display:flex;flex-wrap:wrap;gap:var(--spacing-xs)}.post .post-tags .tag{font-size:var(--font-size-small);padding:.125rem var(--spacing-sm);background-color:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:var(--border-radius-full);color:var(--color-text-muted);font-weight:500;transition:var(--transition-fast)}.post .post-tags .tag:hover{background-color:var(--color-accent-subtle);border-color:var(--color-accent);color:var(--color-accent);text-decoration:none;transform:translateY(-1px)}.post .post-content img{max-width:100%;height:auto;border-radius:6px;margin:var(--spacing-lg) 0}.post .post-content blockquote{margin:var(--spacing-lg) 0;padding-left:var(--spacing-lg);border-left:4px solid var(--color-accent);color:var(--color-text-muted)}.post .post-content table{width:100%;border-collapse:collapse;margin:var(--spacing-lg) 0}.post .post-content table th,.post .post-content table td{padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);text-align:left}.post .post-content table th{background-color:var(--color-code-bg);font-weight:600}.post-list .post-preview{background-color:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);padding:var(--spacing-md) var(--spacing-lg) var(--spacing-lg);margin-bottom:var(--spacing-md);transition:var(--transition);box-shadow:var(--shadow-xs)}.post-list .post-preview:hover{border-color:var(--color-border-strong);box-shadow:var(--shadow-md);transform:translateY(-2px)}.post-list .post-preview:last-child{margin-bottom:0}.post-list .post-preview .post-title{font-size:1.5rem;margin-bottom:var(--spacing-sm);font-weight:700;letter-spacing:-.025em}.post-list .post-preview .post-title a{color:var(--color-text)}.post-list .post-preview .post-title a:hover{color:var(--color-accent);text-decoration:none}.post-list .post-preview .post-excerpt{margin:var(--spacing-md) 0;color:var(--color-text-muted);line-height:1.7}.post-list .post-preview .post-meta{display:flex;align-items:center;gap:var(--spacing-md);flex-wrap:wrap}.site-footer{background-color:var(--color-bg-card);border-top:1px solid var(--color-border);padding:var(--spacing-xl) 0;margin-top:var(--spacing-xl)}.site-footer .footer-content{max-width:var(--max-width);margin:0 auto;padding:0 var(--spacing-md);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing-md);color:var(--color-text-muted)}.site-footer .social-links{display:flex;gap:var(--spacing-sm)}.site-footer .social-links a{color:var(--color-text-muted);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius-md);transition:var(--transition-fast)}.site-footer .social-links a:hover{color:var(--color-accent);background-color:var(--color-bg-subtle);text-decoration:none}.button{display:inline-flex;align-items:center;justify-content:center;padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-accent);color:#fff;border:1px solid var(--color-accent);border-radius:var(--border-radius-md);font-weight:600;font-size:var(--font-size-small);letter-spacing:.025em;transition:var(--transition-fast);box-shadow:var(--shadow-sm);cursor:pointer}.button:hover{background-color:var(--color-accent-hover);border-color:var(--color-accent-hover);text-decoration:none;transform:translateY(-1px);box-shadow:var(--shadow-md)}.button:active{transform:translateY(0);box-shadow:var(--shadow-xs)}.button.button-secondary{background-color:var(--color-bg);color:var(--color-text);border-color:var(--color-border)}.button.button-secondary:hover{background-color:var(--color-bg-subtle);border-color:var(--color-border-strong)}.button.button-ghost{background-color:rgba(0,0,0,0);color:var(--color-text-muted);border-color:rgba(0,0,0,0);box-shadow:none}.button.button-ghost:hover{background-color:var(--color-bg-subtle);color:var(--color-text)}.reading-progress{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg, var(--color-accent), var(--color-accent-hover));transition:width .3s cubic-bezier(.4, 0, .2, 1);z-index:1000;box-shadow:0 1px 3px var(--color-accent)}.reading-progress::after{content:"";position:absolute;top:0;right:0;bottom:0;width:100px;background:linear-gradient(90deg, rgba(0,0,0,0), rgba(255,255,255,.4));animation:pulse 2s ease-in-out infinite}.code-block-wrapper{position:relative;margin:var(--spacing-lg) 0}.code-block-wrapper pre{margin:0}.code-block-wrapper .copy-button{position:absolute;top:var(--spacing-sm);right:var(--spacing-sm);padding:var(--spacing-xs) var(--spacing-sm);background-color:rgba(255,255,255,.9);color:#333;border:1px solid rgba(0,0,0,.1);border-radius:var(--border-radius-md);font-size:var(--font-size-small);font-weight:500;cursor:pointer;transition:var(--transition-fast);opacity:0;box-shadow:var(--shadow-sm);backdrop-filter:blur(4px)}[data-theme=dark] .code-block-wrapper .copy-button{background-color:rgba(0,0,0,.7);color:#ddd;border-color:rgba(255,255,255,.1)}.code-block-wrapper .copy-button:hover{transform:scale(1.05);box-shadow:var(--shadow-md)}.code-block-wrapper .copy-button:active{transform:scale(.95)}.code-block-wrapper .copy-button.copied{color:var(--color-success);border-color:var(--color-success)}.code-block-wrapper:hover .copy-button{opacity:1}.share-buttons{margin:var(--spacing-xl) 0;padding:var(--spacing-lg);background-color:var(--color-code-bg);border-radius:6px}.share-buttons h3{margin-top:0}.share-buttons .share-links{display:flex;gap:var(--spacing-md);flex-wrap:wrap}.share-buttons .share-links a{padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:3px;transition:var(--transition)}.share-buttons .share-links a:hover{background-color:var(--color-accent);color:#fff;border-color:var(--color-accent);text-decoration:none}.post-navigation{display:flex;justify-content:space-between;margin-top:var(--spacing-xl);padding-top:var(--spacing-xl);border-top:1px solid var(--color-border)}.post-navigation a{max-width:45%}.post-navigation a.nav-prev{text-align:left}.post-navigation a.nav-next{text-align:right;margin-left:auto}.tag-cloud{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);justify-content:center;margin:var(--spacing-xl) 0}.tag-cloud .tag-item{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background-color:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);transition:var(--transition-fast);font-size:1rem;font-weight:500;box-shadow:var(--shadow-xs)}.tag-cloud .tag-item:hover{background-color:var(--color-accent-subtle);border-color:var(--color-accent);color:var(--color-accent);text-decoration:none;transform:translateY(-2px) scale(1.02);box-shadow:var(--shadow-md)}.tag-cloud .tag-item:hover .tag-count{color:var(--color-accent);background-color:var(--color-bg)}.tag-cloud .tag-item .tag-count{font-size:var(--font-size-small);color:var(--color-text-muted);background-color:var(--color-bg-subtle);padding:0 var(--spacing-xs);border-radius:var(--border-radius-sm);font-weight:600}.pagination{display:flex;align-items:center;justify-content:center;gap:var(--spacing-lg);margin-top:var(--spacing-xl)}.pagination .pagination-info{color:var(--color-text-muted)}.hero{text-align:center;padding:var(--spacing-xl) 0}.hero .hero-title{font-size:3rem;margin-bottom:var(--spacing-md)}.hero .hero-description{font-size:var(--font-size-large);color:var(--color-text-muted);max-width:600px;margin:0 auto}.project-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:var(--spacing-md);margin-top:var(--spacing-lg)}.project-grid .project-card{padding:var(--spacing-lg);background-color:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);transition:var(--transition);box-shadow:var(--shadow-xs);display:flex;flex-direction:column}.project-grid .project-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--color-border-strong)}.project-grid .project-card h3{margin-top:0;font-weight:700;letter-spacing:-.025em}.project-grid .project-card p{flex:1;color:var(--color-text-muted)}.project-grid .project-card .project-link{font-weight:600;color:var(--color-accent);display:inline-flex;align-items:center;gap:var(--spacing-xs);margin-top:var(--spacing-md)}.project-grid .project-card .project-link:hover{text-decoration:none;gap:var(--spacing-sm)}@media (max-width: 768px){.site-nav{flex-wrap:wrap;gap:var(--spacing-md)}.site-nav .nav-links{gap:var(--spacing-md);font-size:var(--font-size-small)}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.25rem}.hero-title{font-size:2rem}.footer-content{flex-direction:column;text-align:center}.post-navigation{flex-direction:column;gap:var(--spacing-md)}.post-navigation a{max-width:100%;text-align:left !important}}a.ai-disclaimer-inline{display:inline-flex;align-items:center;gap:.3rem;padding:.125rem var(--spacing-sm);background-color:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:var(--border-radius-full);font-size:var(--font-size-small);color:var(--color-text-muted);text-decoration:none;font-weight:500;transition:var(--transition-fast)}a.ai-disclaimer-inline .disclaimer-icon{flex-shrink:0;opacity:.7;vertical-align:middle}a.ai-disclaimer-inline:hover{text-decoration:none;transform:translateY(-1px)}a.ai-disclaimer-inline:hover .disclaimer-icon{opacity:1}.related-posts{margin-top:var(--spacing-2xl);padding-top:var(--spacing-xl);border-top:1px solid var(--color-border)}.related-posts h3{font-size:1.25rem;margin-bottom:var(--spacing-lg);color:var(--color-text)}.related-posts .related-posts-list{list-style:none;padding:0;margin:0}.related-posts .related-posts-list li{display:flex;justify-content:space-between;align-items:baseline;padding:var(--spacing-sm) 0;border-bottom:1px solid var(--color-border-subtle)}.related-posts .related-posts-list li:last-child{border-bottom:none}.related-posts .related-posts-list li a{color:var(--color-text);text-decoration:none;font-weight:500;flex:1;margin-right:var(--spacing-md)}.related-posts .related-posts-list li a:hover{color:var(--color-accent)}.related-posts .related-posts-list li .post-date{color:var(--color-text-muted);font-size:var(--font-size-small);white-space:nowrap}.mermaid-diagram{text-align:center;margin:var(--spacing-lg) auto;padding:var(--spacing-md);background-color:var(--color-background);border-radius:var(--border-radius);overflow-x:auto;max-width:100%}.mermaid-diagram svg{max-width:100%;height:auto;display:inline-block}@media (prefers-color-scheme: dark){.mermaid-diagram svg{filter:invert(0.9) hue-rotate(180deg)}}body.dark .mermaid-diagram svg{filter:invert(0.9) hue-rotate(180deg)}