.app-error{min-height:100dvh;padding:var(--space-lg);background:var(--color-bg-primary);place-items:center;display:grid}.app-error__panel{width:min(100%,560px);padding:var(--space-xl);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-bg-elevated);box-shadow:var(--shadow-lg)}.app-error__eyebrow{margin-bottom:var(--space-sm);color:var(--color-accent);font-family:var(--font-mono);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em}.app-error h1{margin-bottom:var(--space-md);font-family:var(--font-display);font-size:var(--text-2xl)}.app-error p:not(.app-error__eyebrow){color:var(--color-text-secondary)}.app-error button{margin-top:var(--space-lg);border-radius:var(--radius-md);background:var(--color-accent);color:var(--color-accent-text);padding:10px 18px;font-weight:500}.site-header{z-index:100;padding:var(--space-md) 0;transition:background var(--duration-normal) var(--ease-out-expo), box-shadow var(--duration-normal) var(--ease-out-expo), padding var(--duration-normal) var(--ease-out-expo);position:fixed;top:0;left:0;right:0}.site-header--scrolled{-webkit-backdrop-filter:blur(20px)saturate(1.6);box-shadow:0 1px 0 var(--color-border-subtle), var(--shadow-xs);padding:var(--space-sm) 0;background:oklch(98.5% .002 90/.8)}.site-header__inner{justify-content:space-between;align-items:center;display:flex}.site-header__logo{font-family:var(--font-display);font-weight:600;font-size:var(--text-lg);letter-spacing:-.02em;color:var(--color-text-primary);align-items:center;gap:10px;display:flex}.site-header__logo:hover{color:var(--color-text-primary)}.site-header__logo-mark{width:32px;height:32px;font-family:var(--font-mono);color:var(--color-accent-text);background:var(--color-accent);border-radius:var(--radius-sm);justify-content:center;align-items:center;font-size:11px;font-weight:600;display:flex}.site-header__logo-text{color:var(--color-text-primary)}.site-header__nav{align-items:center;gap:var(--space-xs);display:flex}.site-header__link{font-size:var(--text-sm);color:var(--color-text-secondary);border-radius:var(--radius-full);transition:color var(--duration-fast) var(--ease-out-expo), background var(--duration-fast) var(--ease-out-expo);padding:6px 14px;font-weight:400}.site-header__link:hover,.site-header__link--active{color:var(--color-text-primary);background:var(--color-bg-hover)}.site-header__link--external{align-items:center;gap:4px;display:inline-flex}.site-header__link--external svg{opacity:.4;transition:opacity var(--duration-fast)}.site-header__link--external:hover svg{opacity:.8}.site-header__burger{z-index:201;border-radius:var(--radius-sm);flex-direction:column;gap:5px;padding:8px;display:none;position:relative}.site-header__burger:hover{background:var(--color-bg-hover)}.site-header__burger span{background:var(--color-text-secondary);width:18px;height:1.5px;transition:transform var(--duration-normal) var(--ease-out-expo), opacity var(--duration-fast);border-radius:1px;display:block}@media (width<=640px){.site-header__burger{display:flex}.site-header__nav{align-items:flex-start;gap:var(--space-sm);width:280px;padding:var(--space-3xl) var(--space-lg);background:var(--color-bg-elevated);border-left:1px solid var(--color-border-subtle);box-shadow:var(--shadow-lg);transition:transform var(--duration-slow) var(--ease-out-expo);z-index:200;flex-direction:column;position:fixed;top:0;bottom:0;right:0;transform:translate(100%)}.site-header__nav--open{transform:translate(0)}.site-header__link{font-size:var(--text-base);width:100%}}.site-footer{border-top:1px solid var(--color-border-subtle);padding:var(--space-2xl) 0;background:var(--color-bg-secondary);margin-top:auto}.site-footer__inner{justify-content:space-between;align-items:center;gap:var(--space-md);flex-wrap:wrap;display:flex}.site-footer__copy{font-size:var(--text-sm);color:var(--color-text-tertiary)}.site-footer__links{gap:var(--space-lg);display:flex}.site-footer__links a{font-size:var(--text-sm);color:var(--color-text-tertiary);transition:color var(--duration-fast)}.site-footer__links a:hover{color:var(--color-accent)}.project-card{gap:var(--space-lg);padding:var(--space-xl);background:var(--color-bg-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-lg);transition:border-color var(--duration-normal) var(--ease-out-expo), transform var(--duration-normal) var(--ease-out-expo), box-shadow var(--duration-normal) var(--ease-out-expo);flex-direction:column;display:flex}.project-card:hover{border-color:var(--color-border);box-shadow:var(--shadow-lg);transform:translateY(-3px)}.project-card__head{gap:var(--space-sm);flex-direction:column;display:flex}.project-card__meta{align-items:center;gap:var(--space-sm);display:flex}.project-card__category{font-size:var(--text-xs);color:var(--color-accent);text-transform:uppercase;letter-spacing:.08em;font-weight:500}.project-card__version{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-tertiary);background:var(--color-tag-bg);border-radius:var(--radius-full);padding:2px 10px}.project-card__title{font-family:var(--font-display);font-size:var(--text-xl);letter-spacing:-.02em;font-weight:600;line-height:1.3}.project-card__title a{transition:color var(--duration-fast)}.project-card__title a:hover{color:var(--color-accent)}.project-card__desc{font-size:var(--text-sm);color:var(--color-text-secondary);max-width:45ch;line-height:1.65}.project-card__tags{flex-wrap:wrap;gap:6px;display:flex}.project-card__tag{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-tag-text);background:var(--color-tag-bg);border-radius:var(--radius-full);padding:4px 12px}.project-card__actions{align-items:center;gap:var(--space-sm);margin-top:auto;display:flex}.project-card__btn{font-size:var(--text-sm);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out-expo);align-items:center;gap:6px;padding:9px 18px;font-weight:500;display:inline-flex}.project-card__btn--primary{background:var(--color-accent);color:var(--color-accent-text)}.project-card__btn--primary:hover{background:var(--color-accent-hover);color:var(--color-accent-text);box-shadow:var(--shadow-accent);transform:translateY(-1px)}.project-card__btn--ghost{color:var(--color-text-secondary);border:1px solid var(--color-border)}.project-card__btn--ghost:hover{color:var(--color-text-primary);border-color:var(--color-text-tertiary);background:var(--color-bg-hover)}.project-card__btn--disabled{color:var(--color-text-tertiary);cursor:default}.hero{padding-top:calc(var(--space-3xl) + 56px);padding-bottom:var(--space-3xl);position:relative;overflow:hidden}.hero:before{content:"";pointer-events:none;background:radial-gradient(80% 60% at 10% 20%,oklch(55% .2 260/.06),#0000),radial-gradient(60% 50% at 80% 80%,oklch(65% .18 330/.04),#0000),radial-gradient(50% 40% at 50% 10%,oklch(65% .15 200/.04),#0000);position:absolute;inset:0}.hero__inner{text-align:center;flex-direction:column;align-items:center;display:flex;position:relative}.hero__content{z-index:1;max-width:720px;position:relative}.hero__eyebrow{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-accent);background:var(--color-accent-subtle);border-radius:var(--radius-full);margin-bottom:var(--space-lg);align-items:center;gap:8px;padding:5px 16px;display:inline-flex}.hero__title{font-family:var(--font-display);font-size:var(--text-hero);letter-spacing:-.04em;color:var(--color-text-primary);margin-bottom:var(--space-lg);font-weight:700;line-height:1.1}.hero__title-accent{color:var(--color-accent)}.hero__subtitle{font-size:var(--text-lg);color:var(--color-text-secondary);max-width:52ch;margin:0 auto var(--space-xl);line-height:1.65}.hero__actions{justify-content:center;align-items:center;gap:var(--space-md);display:flex}.hero__cta{font-size:var(--text-sm);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out-expo);align-items:center;gap:8px;padding:11px 24px;font-weight:500;display:inline-flex}.hero__cta--primary{background:var(--color-accent);color:var(--color-accent-text)}.hero__cta--primary:hover{background:var(--color-accent-hover);color:var(--color-accent-text);box-shadow:var(--shadow-accent);transform:translateY(-1px)}.hero__cta--ghost{color:var(--color-text-secondary);border:1px solid var(--color-border)}.hero__cta--ghost:hover{color:var(--color-text-primary);border-color:var(--color-text-tertiary);background:var(--color-bg-hover)}.projects-section{padding:var(--space-section) 0}.projects-section__head{margin-bottom:var(--space-2xl);text-align:center}.projects-section__title{font-family:var(--font-display);font-size:var(--text-2xl);letter-spacing:-.02em;margin-bottom:var(--space-sm);font-weight:600}.projects-section__desc{font-size:var(--text-sm);color:var(--color-text-secondary)}.projects-grid{gap:var(--space-lg);grid-template-columns:repeat(auto-fill,minmax(340px,1fr));display:grid}.projects-section__state{justify-content:center;align-items:center;gap:var(--space-md);padding:var(--space-2xl) 0;color:var(--color-text-tertiary);font-size:var(--text-sm);display:flex}.projects-section__state--error{color:oklch(55% .2 25);flex-direction:column}.projects-section__retry{border-radius:var(--radius-md);color:inherit;border:1px solid;padding:8px 16px;font-weight:500}.spinner{border:2px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;width:18px;height:18px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=640px){.hero__actions{flex-direction:column}.projects-grid{grid-template-columns:1fr}}.not-found-page{min-height:70dvh;padding-top:calc(var(--space-3xl) + 56px);padding-bottom:var(--space-section);text-align:center}.not-found-page__code{margin-bottom:var(--space-sm);color:var(--color-accent);font-family:var(--font-mono);font-size:var(--text-sm)}.not-found-page h1{margin-bottom:var(--space-sm);font-family:var(--font-display);font-size:var(--text-2xl)}.not-found-page>p:not(.not-found-page__code){margin-bottom:var(--space-lg);color:var(--color-text-secondary)}.not-found-page__link{color:var(--color-accent);font-weight:500}:root{--color-bg-primary:oklch(98.5% .002 90);--color-bg-secondary:oklch(97% .003 90);--color-bg-elevated:oklch(100% 0 0);--color-bg-hover:oklch(96% .004 90);--color-bg-subtle:oklch(94% .006 90);--color-text-primary:oklch(18% .01 260);--color-text-secondary:oklch(45% .01 260);--color-text-tertiary:oklch(62% .008 260);--color-border:oklch(88% .006 260);--color-border-subtle:oklch(93% .004 260);--color-accent:oklch(55% .2 260);--color-accent-hover:oklch(48% .22 260);--color-accent-subtle:oklch(55% .2 260/.08);--color-accent-text:oklch(99% 0 0);--color-tag-bg:oklch(96% .01 260);--color-tag-text:oklch(45% .02 260);--color-success:oklch(55% .17 155);--color-success-subtle:oklch(55% .17 155/.1);--color-warning:oklch(65% .18 65);--color-warning-subtle:oklch(65% .18 65/.1);--font-display:"Segoe UI Variable Display", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;--font-mono:"Cascadia Code", "SFMono-Regular", Consolas, ui-monospace, monospace;--font-body:"Segoe UI Variable Text", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;--text-xs:clamp(.7rem, .65rem + .25vw, .75rem);--text-sm:clamp(.8rem, .75rem + .25vw, .875rem);--text-base:clamp(.9rem, .85rem + .25vw, 1rem);--text-lg:clamp(1.05rem, .95rem + .5vw, 1.2rem);--text-xl:clamp(1.2rem, 1rem + 1vw, 1.5rem);--text-2xl:clamp(1.5rem, 1.2rem + 1.5vw, 2rem);--text-3xl:clamp(1.8rem, 1.4rem + 2vw, 2.8rem);--text-hero:clamp(2.4rem, 1.8rem + 3vw, 4.2rem);--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2.5rem;--space-2xl:4rem;--space-3xl:6rem;--space-section:clamp(5rem, 4rem + 5vw, 9rem);--max-width:1200px;--radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-xl:28px;--radius-full:999px;--ease-out-expo:cubic-bezier(.16, 1, .3, 1);--ease-out-quart:cubic-bezier(.25, 1, .5, 1);--duration-fast:.15s;--duration-normal:.25s;--duration-slow:.45s;--shadow-xs:0 1px 2px oklch(18% .01 260/.04);--shadow-sm:0 1px 3px oklch(18% .01 260/.06), 0 1px 2px oklch(18% .01 260/.04);--shadow-md:0 4px 16px oklch(18% .01 260/.06), 0 1px 3px oklch(18% .01 260/.04);--shadow-lg:0 12px 40px oklch(18% .01 260/.08), 0 4px 12px oklch(18% .01 260/.04);--shadow-accent:0 4px 20px oklch(55% .2 260/.25)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}body{font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text-primary);background-color:var(--color-bg-primary);min-height:100dvh;line-height:1.6}a{color:inherit;transition:color var(--duration-fast) var(--ease-out-expo);text-decoration:none}a:hover{color:var(--color-accent)}img{max-width:100%;display:block}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none}ul,ol{list-style:none}.container{width:100%;max-width:var(--max-width);padding:0 var(--space-lg);margin:0 auto}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--color-text-tertiary)}::selection{background:var(--color-accent-subtle);color:var(--color-accent)}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.app-layout{flex-direction:column;min-height:100dvh;display:flex}.app-layout>main{flex:1}.route-loading{min-height:70dvh;padding-top:calc(var(--space-3xl) + 56px);justify-content:center;align-items:flex-start;gap:var(--space-md);color:var(--color-text-tertiary);font-size:var(--text-sm);display:flex}