:root{--bg: #fafaf9;--text: #1c1c1c;--muted: #6b7280;--accent: #2563eb;--accent-bg: #eff6ff;--border: #e5e7eb;--surface: #f3f4f6;--radius: 6px;--max-w: 680px;--font-ui: "Inter", system-ui, sans-serif;--font-body: "Lora", Georgia, serif;--font-mono: "JetBrains Mono", monospace}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-ui);background-color:var(--bg);color:var(--text);min-height:100vh;line-height:1.6;-webkit-font-smoothing:antialiased}#root{width:100%;display:flex;flex-direction:column;min-height:100vh}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}::selection{background:var(--accent-bg);color:var(--text)}a{color:inherit;text-decoration:none}.site-header{position:sticky;top:0;background:var(--bg);border-bottom:1px solid var(--border);z-index:100}.header-inner{max-width:var(--max-w);margin:0 auto;padding:0 24px;height:56px;display:flex;align-items:center;justify-content:space-between}.site-name{font-family:var(--font-ui);font-weight:600;font-size:15px;color:var(--text);letter-spacing:-.2px}nav{display:flex;gap:24px}nav a{font-family:var(--font-ui);font-size:14px;color:var(--muted);transition:color .15s}nav a:hover,nav a.active{color:var(--text)}.site-footer{border-top:1px solid var(--border);margin-top:auto}.site-footer p{max-width:var(--max-w);margin:0 auto;padding:32px 24px;font-family:var(--font-ui);font-size:13px;color:var(--muted)}.home{max-width:var(--max-w);margin:0 auto;padding:64px 24px 80px}.home-intro{margin-bottom:48px;padding-bottom:40px;border-bottom:1px solid var(--border)}.home-intro p{font-size:15px;color:var(--muted);line-height:1.7}.tag-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:32px}.tag-filter button{font-family:var(--font-ui);font-size:13px;padding:4px 14px;border:1px solid var(--border);border-radius:20px;background:transparent;color:var(--muted);cursor:pointer;transition:all .15s}.tag-filter button:hover,.tag-filter button.active{border-color:var(--text);color:var(--text)}.post-list{list-style:none;padding:0}.post-item{display:block;padding:28px 0;border-bottom:1px solid var(--border);color:inherit}.post-item-meta{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}.post-item-meta time{font-size:13px;color:var(--muted)}.tag{font-size:12px;color:var(--accent);background:var(--accent-bg);padding:2px 8px;border-radius:4px}.post-item h2{font-family:var(--font-ui);font-size:18px;font-weight:600;color:var(--text);margin-bottom:8px;transition:color .15s;line-height:1.4}.post-item:hover h2{color:var(--accent)}.post-item p{font-size:14px;color:var(--muted);line-height:1.65}.post-empty{padding:40px 0;font-size:14px;color:var(--muted)}@media(max-width:600px){.home{padding:48px 20px 64px}.post-item h2{font-size:17px}}.about{max-width:var(--max-w);margin:0 auto;padding:64px 24px 80px}.about-bio{margin-bottom:56px;padding-bottom:48px;border-bottom:1px solid var(--border)}.about-bio h1{font-family:var(--font-ui);font-size:26px;font-weight:600;color:var(--text);margin-bottom:20px}.about-bio p{font-size:15px;color:var(--muted);line-height:1.8;margin-bottom:12px}.about-bio p:last-child{margin-bottom:0}.about-section{margin-bottom:48px}.about-section h2{font-family:var(--font-ui);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);margin-bottom:20px}.skill-grid{display:flex;flex-wrap:wrap;gap:8px}.skill-item{font-size:14px;padding:5px 14px;border:1px solid var(--border);border-radius:6px;color:var(--text)}.project-list{list-style:none;display:flex;flex-direction:column;gap:2px}.project-list a{display:flex;flex-direction:column;gap:4px;padding:16px 0;border-bottom:1px solid var(--border)}.project-name{font-family:var(--font-ui);font-size:15px;font-weight:500;color:var(--text);transition:color .15s}.project-list a:hover .project-name{color:var(--accent)}.project-desc{font-size:13px;color:var(--muted)}.link-list{list-style:none;display:flex;flex-direction:column;gap:12px}.link-list a{font-size:15px;color:var(--accent)}.link-list a:hover{text-decoration:underline;text-underline-offset:3px}@media(max-width:600px){.about{padding:48px 20px 64px}}.App{min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}main{flex:1}
