:root{--font-family-base:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-family-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-2xl:48px;--spacing-3xl:64px;--safe-area-inset-top:0px;--header-height:44px;--edge-spacing:var(--spacing-xl);--radius-sm:9999px;--radius-md:9999px;--radius-lg:9999px;--radius-pill:9999px;--font-xs:12px;--font-sm:14px;--font-md:16px;--font-lg:18px;--font-xl:20px;--font-2xl:24px;--font-3xl:28px;--font-4xl:32px;--blur-md:blur(15px);--blur-lg:blur(24px);--bg:#fff;--surface:#f7f7f7;--surface-alt:#f9f9f9;--text-primary:#000;--text-secondary:#666;--text-tertiary:#999;--border:#f0f0f0;--border-subtle:#0000000d;--overlay:#0000000d;--glass-bg:#ffffffd9;--shadow-sm:0 2px 8px #0000000a;--shadow-md:0 4px 16px #00000014}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#000;--surface:#1c1c1e;--surface-alt:#2c2c2e;--text-primary:#fff;--text-secondary:#ababab;--text-tertiary:#6e6e73;--border:#2c2c2e;--border-subtle:#ffffff14;--overlay:#0003;--glass-bg:#1c1c1ed9;--shadow-sm:0 2px 8px #0003;--shadow-md:0 4px 16px #0000004d}}:root[data-theme=dark]{--bg:#000;--surface:#1c1c1e;--surface-alt:#2c2c2e;--text-primary:#fff;--text-secondary:#ababab;--text-tertiary:#6e6e73;--border:#2c2c2e;--border-subtle:#ffffff14;--overlay:#0003;--glass-bg:#1c1c1ed9;--shadow-sm:0 2px 8px #0003;--shadow-md:0 4px 16px #0000004d}@media (width<=768px){:root{--edge-spacing:var(--spacing-md);--font-4xl:28px;--font-3xl:24px;--font-2xl:20px}}@media (width<=480px){:root{--edge-spacing:var(--spacing-sm)}}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family-base);background-color:var(--bg);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6;transition:background-color .3s,color .3s}a{color:inherit;text-decoration:none;transition:opacity .2s}a:hover{opacity:.7}ul,ol{list-style:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2}.container{max-width:850px;padding:0 var(--edge-spacing);margin:0 auto}::selection{background-color:var(--text-primary);color:var(--bg)}.topbar-container{top:var(--edge-spacing);left:var(--edge-spacing);z-index:100;pointer-events:none;display:flex;position:fixed}.topbar{pointer-events:auto;background-color:var(--glass-bg);-webkit-backdrop-filter:var(--blur-md);padding:0 var(--spacing-sm);box-shadow:var(--shadow-sm);border:1px solid var(--border-subtle);align-items:center;gap:var(--spacing-xs);border-radius:22px;height:44px;display:flex}.topbar-link{padding:0 var(--spacing-sm);height:36px;color:var(--text-secondary);font-weight:500;font-size:var(--font-sm);font-size:var(--font-sm);z-index:1;border-radius:18px;justify-content:center;align-items:center;text-decoration:none;transition:color .3s;display:flex;position:relative}.topbar-link:hover{background-color:var(--overlay);color:var(--text-primary)}.topbar-link.active{color:var(--bg)}.topbar-active-pill{background-color:var(--text-primary);z-index:-1;pointer-events:none;border-radius:18px;position:absolute;inset:0}.topbar-link span{white-space:nowrap}@media (width<=640px){.topbar-container{top:auto;bottom:var(--spacing-md);left:50%;transform:translate(-50%)}.topbar-link{padding:0 var(--spacing-sm)}.topbar{padding:0 var(--spacing-xs);gap:var(--spacing-xs)}}.page-home{padding-top:var(--spacing-3xl);padding-bottom:var(--spacing-3xl);animation:.8s ease-out fadeIn}@media (width<=768px){.page-home{padding-top:100px;padding-bottom:100px}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.home-header{margin-bottom:var(--spacing-3xl)}.home-title{letter-spacing:-.04em;margin-bottom:var(--spacing-md);color:var(--text-primary);font-size:clamp(48px,6vw,72px);font-weight:700}.home-subtitle{font-size:var(--font-2xl);color:var(--text-secondary);max-width:600px;font-weight:400}.section-title{font-size:var(--font-lg);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--spacing-xl);font-weight:600}.posts-grid{gap:var(--spacing-lg);flex-direction:column;display:flex}.article-page{padding-top:80px;padding-bottom:120px;animation:.6s ease-out fadeIn}.article-nav{margin-bottom:var(--spacing-2xl)}.back-link{align-items:center;gap:var(--spacing-sm);color:var(--text-tertiary);font-weight:500;transition:color .2s;display:inline-flex}.back-link:hover{opacity:1;color:var(--text-primary)}.article-header{margin-bottom:var(--spacing-2xl)}.article-title{font-size:var(--font-4xl);letter-spacing:-.02em;margin-bottom:var(--spacing-md);color:var(--text-primary);font-weight:700;line-height:var(--line-height-tight,1.2)}.article-meta{align-items:center;gap:var(--spacing-sm);color:var(--text-tertiary);font-family:var(--font-family-mono);font-size:var(--font-sm);display:flex}.article-body{font-size:var(--font-lg);line-height:var(--line-height-relaxed,1.8);color:var(--text-primary);max-width:680px}.article-body p{margin-bottom:var(--spacing-xl)}@media (width<=768px){.article-page{padding-top:60px;padding-bottom:80px}.article-title{font-size:var(--font-2xl)}.article-body{font-size:var(--font-md)}}@media (width<=480px){.article-meta{flex-wrap:wrap}}.project-card{padding:var(--spacing-lg) calc(var(--spacing-lg) * 2);background-color:var(--surface);border:1px solid var(--border-subtle);width:260px;color:inherit;-webkit-user-select:none;user-select:none;border-radius:24px;flex-direction:column;transition:box-shadow .2s,background-color .2s;display:flex}.project-card:hover{box-shadow:var(--shadow-md);background-color:var(--surface-alt)}.project-card-title{font-size:var(--font-lg);margin:0 0 var(--spacing-sm) 0;color:var(--text-primary);font-weight:600}.project-card-desc{font-size:var(--font-sm);color:var(--text-secondary);margin:0 0 var(--spacing-md) 0;-webkit-line-clamp:3;-webkit-box-orient:vertical;line-height:1.6;display:-webkit-box;overflow:hidden}.project-card-tags{gap:var(--spacing-xs);flex-wrap:wrap;margin-top:auto;display:flex}.project-card-tag{font-size:var(--font-xs);color:var(--text-tertiary);background-color:var(--overlay);padding:2px var(--spacing-sm);border-radius:var(--radius-pill);white-space:nowrap}@media (width<=640px){.project-card{width:220px;padding:var(--spacing-md) var(--spacing-lg)}}.page-projects{flex-direction:column;justify-content:center;align-items:center;padding:0;display:flex;position:fixed;inset:0;overflow:hidden}.projects-marquee-container{pointer-events:none;flex-direction:column;gap:120px;width:100vw;display:flex}.marquee-row{pointer-events:auto;padding:20px 0;display:flex}.marquee-inner{will-change:transform;gap:32px;width:max-content;display:flex}.marquee-item{flex-shrink:0}@media (width<=640px){.projects-marquee-container{gap:80px}}.header-actions-container{top:var(--edge-spacing);right:var(--edge-spacing);z-index:1000;pointer-events:none;position:fixed}.settings-capsule{pointer-events:auto;background-color:var(--glass-bg);-webkit-backdrop-filter:var(--blur-md);box-shadow:var(--shadow-sm);border:1px solid var(--border-subtle);border-radius:22px;flex-direction:column;max-width:88px;height:48px;transition:all .5s cubic-bezier(.4,0,.2,1);display:flex;overflow:hidden}.settings-capsule.open{max-width:400px}.settings-capsule.open.has-vertical{height:140px}.settings-main-row{flex-direction:row-reverse;align-items:center;width:100%;height:48px;display:flex}.settings-trigger{cursor:pointer;height:48px;color:var(--text-primary);white-space:nowrap;background:0 0;border:none;justify-content:center;align-items:center;padding:0 24px;font-family:inherit;font-size:15px;font-weight:600;transition:all .3s;display:flex}.settings-trigger:hover{background-color:var(--overlay-subtle)}.settings-content{opacity:0;pointer-events:none;flex:1;align-items:center;padding-left:8px;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;transform:translate(20px)}.settings-capsule.open .settings-content{opacity:1;pointer-events:auto;transform:translate(0)}.settings-item{cursor:pointer;height:48px;color:var(--text-secondary);white-space:nowrap;background:0 0;border:none;align-items:center;padding:0 16px;font-family:inherit;font-size:14px;font-weight:500;transition:all .2s;display:flex}.settings-item:hover{color:var(--text-primary)}.dropdown-wrapper.active .settings-item{color:var(--text-primary);font-weight:700}.vertical-menu-container{opacity:0;visibility:hidden;border-top:1px solid var(--border-subtle);flex-direction:column;align-items:center;padding:10px 0;transition:all .3s;display:flex}.vertical-menu-container.show{opacity:1;visibility:visible}.dropdown-menu{flex-direction:column;align-items:center;gap:4px;width:100%;display:flex}.dropdown-item{cursor:pointer;width:90%;height:36px;color:var(--text-secondary);border-radius:var(--radius-sm);background:0 0;border:none;justify-content:center;align-items:center;font-family:inherit;font-size:14px;font-weight:500;transition:all .2s;display:flex}.dropdown-item:hover{background-color:var(--overlay-subtle);color:var(--text-primary)}.dropdown-item.active{color:var(--text-primary);font-weight:700}@media (width<=640px){.settings-capsule{max-width:80px;height:40px}.settings-capsule.open.has-vertical{height:120px}.settings-main-row{height:40px}.settings-trigger{height:40px;padding:0 16px;font-size:14px}.settings-item{height:40px;padding:0 12px;font-size:13px}}.dynamic-title-container{z-index:1;pointer-events:none;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.dynamic-title{letter-spacing:-.04em;color:var(--text-primary);padding:0 var(--spacing-md);text-align:center;justify-content:center;align-items:center;width:100%;margin:0;font-size:clamp(32px,8vw,80px);font-weight:700;display:flex}.title-prefix{white-space:pre;display:block}.title-suffix-wrapper{display:grid}.dynamic-suffix{white-space:pre;color:var(--text-secondary);background:linear-gradient(90deg, var(--text-secondary), var(--text-primary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;grid-area:1/1;place-self:center}.dynamic-suffix.ghost{visibility:hidden;pointer-events:none}.dynamic-suffix.leaving{animation:.4s cubic-bezier(.4,0,.2,1) forwards slideUpOut}.dynamic-suffix.entering{animation:.4s cubic-bezier(.4,0,.2,1) forwards slideUpIn}.dynamic-suffix.settled{opacity:1;transform:translateY(0)}@keyframes slideUpIn{0%{opacity:0;transform:translateY(80%)}to{opacity:1;transform:translateY(0)}}@keyframes slideUpOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-80%)}}@media (width<=640px){.dynamic-title{gap:var(--spacing-xs);flex-direction:column}}