:root{
  --page:#f3f4f6;--selector:#f7f7f5;--content:#fbfbf9;--ink:#17191f;--muted:#7d828d;--line:#e4e4df;
  --active:#6d63ff;--radius:30px;--side-scale:.84;--side-opacity:.34;--motion:.46s;
  --hero-overlay:.26;--hero-height:88svh;--mobile-hero-height:72svh;
  font-synthesis:none;color-scheme:light
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--page);color:var(--ink);font-family:"Montserrat","Noto Sans SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}a{color:inherit;text-decoration:none}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}::selection{background:linear-gradient(90deg,#7cecff,#ff9fc8);color:#111}.is-hidden{visibility:hidden}

/* first-visit intro: deliberately light. No giant blur/filter layers. */
.intro{position:fixed;inset:0;z-index:2000;overflow:hidden;background:#06080d;color:#fff;transition:opacity .72s ease,visibility .72s ease}.intro.done{opacity:0;visibility:hidden;pointer-events:none}.intro-atmosphere{position:absolute;inset:0;background:radial-gradient(circle at 82% 22%,rgba(36,160,220,.20),transparent 38%),radial-gradient(circle at 12% 88%,rgba(219,83,145,.14),transparent 34%);opacity:0;transition:opacity 1.2s ease}.intro.stage-1 .intro-atmosphere{opacity:1}.intro-branch{position:absolute;right:-3vw;top:-5vh;width:min(54vw,720px);height:108vh;fill:none;stroke:rgba(159,105,127,.52);stroke-width:6;stroke-linecap:round;opacity:0;transition:opacity 1s ease}.intro-branch path{stroke-dasharray:1200;stroke-dashoffset:1200}.intro.stage-2 .intro-branch{opacity:.72}.intro.stage-2 .intro-branch path{animation:drawBranch 2.2s ease forwards}.intro-character{position:absolute;right:2vw;bottom:-7vh;height:min(104vh,940px);max-width:54vw;object-fit:contain;object-position:right bottom;opacity:0;transform:translate3d(30px,0,0);transition:opacity 1.1s ease,transform 1.1s cubic-bezier(.2,.8,.2,1);pointer-events:none}.intro.stage-2 .intro-character{opacity:.16}.intro.stage-3 .intro-character{opacity:.48;transform:translate3d(12px,0,0)}.intro.stage-4 .intro-character{opacity:.88;transform:none}.intro-copy{position:absolute;left:9vw;top:50%;z-index:5;width:min(56vw,780px);transform:translateY(-52%)}.quote-lines{font-family:"Shippori Mincho",serif;font-size:clamp(23px,2.15vw,36px);line-height:2.12;letter-spacing:.055em}.quote-line{opacity:0;transform:translate3d(0,7px,0);transition:opacity .82s ease,transform .82s ease}.quote-line.visible{opacity:1;transform:none}.quote-source{margin-top:26px;color:rgba(255,255,255,.52);font-family:"Shippori Mincho",serif;font-size:12px;letter-spacing:.08em;opacity:0;transition:opacity .8s ease}.quote-source.visible{opacity:1}.intro-skip{position:absolute;left:50%;bottom:4vh;transform:translateX(-50%);border:0;background:none;color:rgba(255,255,255,.48);font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.2em;cursor:pointer;padding:15px}.intro-skip span{display:block;margin-top:7px}.intro-petals{position:absolute;inset:0;overflow:hidden;pointer-events:none}.intro-petal{position:absolute;top:-6vh;left:var(--x);width:var(--s);height:calc(var(--s)*.55);border-radius:90% 20% 80% 30%;background:rgba(245,146,184,.78);opacity:0;transform:rotate(var(--r));animation:petalFall var(--t) linear var(--d) infinite}.intro.stage-3 .intro-petal{opacity:.45}.intro.stage-4 .intro-petal{opacity:.76}

.masthead{position:absolute;top:0;left:0;right:0;z-index:100;height:76px;padding:0 clamp(20px,4vw,68px);display:flex;align-items:center;justify-content:space-between;color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.28)}.brand{font-family:"Lexend",sans-serif;font-size:13px;font-weight:800;letter-spacing:.18em}.masthead-meta{display:flex;align-items:center;gap:24px;font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.11em}.masthead-meta span{opacity:.72}.masthead-meta a{opacity:.86}.masthead-meta a:hover{opacity:1}

/* The opening image is a real image, not a filtered background layer. */
.hero{position:relative;height:var(--hero-height);min-height:600px;overflow:hidden;background:#dfe4ec;color:#fff}.hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.001);background:#dfe4ec}.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,8,14,.34) 0%,rgba(5,8,14,.05) 44%,rgba(5,8,14,.48) 100%);opacity:var(--hero-overlay)}.hero-content{position:absolute;z-index:3;left:clamp(24px,7vw,112px);bottom:clamp(105px,14vh,150px);max-width:min(720px,76vw);text-shadow:0 3px 24px rgba(0,0,0,.28)}.hero-kicker{margin:0 0 14px;font-family:"JetBrains Mono",monospace;font-size:10px;font-weight:600;letter-spacing:.18em;opacity:.82}.hero-content h1{margin:0;font-family:"Lexend",sans-serif;font-size:clamp(40px,5.3vw,82px);line-height:1.04;letter-spacing:-.055em;font-weight:700}.hero-subtitle{margin:18px 0 0;font-family:"JetBrains Mono",monospace;font-size:11px;line-height:1.7;letter-spacing:.06em;opacity:.78}.hero-scroll{position:absolute;z-index:4;left:50%;bottom:42px;transform:translateX(-50%);display:grid;justify-items:center;gap:8px;font-family:"JetBrains Mono",monospace;font-size:8px;letter-spacing:.17em;opacity:.8}.hero-scroll i{display:block;width:1px;height:30px;background:linear-gradient(#fff,transparent)}.hero-tail{position:absolute;z-index:2;left:0;right:0;bottom:0;height:110px;background:linear-gradient(180deg,transparent 0%,rgba(247,247,245,.14) 60%,var(--selector) 100%);pointer-events:none}

/* Selector begins under the opening visual, with a small overlap to hide the seam. */
.selector{position:relative;z-index:5;margin-top:-46px;padding:90px 0 116px;background:var(--selector);border-radius:46px 46px 0 0;box-shadow:0 -1px 0 rgba(255,255,255,.55);overflow:hidden}.selector::before{content:"";position:absolute;left:9%;right:9%;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(65,69,80,.12),transparent)}.selector-head{width:min(1180px,calc(100% - 48px));margin:0 auto 28px;display:flex;align-items:end;justify-content:space-between;gap:24px}.micro{margin:0 0 10px;color:#858a95;font-family:"JetBrains Mono",monospace;font-size:9px;font-weight:600;letter-spacing:.17em}.selector-head h2{margin:0;font-family:"Lexend",sans-serif;font-size:clamp(34px,4vw,58px);font-weight:700;letter-spacing:-.05em}.selector-hint{margin:0 0 7px;color:#9297a1;font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.08em}
.carousel-viewport{position:relative;height:clamp(390px,48vw,590px);overflow:hidden;touch-action:pan-y;user-select:none}.carousel{position:absolute;inset:0}.project-card{--accent:#6d63ff;position:absolute;left:50%;top:50%;width:min(60vw,900px);height:min(39vw,540px);min-height:370px;border-radius:var(--radius);overflow:hidden;background:var(--accent);transform:translate3d(-50%,-50%,0) scale(.72);opacity:0;pointer-events:none;transition:transform var(--motion) cubic-bezier(.2,.8,.2,1),opacity calc(var(--motion)*.82) ease;will-change:transform,opacity;contain:layout paint}.project-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--position,center);pointer-events:none}.project-card .card-fallback{position:absolute;inset:0;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 86%,white),color-mix(in srgb,var(--accent) 70%,#151923));pointer-events:none}.project-card.has-image .card-fallback{display:none}.project-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,10,16,.03),rgba(8,10,16,.08) 52%,rgba(8,10,16,.66));pointer-events:none}.project-card[data-state="active"]{z-index:5;transform:translate3d(-50%,-50%,0) scale(1);opacity:1;pointer-events:auto}.project-card[data-state="prev"]{z-index:3;transform:translate3d(calc(-50% - min(42vw,620px)),-50%,0) scale(var(--side-scale));opacity:var(--side-opacity);pointer-events:auto}.project-card[data-state="next"]{z-index:3;transform:translate3d(calc(-50% + min(42vw,620px)),-50%,0) scale(var(--side-scale));opacity:var(--side-opacity);pointer-events:auto}.project-card[data-state="prev2"]{z-index:2;transform:translate3d(calc(-50% - min(68vw,1000px)),-50%,0) scale(calc(var(--side-scale)*.82));opacity:calc(var(--side-opacity)*.22)}.project-card[data-state="next2"]{z-index:2;transform:translate3d(calc(-50% + min(68vw,1000px)),-50%,0) scale(calc(var(--side-scale)*.82));opacity:calc(var(--side-opacity)*.22)}.card-number{position:absolute;z-index:3;left:30px;top:27px;color:#fff;font-family:"JetBrains Mono",monospace;font-size:12px;font-weight:700;letter-spacing:.08em;text-shadow:0 2px 12px rgba(0,0,0,.28)}.card-label{position:absolute;z-index:3;left:30px;bottom:31px;color:rgba(255,255,255,.70);font-family:"JetBrains Mono",monospace;font-size:8px;font-weight:600;letter-spacing:.16em}.card-title{position:absolute;z-index:3;right:31px;bottom:25px;max-width:80%;margin:0;color:#fff;text-align:right;font-family:"Lexend",sans-serif;font-size:clamp(36px,5vw,74px);line-height:.95;font-weight:800;letter-spacing:-.055em;text-shadow:0 3px 18px rgba(0,0,0,.25)}
.nav-arrow{position:absolute;top:50%;z-index:20;width:52px;height:52px;border:1px solid rgba(22,24,30,.12);border-radius:50%;background:#fff;color:#1b1d24;display:grid;place-items:center;transform:translateY(-50%);cursor:pointer;font-family:"JetBrains Mono",monospace;font-size:18px;box-shadow:0 7px 22px rgba(31,35,48,.09);transition:transform .18s ease,opacity .18s ease}.nav-arrow:hover{transform:translateY(-50%) scale(1.05)}.nav-arrow:active{transform:translateY(-50%) scale(.96)}.nav-arrow:disabled{opacity:.24;cursor:not-allowed}.nav-prev{left:max(14px,3.2vw)}.nav-next{right:max(14px,3.2vw)}
.selector-meta{width:min(940px,calc(100% - 48px));margin:4px auto 0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px}.active-number{display:none}.active-subtitle{margin:0;max-width:650px;color:#69707c;font-family:"JetBrains Mono",monospace;font-size:11px;line-height:1.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.selector-actions{display:flex;align-items:center;gap:24px}.slide-dots{display:flex;align-items:center;gap:7px}.slide-dots button{width:6px;height:6px;border:0;padding:0;border-radius:99px;background:#c1c4cb;cursor:pointer;transition:width .2s ease,background .2s ease}.slide-dots button.active{width:22px;background:#191b21}.enter-link{padding:8px 0;border-bottom:1px solid #262830;font-family:"JetBrains Mono",monospace;font-size:11px;font-weight:700;letter-spacing:.1em;white-space:nowrap;transition:color .18s ease,letter-spacing .18s ease}.enter-link:hover{color:var(--active);letter-spacing:.14em}

.content{position:relative;background:var(--content)}.content-transition{height:70px;display:grid;place-items:center;background:linear-gradient(180deg,var(--selector),var(--content))}.content-transition span{width:42px;height:3px;border-radius:99px;background:#d5d6d9}.about{width:min(1180px,calc(100% - 48px));margin:0 auto;padding:58px 0 72px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:150px minmax(0,1fr) 330px;gap:44px}.avatar-wrap{position:relative;width:104px;height:104px;display:grid;place-items:center}.avatar{position:relative;z-index:2;width:80px;height:80px;border-radius:50%;object-fit:cover;background:#272a32;border:3px solid #fff}.avatar-ring{position:absolute;inset:1px;border-radius:50%;padding:2px;background:conic-gradient(from 0deg,#62d9eb,#a68bfa,#f08bb9,#f1c65c,#62d9eb);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.68}.ring-b{inset:9px;opacity:.28;transform:rotate(120deg)}.avatar-wrap:hover .ring-a{animation:ringSpin 2.7s linear infinite}.avatar-wrap:hover .ring-b{animation:ringSpinBack 2s linear infinite}.about-main h2{margin:0 0 12px;font-family:"Lexend",sans-serif;font-size:34px;letter-spacing:-.045em}.site-intro{max-width:640px;margin:0;color:#666d78;font-size:13px;line-height:2}.now-lines{color:#707681;font-family:"JetBrains Mono",monospace;font-size:10px;line-height:2;white-space:pre-wrap}.footer{width:min(1180px,calc(100% - 48px));margin:0 auto;padding:26px 0 36px;display:flex;justify-content:space-between;gap:20px;color:#9398a2;font-family:"JetBrains Mono",monospace;font-size:8px;letter-spacing:.08em}
.reveal{opacity:0;transform:translate3d(0,14px,0);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.8,.2,1)}.reveal.visible{opacity:1;transform:none}

.player{position:fixed;left:17px;bottom:17px;z-index:1100}.player-toggle{height:38px;min-width:100px;border:1px solid rgba(18,20,26,.12);border-radius:99px;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 13px;cursor:pointer;box-shadow:0 6px 20px rgba(31,35,48,.08)}.player-toggle span{font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.08em}.player-toggle b{font-weight:400}.player-panel{position:absolute;left:0;bottom:48px;width:290px;padding:16px;border:1px solid rgba(18,20,26,.10);border-radius:16px;background:#fff;box-shadow:0 16px 44px rgba(31,35,48,.13);transform-origin:left bottom;transition:opacity .2s ease,transform .2s ease}.player.collapsed .player-panel{opacity:0;transform:translate3d(0,7px,0) scale(.96);pointer-events:none}.player-meta strong,.player-meta small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-meta strong{font-family:"Lexend",sans-serif;font-size:12px}.player-meta small{margin-top:3px;color:#8a909b;font-family:"JetBrains Mono",monospace;font-size:9px}.player input[type=range]{width:100%;margin:13px 0;accent-color:#5f64ff}.player-controls{display:flex;justify-content:center;gap:12px}.player-controls button{width:33px;height:33px;border:1px solid #dedfe2;border-radius:50%;background:#fff;cursor:pointer}.player-controls .play{background:#191b21;color:#fff;border-color:#191b21}

@keyframes drawBranch{to{stroke-dashoffset:0}}@keyframes petalFall{from{transform:translate3d(0,-8vh,0) rotate(var(--r))}to{transform:translate3d(var(--drift),112vh,0) rotate(calc(var(--r) + 430deg))}}@keyframes ringSpin{to{transform:rotate(360deg)}}@keyframes ringSpinBack{to{transform:rotate(-360deg)}}

@media(max-width:900px){.project-card{width:68vw;height:46vw;min-height:340px}.about{grid-template-columns:120px 1fr}.about-now{grid-column:2}.masthead-meta span{display:none}}
@media(max-width:720px){
  :root{--hero-height:var(--mobile-hero-height)}.masthead{height:64px;padding:0 18px}.masthead-meta{gap:14px;font-size:8px}.hero{min-height:500px}.hero-content{left:22px;right:22px;bottom:86px;max-width:none}.hero-content h1{font-size:clamp(36px,10vw,58px)}.hero-subtitle{font-size:9px}.hero-scroll{bottom:24px}.selector{margin-top:-28px;border-radius:28px 28px 0 0;padding:64px 0 84px}.selector-head{width:calc(100% - 32px);margin-bottom:18px}.selector-head h2{font-size:31px}.selector-hint{display:none}.carousel-viewport{height:clamp(350px,105vw,470px)}.project-card{width:78vw;height:56vw;min-height:280px;border-radius:min(var(--radius),24px)}.project-card[data-state="prev"]{transform:translate3d(calc(-50% - 70vw),-50%,0) scale(.88);opacity:calc(var(--side-opacity)*.82)}.project-card[data-state="next"]{transform:translate3d(calc(-50% + 70vw),-50%,0) scale(.88);opacity:calc(var(--side-opacity)*.82)}.project-card[data-state="prev2"],.project-card[data-state="next2"]{opacity:0}.card-number{left:20px;top:18px;font-size:10px}.card-label{left:20px;bottom:20px;font-size:7px}.card-title{right:20px;bottom:17px;font-size:clamp(30px,10vw,50px)}.nav-arrow{width:42px;height:42px;font-size:15px}.nav-prev{left:5px}.nav-next{right:5px}.selector-meta{width:calc(100% - 32px);grid-template-columns:1fr;gap:13px;margin-top:-4px}.active-subtitle{font-size:10px;white-space:normal;min-height:34px}.selector-actions{justify-content:space-between}.enter-link{font-size:10px}.about{width:calc(100% - 32px);grid-template-columns:86px 1fr;gap:20px;padding:45px 0 55px}.avatar-wrap{width:80px;height:80px}.avatar{width:60px;height:60px}.about-main h2{font-size:27px}.site-intro{font-size:12px}.about-now{grid-column:1/-1}.footer{width:calc(100% - 32px);flex-direction:column}.intro-copy{left:7vw;top:44%;width:86vw}.quote-lines{font-size:18px;line-height:2}.intro-character{right:-28vw;height:75vh;opacity:0!important}.player-panel{width:min(290px,calc(100vw - 34px))}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.project-card,.reveal,.intro,.intro-character,.quote-line,.quote-source,.player-panel{transition:none!important}.intro-petal,.intro-branch path,.avatar-ring{animation:none!important}}
.hide-card-index .card-number{display:none}
