@import"https://fonts.googleapis.com/css2?family=Inter:wght@100..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap";*{box-sizing:border-box}html,body,#app{min-height:100%}body{margin:0;background:#f5f5f5;color:#0b0b0f;font-family:Inter,PingFang SC,Microsoft YaHei,sans-serif;overflow-x:hidden}img{display:block;max-width:100%}a{color:inherit}.language-home{position:relative;min-height:100vh;overflow:hidden}.home-logo{position:absolute;left:50%;top:4vh;z-index:2;width:min(30vw,360px);transform:translate(-50%);mix-blend-mode:difference}.language-panels{display:flex;min-height:100vh;font-family:JetBrains Mono,monospace;font-size:clamp(18px,2vw,24px)}.language-panel{display:flex;flex:1 1 50%;flex-direction:column;align-items:center;justify-content:center;min-width:0;padding:32px;text-decoration:none;transition:flex-basis .8s ease,color .45s ease}.language-panel:hover{flex-basis:72%}.language-panel--dark{background:#111;color:#fff}.language-panel--light{background:#f5f5f5;color:#111}.language-label{text-decoration-thickness:1px;text-underline-offset:4px}.language-panel:hover .language-label{text-decoration:underline}.language-line{width:min(520px,80%);margin-top:18px;color:transparent;text-align:center;transition:color .45s ease}.language-panel--dark:hover .language-line{color:#ffffffeb}.language-panel--light:hover .language-line{color:#171717}.site-header{position:sticky;top:0;z-index:5;display:grid;grid-template-columns:148px 1fr;align-items:start;min-height:126px;padding:26px clamp(20px,5vw,64px) 18px;background:#f5f5f5eb;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.site-header--compact{grid-template-columns:148px 1fr auto;min-height:96px}.phone-logo{display:none;width:44px}.logo-mark{display:inline-flex;align-items:center;width:max-content;min-height:36px;font-family:JetBrains Mono,monospace;font-size:17px;font-weight:500;line-height:1;text-decoration:none;text-transform:uppercase;white-space:nowrap}.logo-mark span{padding-bottom:3px;border-bottom:1px solid transparent}.logo-mark:hover span{border-bottom-color:currentColor}.top-nav{display:flex;align-items:flex-start;justify-content:flex-end;gap:28px;font-family:JetBrains Mono,monospace;font-size:16px}.nav-link,.text-link{text-decoration:none;text-underline-offset:4px}.nav-link:hover,.nav-link.active,.text-link:hover{text-decoration:underline}.nav-group{display:grid;gap:8px;text-align:center}.sub-nav{display:flex;justify-content:center;gap:18px;font-size:14px}.return-button{display:inline-flex;align-items:center;gap:8px;justify-self:end;min-width:92px;min-height:42px;padding:9px 13px;border:1px solid rgba(11,11,15,.55);background:#f5f5f5c7;font-family:JetBrains Mono,monospace;font-size:14px;text-decoration:none;transition:background .2s ease,color .2s ease,border-color .2s ease}.return-button:hover{border-color:#0b0b0f;background:#0b0b0f;color:#fff}.return-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.project-browser{width:min(1380px,calc(100% - 40px));margin:26px auto 80px}.project-filterbar{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-start;margin:0 0 22px;font-family:JetBrains Mono,monospace}.filter-button{display:inline-flex;align-items:center;min-height:34px;padding:8px 12px;border:1px solid rgba(11,11,15,.34);color:#0b0b0fb8;font-size:13px;line-height:1;text-decoration:none;transition:background .2s ease,border-color .2s ease,color .2s ease}.filter-button:hover,.filter-button.active{border-color:#0b0b0f;background:#0b0b0f;color:#fff}.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(16px,3vw,36px)}.project-card{position:relative;aspect-ratio:1;overflow:hidden;background:#e8e8e8}.project-card__link{display:block;width:100%;height:100%}.project-card__image{width:100%;height:100%;object-fit:cover;filter:saturate(0);transition:filter .35s ease,transform .35s ease}.project-card__title{position:absolute;inset:auto 0 0;padding:18px;background:#0b0b0fc7;color:#fff;font-family:JetBrains Mono,monospace;font-size:15px;line-height:1.45;opacity:0;transform:translateY(10px);transition:opacity .25s ease,transform .25s ease}.project-card:hover .project-card__image{filter:saturate(1);transform:scale(1.02)}.project-card:hover .project-card__title{opacity:1;transform:translateY(0)}.project-card--closed .project-card__image{filter:blur(12px) saturate(.8) contrast(1.1);opacity:.7;transform:scale(1.04)}.project-card--closed:hover .project-card__image{filter:blur(12px) saturate(.8) contrast(1.1);transform:scale(1.04)}.project-card--closed .project-card__link{cursor:default}.project-empty{margin:72px 0 0;color:#0b0b0f8a;font-family:JetBrains Mono,monospace;font-size:14px}.about-page{display:grid;grid-template-columns:minmax(220px,300px) minmax(360px,1fr);gap:clamp(42px,8vw,112px);align-items:start;width:min(1040px,calc(100% - 56px));margin:38px auto 90px}.about-left,.about-right{display:grid;gap:22px;align-content:start}.portrait{width:min(240px,100%);aspect-ratio:1;border-radius:50%;object-fit:cover;object-position:center}.identity h1{margin:0;font-size:clamp(32px,4.6vw,52px);line-height:.95;font-weight:600}.identity p,.identity span{display:block;margin:10px 0 0;font-family:JetBrains Mono,monospace;line-height:1.45}.about-section h2{margin:0 0 14px;font-family:JetBrains Mono,monospace;font-size:clamp(21px,2.5vw,30px);font-weight:500}.about-section{padding-top:22px;border-top:1px solid rgba(11,11,15,.16)}.about-section:first-child{padding-top:0;border-top:0}.about-section p{margin:0;white-space:pre-line;max-width:560px;line-height:1.72}.contact-page{position:relative;display:grid;place-items:center;width:min(980px,calc(100% - 40px));min-height:calc(100vh - 150px);margin:0 auto 70px}.contact-image{width:min(760px,100%)}.contact-list{position:absolute;right:clamp(16px,8vw,110px);bottom:clamp(40px,11vw,126px);display:grid;gap:16px;min-width:280px;padding:24px 28px;background:#f5f5f5d6;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.contact-list p{margin:0}.contact-list strong{margin-right:12px;font-weight:650}.project-detail{width:min(1180px,calc(100% - 40px));margin:34px auto 90px}.project-hero{display:grid;grid-template-columns:minmax(280px,.95fr) minmax(300px,.7fr);gap:clamp(28px,5vw,72px);align-items:center}.project-hero img{width:100%;max-height:720px;object-fit:contain;background:#ececec}.project-kicker{margin:0 0 14px;font-family:JetBrains Mono,monospace;text-transform:uppercase}.project-copy h1{margin:0;font-size:clamp(34px,5vw,68px);line-height:1}.title-separator{display:inline-block;margin:0 .18em;color:#0b0b0f70;font-weight:300}.project-copy p{line-height:1.8}.download-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}.download-link{padding:10px 14px;border:1px solid #0b0b0f;font-family:JetBrains Mono,monospace;text-decoration:none}.download-link:hover{background:#0b0b0f;color:#fff}.output-gallery{display:grid;gap:28px;margin-top:56px}.output-gallery img{width:100%;max-height:1200px;object-fit:contain;background:#ececec}.code-stack{display:grid;gap:30px;margin-top:56px}.code-panel{border:1px solid rgba(11,11,15,.16);background:#101114;color:#f5f5f5}.code-panel__header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.14);font-family:JetBrains Mono,monospace}.code-panel__header h2{margin:0;font-size:15px;font-weight:500}.code-panel__header span{display:block;margin-top:6px;color:#f5f5f594;font-size:12px}.code-copy{flex:0 0 auto;min-height:34px;padding:8px 12px;border:1px solid rgba(245,245,245,.36);background:transparent;color:inherit;font-family:JetBrains Mono,monospace;font-size:12px;cursor:pointer}.code-copy:hover{background:#f5f5f5;color:#101114}.code-mobile-note{display:none;margin:0;padding:18px;color:#f5f5f5b8;font-family:JetBrains Mono,monospace;font-size:13px;line-height:1.6}.code-panel__body{max-height:620px;margin:0;padding:18px;overflow:auto;font-family:JetBrains Mono,monospace;font-size:13px;line-height:1.62;-moz-tab-size:2;tab-size:2}.code-panel__body code{display:block;min-width:max-content;white-space:pre}.embed-stack{display:grid;gap:42px;margin-top:70px}.embed-panel h2{margin:0 0 14px;font-family:JetBrains Mono,monospace;font-weight:500}.embed-panel iframe{width:100%;height:min(78vh,900px);border:1px solid rgba(0,0,0,.12);background:#fff}.embed-link{display:block;width:fit-content;margin:12px auto 0;font-family:JetBrains Mono,monospace;font-size:13px;text-align:center;text-decoration:underline;text-underline-offset:4px}.embed-note{margin:10px auto 0;color:#0b0b0fad;font-family:JetBrains Mono,monospace;font-size:13px;text-align:center}.project-detail--empty{min-height:50vh}@media (max-width: 780px){body{min-width:320px}.language-panels{flex-direction:column}.language-panel{min-height:50vh;padding:24px 22px}.language-panel:hover{flex-basis:50%}.home-logo{top:50%;width:min(55vw,260px);transform:translate(-50%,-50%)}.language-line{width:min(320px,88%);color:currentColor;font-size:13px;line-height:1.55;opacity:.72}.site-header,.site-header--compact{grid-template-columns:48px minmax(0,1fr);align-items:center;gap:12px;min-height:auto;padding:12px 16px 11px}.phone-logo{display:block;width:42px}.phone-logo img{width:42px;height:42px}.logo-mark{display:none}.return-button{grid-column:2;min-width:82px;min-height:38px;padding:8px 10px;font-size:13px}.top-nav{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:7px 12px;min-width:0;font-size:12px;line-height:1.2}.nav-separator{display:none}.nav-group{display:contents}.nav-label{display:none}.sub-nav{display:contents;font-size:12px}.project-browser{width:calc(100% - 32px);margin-top:14px;margin-bottom:54px}.project-filterbar{flex-wrap:nowrap;gap:7px;margin-bottom:14px;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:none}.project-filterbar::-webkit-scrollbar{display:none}.filter-button{flex:0 0 auto;min-height:32px;padding:8px 10px;font-size:12px;white-space:nowrap}.filter-button--unpublished,.filter-button--vibe-coding{display:none}.project-grid{grid-template-columns:1fr;gap:14px}.project-card__title{padding:13px 14px;font-size:13px;opacity:1;transform:none}.project-card__image{filter:saturate(.2)}.about-page,.project-hero{grid-template-columns:1fr}.about-page{width:min(100% - 36px,560px);gap:30px;margin-top:28px;margin-bottom:64px}.about-left{grid-template-columns:132px minmax(0,1fr);align-items:end;gap:18px}.portrait{width:132px}.identity h1{font-size:34px}.identity span{font-size:12px}.about-section p{font-size:15px}.contact-page{width:calc(100% - 32px);min-height:auto;margin:18px auto 56px;place-items:stretch}.contact-image{width:100%;max-height:58vh;object-fit:contain}.contact-list{position:static;width:100%;min-width:0;margin-top:16px;padding:18px 0 0;border-top:1px solid rgba(11,11,15,.16);background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}.contact-list p{display:grid;grid-template-columns:84px minmax(0,1fr);gap:10px;align-items:baseline}.contact-list strong{margin-right:0}.contact-list span{overflow-wrap:anywhere}.project-detail{width:calc(100% - 32px);margin:22px auto 64px}.project-hero{gap:24px}.project-hero img{max-height:58vh}.project-kicker{margin-bottom:10px;font-size:12px}.project-copy h1{font-size:clamp(30px,11vw,42px);line-height:1.02}.project-copy p{font-size:15px;line-height:1.72}.download-row{margin-top:24px}.download-link{width:100%;padding:12px 14px;text-align:center}.output-gallery{gap:18px;margin-top:34px}.output-gallery img{max-height:none}.code-stack{gap:22px;margin-top:34px}.code-panel__header{align-items:flex-start;padding:14px}.code-panel__header h2{font-size:13px;line-height:1.35}.code-copy,.code-panel__body{display:none}.code-mobile-note{display:block}.embed-stack{gap:30px;margin-top:42px}.embed-panel h2{font-size:18px}.embed-note{font-size:12px}.embed-panel iframe{height:min(68vh,620px);min-height:420px}}@media (max-width: 420px){.site-header,.site-header--compact{padding-inline:14px}.top-nav{gap:7px 10px;font-size:11px}.about-left{grid-template-columns:104px minmax(0,1fr);gap:16px}.portrait{width:104px}.identity h1{font-size:30px}.identity p{font-size:12px}.project-browser,.project-detail,.contact-page{width:calc(100% - 28px)}.project-card__title{font-size:12px}.embed-panel iframe{min-height:360px}}@media (max-width: 360px){.top-nav{font-size:10px;gap:6px 8px}.phone-logo,.phone-logo img{width:38px;height:38px}.site-header,.site-header--compact{grid-template-columns:40px minmax(0,1fr)}.about-left{grid-template-columns:1fr}.portrait{width:118px}.contact-list p{grid-template-columns:1fr;gap:3px}}