:root{--lavender:#bbb8d0;--purple:#5e547f;--purple-deep:#41375f;--cream:#fffdf5}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--lavender);color:var(--purple-deep);font-family:"DM Sans","Microsoft YaHei",sans-serif}a{color:inherit;text-decoration:none}
.landing{position:relative;min-height:100svh;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 50% 62%,rgba(255,255,255,.15),transparent 33%),var(--lavender)}
.landing:after{content:"";position:absolute;z-index:4;left:0;right:0;bottom:0;height:17%;pointer-events:none;background:linear-gradient(to top,var(--lavender),rgba(187,184,208,.84) 40%,transparent)}
.name-lockup{position:absolute;z-index:0;top:5.5%;left:50%;width:100%;text-align:center;transform:translateX(-50%)}
h1{margin:0;color:var(--cream);font-family:"Archivo Black",Impact,sans-serif;font-size:clamp(5rem,12.5vw,12rem);line-height:.84;letter-spacing:-.07em;white-space:nowrap;animation:title-in 1s cubic-bezier(.16,1,.3,1) both}
@keyframes title-in{from{opacity:0;transform:translateY(-26px) scale(.98)}to{opacity:1;transform:none}}
.media-stage{position:absolute;z-index:2;left:50%;bottom:-4%;width:min(58vw,820px);height:83%;overflow:hidden;transform:translateX(-50%);animation:character-in 1.05s .15s cubic-bezier(.16,1,.3,1) both}.media-stage video{width:100%;height:100%;display:block;object-fit:cover;object-position:center center}.media-stage:after{content:"";position:absolute;inset:auto 0 0;height:12%;background:linear-gradient(to top,var(--lavender),transparent);pointer-events:none}
@keyframes character-in{from{opacity:0;transform:translate(-50%,45px) scale(.97)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
.statement,.identity{position:absolute;z-index:7;width:min(28vw,380px);color:var(--purple-deep)}.statement-left{left:5.8%;top:40%;text-align:left}.statement-right{right:5.8%;top:43%;text-align:right}.identity-en{margin:0;font-size:clamp(1.65rem,2.55vw,2.8rem);font-weight:600;line-height:1;letter-spacing:-.035em}.identity-cn{margin:.75rem 0 0;font-size:clamp(1.05rem,1.3vw,1.35rem);font-weight:600;letter-spacing:.28em}.statement-en{margin:.75rem 0 0;font-size:clamp(1.2rem,1.8vw,2rem);font-weight:600;line-height:1.18;letter-spacing:-.035em}.statement-cn{margin:0;font-size:clamp(1rem,1.22vw,1.3rem);font-weight:600;letter-spacing:.06em}.statement-left:before,.statement-right:before{content:"";display:block;width:0;height:2px;margin-bottom:1.15rem;background:var(--purple);transition:width .75s cubic-bezier(.16,1,.3,1)}.statement-right:before{margin-left:auto}
.hero-actions{position:absolute;z-index:9;left:50%;bottom:5%;display:flex;gap:1rem;transform:translateX(-50%)}.hero-actions a{display:flex;align-items:center;justify-content:space-between;min-width:180px;padding:1rem 1.25rem;border:2px solid var(--purple-deep);border-radius:999px;background:var(--purple-deep);color:var(--cream);font-size:.9rem;font-weight:600;letter-spacing:.06em;box-shadow:0 10px 28px rgba(65,55,95,.18);transition:transform .25s,background .25s,color .25s}.hero-actions a:last-child{background:transparent;color:var(--purple-deep)}.hero-actions a:hover{transform:translateY(-5px);background:var(--cream);color:var(--purple-deep);border-color:var(--cream)}.hero-actions a span{font-size:1.05rem}
.hero-detail{opacity:0;transition:opacity .55s ease}.landing.is-revealed .hero-detail{opacity:1}.landing.is-revealed .statement:before,.landing.is-revealed .identity:before{width:100%}.landing.is-revealed .statement-left{transition-delay:.1s}.landing.is-revealed .statement-right{transition-delay:.52s}.landing.is-revealed .hero-actions{transition-delay:.94s}

.world{position:relative;min-height:100svh;overflow:hidden;background:#f5f4f1;color:#17151c;padding:4.2vh 4vw 2vh}.section-anchor{position:absolute;top:0}.world-heading{text-align:center}.world-heading>p{margin:0 0 .35rem;font-size:.61rem;font-weight:700;letter-spacing:.18em}.world-heading h2{margin:0;font-size:clamp(2.3rem,4vw,4.2rem);line-height:1.05;letter-spacing:-.06em}.world-heading>span{display:block;margin-top:.55rem;font-size:.84rem;font-weight:600}.world-cards{position:relative;z-index:4;width:min(920px,82vw);height:39vh;margin:2.6vh auto 0}.world-card{position:absolute;top:0;left:50%;display:flex;flex-direction:column;width:clamp(145px,13vw,195px);height:clamp(190px,25vh,255px);padding:.65rem .65rem 1rem;border:3px solid #17151c;border-radius:10px;box-shadow:9px 10px 0 rgba(23,21,28,.22);transform-origin:center 120%;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,filter .35s;outline:none}.world-card:hover,.world-card:focus-visible,.world-card.is-active{z-index:10;transform:translateX(-50%) translateY(-22px) rotate(0deg) scale(1.07)!important;box-shadow:13px 16px 0 rgba(23,21,28,.17);filter:saturate(1.08)}.card-window{flex:1;border-radius:4px;background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 2px rgba(0,0,0,.08)}.world-card strong{margin-top:.72rem;font-size:.7rem;letter-spacing:.11em}.world-card small{margin-top:.18rem;font-size:.68rem;font-weight:600}.card-design{background:#dc8eaa;transform:translateX(-230%) translateY(48px) rotate(-13deg)}.card-development{background:#96bd3e;transform:translateX(-155%) translateY(12px) rotate(-6deg)}.card-practice{background:#86b4d5;transform:translateX(-50%) translateY(0) rotate(0)}.card-projects{background:#efa15d;transform:translateX(55%) translateY(12px) rotate(6deg)}.card-awards{background:#a58bc6;transform:translateX(130%) translateY(48px) rotate(13deg)}
.world-character{position:absolute;z-index:2;left:50%;bottom:1.5vh;width:min(30vw,410px);height:45vh;transform:translateX(-50%)}.world-character video{width:100%;height:100%;object-fit:contain;object-position:center bottom}.world-hint{position:absolute;z-index:5;left:50%;bottom:1.2rem;margin:0;transform:translateX(-50%);font-size:.57rem;font-weight:700;letter-spacing:.2em}.future-sections{position:relative;height:1px}.future-sections span{position:absolute}
@media(max-width:760px){.name-lockup{top:7%;padding:0 .5rem}h1{font-size:clamp(2.35rem,12vw,4.5rem);letter-spacing:-.075em}.media-stage{width:112vw;height:68%;bottom:7%}.statement,.identity{width:53vw}.statement-left{left:1.1rem;top:28%}.statement-right{right:.8rem;top:48%;width:min(59vw,15rem)}.identity-en{font-size:1.28rem}.identity-cn{font-size:.95rem}.statement-en{font-size:.86rem;line-height:1.25}.statement-cn{font-size:.72rem;line-height:1.55;overflow-wrap:anywhere}.hero-actions{left:1rem;right:1rem;bottom:3.5%;gap:.55rem;transform:none}.hero-actions a{flex:1;min-width:0;padding:.9rem 1rem;font-size:.78rem}}
@media(max-width:980px){.name-lockup h1{font-size:clamp(1.7rem,8vw,3rem);letter-spacing:-.075em}.statement-right{right:clamp(3rem,18vw,9rem);width:min(42vw,10rem);overflow-wrap:anywhere}.statement-right .statement-en{font-size:clamp(.62rem,3vw,.82rem)}.statement-right .statement-cn{font-size:clamp(.58rem,2.5vw,.72rem);line-height:1.5}}

.site-watermark{position:fixed;z-index:1000;right:.8rem;bottom:.65rem;padding:.28rem .48rem;border:1px solid currentColor;border-radius:999px;background:rgba(255,253,245,.72);color:#41375f;font-size:.52rem;font-weight:700;letter-spacing:.08em;opacity:.55;pointer-events:none;user-select:none}
.portfolio-notice{margin-top:1rem;font-size:.75rem;opacity:.7}
img,video,canvas{-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
@media(max-width:760px){.site-watermark{right:.45rem;bottom:.45rem;font-size:.45rem}}
@media(max-width:760px){.world{min-height:100svh;padding:3.5rem 1rem 1rem}.world-heading h2{font-size:2.4rem}.world-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem;width:100%;height:auto;margin-top:2rem}.world-card{position:relative;inset:auto!important;width:auto;height:118px;padding:.45rem;border-width:2px;border-radius:8px;box-shadow:5px 6px 0 rgba(23,21,28,.18);transform:none!important}.world-card:nth-child(5){grid-column:1/-1;width:calc(50% - .35rem);justify-self:center}.world-card:hover,.world-card:focus-visible,.world-card.is-active{transform:translateY(-5px)!important}.card-window{min-height:55px}.world-card strong{margin-top:.35rem}.world-card small{display:none}.world-character{width:56vw;height:31vh;bottom:1.4rem}.world-hint{display:none}}
@media(max-height:680px) and (min-width:761px){.name-lockup{top:4%}.media-stage{height:80%}.statement-left{top:34%}.statement-right{top:46%}}

@media(min-width:761px){
  .card-design:hover,.card-design:focus-visible,.card-design.is-active{transform:translateX(-230%) translateY(26px) rotate(0) scale(1.07)!important}
  .card-development:hover,.card-development:focus-visible,.card-development.is-active{transform:translateX(-155%) translateY(-10px) rotate(0) scale(1.07)!important}
  .card-practice:hover,.card-practice:focus-visible,.card-practice.is-active{transform:translateX(-50%) translateY(-22px) rotate(0) scale(1.07)!important}
  .card-projects:hover,.card-projects:focus-visible,.card-projects.is-active{transform:translateX(55%) translateY(-10px) rotate(0) scale(1.07)!important}
  .card-awards:hover,.card-awards:focus-visible,.card-awards.is-active{transform:translateX(130%) translateY(26px) rotate(0) scale(1.07)!important}
}

/* Keep mobile hero copy in clear bands above/below the character's face. */
@media(max-width:760px){
  .landing .statement-left{top:15%;left:.75rem;right:.75rem;width:auto;text-align:center}
  .landing .statement-left:before{width:min(42vw,8rem)!important;margin:0 auto .55rem}
  .landing .identity-en{font-size:1rem;letter-spacing:.02em}
  .landing .identity-cn{margin:.35rem 0 0;font-size:.76rem;letter-spacing:.16em}
  .landing .statement-right{top:auto;right:.75rem;bottom:14%;left:.75rem;width:auto;max-width:none;text-align:center}
  .landing .statement-right:before{width:min(42vw,8rem)!important;margin:0 auto .55rem}
  .landing .statement-right .statement-cn{font-size:.76rem;line-height:1.45}
  .landing .statement-right .statement-en{margin:.35rem 0 0;font-size:.68rem;line-height:1.25}
}

@media(min-width:761px){
  .card-design{transform:translateX(-300%) translateY(48px) rotate(-13deg)}
  .card-development{transform:translateX(-175%) translateY(12px) rotate(-6deg)}
  .card-practice{transform:translateX(-50%) translateY(0) rotate(0)}
  .card-projects{transform:translateX(75%) translateY(12px) rotate(6deg)}
  .card-awards{transform:translateX(200%) translateY(48px) rotate(13deg)}
  .card-design:hover,.card-design:focus-visible,.card-design.is-active{transform:translateX(-300%) translateY(26px) rotate(0) scale(1.07)!important}
  .card-development:hover,.card-development:focus-visible,.card-development.is-active{transform:translateX(-175%) translateY(-10px) rotate(0) scale(1.07)!important}
  .card-practice:hover,.card-practice:focus-visible,.card-practice.is-active{transform:translateX(-50%) translateY(-22px) rotate(0) scale(1.07)!important}
  .card-projects:hover,.card-projects:focus-visible,.card-projects.is-active{transform:translateX(75%) translateY(-10px) rotate(0) scale(1.07)!important}
  .card-awards:hover,.card-awards:focus-visible,.card-awards.is-active{transform:translateX(200%) translateY(26px) rotate(0) scale(1.07)!important}
}

.portfolio-section{position:relative;min-height:100svh;padding:7vw;scroll-margin-top:0}.section-head>span,.practice-copy>span,.awards-title>span{font-size:.68rem;font-weight:700;letter-spacing:.17em}.section-head h2{margin:.45rem 0 0;font-size:clamp(3.6rem,7.5vw,8rem);line-height:.9;letter-spacing:-.07em}.section-head p{margin:1.2rem 0 0;font-size:1rem}.section-status{position:absolute;right:7vw;bottom:2rem;margin:0;font-size:.62rem;font-weight:600;letter-spacing:.13em}
.design-section{overflow:hidden;background:#f3cbd8}.design-gallery{position:relative;height:63vh;margin-top:1.5rem}.design-shot{position:absolute;margin:0;background:#fff;border:3px solid #17151c;box-shadow:12px 14px 0 rgba(23,21,28,.17);overflow:hidden}.design-shot img{width:100%;height:100%;display:block;object-fit:contain}.design-shot figcaption{position:absolute;left:.8rem;bottom:.7rem;padding:.32rem .5rem;background:#17151c;color:#fff;font-size:.55rem;letter-spacing:.12em}.shot-a{left:2%;bottom:2%;width:28%;height:70%;transform:rotate(-6deg)}.shot-b{left:36%;top:0;width:28%;height:78%;transform:rotate(3deg)}.shot-c{right:1%;bottom:4%;width:28%;height:68%;transform:rotate(8deg)}
.development-section{background:#18171a;color:#f7f4ed}.light-head p{color:#c9c7c2}.development-layout{display:grid;grid-template-columns:.72fr 1.6fr;gap:5vw;align-items:center;margin-top:4rem}.dev-index{display:grid}.dev-index span{padding:1.25rem 0;border-bottom:1px solid #555;font-size:1rem;font-weight:600}.browser-frame{border:3px solid #f7f4ed;background:#abcde5;color:#17151c;box-shadow:16px 18px 0 #a6df3f}.browser-bar{display:flex;align-items:center;gap:.45rem;padding:.75rem;border-bottom:3px solid #17151c;background:#f7f4ed}.browser-bar i{width:9px;height:9px;border-radius:50%;background:#f09bb5}.browser-bar b{margin-left:auto;font-size:.56rem;letter-spacing:.12em}.browser-content{position:relative;display:flex;align-items:center;justify-content:space-between;height:52vh;padding:3rem}.browser-content strong{font-size:clamp(2.8rem,5.5vw,6rem);line-height:.82;letter-spacing:-.08em}.browser-content img{width:42%;height:90%;object-fit:contain}.light-status{color:#bbb}
.dev-projects{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(4rem,9vw,10rem);margin-top:3rem;padding:0 2vw}.dev-project-card{position:relative;height:54vh;min-height:420px;padding:0;overflow:hidden;border:2px solid #f7f4ed;background:#252329;color:#fff;text-align:left;cursor:pointer;transition:transform .35s ease,box-shadow .35s ease}.dev-project-card:first-child{transform:translateY(1.6rem)}.dev-project-card:hover,.dev-project-card:focus-visible{transform:translateY(-8px);box-shadow:13px 14px 0 #8f75d1;outline:none}.dev-project-card:first-child:hover,.dev-project-card:first-child:focus-visible{transform:translateY(calc(1.6rem - 8px))}.dev-project-card img{width:100%;height:100%;display:block;object-fit:cover;filter:saturate(.82) brightness(.72);transition:transform .6s ease,filter .35s ease}.dev-project-card:hover img{transform:scale(1.035);filter:saturate(1) brightness(.82)}.dev-project-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(10,9,13,.94) 100%)}.dev-card-no{position:absolute;z-index:2;top:1rem;left:1rem;display:grid;place-items:center;width:2.6rem;height:2.6rem;border:1px solid rgba(255,255,255,.8);border-radius:50%;font-size:.68rem;font-weight:700}.dev-card-copy{position:absolute;z-index:2;right:1.4rem;bottom:1.4rem;left:1.4rem}.dev-card-copy small{display:block;font-size:.56rem;font-weight:700;letter-spacing:.15em;color:#cbc2ec}.dev-card-copy strong{display:block;margin:.45rem 0 .3rem;font-size:clamp(2.4rem,4vw,4.6rem);line-height:.9;letter-spacing:-.055em}.dev-card-copy em{display:block;max-width:90%;font-size:.86rem;font-style:normal;line-height:1.55;color:#ddd}.dev-guide{position:absolute;z-index:4;left:50%;bottom:-1.7rem;width:clamp(150px,17vw,255px);height:clamp(170px,21vw,305px);overflow:hidden;border:2px solid #f7f4ed;border-radius:50% 50% 12px 12px;background:#d7cafa;transform:translateX(-50%);pointer-events:none}.dev-guide span{position:absolute;z-index:2;top:.9rem;left:50%;transform:translateX(-50%);font-size:.52rem;font-weight:800;line-height:1.25;letter-spacing:.13em;text-align:center;color:#17151c}.dev-guide video{width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply}.dev-tech-line{display:flex;flex-wrap:wrap;gap:.55rem;margin:4.8rem 2vw 0}.dev-tech-line span{padding:.5rem .75rem;border:1px solid #625f68;border-radius:999px;font-size:.56rem;letter-spacing:.11em;color:#bbb}.light-status{color:#bbb}
.practice-section{display:grid;grid-template-columns:1.15fr .85fr;gap:6vw;align-items:center;background:#f4efe6}.practice-photo{height:76vh;overflow:hidden;border-radius:50% 50% 3rem 3rem}.practice-photo img{width:100%;height:100%;object-fit:cover}.practice-copy h2{margin:.8rem 0 1.5rem;font-size:clamp(3.6rem,6.5vw,7rem);line-height:.94;letter-spacing:-.07em}.practice-copy p{max-width:530px;font-size:1.05rem;line-height:1.85}.practice-tags{display:flex;gap:.6rem;margin-top:2rem}.practice-tags b{padding:.65rem 1rem;border:2px solid #17151c;border-radius:999px;font-size:.75rem}
.projects-section{background:#ded7ee}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:3.5rem}.project-grid article{position:relative;height:56vh;overflow:hidden;border:3px solid #17151c;background:#fff;transition:transform .3s,box-shadow .3s}.project-grid article:hover{transform:translateY(-10px);box-shadow:10px 12px 0 #17151c}.project-grid video{width:100%;height:100%;object-fit:cover}.project-grid article>div{position:absolute;left:0;right:0;bottom:0;padding:1.2rem;background:linear-gradient(transparent,rgba(0,0,0,.78));color:#fff}.project-grid span{font-size:.55rem;letter-spacing:.13em}.project-grid h3{margin:.4rem 0 0;font-size:1.2rem}
.awards-section{display:grid;grid-template-columns:.75fr 1.25fr;gap:7vw;align-items:center;background:#b9ef4a;color:#17151c}.awards-title h2{margin:.7rem 0 0;font-size:clamp(6rem,11vw,12rem);line-height:.7;letter-spacing:-.09em}.awards-list{border-top:3px solid #17151c}.awards-list>div{display:grid;grid-template-columns:3rem 1fr auto;gap:1rem;align-items:center;padding:1.5rem 0;border-bottom:2px solid #17151c}.awards-list b{font-size:.72rem}.awards-list span{font-size:clamp(1.5rem,2.5vw,2.6rem);font-weight:700}.awards-list small{font-size:.58rem;letter-spacing:.13em}.awards-list p{margin-top:2rem}.back-top{position:absolute;right:7vw;bottom:2rem;padding:.75rem 1rem;border:2px solid #17151c;border-radius:999px;font-size:.75rem;font-weight:700}

@media(max-width:760px){.portfolio-section{min-height:auto;padding:4.5rem 1rem}.section-head h2{font-size:3.6rem}.section-status{position:static;margin-top:2rem}.design-gallery{height:78vh}.design-shot{width:58%;height:42%}.shot-a{left:0;top:4%}.shot-b{left:auto;right:0;top:27%}.shot-c{left:12%;right:auto;bottom:0}.development-layout{grid-template-columns:1fr;margin-top:2rem}.dev-index{grid-template-columns:1fr 1fr}.dev-index span{font-size:.72rem}.browser-content{height:40vh;padding:1.5rem}.browser-content strong{font-size:2.8rem}.practice-section{grid-template-columns:1fr}.practice-photo{height:58vh}.practice-copy h2{font-size:3.7rem}.project-grid{grid-template-columns:1fr}.project-grid article{height:55vh}.awards-section{grid-template-columns:1fr}.awards-title h2{font-size:7rem}.awards-list>div{grid-template-columns:2rem 1fr}.awards-list small{display:none}.back-top{position:static;display:inline-block;margin-top:3rem}}
@media(max-width:760px){.dev-projects{grid-template-columns:1fr;gap:2rem;padding:0}.dev-project-card,.dev-project-card:first-child{height:58vh;min-height:410px;transform:none}.dev-project-card:first-child:hover,.dev-project-card:first-child:focus-visible{transform:translateY(-7px)}.dev-guide{position:relative;left:50%;bottom:auto;grid-row:2;width:180px;height:210px;margin:-4.5rem 0 -4rem}.dev-xinyu-card{grid-row:3}.dev-tech-line{margin:5rem 0 0}.dev-card-copy strong{font-size:3rem}.dev-card-copy em{font-size:.78rem}}

.browser-content video{width:42%;height:90%;object-fit:cover;mix-blend-mode:multiply}.practice-copy{position:relative}.practice-character{position:absolute;right:-4vw;bottom:-17vh;width:18vw;height:28vh;object-fit:contain;mix-blend-mode:multiply}.project-placeholder{background:#f4f0fa}.project-placeholder:nth-child(3){background:#f2a8bd}.project-grid .project-placeholder>div{inset:0;display:flex;flex-direction:column;justify-content:flex-end;background:none;color:#17151c}.project-placeholder h3{font-size:clamp(1.7rem,2.7vw,3rem)}.project-placeholder p{margin:.8rem 0 0}.awards-character{position:absolute;z-index:0;left:36%;bottom:0;width:26vw;height:55vh;object-fit:contain;mix-blend-mode:multiply;opacity:.82}.awards-title,.awards-list,.back-top{position:relative;z-index:1}
@media(max-width:760px){.browser-content video{width:45%;height:100%}.practice-character{right:-4vw;bottom:-8vh;width:46vw;height:24vh}.awards-character{left:auto;right:-14vw;width:65vw;height:42vh;opacity:.35}}

.microvideo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:3rem}.microvideo-card{position:relative;height:62vh;padding:0;overflow:hidden;border:3px solid #17151c;background:#fff;color:#17151c;text-align:left;cursor:pointer;box-shadow:10px 12px 0 rgba(23,21,28,.18);transition:transform .3s,box-shadow .3s}.microvideo-card:nth-child(2){transform:translateY(2.2rem)}.microvideo-card:hover,.microvideo-card:focus-visible{transform:translateY(-10px);box-shadow:15px 18px 0 rgba(23,21,28,.2);outline:none}.microvideo-card:nth-child(2):hover,.microvideo-card:nth-child(2):focus-visible{transform:translateY(calc(2.2rem - 10px))}.microvideo-card img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .5s}.microvideo-card:hover img{transform:scale(1.035)}.microvideo-card>span{position:absolute;left:0;right:0;bottom:0;padding:4rem 1.2rem 1.2rem;background:linear-gradient(transparent,rgba(0,0,0,.84));color:#fff}.microvideo-card small{display:block;font-size:.55rem;letter-spacing:.14em}.microvideo-card strong{display:block;margin-top:.35rem;font-size:1.45rem}.microvideo-card em{display:block;margin-top:.35rem;font-size:.72rem;font-style:normal;opacity:.8}
.work-dialog{width:min(1260px,94vw);max-height:90vh;padding:0;border:0;background:#f5f3ed;color:#17151c;box-shadow:0 30px 100px rgba(0,0,0,.35)}.work-dialog::backdrop{background:rgba(20,18,25,.78);backdrop-filter:blur(7px)}.work-dialog[open]{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(420px,.88fr)}.dialog-close{position:absolute;z-index:3;top:1rem;right:1rem;width:44px;height:44px;border:2px solid #17151c;border-radius:50%;background:#b9ef4a;font-size:1.7rem;line-height:1;cursor:pointer}.dialog-media{min-height:70vh;background:#111;display:grid;place-items:center}.dialog-media video{width:100%;max-height:80vh;display:block}.dialog-copy{min-width:0;display:flex;flex-direction:column;justify-content:center;padding:3rem 2.5rem}.dialog-copy>span{max-width:calc(100% - 3rem);font-size:.62rem;font-weight:700;line-height:1.6;letter-spacing:.12em}.dialog-copy h2{margin:.8rem 0 1.5rem;font-size:clamp(2.4rem,3.5vw,4.2rem);line-height:1.04;letter-spacing:-.055em;text-wrap:balance;word-break:keep-all}.dialog-copy p{margin:0;font-size:1rem;line-height:1.9;text-align:justify;text-justify:inter-ideograph;word-break:normal;line-break:strict}.dialog-tags{display:flex;flex-wrap:wrap;gap:.45rem;margin:1.6rem 0 2rem}.dialog-tags span{padding:.45rem .7rem;border:1px solid #17151c;border-radius:999px;font-size:.68rem;white-space:nowrap}.dialog-copy>a{align-self:flex-start;padding:.85rem 1rem;background:#17151c;color:#fff;font-size:.75rem;font-weight:700;white-space:nowrap}
@media(max-width:900px){.work-dialog[open]{display:block;overflow:auto}.dialog-media{min-height:0}.dialog-media video{max-height:52vh}.dialog-copy{padding:2.2rem 1.5rem}.dialog-copy h2{max-width:calc(100% - 3rem);font-size:2.8rem}.dialog-close{position:fixed}}
@media(max-width:760px){.microvideo-grid{grid-template-columns:1fr}.microvideo-card,.microvideo-card:nth-child(2){height:66vh;transform:none}.microvideo-card:nth-child(2):hover{transform:translateY(-7px)}.dialog-copy{padding:1.8rem 1.1rem}.dialog-copy h2{font-size:2.35rem}.dialog-copy p{text-align:left;font-size:.94rem;line-height:1.8}.dialog-copy>a{white-space:normal}}

.dialog-copy h2{font-size:clamp(2rem,2.7vw,3.25rem);line-height:1.08;letter-spacing:-.045em;white-space:nowrap;text-wrap:nowrap}
@media(max-width:900px){.dialog-copy h2{font-size:clamp(1.8rem,7vw,2.7rem)}}
@media(max-width:760px){.dialog-copy h2{font-size:clamp(1.5rem,7.2vw,2.2rem)}}

/* Practice: editorial field notes */
.practice-section{display:block;overflow:hidden;background:#f4efe6}.practice-head{position:relative;z-index:2}.practice-head h2{font-size:clamp(3.6rem,6.5vw,7rem)}.practice-head p{max-width:34rem;line-height:1.75}.practice-gallery{display:grid;grid-template-columns:1.05fr .95fr 1.1fr;grid-template-rows:28vh 28vh;gap:1rem;margin-top:2.3rem;padding-right:5vw}.practice-card{position:relative;margin:0;overflow:hidden;border:2px solid #17151c;background:#ddd}.practice-card img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .55s ease}.practice-card:hover img{transform:scale(1.035)}.practice-card-teaching{grid-row:1/3}.practice-card-hackathon{grid-column:2/4}.practice-card-marathon{grid-column:2}.practice-card-student{grid-column:3}.practice-card figcaption{position:absolute;right:.75rem;bottom:.75rem;left:.75rem;display:flex;align-items:flex-end;gap:.75rem;padding:.75rem;background:rgba(247,244,237,.92);backdrop-filter:blur(6px)}.practice-card figcaption>b{font-size:.62rem}.practice-card figcaption>span{font-size:.9rem;font-weight:750}.practice-card figcaption small{display:block;margin-top:.2rem;font-size:.48rem;letter-spacing:.12em;color:#615d62}.practice-corner-character{position:absolute;z-index:4;right:.7vw;bottom:0;width:clamp(110px,11vw,175px);height:25vh;object-fit:cover;mix-blend-mode:multiply;pointer-events:none}

/* Awards: certificate shelf */
.awards-section{display:grid;grid-template-columns:.55fr 1.45fr;gap:5vw;align-items:start;overflow:hidden;background:#b9ef4a}.awards-title{position:sticky;top:4rem;z-index:2}.awards-title h2{margin:.7rem 0 1.5rem;font-size:clamp(5.2rem,9vw,10rem);line-height:.73;letter-spacing:-.09em}.awards-title p{max-width:18rem;font-size:.9rem;line-height:1.7}.award-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.15rem}.award-card{position:relative;height:38vh;min-height:300px;overflow:hidden;border:2px solid #17151c;background:#f7f4ed;color:#17151c;box-shadow:8px 9px 0 rgba(23,21,28,.16);transition:transform .3s,box-shadow .3s}.award-card:nth-child(even){transform:translateY(2rem)}.award-card:hover{transform:translateY(-6px);box-shadow:12px 14px 0 rgba(23,21,28,.22)}.award-card:nth-child(even):hover{transform:translateY(calc(2rem - 6px))}.award-card img{width:100%;height:100%;display:block;object-fit:contain;background:#f7f4ed;padding:1rem}.award-card>span{position:absolute;right:.7rem;bottom:.7rem;left:.7rem;display:grid;grid-template-columns:2rem 1fr;gap:.15rem .5rem;padding:.7rem;background:rgba(23,21,28,.92);color:#fff}.award-card b{grid-row:1/3;font-size:.65rem}.award-card strong{font-size:.82rem}.award-card small{font-size:.55rem;letter-spacing:.07em;color:#cfef8b}.awards-corner-character{position:absolute;z-index:3;left:.8vw;bottom:0;width:clamp(105px,11vw,170px);height:24vh;object-fit:contain;pointer-events:none}.awards-section .back-top{z-index:5}

@media(max-width:760px){.practice-gallery{grid-template-columns:1fr 1fr;grid-template-rows:42vh 30vh 30vh;padding-right:0}.practice-card-teaching{grid-row:1;grid-column:1}.practice-card-hackathon{grid-row:1;grid-column:2}.practice-card-marathon{grid-row:2;grid-column:1/3}.practice-card-student{grid-row:3;grid-column:1/3}.practice-card figcaption{right:.45rem;bottom:.45rem;left:.45rem;padding:.55rem}.practice-corner-character{right:-1rem;width:120px;height:18vh;opacity:.9}.awards-section{display:block}.awards-title{position:relative;top:auto}.awards-title h2{font-size:6rem}.award-gallery{grid-template-columns:1fr;margin-top:2.5rem}.award-card,.award-card:nth-child(even){height:44vh;min-height:300px;transform:none}.award-card:nth-child(even):hover{transform:translateY(-6px)}.awards-corner-character{left:-1.5rem;width:120px;height:17vh;opacity:.9}.awards-section .back-top{margin-left:7rem}}

/* Development cover composition */
.dev-projects{display:flex;justify-content:center;align-items:flex-end;gap:0;padding:0 4vw;margin-top:4rem}.dev-project-card{flex:0 1 58%;height:auto;min-height:0;aspect-ratio:16/9;background:#0d1014}.dev-project-card:first-child{z-index:1;transform:translateX(4vw) translateY(1.7rem) rotate(-1.5deg)}.dev-project-card:last-child{z-index:2;transform:translateX(-4vw) rotate(1.5deg)}.dev-project-card:first-child:hover,.dev-project-card:first-child:focus-visible{transform:translateX(4vw) translateY(.9rem) rotate(-1.5deg)}.dev-project-card:last-child:hover,.dev-project-card:last-child:focus-visible{transform:translateX(-4vw) translateY(-8px) rotate(1.5deg)}.dev-project-card img{object-fit:contain;filter:none;background:#0d1014}.dev-project-card:hover img{transform:none;filter:none}.dev-project-card:after{background:linear-gradient(180deg,transparent 54%,rgba(10,9,13,.92) 100%)}.dev-guide{top:-12.5rem;right:-1.5vw;bottom:auto;left:auto;width:clamp(100px,10vw,150px);height:clamp(125px,13vw,190px);border-radius:48% 48% 12px 12px;transform:none}.dev-guide span{display:none}.dev-tech-line{margin-top:4rem}.dialog-media img{width:100%;height:100%;max-height:80vh;display:block;object-fit:contain;padding:1.25rem;background:#111}.dialog-media [hidden]{display:none!important}
@media(max-width:760px){.dev-projects{display:flex;flex-direction:column;gap:1.2rem;padding:0;margin-top:3rem}.dev-project-card,.dev-project-card:first-child,.dev-project-card:last-child{width:100%;flex:none;height:auto;min-height:0;transform:none}.dev-project-card:first-child:hover,.dev-project-card:first-child:focus-visible,.dev-project-card:last-child:hover,.dev-project-card:last-child:focus-visible{transform:translateY(-5px)}.dev-guide{position:absolute;top:-10.5rem;right:-.4rem;left:auto;bottom:auto;width:90px;height:112px;margin:0;transform:none}.dev-card-copy strong{font-size:2.4rem}.dialog-media img{height:auto;max-height:52vh;padding:.5rem}}

/* Section navigation and coming-soon feedback */
.return-world{position:absolute;z-index:8;top:2.2rem;right:3vw;padding:.72rem 1rem;border:2px solid currentColor;border-radius:999px;background:rgba(247,244,237,.82);color:#17151c;font-size:.68rem;font-weight:750;letter-spacing:.06em;backdrop-filter:blur(8px);transition:transform .25s,background .25s}.return-world:hover,.return-world:focus-visible{transform:translateY(-3px);background:#fff;outline:none}.development-section .return-world{border-color:#f7f4ed;background:rgba(24,23,26,.72);color:#f7f4ed}.coming-soon-toast{position:fixed;z-index:50;left:50%;bottom:2rem;padding:.9rem 1.25rem;border:2px solid #2f2445;border-radius:999px;background:#7660a5;color:#fff;font-size:.78rem;font-weight:750;letter-spacing:.06em;box-shadow:0 12px 40px rgba(36,27,52,.25);opacity:0;transform:translate(-50%,18px);pointer-events:none;transition:opacity .25s,transform .25s}.coming-soon-toast.is-visible{opacity:1;transform:translate(-50%,0)}

/* Development cards: more breathing room */
.dev-projects{gap:4vw;padding:0 1vw}.dev-project-card{flex:1 1 0;max-width:48%}.dev-project-card:first-child{transform:translateY(1.4rem) rotate(-.8deg)}.dev-project-card:last-child{transform:rotate(.8deg)}.dev-project-card:first-child:hover,.dev-project-card:first-child:focus-visible{transform:translateY(.6rem) rotate(-.8deg)}.dev-project-card:last-child:hover,.dev-project-card:last-child:focus-visible{transform:translateY(-8px) rotate(.8deg)}
@media(max-width:760px){.return-world{top:1.1rem;right:1rem;padding:.58rem .78rem;font-size:.6rem}.coming-soon-toast{bottom:1.2rem;white-space:nowrap}.dev-projects{gap:1.2rem;padding:0}.dev-project-card,.dev-project-card:first-child,.dev-project-card:last-child{max-width:none;transform:none}.dev-project-card:first-child:hover,.dev-project-card:first-child:focus-visible,.dev-project-card:last-child:hover,.dev-project-card:last-child:focus-visible{transform:translateY(-5px)}}

/* Practice field-notes redesign and story walls */
.practice-section{padding-top:5vw}.practice-head{display:grid;grid-template-columns:1fr auto;grid-template-areas:"label label" "title text";align-items:end;column-gap:4rem}.practice-head>span{grid-area:label}.practice-head h2{grid-area:title;margin:.35rem 0 0;font-size:clamp(3.4rem,5vw,6rem);line-height:.92;white-space:nowrap}.practice-head p{grid-area:text;max-width:27rem;margin:0 5vw .3rem 0}.practice-gallery{grid-template-columns:.9fr 1.2fr 1fr;grid-template-rows:25vh 25vh;gap:1.2rem;margin-top:2rem;padding-right:4vw}.practice-card{cursor:pointer;box-shadow:7px 8px 0 rgba(65,51,91,.13);transition:transform .3s,box-shadow .3s}.practice-card:hover,.practice-card:focus-visible{transform:translateY(-6px);box-shadow:11px 13px 0 rgba(65,51,91,.18);outline:none}.practice-card figcaption{align-items:center}.practice-card figcaption>span{flex:1}.practice-card figcaption em{font-size:.48rem;font-style:normal;font-weight:750;letter-spacing:.1em;color:#7660a5}.practice-corner-character{right:-1.5vw;bottom:-1.5rem;width:clamp(140px,14vw,220px);height:25vh;object-fit:contain;mix-blend-mode:normal}.practice-dialog{width:min(1500px,96vw);height:92vh;max-height:92vh;padding:0;border:0;background:#f4efe6;color:#302742;box-shadow:0 28px 100px rgba(24,18,34,.38)}.practice-dialog::backdrop{background:rgba(31,24,42,.82);backdrop-filter:blur(7px)}.practice-dialog[open]{display:block;overflow:auto}.practice-dialog>header{position:sticky;z-index:4;top:0;display:flex;justify-content:space-between;gap:2rem;padding:2rem 3rem 1.5rem;border-bottom:2px solid #302742;background:rgba(244,239,230,.94);backdrop-filter:blur(12px)}.practice-dialog header span{font-size:.58rem;font-weight:750;letter-spacing:.14em}.practice-dialog h2{margin:.35rem 0 .45rem;font-size:clamp(2.5rem,4.5vw,5rem);line-height:.9;letter-spacing:-.065em}.practice-dialog header p{max-width:42rem;margin:0;font-size:.9rem;line-height:1.7}.practice-dialog-close{flex:0 0 auto;width:46px;height:46px;border:2px solid #302742;border-radius:50%;background:#b9ef4a;font-size:1.8rem;cursor:pointer}.practice-photo-wall{columns:3 300px;column-gap:1.2rem;padding:2rem 3rem}.practice-photo-wall figure{position:relative;break-inside:avoid;margin:0 0 1.2rem;overflow:hidden;border:2px solid #302742;background:#fff}.practice-photo-wall img{width:100%;display:block}.practice-photo-wall figcaption{position:absolute;right:.5rem;bottom:.5rem;padding:.35rem .48rem;background:#302742;color:#fff;font-size:.55rem;letter-spacing:.1em}.practice-dialog-back{display:block;margin:0 auto 2.5rem;padding:.8rem 1.1rem;border:2px solid #302742;border-radius:999px;background:transparent;color:#302742;font-weight:750;cursor:pointer}
@media(max-width:760px){.practice-section{padding-top:4.5rem}.practice-head{display:block}.practice-head h2{font-size:clamp(2.8rem,13vw,4.2rem);white-space:normal}.practice-head p{margin:1rem 0 0}.practice-gallery{grid-template-columns:1fr;grid-template-rows:none;padding-right:0}.practice-card,.practice-card-teaching,.practice-card-hackathon,.practice-card-marathon,.practice-card-student{grid-column:auto;grid-row:auto;height:46vh}.practice-card figcaption em{display:none}.practice-corner-character{right:-2rem;bottom:-1rem;width:150px;height:18vh}.practice-dialog{width:96vw;height:94vh;max-height:94vh}.practice-dialog>header{padding:1.3rem 1rem 1rem}.practice-dialog h2{font-size:2.8rem}.practice-dialog header p{font-size:.8rem}.practice-photo-wall{columns:1;padding:1rem}.practice-dialog-close{width:40px;height:40px}}

/* Practice final composition refinement */
.practice-section{padding-right:6vw;padding-left:6vw}.practice-head{column-gap:clamp(2rem,5vw,6rem);padding-right:7vw}.practice-head h2{font-size:clamp(3.2rem,4.6vw,5.5rem);letter-spacing:-.075em}.practice-head p{margin-right:0}.practice-gallery{grid-template-columns:.9fr 1.22fr 1fr;grid-template-rows:26vh 26vh;gap:clamp(1rem,1.35vw,1.6rem);margin-top:2.4rem;padding-right:7vw}.practice-card figcaption{right:.9rem;bottom:.9rem;left:.9rem;padding:.85rem .9rem}.practice-corner-character{right:-3vw;bottom:-2.2rem;width:clamp(200px,19vw,310px);height:33vh}.practice-section>.section-status{right:auto;left:6vw}
@media(max-width:760px){.practice-section{padding-right:1rem;padding-left:1rem}.practice-head{padding-right:0}.practice-head h2{font-size:clamp(2.7rem,12vw,4rem);letter-spacing:-.065em}.practice-gallery{grid-template-columns:1fr;grid-template-rows:none;gap:1.1rem;margin-top:2rem;padding-right:0}.practice-card figcaption{right:.65rem;bottom:.65rem;left:.65rem;padding:.7rem}.practice-corner-character{right:-3.5rem;bottom:-.7rem;width:185px;height:22vh}.practice-section>.section-status{left:auto}}

/* World card previews and locked chapters */
.card-window{position:relative;overflow:hidden}.card-window img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .45s ease,filter .35s ease}.card-design .card-window img{object-position:center 38%}.card-development .card-window img{object-position:32% center}.card-practice .card-window img{object-position:center center}.world-card:hover .card-window img,.world-card:focus-visible .card-window img{transform:scale(1.055);filter:saturate(1.08)}.locked-window{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;background:rgba(255,255,255,.16)}.locked-window i{position:relative;width:2.5rem;height:2.1rem;border:3px solid #17151c;border-radius:.35rem;background:rgba(255,255,255,.16)}.locked-window i:before{content:"";position:absolute;left:50%;bottom:100%;width:1.35rem;height:1.15rem;border:3px solid #17151c;border-bottom:0;border-radius:1rem 1rem 0 0;transform:translateX(-50%)}.locked-window i:after{content:"";position:absolute;top:.55rem;left:50%;width:.3rem;height:.6rem;border-radius:999px;background:#17151c;transform:translateX(-50%)}.locked-window em{font-size:.52rem;font-style:normal;font-weight:800;letter-spacing:.18em}.card-projects,.card-awards{cursor:pointer}
@media(max-width:760px){.locked-window{gap:.35rem}.locked-window i{width:1.6rem;height:1.35rem;border-width:2px}.locked-window i:before{width:.85rem;height:.7rem;border-width:2px}.locked-window i:after{top:.35rem;width:.22rem;height:.42rem}.locked-window em{font-size:.43rem}}

.world-character{width:min(58vw,820px);height:72vh;bottom:-7vh}
@media(max-width:760px){.world-character{width:104vw;height:52vh;bottom:-7vh}}

@media(min-width:761px){
  .card-design{transform:translateX(-270%) translateY(48px) rotate(-13deg)}
  .card-development{transform:translateX(-160%) translateY(12px) rotate(-6deg)}
  .card-practice{transform:translateX(-50%) translateY(0) rotate(0)}
  .card-projects{transform:translateX(60%) translateY(12px) rotate(6deg)}
  .card-awards{transform:translateX(170%) translateY(48px) rotate(13deg)}
  .card-design:hover,.card-design:focus-visible,.card-design.is-active{transform:translateX(-270%) translateY(26px) rotate(0) scale(1.07)!important}
  .card-development:hover,.card-development:focus-visible,.card-development.is-active{transform:translateX(-160%) translateY(-10px) rotate(0) scale(1.07)!important}
  .card-practice:hover,.card-practice:focus-visible,.card-practice.is-active{transform:translateX(-50%) translateY(-22px) rotate(0) scale(1.07)!important}
  .card-projects:hover,.card-projects:focus-visible,.card-projects.is-active{transform:translateX(60%) translateY(-10px) rotate(0) scale(1.07)!important}
  .card-awards:hover,.card-awards:focus-visible,.card-awards.is-active{transform:translateX(170%) translateY(26px) rotate(0) scale(1.07)!important}
}