.navbar{z-index:100;height:var(--nav-height);background-color:var(--surface);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(12px);position:fixed;top:0;left:0;right:0}.navbar__inner{justify-content:space-between;align-items:center;height:100%;display:flex}.navbar__brand{font-family:var(--font-heading);color:var(--text);letter-spacing:-.02em;transition:color var(--transition-fast);font-size:1.125rem;font-weight:700}.navbar__brand:hover,.navbar__brand span{color:var(--accent)}.navbar__links{align-items:center;gap:var(--space-xs);display:flex}.navbar__link{font-family:var(--font-mono);color:var(--text-muted);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);transition:color var(--transition-fast), background-color var(--transition-fast);font-size:.8125rem;font-weight:400;position:relative}.navbar__link:hover{color:var(--text);background-color:var(--surface-hover)}.navbar__link--active{color:var(--accent)}.navbar__separator{color:var(--text-faint);font-family:var(--font-mono);-webkit-user-select:none;user-select:none;font-size:.75rem}.navbar__avatar{background-color:var(--accent);width:28px;height:28px;color:var(--bg);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex;overflow:hidden}.navbar__avatar img{object-fit:cover;width:100%;height:100%}.navbar__theme-toggle{border-radius:var(--radius-sm);width:32px;height:32px;color:var(--text-muted);cursor:pointer;transition:color var(--transition-fast), background-color var(--transition-fast);justify-content:center;align-items:center;display:flex}.navbar__theme-toggle:hover{color:var(--accent);background-color:var(--surface-hover)}.navbar__theme-toggle svg{width:16px;height:16px;transition:transform var(--transition-base)}.navbar__theme-toggle:hover svg{transform:rotate(15deg)}.navbar-spacer{height:var(--nav-height)}@media (width<=480px){.navbar__inner{padding-inline:var(--space-sm)}.navbar__brand{font-size:1rem}.navbar__links{gap:0}.navbar__separator{display:none}.navbar__link{padding:var(--space-xs) 6px}}.footer{padding:var(--space-xl) 0;border-top:1px solid var(--border);margin-top:auto}.footer__inner{justify-content:space-between;align-items:center;display:flex}.footer__copy{font-family:var(--font-mono);color:var(--text-faint);font-size:.75rem}.footer__links{align-items:center;gap:var(--space-md);display:flex}.footer__link{font-family:var(--font-mono);color:var(--text-faint);transition:color var(--transition-fast);font-size:.75rem}.footer__link:hover{color:var(--accent)}@media (width<=480px){.footer__inner{gap:var(--space-sm);text-align:center;flex-direction:column}}.layout{flex-direction:column;min-height:100vh;display:flex}.layout__main{padding-bottom:var(--space-3xl);flex:1}.hero{padding:var(--space-4xl) 0 var(--space-2xl);animation:fade-in-up var(--transition-slow) ease both}.hero__name{font-family:var(--font-heading);letter-spacing:-.03em;color:var(--text);margin-bottom:var(--space-sm);font-size:2.75rem;font-weight:700}.hero__name span{color:var(--accent)}.hero__bio{color:var(--text-muted);max-width:520px;margin-bottom:var(--space-lg);font-size:1.0625rem;line-height:1.6}.hero__skeleton-tagline{border-radius:var(--radius-sm);width:70%;height:1em;display:block}.hero__links{align-items:center;gap:var(--space-md);display:flex}.hero__social-link{align-items:center;gap:var(--space-xs);font-family:var(--font-mono);color:var(--text-muted);padding:var(--space-xs) var(--space-sm);border:1px solid var(--border);border-radius:var(--radius-md);transition:color var(--transition-fast), border-color var(--transition-fast), background-color var(--transition-fast);font-size:.8125rem;display:inline-flex}.hero__social-link:hover{color:var(--accent);border-color:var(--accent);background-color:var(--accent-glow)}.hero__social-link svg{flex-shrink:0;width:16px;height:16px}.post-list{flex-direction:column;display:flex}.post-list__row{align-items:baseline;gap:var(--space-md);padding:var(--space-sm) var(--space-sm);border-radius:var(--radius-sm);transition:background-color var(--transition-fast);color:inherit;grid-template-columns:auto 1fr auto auto;text-decoration:none;display:grid}.post-list__row:hover{background-color:var(--surface-hover)}.post-list__row:hover .post-list__title{color:var(--accent)}.post-list__marker{align-items:baseline;gap:var(--space-sm);flex-shrink:0;display:flex}.post-list__dot{background-color:var(--accent);border-radius:50%;flex-shrink:0;width:8px;height:8px;display:inline-block;position:relative;top:-1px}.post-list__hash{font-family:var(--font-mono);color:var(--text-faint);letter-spacing:.02em;font-size:.8125rem}.post-list__title{font-family:var(--font-heading);color:var(--text);transition:color var(--transition-fast);white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:.9375rem;font-weight:600;overflow:hidden}.post-list__meta{font-family:var(--font-mono);color:var(--text-muted);white-space:nowrap;flex-shrink:0;font-size:.75rem}.post-list__date{font-family:var(--font-mono);color:var(--text-faint);white-space:nowrap;text-align:right;flex-shrink:0;min-width:5ch;font-size:.75rem}.post-list__skeleton-row{align-items:center;gap:var(--space-md);padding:var(--space-sm) var(--space-sm);grid-template-columns:auto 1fr auto auto;display:grid}.post-list__skeleton-dot{border-radius:50%;width:8px;height:8px}.post-list__skeleton-hash{width:50px;height:14px}.post-list__skeleton-title{width:70%;height:16px}.post-list__skeleton-meta{width:70px;height:13px}.post-list__skeleton-date{width:50px;height:13px}@media (width<=640px){.post-list__row,.post-list__skeleton-row{gap:0 var(--space-sm);padding:var(--space-sm) var(--space-xs);grid-template-rows:auto auto;grid-template-columns:auto 1fr auto}.post-list__marker{grid-row:1/span 2}.post-list__title,.post-list__skeleton-title{white-space:normal;grid-column:2/span 2}.post-list__meta,.post-list__skeleton-meta{grid-area:2/2}.post-list__date,.post-list__skeleton-date{text-align:right;grid-area:2/3}}@media (width<=480px){.post-list__row,.post-list__skeleton-row{grid-template-rows:auto auto auto;grid-template-columns:auto 1fr}.post-list__marker{grid-row:1/span 3}.post-list__title,.post-list__skeleton-title{grid-area:1/2}.post-list__meta,.post-list__skeleton-meta{grid-area:2/2}.post-list__date,.post-list__skeleton-date{text-align:left;grid-area:3/2;margin-top:2px}}.home-page{animation:fade-in-up var(--transition-slow) ease both}.home-page__section-header{margin-bottom:var(--space-md);padding-bottom:var(--space-sm);border-bottom:1px solid var(--border);justify-content:space-between;align-items:baseline;display:flex}.home-page__section-title{font-family:var(--font-heading);color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:1rem;font-weight:600}.home-page__view-all{font-family:var(--font-mono);color:var(--accent);transition:color var(--transition-fast);font-size:.8125rem}.home-page__view-all:hover{color:var(--accent-hover)}.posts-page{padding-top:var(--space-3xl);animation:fade-in-up var(--transition-slow) ease both}.posts-page__header{align-items:baseline;gap:var(--space-md);margin-bottom:var(--space-lg);padding-bottom:var(--space-sm);border-bottom:1px solid var(--border);display:flex}.posts-page__title{font-family:var(--font-heading);color:var(--text);font-size:1.5rem;font-weight:700}.posts-page__count{font-family:var(--font-mono);color:var(--text-faint);font-size:.8125rem}.comments{margin-top:var(--space-2xl);padding-top:var(--space-2xl);border-top:1px solid var(--border)}.comments__heading{font-family:var(--font-heading);margin-bottom:var(--space-lg);color:var(--text);font-size:1.25rem;font-weight:600}.comments__count{font-family:var(--font-mono);color:var(--text-muted);margin-left:var(--space-sm);font-size:.8125rem;font-weight:400}.comments__auth-prompt{align-items:center;gap:var(--space-md);padding:var(--space-xl) var(--space-lg);border:1px dashed var(--border);border-radius:var(--radius-md);text-align:center;flex-direction:column;display:flex}.comments__auth-text{color:var(--text-muted);font-size:.875rem}.comments__google-btn{align-items:center;gap:var(--space-sm);font-family:var(--font-mono);color:var(--accent);padding:var(--space-sm) var(--space-lg);border:1px solid var(--accent);border-radius:var(--radius-md);transition:background-color var(--transition-fast), color var(--transition-fast);cursor:pointer;background:0 0;font-size:.8125rem;display:inline-flex}.comments__google-btn:hover{background-color:var(--accent-glow-strong);color:var(--accent-hover)}.comments__google-btn svg{width:16px;height:16px}.comments__loading-spinner{align-items:center;gap:var(--space-sm);font-family:var(--font-mono);color:var(--accent);font-size:.8125rem;display:flex}.comments__loading-spinner:before{content:"";border:2px solid var(--accent-glow-strong);border-top-color:var(--accent);border-radius:50%;width:14px;height:14px;animation:1s linear infinite comments-spin}@keyframes comments-spin{to{transform:rotate(360deg)}}.comments__form-header{margin-bottom:var(--space-md);justify-content:space-between;align-items:center;display:flex}.comments__user-info{align-items:center;gap:var(--space-sm);display:flex}.comments__avatar{background-color:var(--accent);width:28px;height:28px;font-family:var(--font-mono);color:var(--bg);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.6875rem;font-weight:600;display:flex;overflow:hidden}.comments__avatar img{object-fit:cover;width:100%;height:100%}.comments__user-name{font-family:var(--font-mono);color:var(--text);font-size:.8125rem}.comments__sign-out{font-family:var(--font-mono);color:var(--text-faint);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;font-size:.75rem}.comments__sign-out:hover{color:var(--danger)}.comments__form{gap:var(--space-sm);margin-bottom:var(--space-xl);flex-direction:column;display:flex}.comments__textarea{width:100%;min-height:80px;padding:var(--space-sm) var(--space-md);background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);font-family:var(--font-body);resize:vertical;transition:border-color var(--transition-fast);font-size:.875rem;line-height:1.5}.comments__textarea:focus{border-color:var(--accent);outline:none}.comments__textarea::placeholder{color:var(--text-faint)}.comments__submit{font-family:var(--font-mono);color:var(--bg);background-color:var(--accent);padding:var(--space-xs) var(--space-lg);border-radius:var(--radius-sm);cursor:pointer;transition:background-color var(--transition-fast);border:none;align-self:flex-end;font-size:.8125rem}.comments__submit:hover{background-color:var(--accent-hover)}.comments__submit:disabled{opacity:.5;cursor:not-allowed}.comments__list{gap:var(--space-lg);flex-direction:column;display:flex}.comment{gap:var(--space-md);display:flex}.comment__avatar{background-color:var(--surface-hover);width:32px;height:32px;font-family:var(--font-mono);color:var(--accent-secondary);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.75rem;font-weight:600;display:flex;overflow:hidden}.comment__avatar img{object-fit:cover;width:100%;height:100%}.comment__body{flex:1;min-width:0}.comment__header{align-items:baseline;gap:var(--space-sm);margin-bottom:var(--space-xs);display:flex}.comment__author{font-family:var(--font-mono);color:var(--text);font-size:.8125rem;font-weight:500}.comment__time{font-family:var(--font-mono);color:var(--text-faint);font-size:.6875rem}.comment__delete{font-family:var(--font-mono);color:var(--text-faint);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;margin-left:auto;font-size:.6875rem}.comment__delete:hover{color:var(--danger)}.comment__content{color:var(--text-muted);font-size:.875rem;line-height:1.55}.comments__empty{color:var(--text-faint);padding:var(--space-md) 0;font-size:.875rem;font-style:italic}.single-post{padding-top:var(--space-3xl);animation:fade-in-up var(--transition-slow) ease both}.single-post__back{align-items:center;gap:var(--space-xs);font-family:var(--font-mono);color:var(--accent);margin-bottom:var(--space-xl);transition:color var(--transition-fast);font-size:.8125rem;display:inline-flex}.single-post__back:hover{color:var(--accent-hover)}.single-post__title{font-family:var(--font-heading);letter-spacing:-.02em;color:var(--text);margin-bottom:var(--space-md);font-size:2.25rem;font-weight:700;line-height:1.15}.single-post__meta{align-items:center;gap:var(--space-md);font-family:var(--font-mono);color:var(--text-muted);margin-bottom:var(--space-2xl);flex-wrap:wrap;font-size:.8125rem;display:flex}.single-post__meta-separator{color:var(--text-faint)}.single-post__banner{object-fit:cover;width:100%;max-height:420px;margin-bottom:var(--space-2xl)}.single-post__content{max-width:var(--reading-width);color:var(--text);font-size:1.0625rem;line-height:1.75}.single-post__content h2{font-family:var(--font-heading);margin-top:var(--space-2xl);margin-bottom:var(--space-md);color:var(--text);font-size:1.375rem;font-weight:600}.single-post__content h3{font-family:var(--font-heading);margin-top:var(--space-xl);margin-bottom:var(--space-sm);color:var(--text);font-size:1.125rem;font-weight:600}.single-post__content p{margin-bottom:var(--space-md);color:var(--text-muted)}.single-post__content a{color:var(--accent-secondary);text-underline-offset:3px;transition:color var(--transition-fast);text-decoration:underline}.single-post__content a:hover{color:var(--accent-secondary-hover)}.single-post__content code{font-family:var(--font-mono);background-color:var(--surface);border-radius:var(--radius-sm);color:var(--accent-secondary);padding:.15em .4em;font-size:.85em}.single-post__content pre{background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-md) var(--space-lg);margin:var(--space-lg) 0;line-height:1.6;overflow-x:auto}.single-post__content pre code{color:var(--text);background:0 0;border-radius:0;padding:0;font-size:.8125rem}.single-post__content ul,.single-post__content ol{margin-bottom:var(--space-md);padding-left:var(--space-lg)}.single-post__content ul{list-style:outside}.single-post__content ol{list-style:decimal}.single-post__content li{margin-bottom:var(--space-xs);color:var(--text-muted)}.single-post__content blockquote{border-left:3px solid var(--accent);padding-left:var(--space-md);margin:var(--space-lg) 0;color:var(--text-muted);font-style:italic}.single-post__content img{border-radius:var(--radius-md);max-width:100%;margin:var(--space-lg) 0}.single-post__content hr{border:none;border-top:1px solid var(--border);margin:var(--space-2xl) 0}.single-post__skeleton-title{width:75%;height:40px;margin-bottom:var(--space-md)}.single-post__skeleton-meta{width:300px;height:16px;margin-bottom:var(--space-2xl)}.single-post__skeleton-line{height:16px;margin-bottom:var(--space-sm)}.single-post__skeleton-line:nth-child(odd){width:100%}.single-post__skeleton-line:nth-child(2n){width:85%}.single-post__not-found{text-align:center;padding:var(--space-4xl) 0}.single-post__not-found h2{font-family:var(--font-heading);margin-bottom:var(--space-sm);color:var(--text);font-size:1.5rem}.single-post__not-found p{color:var(--text-muted);margin-bottom:var(--space-lg)}.about-page{padding-top:var(--space-3xl);animation:fade-in-up var(--transition-slow) ease both;max-width:var(--reading-width)}.about-page__name{font-family:var(--font-heading);letter-spacing:-.02em;color:var(--text);margin-bottom:var(--space-lg);font-size:2.25rem;font-weight:700}.about-page__name span{color:var(--accent)}.about-page__bio{color:var(--text-muted);margin-bottom:var(--space-2xl);font-size:1.0625rem;line-height:1.75}.about-page__section{margin-bottom:var(--space-2xl)}.about-page__section-title{font-family:var(--font-heading);color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--space-md);padding-bottom:var(--space-sm);border-bottom:1px solid var(--border);font-size:1rem;font-weight:600}.about-page__focus{color:var(--text-muted);font-size:.9375rem;line-height:1.7}.about-page__projects{gap:var(--space-sm);flex-direction:column;display:flex}.about-page__project{align-items:center;gap:var(--space-md);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);transition:background-color var(--transition-fast);display:flex}.about-page__project:hover{background-color:var(--surface-hover)}.about-page__project-dot{background-color:var(--accent-secondary);border-radius:50%;flex-shrink:0;width:6px;height:6px}.about-page__project-name{font-family:var(--font-heading);color:var(--text);transition:color var(--transition-fast);font-size:.9375rem;font-weight:600}.about-page__project:hover .about-page__project-name{color:var(--accent)}.about-page__project-desc{font-family:var(--font-mono);color:var(--text-faint);text-align:right;word-break:break-word;white-space:normal;flex-shrink:1;min-width:0;margin-left:auto;font-size:.75rem}.about-page__socials{gap:var(--space-md);display:flex}.about-page__social-link{align-items:center;gap:var(--space-xs);font-family:var(--font-mono);color:var(--text-muted);padding:var(--space-sm) var(--space-md);border:1px solid var(--border);border-radius:var(--radius-md);transition:color var(--transition-fast), border-color var(--transition-fast), background-color var(--transition-fast);font-size:.8125rem;display:inline-flex}.about-page__social-link:hover{color:var(--accent);border-color:var(--accent);background-color:var(--accent-glow)}.about-page__social-link svg{width:16px;height:16px}.privacy-page{padding-top:var(--space-3xl);padding-bottom:var(--space-4xl);animation:fade-in-up var(--transition-slow) ease both;max-width:var(--reading-width)}.privacy-page__title{font-family:var(--font-heading);letter-spacing:-.02em;color:var(--text);margin-bottom:var(--space-xs);font-size:2.25rem;font-weight:700}.privacy-page__date{color:var(--text-faint);margin-bottom:var(--space-2xl);font-size:.9375rem;font-family:var(--font-mono)}.privacy-page__intro{color:var(--text-muted);margin-bottom:var(--space-2xl);font-size:1.0625rem;line-height:1.75}.privacy-page__section{margin-bottom:var(--space-xl)}.privacy-page__section h2{font-family:var(--font-heading);color:var(--text);margin-bottom:var(--space-sm);font-size:1.25rem;font-weight:600}.privacy-page__section p{color:var(--text-muted);font-size:1rem;line-height:1.7}.not-found-page{min-height:calc(100vh - var(--nav-height) - var(--space-4xl));padding-block:var(--space-4xl);justify-content:center;align-items:center;display:flex}.not-found-content{text-align:center}.not-found-content h1{font-size:var(--space-4xl);margin-bottom:var(--space-sm)}.not-found-content h2{font-size:var(--space-xl);margin-bottom:var(--space-md)}.not-found-content p{margin-bottom:var(--space-2xl)}.not-found-content .btn{padding:var(--space-sm) var(--space-md);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);transition:all var(--transition-fast);display:inline-block}.not-found-content .btn:hover{background:var(--surface-hover);border-color:var(--accent);color:var(--accent)}.error-page{min-height:calc(100vh - var(--nav-height) - var(--space-4xl));padding-block:var(--space-4xl);justify-content:center;align-items:center;display:flex}.error-content{text-align:center}.error-content h1{color:var(--danger);font-size:var(--space-3xl);margin-bottom:var(--space-sm)}.error-content h2{font-size:var(--space-xl);margin-bottom:var(--space-md)}.error-content p{margin-bottom:var(--space-2xl)}.error-content .btn{padding:var(--space-sm) var(--space-md);border:1px solid var(--danger);border-radius:var(--radius-sm);color:var(--danger);transition:all var(--transition-fast);background:0 0;display:inline-block}.error-content .btn:hover{background:var(--danger);color:var(--bg)}:root,:root[data-theme=dark]{--bg:#0b0e14;--surface:#12161f;--surface-hover:#181d2a;--border:#1e2330;--border-subtle:#161b25;--text:#e6e8eb;--text-muted:#7c8494;--text-faint:#4a5060;--accent:#f2b84b;--accent-hover:#f5c96e;--accent-secondary:#7dd3fc;--accent-secondary-hover:#a0e0fd;--accent-glow:#f2b84b0f;--accent-glow-strong:#f2b84b1a;--accent-selection:#f2b84b40;--danger:#f87171;--success:#34d399}:root[data-theme=light]{--bg:#fafaf8;--surface:#fff;--surface-hover:#f0f0ec;--border:#e2e2de;--border-subtle:#ebebea;--text:#1a1d23;--text-muted:#6b7280;--text-faint:#9ca3af;--accent:#c9860e;--accent-hover:#a5700a;--accent-secondary:#0891b2;--accent-secondary-hover:#06738e;--accent-glow:#c9860e0f;--accent-glow-strong:#c9860e1a;--accent-selection:#c9860e33;--danger:#dc2626;--success:#16a34a}:root{--font-heading:"Space Grotesk", system-ui, sans-serif;--font-body:"Inter", system-ui, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--space-3xl:4rem;--space-4xl:6rem;--max-width:960px;--reading-width:720px;--nav-height:56px;--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.4s ease;--radius-sm:4px;--radius-md:6px;--radius-lg:8px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-body);color:var(--text);background-color:var(--bg);min-height:100vh;transition:color var(--transition-base), background-color var(--transition-base);font-weight:400;line-height:1.6}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--text);font-weight:600;line-height:1.2}h1{font-size:2.25rem}h2{font-size:1.5rem}h3{font-size:1.25rem}a{color:inherit;transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--accent)}img{max-width:100%;display:block}button{font-family:inherit;font-size:inherit;cursor:pointer;color:inherit;background:0 0;border:none}input,textarea{font-family:inherit;font-size:inherit;color:inherit;background:0 0;border:none;outline:none}ul,ol{list-style:none}code{font-family:var(--font-mono);font-size:.875em}::selection{background-color:var(--accent-selection);color:var(--text)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-faint)}.container{width:100%;max-width:var(--max-width);padding-inline:var(--space-lg);margin-inline:auto}.reading-column{max-width:var(--reading-width);margin-inline:auto}.mono{font-family:var(--font-mono)}.text-muted{color:var(--text-muted)}.text-accent{color:var(--accent)}@keyframes skeleton-pulse{0%,to{opacity:.4}50%{opacity:.15}}.skeleton{background:var(--surface-hover);border-radius:var(--radius-sm);animation:1.8s ease-in-out infinite skeleton-pulse}@keyframes fade-in-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:fade-in-up var(--transition-slow) ease both}
