:root{--spacing-2xs:2px;--spacing-xs:4px;--spacing-sm:8px;--spacing-sm-md:12px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-2xl:48px;--spacing-3xl:64px;--spacing-4xl:96px;--font-sans:"Mona Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, "SF Mono", "Cascadia Code", "Fira Code", monospace;--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-full:9999px;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 4px 6px #0006;--shadow-lg:0 10px 15px #00000080;--z-behind:-1;--z-base:1;--z-overlay:10;--z-modal:100;--z-toast:1000;--z-top-bar:9999;--bp-sm:640px;--bp-md:768px;--bp-lg:1024px;--bp-xl:1280px;--duration-fast:.15s}:root,[data-theme=dark]{--color-bg:#000;--color-surface:#18181b;--color-surface-alt:#212124;--color-border:#2e2e32;--color-text:#f2f2f5;--color-text-muted:#9a9aa3;--color-primary:#5488ff;--color-primary-dark:#3b6fe0;--color-accent:#2dd4a0;--color-danger:#ff6b6b;--color-warning:#f5a623;--color-badge-bg:#232326;--color-badge-text:#93c5fd}[data-theme=light]{--color-bg:#fff;--color-surface:#f4f4f5;--color-surface-alt:#e8e8ea;--color-border:#e2e2e5;--color-text:#16161a;--color-text-muted:#6b6b74;--color-primary:#5488ff;--color-primary-dark:#3b6fe0;--color-accent:#2dd4a0;--color-danger:#ff6b6b;--color-warning:#f5a623;--color-badge-bg:#eef1ff;--color-badge-text:#35c}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6}img{max-width:100%;display:block}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}button{font:inherit;cursor:pointer;color:inherit;background:0 0;border:none}pre,code{font-family:var(--font-mono)}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}.block{display:block}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-xs{gap:var(--spacing-xs)}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}.gap-lg{gap:var(--spacing-lg)}.gap-xl{gap:var(--spacing-xl)}.p-xs{padding:var(--spacing-xs)}.p-sm{padding:var(--spacing-sm)}.p-md{padding:var(--spacing-md)}.p-lg{padding:var(--spacing-lg)}.p-xl{padding:var(--spacing-xl)}.px-sm{padding-inline:var(--spacing-sm)}.px-md{padding-inline:var(--spacing-md)}.px-lg{padding-inline:var(--spacing-lg)}.py-sm{padding-block:var(--spacing-sm)}.py-md{padding-block:var(--spacing-md)}.py-lg{padding-block:var(--spacing-lg)}.m-auto{margin:auto}.ml-auto{margin-left:auto}.mt-sm{margin-top:var(--spacing-sm)}.mt-md{margin-top:var(--spacing-md)}.mt-lg{margin-top:var(--spacing-lg)}.mt-xl{margin-top:var(--spacing-xl)}.mb-sm{margin-bottom:var(--spacing-sm)}.mb-md{margin-bottom:var(--spacing-md)}.mb-lg{margin-bottom:var(--spacing-lg)}.mb-xl{margin-bottom:var(--spacing-xl)}.bg-surface{background:var(--color-surface)}.bg-surface-alt{background:var(--color-surface-alt)}.bg-primary{background:var(--color-primary)}.bg-accent{background:var(--color-accent)}.bg-danger{background:var(--color-danger)}.text-primary{color:var(--color-primary)}.text-muted{color:var(--color-text-muted)}.text-danger{color:var(--color-danger)}.text-accent{color:var(--color-accent)}.border{border:1px solid var(--color-border)}.border-t{border-top:1px solid var(--color-border)}.border-b{border-bottom:1px solid var(--color-border)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded{border-radius:var(--radius-full)}.w-full{width:100%}.h-full{height:100%}.min-w-0{min-width:0}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.cursor-pointer{cursor:pointer}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.badge-pill{border-radius:var(--radius-full);background:var(--color-badge-bg);color:var(--color-badge-text);border:1px solid var(--color-border);font-family:var(--font-mono);display:inline-block}.badge-pill-xs{font-size:var(--text-xs);padding:var(--spacing-2xs) var(--spacing-sm)}.badge-pill-sm{font-size:var(--text-sm);padding:var(--spacing-xs) var(--spacing-sm-md)}.text-disabled{color:var(--color-text-muted);cursor:default}.font-mono{font-family:var(--font-mono)}.text-sm{font-size:var(--text-sm)}.text-lg{font-size:var(--text-lg)}.text-xl{font-size:var(--text-xl)}.text-2xl{font-size:var(--text-2xl)}.text-center{text-align:center}.container{max-width:1200px;padding-inline:var(--spacing-lg);margin:0 auto}.app-layout{flex-direction:column;min-height:100dvh;display:flex}.background-video{object-fit:cover;width:100%;height:100%;z-index:var(--z-behind);pointer-events:none;position:fixed;inset:0}.main-content{padding-block:var(--spacing-3xl);flex:1}.nav{padding:var(--spacing-md) var(--spacing-lg);background:var(--color-surface);border-bottom:1px solid var(--color-border);z-index:var(--z-overlay);justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.nav-logo{align-items:center;gap:var(--spacing-sm);font-size:var(--text-xl);color:var(--color-text);font-weight:700;display:flex}.nav-logo-gif,.nav-logo-static{filter:invert(0);width:auto;height:100px;position:absolute;left:65px}[data-theme=light] .nav-logo-gif,[data-theme=light] .nav-logo-static{filter:invert()}.nav-logo-static{display:none}@media (prefers-reduced-motion:reduce){.nav-logo-gif{display:none}.nav-logo-static{display:inline-block}}@media (width<=640px){.nav-logo-gif,.nav-logo-static{display:none}}.nav-links{gap:var(--spacing-lg);display:flex}.nav-links a{color:var(--color-text-muted);font-size:var(--text-sm);transition:color var(--duration-fast)}.theme-toggle{border-radius:var(--radius-full);border:1px solid var(--color-border);width:28px;height:28px;color:var(--color-text-muted);font-size:var(--text-sm);transition:color var(--duration-fast), border-color var(--duration-fast);justify-content:center;align-items:center;display:flex}.theme-toggle:hover{color:var(--color-text);border-color:var(--color-text-muted)}.nav-links a:hover{color:var(--color-text);text-decoration:none}@media (width>=768px){.container{padding-inline:var(--spacing-xl)}}.back-link{align-items:center;gap:var(--spacing-xs);color:var(--color-text-muted);font-size:var(--text-sm);margin-bottom:var(--spacing-lg);transition:color var(--duration-fast);display:inline-flex}.back-link:hover{color:var(--color-primary);text-decoration:none}.tab-bar{border-bottom:2px solid var(--color-border);margin-bottom:var(--spacing-lg);gap:0;display:flex;overflow-x:auto}.tab-button{align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);font-size:var(--text-sm);font-family:var(--font-mono);color:var(--color-text-muted);transition:color var(--duration-fast);white-space:nowrap;border-bottom:2px solid #0000;margin-bottom:-2px;display:flex;position:relative}.tab-button:hover{color:var(--color-text);text-decoration:none}.tab-button.active{color:var(--color-primary)}.tab-icon{font-size:var(--text-xs);opacity:.7}.tab-indicator{background:var(--color-primary);height:2px;position:absolute;bottom:-2px;left:0;right:0}.page-shell{gap:var(--spacing-xl);grid-template-columns:1fr;display:grid}@media (width>=1024px){.page-shell{grid-template-columns:1fr 280px;align-items:start}}.page-aside{gap:var(--spacing-lg);flex-direction:column;display:flex}@media (width>=1024px){.page-aside{top:calc(var(--spacing-lg) + var(--nav-height,65px));position:sticky}}.site-footer{justify-content:space-between;align-items:center;gap:var(--spacing-md);background:var(--color-surface);border-top:1px solid var(--color-border);padding:var(--spacing-lg);color:var(--color-text-muted);font-size:var(--text-sm);flex-wrap:wrap;display:flex}.site-footer-socials{gap:var(--spacing-sm);display:flex}.site-footer-links{align-items:center;gap:var(--spacing-sm);display:flex}.site-footer-links-label{color:var(--color-text-muted);font-weight:600}.social-link{background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:var(--radius-md);width:36px;height:36px;color:var(--color-text-muted);transition:border-color var(--duration-fast), color var(--duration-fast);justify-content:center;align-items:center;display:inline-flex}.social-link:hover{border-color:var(--color-primary);color:var(--color-text);text-decoration:none}.site-footer a{color:var(--color-text-muted)}.site-footer a:hover{color:var(--color-text)}#top-bar{height:3px;z-index:var(--z-top-bar);pointer-events:none;position:fixed;top:0;left:0;right:0}#top-bar-fill{background:var(--color-primary);transform-origin:0;height:100%;transform:scaleX(0)}body.page-loading #top-bar-fill{animation:8s ease-out forwards top-bar-progress}body.page-loading-done #top-bar-fill{opacity:0;transition:transform .28s ease-out,opacity .3s ease-out .28s;transform:scaleX(1)!important}@keyframes top-bar-progress{0%{transform:scaleX(0)}30%{transform:scaleX(.28)}50%{transform:scaleX(.5)}75%{transform:scaleX(.72)}to{transform:scaleX(.9)}}@media (prefers-reduced-motion:reduce){body.page-loading #top-bar-fill{animation:none;transform:scaleX(.9)}}h1,h2,h3,h4,h5,h6{color:var(--color-text);font-weight:600;line-height:1.3}h1{font-size:var(--text-3xl);margin-bottom:var(--spacing-lg)}h2{font-size:var(--text-2xl);margin-bottom:var(--spacing-md)}h3{font-size:var(--text-xl);margin-bottom:var(--spacing-sm)}p{margin-bottom:var(--spacing-md)}p:last-child{margin-bottom:0}.markdown-content .code-block{border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--spacing-md);overflow:hidden}.markdown-content .code-block-header{justify-content:space-between;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);border-bottom:1px solid var(--color-border);background:var(--color-surface);display:flex}.markdown-content .code-block-lang{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-muted)}.markdown-content .code-block-copy{font-size:var(--text-xs);color:var(--color-text-muted);transition:color var(--duration-fast)}.markdown-content .code-block-copy:hover{color:var(--color-text)}.markdown-content .code-block-copy:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.markdown-content pre{background:var(--color-surface-alt);padding:var(--spacing-md);overflow-x:auto}.markdown-content code{font-family:var(--font-mono);font-size:var(--text-sm)}.markdown-content :not(pre)>code{background:var(--color-surface-alt);border-radius:var(--radius-sm);border:1px solid var(--color-border);padding:2px 6px}.markdown-content ul,.markdown-content ol{padding-left:var(--spacing-xl);margin-bottom:var(--spacing-md)}.markdown-content li{margin-bottom:var(--spacing-xs)}.markdown-content blockquote{border-left:3px solid var(--color-primary);padding-left:var(--spacing-md);color:var(--color-text-muted);margin-bottom:var(--spacing-md)}.markdown-content hr{border:none;border-top:1px solid var(--color-border);margin-block:var(--spacing-lg)}.markdown-content table{border-collapse:collapse;width:100%;margin-bottom:var(--spacing-md)}.markdown-content th,.markdown-content td{border:1px solid var(--color-border);padding:var(--spacing-sm) var(--spacing-md);text-align:left}.markdown-content th{background:var(--color-surface-alt);font-weight:600}.hljs{background:var(--color-surface-alt);color:var(--color-text)}.hljs-comment,.hljs-quote{color:var(--color-text-muted);font-style:italic}.hljs-keyword,.hljs-selector-tag,.hljs-tag,.hljs-literal{color:var(--color-primary)}.hljs-string,.hljs-attr,.hljs-template-tag,.hljs-template-variable{color:var(--color-accent)}.hljs-number,.hljs-symbol,.hljs-bullet{color:var(--color-warning)}.hljs-title,.hljs-name,.hljs-section,.hljs-selector-id,.hljs-selector-class{color:var(--color-badge-text)}.hljs-deletion,.hljs-regexp{color:var(--color-danger)}.hljs-addition{color:var(--color-accent)}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.home-header{margin-bottom:var(--spacing-2xl)}.home-title{font-size:var(--text-3xl);font-weight:700}.home-subtitle{color:var(--color-text-muted);font-size:var(--text-lg);margin-top:var(--spacing-sm)}.project-grid{gap:var(--spacing-lg);grid-template-columns:1fr;display:grid}@media (width>=640px){.project-grid{grid-template-columns:repeat(2,1fr)}}@media (width>=1024px){.project-grid{grid-template-columns:repeat(3,1fr)}}.project-card{position:relative}.project-card-title{font-size:var(--text-lg);font-weight:600}.project-card-link{color:inherit}.project-card-link:hover{text-decoration:none}.project-card-link:after{content:"";position:absolute;inset:0}.project-card .badge{z-index:1;position:relative}.project-card-desc{font-size:var(--text-sm);-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.5;display:-webkit-box;overflow:hidden}.project-card-footer{border-top:1px solid var(--color-border);padding-top:var(--spacing-sm)}.badge img{display:inline}.detail-header{margin-bottom:var(--spacing-xl)}.detail-title{font-size:var(--text-3xl);font-weight:700;font-family:var(--font-mono)}.detail-desc{color:var(--color-text-muted);margin-top:var(--spacing-sm)}.tab-content{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-lg);min-height:300px}.profile-avatar{border-radius:var(--radius-sm);background:var(--color-surface-alt);border:2px solid var(--color-border);width:56px;height:56px;font-size:var(--text-xl);font-family:var(--font-mono);color:var(--color-primary);flex-shrink:0;justify-content:center;align-items:center;display:flex}.profile-name{font-family:var(--font-mono);color:var(--color-text);font-size:32px;font-weight:700}.profile-terminal-line{margin-top:var(--spacing-xs)}.profile-stack{color:var(--color-primary)}.profile-meta{align-items:center;gap:var(--spacing-sm);color:var(--color-text-muted);font-size:var(--text-sm);display:flex}.profile-handle{font-family:var(--font-mono)}.profile-bio{color:var(--color-text);font-size:var(--text-lg);white-space:pre-line;line-height:1.8}.skills-section h2{font-size:var(--text-lg);margin-bottom:var(--spacing-md)}.contact-shell{max-width:560px;padding-block:var(--spacing-2xl) var(--spacing-3xl);margin-inline:auto}.contact-head{margin-bottom:var(--spacing-xl)}.contact-form{gap:var(--spacing-lg);flex-direction:column;display:flex}.contact-field{gap:var(--spacing-xs);font-size:var(--text-sm);color:var(--color-text-muted);flex-direction:column;display:flex}.contact-field input,.contact-field select,.contact-field textarea{font:inherit;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-sm) var(--spacing-sm-md)}.contact-field input:focus-visible,.contact-field select:focus-visible,.contact-field textarea:focus-visible{outline:2px solid var(--color-primary);outline-offset:1px}.contact-field textarea{resize:vertical;min-height:8rem}.contact-hp{width:1px;height:1px;position:absolute;left:-9999px;overflow:hidden}.contact-btn-primary{font:inherit;color:var(--color-bg);background:var(--color-primary);border-radius:var(--radius-md);padding:var(--spacing-sm) var(--spacing-lg);cursor:pointer;transition:background var(--duration-fast) ease;border:none;align-self:flex-start;font-weight:600}.contact-btn-primary:hover:not(:disabled){background:var(--color-primary-dark)}.contact-btn-primary:disabled{opacity:.6;cursor:not-allowed}.contact-btn-secondary{font:inherit;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-sm) var(--spacing-lg);cursor:pointer}.contact-sent{align-items:flex-start;gap:var(--spacing-md);padding:var(--spacing-lg);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);flex-direction:column;display:flex}.contact-error{color:var(--color-danger);font-size:var(--text-sm)}