:root{--font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Cascadia Code", ui-monospace, monospace;--font-serif: "Lora", Georgia, "Times New Roman", serif;--max-w: 860px;--max-w-wide: 1100px;--bg: #ffffff;--bg-alt: #f5f5f5;--border: #e0e0e0;--text: #222222;--text-sub: #666666;--accent: #2563a8;--accent-h: #1a4a80;--tag-bg: #eeeeee;--code-bg: #f6f6f6;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-6: 1.5rem;--space-8: 2rem;--space-12: 3rem;--space-16: 4rem;--radius: 3px;--radius-lg: 6px;--transition: .15s ease}@media(prefers-color-scheme:dark){:root{--bg: #1e1e1e;--bg-alt: #262626;--border: #3a3a3a;--text: #e4e4e4;--text-sub: #999999;--accent: #79b8ff;--accent-h: #a8d0ff;--tag-bg: #2e2e2e;--code-bg: #262626}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{font-family:var(--font-sans);background:var(--bg);color:var(--text);line-height:1.7;min-height:100vh;display:flex;flex-direction:column}img,video{max-width:100%;height:auto;display:block}a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;transition:color var(--transition)}a:hover{color:var(--accent-h)}.site-wrapper{max-width:var(--max-w);margin:0 auto;padding:0 var(--space-6);width:100%}main{flex:1;padding:var(--space-12) 0}.site-header{border-bottom:1px solid var(--border);padding:var(--space-4) 0;position:sticky;top:0;background:var(--bg);z-index:100}.header-inner{max-width:var(--max-w);margin:0 auto;padding:0 var(--space-6);display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}.site-logo{font-family:var(--font-mono);font-size:1.05rem;font-weight:600;color:var(--text);text-decoration:none;letter-spacing:-.02em}.site-logo:hover{color:var(--accent)}.site-nav{display:flex;align-items:center;gap:var(--space-4)}.site-nav a{font-size:.875rem;color:var(--text-sub);text-decoration:none;transition:color var(--transition)}.site-nav a:hover{color:var(--text)}.nav-search-btn{background:none;border:none;cursor:pointer;color:var(--text-sub);display:flex;align-items:center;padding:var(--space-1);transition:color var(--transition)}.nav-search-btn:hover{color:var(--text)}.site-footer{border-top:1px solid var(--border);padding:var(--space-8) 0;color:var(--text-sub);font-size:.8125rem}.footer-inner{max-width:var(--max-w);margin:0 auto;padding:0 var(--space-6);display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);flex-wrap:wrap}.footer-links{display:flex;gap:var(--space-4)}.footer-links a{color:var(--text-sub);text-decoration:none;font-size:.8125rem}.footer-links a:hover{color:var(--text)}.post-list{list-style:none;display:flex;flex-direction:column}.post-list-item{padding:var(--space-6) 0;border-bottom:1px solid var(--border)}.post-list-item:first-child{border-top:1px solid var(--border)}.post-list-meta{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-2);flex-wrap:wrap}.post-date{font-family:var(--font-mono);font-size:.8rem;color:var(--text-sub)}.post-list-link{display:flex;align-items:flex-start;gap:var(--space-4);text-decoration:none;color:inherit}.post-list-content{flex:1;min-width:0}.post-list-thumbnail{flex-shrink:0;width:120px}.post-list-thumbnail img{width:120px;height:80px;object-fit:cover;border-radius:var(--radius);display:block}.post-list-title{font-size:1.125rem;font-weight:600;margin-bottom:var(--space-2);line-height:1.4;color:var(--text)}.post-list-link:hover .post-list-title{color:var(--accent)}.post-description{color:var(--text-sub);font-size:.9rem;line-height:1.6}.article-thumbnail{margin-bottom:var(--space-8);border-radius:var(--radius-lg);overflow:hidden}.article-thumbnail img{width:100%;max-height:400px;object-fit:cover;display:block}.tag-list{display:flex;flex-wrap:wrap;gap:var(--space-2)}.tag{display:inline-block;background:var(--tag-bg);color:var(--text-sub);font-family:var(--font-mono);font-size:.75rem;padding:2px var(--space-2);border-radius:var(--radius);text-decoration:none;transition:background var(--transition),color var(--transition)}.tag:hover{background:var(--border);color:var(--text)}.tag:before{content:"#";opacity:.6}.page-header{margin-bottom:var(--space-8);padding-bottom:var(--space-6);border-bottom:1px solid var(--border)}.page-header h1{font-size:1.5rem;font-weight:700;letter-spacing:-.02em}.page-header p{color:var(--text-sub);font-size:.9rem;margin-top:var(--space-2)}.article-header{margin-bottom:var(--space-8)}.article-title{font-size:1.875rem;font-weight:700;line-height:1.3;letter-spacing:-.02em;margin-bottom:var(--space-4)}.article-meta{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;margin-bottom:var(--space-4)}.article-body{font-family:var(--font-sans);font-size:1rem;line-height:1.8}.article-body h2,.article-body h3,.article-body h4{font-family:var(--font-sans);letter-spacing:-.02em;margin-top:var(--space-12);margin-bottom:var(--space-4);color:var(--text)}.article-body h2{font-size:1.375rem;padding-bottom:var(--space-3);border-bottom:1px solid var(--border)}.article-body h3{font-size:1.125rem}.article-body h4{font-size:1rem}.article-body p{margin-bottom:var(--space-6)}.article-body a{text-decoration:underline;text-underline-offset:3px}.article-body ul,.article-body ol{margin-bottom:var(--space-6);padding-left:var(--space-6)}.article-body li{margin-bottom:var(--space-2)}.article-body blockquote{border-left:3px solid var(--border);padding:var(--space-3) var(--space-4);margin:var(--space-6) 0;color:var(--text-sub);font-style:italic}.article-body blockquote p{margin-bottom:0}.article-body hr{border:none;border-top:1px solid var(--border);margin:var(--space-8) 0}.article-body img{border-radius:var(--radius-lg);margin:var(--space-8) auto}.article-body :not(pre)>code{font-family:var(--font-mono);font-size:.875em;background:var(--code-bg);border:1px solid var(--border);padding:1px 5px;border-radius:var(--radius)}.article-body pre{margin:var(--space-6) 0;border-radius:var(--radius-lg);border:1px solid var(--border);overflow-x:auto;font-size:.875rem;line-height:1.6}.article-body pre code{display:block;padding:var(--space-4);background:none!important;border:none;font-family:var(--font-mono)}.article-body table{width:100%;border-collapse:collapse;margin-bottom:var(--space-6);font-size:.9rem}.article-body th,.article-body td{text-align:left;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border)}.article-body th{font-weight:600;font-family:var(--font-sans);color:var(--text-sub);font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}.article-footer{margin-top:var(--space-12);padding-top:var(--space-8);border-top:1px solid var(--border)}.pagination{display:flex;justify-content:space-between;margin-top:var(--space-8);gap:var(--space-4)}.pagination-btn{font-size:.875rem;color:var(--text-sub);text-decoration:none;display:flex;align-items:center;gap:var(--space-2);transition:color var(--transition)}.pagination-btn:hover{color:var(--accent)}.tag-index{display:flex;flex-wrap:wrap;gap:var(--space-3)}.tag-index-item{display:flex;align-items:center;gap:var(--space-2);background:var(--tag-bg);border-radius:var(--radius);padding:var(--space-2) var(--space-3);text-decoration:none;color:var(--text);font-size:.875rem;transition:background var(--transition)}.tag-index-item:hover{background:var(--border)}.tag-index-item .tag-name{font-family:var(--font-mono);color:var(--text-sub)}.tag-index-item .tag-count{font-size:.75rem;color:var(--text-sub)}.search-wrapper{margin-bottom:var(--space-8)}.pagefind-ui{--pagefind-ui-scale: .9;--pagefind-ui-primary: var(--accent);--pagefind-ui-text: var(--text);--pagefind-ui-background: var(--bg);--pagefind-ui-border: var(--border);--pagefind-ui-tag: var(--tag-bg);--pagefind-ui-border-width: 1px;--pagefind-ui-border-radius: 3px;--pagefind-ui-image-border-radius: 3px;--pagefind-ui-font: var(--font-sans)}.not-found{text-align:center;padding:var(--space-16) 0}.not-found h1{font-family:var(--font-mono);font-size:4rem;color:var(--border);margin-bottom:var(--space-4)}.not-found p{color:var(--text-sub);margin-bottom:var(--space-6)}.toc{background:var(--bg-alt);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-4) var(--space-6);margin-bottom:var(--space-8);font-size:.9rem}.toc summary{cursor:pointer;font-weight:600;color:var(--text-sub);font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;list-style:none;user-select:none}.toc summary::-webkit-details-marker{display:none}.toc summary:before{content:"▶ ";font-size:.7em}details[open] .toc summary:before{content:"▼ "}.toc ol{list-style:none;margin-top:var(--space-3);display:flex;flex-direction:column;gap:var(--space-1)}.toc a{color:var(--text-sub);text-decoration:none;display:block;padding:2px 0}.toc a:hover{color:var(--accent)}.toc .toc-h3{padding-left:var(--space-4)}.related-posts{margin-top:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--border)}.related-title{font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-sub);font-family:var(--font-sans);margin-bottom:var(--space-4);font-weight:600}.related-list{list-style:none;display:flex;flex-direction:column;gap:var(--space-3)}.related-list a{display:flex;align-items:center;gap:var(--space-3);text-decoration:none;color:var(--text);font-size:.9rem}.related-list a:hover{color:var(--accent)}.related-list img{width:64px;height:42px;object-fit:cover;border-radius:var(--radius);flex-shrink:0}.portfolio-header{margin-bottom:var(--space-12);padding-bottom:var(--space-6);border-bottom:1px solid var(--border)}.portfolio-name{font-size:1.75rem;font-weight:700;letter-spacing:-.02em;margin-bottom:var(--space-2)}.portfolio-sub{color:var(--text-sub);font-size:.9rem}.portfolio-section{margin-bottom:var(--space-12)}.portfolio-section-title{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-sub);font-weight:600;margin-bottom:var(--space-6);padding-bottom:var(--space-3);border-bottom:1px solid var(--border)}.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-6)}.skill-group-title{font-size:.85rem;font-weight:600;margin-bottom:var(--space-2);color:var(--text)}.skill-tags{display:flex;flex-wrap:wrap;gap:var(--space-2)}.skill-tag{font-family:var(--font-mono);font-size:.75rem;background:var(--tag-bg);color:var(--text-sub);padding:2px var(--space-2);border-radius:var(--radius)}.project-list{list-style:none;display:flex;flex-direction:column;gap:var(--space-4)}.project-item{padding:var(--space-4);border:1px solid var(--border);border-radius:var(--radius-lg)}.project-title{font-weight:600;margin-bottom:var(--space-1)}.project-desc{font-size:.875rem;color:var(--text-sub)}.lang-switcher{margin-bottom:var(--space-8);font-size:.875rem}.lang-btn{background:none;border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-1) var(--space-3);cursor:pointer;color:var(--text-sub);font-size:.8rem;margin-right:var(--space-2);transition:all var(--transition)}.lang-btn.active{background:var(--text);color:var(--bg);border-color:var(--text)}@media(max-width:640px){.article-title{font-size:1.5rem}.header-inner{gap:var(--space-3)}.skills-grid{grid-template-columns:1fr}}
