:root{--bg:#0a0b0e;--bg2:#101218;--bg3:#161923;--light:#f6f7f9;--white:#fff;--td:#e8eaed;--td2:#9aa0ac;--tl:#17181c;--tl2:#5c6370;--line:rgba(255,255,255,.09);--lineL:rgba(10,11,14,.1);--acc:#8b7cff;--acc2:#3ed6c5;--grad:linear-gradient(90deg,#8b7cff,#3ed6c5);--r:18px;--font:'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif;--en:'Inter',var(--font)}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scroll-padding-top:76px}body{background:var(--bg);color:var(--td);font-family:var(--font);line-height:1.65;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img,video{display:block;max-width:100%}.wrap{width:min(1200px,calc(100% - 64px));margin:auto}.reveal{opacity:0;transform:translateY(22px);transition:.65s ease}.reveal.on{opacity:1;transform:none}
.site-nav{position:fixed;inset:0 0 auto;z-index:50;background:rgba(10,11,14,.84);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.nav-inner{height:60px;display:flex;align-items:center;justify-content:space-between}.logo{font:800 17px var(--en);letter-spacing:.4px}.logo span{background:var(--grad);background-clip:text;color:transparent}.nav-links{display:flex;gap:32px}.nav-links a{font-size:13.5px;color:var(--td2);transition:.2s}.nav-links a:hover,.nav-links a.active{color:var(--td)}.nav-toggle{display:none;border:1px solid var(--line);background:transparent;color:var(--td);padding:6px 11px;border-radius:7px}
.hero{padding:148px 0 88px;background:radial-gradient(ellipse 60% 45% at 82% 0,rgba(139,124,255,.13),transparent),radial-gradient(ellipse 45% 35% at 10% 90%,rgba(62,214,197,.07),transparent)}.hero-grid{display:grid;grid-template-columns:5fr 6fr;gap:48px;align-items:center}.eyebrow,.kicker{font:500 12px var(--en);letter-spacing:2.5px;text-transform:uppercase;color:var(--acc);display:flex;align-items:center;gap:10px;margin-bottom:12px}.eyebrow:before,.kicker:before{content:'';width:24px;height:2px;background:var(--grad)}h1{font-size:clamp(38px,4.8vw,58px);line-height:1.15;font-weight:900;letter-spacing:-1px}h1 em{font-style:normal;background:var(--grad);background-clip:text;color:transparent}.hero-sub{font-size:clamp(16px,1.8vw,20px);color:var(--td2);margin:18px 0}.hero-note{font-size:13px;color:var(--td2);margin-top:25px}.tag-row,.cap-row{display:flex;gap:8px;flex-wrap:wrap}.tag{font-size:12.5px;padding:5px 12px;border:1px solid var(--line);border-radius:999px;color:var(--td2);background:rgba(255,255,255,.025)}.tag.accent{border-color:rgba(139,124,255,.45);color:var(--acc)}
.media-slot{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--r);background-color:var(--bg2);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;isolation:isolate}.media-slot:before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:44px 44px;z-index:-1}.media-slot.has-image:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.46));z-index:-1}.media-slot.has-image .slot-copy,.media-slot.has-video .slot-copy{opacity:0}.media-slot>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#050609;z-index:1}.hero-media{aspect-ratio:16/9}.slot-copy{text-align:center;display:grid;gap:5px;color:var(--td2);transition:.25s}.slot-copy b{color:var(--td);font-size:15px}.slot-copy small{font-size:11px}.slot-icon{font:800 22px var(--en);background:var(--grad);background-clip:text;color:transparent}.slot-spec{position:absolute;bottom:14px;right:16px;font-size:10.5px;color:var(--td2);padding:3px 7px;background:rgba(10,11,14,.7);border-radius:5px;z-index:2}
section{padding:88px 0}.light{background:var(--light);color:var(--tl)}.deep{background:var(--bg2)}.section-head{margin-bottom:44px}.section-head h2{font-size:clamp(27px,3.5vw,38px);line-height:1.25}.section-head p{max-width:720px;color:var(--td2);margin-top:8px;font-size:14.5px}.light .section-head p{color:var(--tl2)}.about-grid{display:grid;grid-template-columns:5fr 7fr;gap:72px;align-items:start}.about-copy{font-size:15px;color:var(--tl2)}.about-copy p+p{margin-top:14px}.cap-row{margin-top:25px}.cap-row span{font-size:12px;border:1px solid var(--lineL);padding:6px 12px;border-radius:999px;background:#fff}
.project-list{display:grid;gap:70px}.project-card{display:grid;grid-template-columns:7fr 5fr;gap:48px;align-items:center}.project-card.reverse .project-media{order:2}.project-media{aspect-ratio:16/9;transition:.3s}.project-media:hover{transform:translateY(-5px);border-color:rgba(139,124,255,.5);box-shadow:0 22px 60px rgba(0,0,0,.3)}.project-index{font:700 11px var(--en);letter-spacing:2px;color:var(--acc);margin-bottom:8px}.project-copy h3{font-size:clamp(22px,2.5vw,31px);line-height:1.3}.project-copy>p{color:var(--td2);font-size:14px;margin:14px 0 18px}.text-link{display:inline-flex;gap:10px;margin-top:24px;font-size:13.5px;font-weight:600}.text-link span{color:var(--acc);transition:.2s}.text-link:hover span{transform:translateX(4px)}
.workflow-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.step{background:#fff;border:1px solid var(--lineL);border-radius:11px;padding:22px 18px;min-height:160px}.step span{font:700 11px var(--en);color:#6c5ce7}.step b{display:block;margin:10px 0 5px}.step p{font-size:12px;color:var(--tl2)}.works-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.work-item{aspect-ratio:4/3}.contact{text-align:center}.centered{justify-content:center}.contact h2{font-size:clamp(28px,3.7vw,42px);line-height:1.25}.contact>div>p{color:var(--td2);margin:12px 0 32px}.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.contact-grid>div{padding:22px;background:var(--bg3);border:1px solid var(--line);border-radius:11px}.contact-grid small{display:block;color:var(--td2);margin-bottom:5px}.contact-grid b{font:500 14px var(--en)}footer{text-align:center;border-top:1px solid var(--line);color:var(--td2);font-size:12px;padding:30px}
/* project detail */
.project-hero{padding:120px 0 52px}.back-link{display:inline-flex;gap:8px;color:var(--td2);font-size:13px;margin-bottom:28px}.project-title-grid{display:grid;grid-template-columns:7fr 5fr;gap:42px;align-items:end}.project-number{font:800 12px var(--en);color:var(--acc);letter-spacing:2px}.project-hero h1{font-size:clamp(38px,5vw,66px);margin:10px 0 16px}.project-lead{color:var(--td2);max-width:760px}.project-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px}.project-meta div{padding:15px;border:1px solid var(--line);border-radius:10px;background:var(--bg3)}.project-meta small{display:block;color:var(--td2)}.project-meta b{font-size:13px}.project-cover{width:min(1400px,calc(100% - 64px));margin:0 auto;aspect-ratio:16/8.2}.project-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:56px;align-items:start}.toc{position:sticky;top:88px;padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--bg2)}.toc b{font-size:12px;color:var(--acc)}.toc a{display:block;font-size:12.5px;color:var(--td2);padding:7px 0;border-bottom:1px solid var(--line)}.toc a:last-child{border:0}.case-content{min-width:0}.case-section{padding:0 0 88px;scroll-margin-top:90px}.case-section h2{font-size:clamp(25px,3vw,36px);margin-bottom:10px}.case-section>.lead{color:var(--td2);max-width:780px;margin-bottom:28px}.case-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.case-grid.four{grid-template-columns:repeat(4,1fr)}.case-grid.three{grid-template-columns:repeat(3,1fr)}.case-grid .media-slot{min-height:260px}.case-grid.four .media-slot{min-height:320px}.case-wide{min-height:430px}.note-card{padding:25px;background:var(--bg3);border:1px solid var(--line);border-left:3px solid var(--acc);border-radius:11px}.note-card h3{font-size:16px;margin-bottom:8px}.note-card p,.note-card li{font-size:13px;color:var(--td2)}.note-card ul{padding-left:18px}.note-card li+li{margin-top:7px}.next-project{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:30px}.next-project a{font-size:13px;color:var(--td2)}
.world-statement{padding:42px;background:var(--bg3);border:1px solid var(--line);border-radius:var(--r);position:relative;overflow:hidden}.world-statement:before{content:'';position:absolute;width:240px;height:240px;border:1px solid rgba(139,124,255,.2);border-radius:50%;right:-70px;top:-100px}.world-statement span,.world-statement strong{display:block;font:800 clamp(31px,5vw,58px)/1 var(--en);letter-spacing:-1px}.world-statement span{color:var(--td2)}.world-statement strong{background:var(--grad);background-clip:text;color:transparent;margin:8px 0 20px}.world-statement p{max-width:680px;color:var(--td2);font-size:14px}.color-system{display:grid;grid-template-columns:1fr 1fr;gap:10px}.color-system>div{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;padding:12px 14px;background:var(--bg3);border:1px solid var(--line);border-radius:9px}.color-system span{width:34px;height:34px;border-radius:50%;background:var(--role)}.color-system b{font:700 13px var(--en)}.color-system small{color:var(--td2);font:11px var(--en)}.squad-grid>div{padding:24px 17px;border:1px solid var(--line);border-top:3px solid var(--role);border-radius:11px;background:var(--bg3);min-height:150px}.squad-grid b,.squad-grid span,.squad-grid small{display:block}.squad-grid b{font:800 21px var(--en);color:var(--role)}.squad-grid span{font-size:13px;margin:9px 0}.squad-grid small{font:600 10px var(--en);color:var(--td2)}.role-profile{display:grid;grid-template-columns:5fr 7fr;gap:34px;align-items:stretch}.role-profile.flip .media-slot{order:2}.role-profile>.media-slot{min-height:450px}.role-copy{padding:42px;background:var(--bg3);border:1px solid var(--line);border-left:3px solid var(--role);border-radius:var(--r);display:flex;flex-direction:column;justify-content:center}.role-copy .role-no{font:700 10px var(--en);letter-spacing:1.6px;color:var(--role)}.role-copy h2{margin:8px 0 2px}.role-copy h3{font-size:14px;color:var(--td);margin-bottom:16px}.role-copy p{font-size:14px;color:var(--td2)}.role-copy blockquote{font:700 15px var(--en);color:var(--role);margin-top:25px;padding-top:16px;border-top:1px solid var(--line)}
@media(max-width:920px){.wrap{width:min(100% - 40px,720px)}.nav-toggle{display:block}.nav-links{display:none;position:absolute;top:60px;left:0;right:0;padding:16px 20px;background:var(--bg);border-bottom:1px solid var(--line);flex-direction:column;gap:12px}.nav-links.open{display:flex}.hero-grid,.about-grid,.project-card,.project-title-grid,.role-profile{grid-template-columns:1fr}.project-card.reverse .project-media,.role-profile.flip .media-slot{order:0}.workflow-grid{grid-template-columns:1fr 1fr}.works-grid{grid-template-columns:1fr 1fr}.project-layout{grid-template-columns:1fr}.toc{position:relative;top:auto}.case-grid.four{grid-template-columns:1fr 1fr}.project-meta{margin-top:18px}}
@media(max-width:600px){.wrap,.project-cover{width:calc(100% - 32px)}.hero{padding-top:112px}.workflow-grid,.case-grid,.case-grid.three,.case-grid.four,.contact-grid{grid-template-columns:1fr}.works-grid{grid-template-columns:1fr 1fr}.project-cover{aspect-ratio:4/3}.case-wide{min-height:260px}section{padding:68px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}
.edit-preview [data-text]{cursor:text;outline:1px dashed rgba(139,124,255,.45);outline-offset:5px;border-radius:2px;transition:outline-color .2s,background .2s}.edit-preview [data-text]:hover,.edit-preview [data-text]:focus{outline:2px solid var(--acc);background:rgba(139,124,255,.1)}.edit-preview [data-image]{cursor:pointer;outline:2px dashed rgba(62,214,197,.58);outline-offset:-6px}.edit-preview [data-image]:hover{outline-style:solid;filter:brightness(1.08)}.edit-preview [data-image]:after{content:'点击替换素材';position:absolute;left:12px;top:12px;z-index:5;padding:5px 9px;border-radius:6px;background:rgba(10,11,14,.84);color:#fff;font-size:11px;line-height:1.2;pointer-events:none}.edit-preview [data-image].has-image:after,.edit-preview [data-image].has-video:after{background:rgba(62,214,197,.9);color:#08120f}.edit-preview [data-image]>video{pointer-events:none}
.case-grid.motion-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.case-grid.motion-grid .media-slot{aspect-ratio:16/9;min-height:0}@media(max-width:600px){.case-grid.motion-grid{grid-template-columns:1fr}}
.works-grid{display:flex;gap:22px;overflow-x:auto;overflow-y:visible;scroll-snap-type:x mandatory;padding:22px 0 34px;margin-inline:-6px;scrollbar-width:thin;scrollbar-color:rgba(62,214,197,.75) rgba(255,255,255,.08)}.works-grid::-webkit-scrollbar{height:8px}.works-grid::-webkit-scrollbar-track{background:rgba(255,255,255,.06);border-radius:999px}.works-grid::-webkit-scrollbar-thumb{background:var(--acc2);border-radius:999px}.work-item{flex:0 0 clamp(230px,24vw,330px);aspect-ratio:3/4;border-radius:14px;scroll-snap-align:center;transform:scale(.92);opacity:.72;transition:transform .32s ease,opacity .32s ease,border-color .32s ease,box-shadow .32s ease}.work-item.is-active,.work-item:hover{transform:scale(1);opacity:1;border-color:rgba(62,214,197,.9);box-shadow:0 20px 70px rgba(0,0,0,.38)}@media(max-width:920px){.work-item{flex-basis:260px;transform:scale(.96)}}@media(max-width:520px){.works-grid{gap:16px}.work-item{flex-basis:72vw}}
[data-image="images.fountain.flora"],[data-image="images.fountain.kai"],[data-image="images.fountain.evelyn"],[data-image="images.fountain.lancer"],[data-image="images.toy.char1"],[data-image="images.toy.char2"],[data-image="images.toy.char3"],[data-image="images.toy.char4"]{aspect-ratio:3/4;min-height:0!important;background-size:auto 100%;background-repeat:no-repeat;background-position:center}.role-profile{grid-template-columns:390px minmax(0,560px);justify-content:center}.role-profile>.media-slot{width:390px;min-height:0}.role-profile>.role-copy{width:560px;min-height:520px}.role-profile>[data-image^="images.toy.char"]{align-self:start;justify-self:center}@media(max-width:920px){.role-profile{grid-template-columns:1fr}.role-profile>.media-slot,.role-profile>.role-copy{width:100%;max-width:560px;justify-self:center}}
[data-image="images.toy.sketch"],[data-image="images.toy.design2d"],[data-image="images.toy.turnaround"],[data-image="images.toy.poster1"],[data-image="images.toy.poster2"],[data-image="images.toy.poster3"],[data-image="images.toy.poster4"]{aspect-ratio:3/4;min-height:0!important;background-repeat:no-repeat;background-position:center}
