﻿:root{--ink:#20201d;--paper:#f7f3ea;--orange:#ff6542;--blue:#78b6e3;--yellow:#ffd65b;--pink:#ffaab8;--line:2px solid var(--ink)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Noto Serif SC',serif;overflow-x:hidden}.paper-grain{position:fixed;inset:0;opacity:.16;pointer-events:none;z-index:10;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E")}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 5.5vw;border-bottom:var(--line);position:relative;z-index:2;background:rgba(247,243,234,.88);backdrop-filter:blur(6px)}.logo{font:500 1.7rem 'DM Mono',monospace;color:var(--ink);text-decoration:none;letter-spacing:-3px}.logo span:first-child{font-family:'ZCOOL KuaiLe',sans-serif;color:var(--orange);font-size:2.4rem;letter-spacing:-7px}.spark{color:var(--blue);vertical-align:top;font-size:1rem;letter-spacing:0}nav{display:flex;gap:32px}nav a,.nav-note{font:500 13px 'DM Mono',monospace;text-decoration:none;color:var(--ink);position:relative}.nav a:after{content:'';position:absolute;bottom:-5px;left:0;width:0;height:2px;background:var(--orange);transition:.25s}.nav a:hover:after{width:100%}.nav-note{border:var(--line);padding:9px 13px;border-radius:50%;transform:rotate(2deg)}.nav-note span{color:var(--orange);font-size:18px}.section{padding-left:8vw;padding-right:8vw}.hero{min-height:calc(100vh - 76px);display:grid;grid-template-columns:1.08fr .92fr;align-items:center;position:relative;padding-top:55px;padding-bottom:80px}.eyebrow,.section-label,.project-meta,.tag,.time,.contact-foot{font:500 11px 'DM Mono',monospace;letter-spacing:.07em}.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--orange);margin-right:6px;animation:pulse 1.5s infinite}.hero h1{font-size:clamp(3.2rem,6.4vw,6.7rem);line-height:1.05;letter-spacing:-.085em;margin:20px 0 22px;font-weight:900}.hero h1 i,.contact h2 i{font-family:'Ma Shan Zheng',cursive;font-weight:400;color:var(--orange);font-style:normal;letter-spacing:-.02em}.hero h1 em{font-style:normal;display:inline-block;position:relative;z-index:0}.hero h1 em:after{content:'';background:var(--yellow);height:.32em;position:absolute;left:-.05em;right:-.05em;bottom:.11em;z-index:-1;transform:rotate(-2deg)}.hero-summary{max-width:350px;font-size:15px;line-height:1.95;margin:0 0 27px}.scribble-btn{font:500 13px 'DM Mono',monospace;text-decoration:none;color:var(--ink);display:inline-block;border:var(--line);padding:13px 16px;border-radius:8px 12px 9px 14px;box-shadow:4px 4px 0 var(--blue);transition:.25s}.scribble-btn:hover{box-shadow:7px 7px 0 var(--orange);transform:translate(-2px,-2px)}.scribble-btn b{font-size:20px;margin-left:9px}.hero-doodle{height:500px;position:relative;max-width:500px;justify-self:end;width:100%;background:radial-gradient(circle at 53% 45%,#fffaf0 0 31%,transparent 32%)}.sun{width:112px;height:112px;border:var(--line);border-radius:49% 51% 47% 53%;position:absolute;top:30px;right:42px;background:var(--yellow);text-align:center;padding-top:28px;font:400 25px 'ZCOOL KuaiLe';line-height:.8;transform:rotate(7deg);box-shadow:5px 5px 0 var(--ink)}.sun small{font:10px 'DM Mono';letter-spacing:-1px}.robot{position:absolute;width:190px;height:260px;left:38%;top:128px;z-index:2}.head{width:150px;height:110px;border:var(--line);background:#fffdf7;border-radius:44% 48% 43% 47%;position:absolute;left:20px;display:flex;align-items:center;justify-content:center;gap:35px}.head i{width:18px;height:25px;background:var(--ink);border-radius:50%}.head b{position:absolute;bottom:19px;font:27px 'DM Mono'}.antenna{position:absolute;width:2px;height:34px;background:var(--ink);left:95px;top:-25px}.antenna:before{content:'';width:13px;height:13px;border:var(--line);border-radius:50%;background:var(--pink);position:absolute;top:-6px;left:-6px}.body{position:absolute;top:103px;left:38px;width:113px;height:105px;background:var(--blue);border:var(--line);border-radius:20px 21px 37px 36px;text-align:center;padding-top:22px;font-size:30px}.arms{position:absolute;width:62px;height:55px;border-bottom:var(--line);top:126px}.arms.left{left:-22px;transform:rotate(34deg);border-left:var(--line);border-radius:0 0 0 28px}.arms.right{right:-22px;transform:rotate(-34deg);border-right:var(--line);border-radius:0 0 28px 0}.legs{position:absolute;top:204px;left:55px;width:75px;height:55px;border-left:var(--line);border-right:var(--line);border-bottom:var(--line);border-radius:0 0 23px 23px}.orbit{border:var(--line);border-radius:50%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-15deg)}.orbit-a{width:390px;height:200px}.orbit-b{width:360px;height:220px;transform:translate(-50%,-50%) rotate(55deg);border-style:dashed}.cloud{position:absolute;border:var(--line);padding:7px 13px;background:#fffdf7;border-radius:40% 50% 45% 52%;font:12px 'DM Mono';z-index:3}.c1{top:130px;left:1%;transform:rotate(-9deg)}.c2{right:0;bottom:86px;transform:rotate(7deg);background:var(--pink)}.doodle-arrow{position:absolute;right:-10px;bottom:15px;font:22px 'Ma Shan Zheng';transform:rotate(-8deg)}.star{position:absolute;font-size:30px;color:var(--orange)}.s1{top:40px;left:15%}.s2{bottom:88px;left:5%;color:var(--blue)}.scroll-hint{position:absolute;bottom:22px;left:8vw;font:10px 'DM Mono';letter-spacing:.13em;display:flex;gap:10px;align-items:center}.scroll-hint i{height:2px;width:70px;background:var(--ink);display:block}.section-line{border-top:var(--line)}.intro{padding-top:75px;padding-bottom:88px;display:grid;grid-template-columns:180px 1fr;gap:30px}.section-label{padding-top:10px}.big-quote{font-size:clamp(2rem,4vw,4.25rem);font-weight:900;line-height:1.35;letter-spacing:-.065em;margin:0}.big-quote mark{background:transparent;position:relative;z-index:0;color:inherit}.big-quote mark:after{content:'';position:absolute;left:-.04em;right:-.04em;height:.3em;background:var(--yellow);bottom:.08em;z-index:-1;transform:rotate(-1deg)}.big-quote mark+br+mark:after{background:var(--blue)}.intro-bottom{margin-top:50px;display:grid;grid-template-columns:115px 290px 1fr;align-items:center;gap:38px}.intro-bottom>p{font-size:14px;line-height:2;margin:0}.portrait{height:112px;width:100px;border:var(--line);background:var(--pink);border-radius:52% 48% 43% 51%;position:relative;transform:rotate(-5deg)}.portrait-face{font:55px 'ZCOOL KuaiLe';text-align:center;padding-top:15px}.portrait span{position:absolute;white-space:nowrap;background:#fffdf7;border:var(--line);font:11px 'DM Mono';padding:3px 7px;right:-34px;top:-14px;transform:rotate(8deg)}.skills-cloud{display:flex;flex-wrap:wrap;gap:10px;align-content:center}.skills-cloud span{font:12px 'DM Mono';padding:6px 10px;border:1.5px solid var(--ink);border-radius:50%;transform:rotate(var(--r,0deg))}.skills-cloud span:nth-child(2n){background:var(--yellow);--r:4deg}.skills-cloud span:nth-child(3n){background:var(--blue);--r:-4deg}.work{padding-top:74px;padding-bottom:100px}.work-heading{display:grid;grid-template-columns:180px 1fr 300px;align-items:end;margin-bottom:60px}.work-heading h2,.journey h2,.contact h2{font-size:clamp(2.8rem,5vw,5.5rem);font-weight:900;line-height:1.02;letter-spacing:-.08em;margin:0}.work-heading h2 span{font-family:'Ma Shan Zheng';color:var(--orange);font-weight:400}.work-heading>p{font-size:13px;line-height:1.9;margin:0 0 8px}.projects{display:grid;grid-template-columns:1fr 1fr;gap:24px}.project{border:var(--line);background:#fffdf7;position:relative;overflow:hidden}.project-meta{display:flex;justify-content:space-between;padding:18px 20px;border-bottom:1.5px solid var(--ink)}.project-feature{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;min-height:555px}.project-feature>.project-meta{grid-column:1/-1;height:52px}.project-art{position:relative;background:#fceaa3;border-right:var(--line);min-height:500px;overflow:hidden}.robot-art img{position:absolute;width:44%;left:29%;bottom:24px;border:var(--line);border-radius:20px;transform:rotate(-4deg);box-shadow:8px 8px 0 var(--ink)}.tape{position:absolute;top:27px;left:30px;font:13px 'DM Mono';background:#fff7a5;border:var(--line);padding:8px;transform:rotate(-7deg);z-index:2}.sticker{position:absolute;right:25px;bottom:35px;background:var(--pink);border:var(--line);border-radius:50%;width:100px;height:100px;text-align:center;padding-top:24px;font:17px 'Ma Shan Zheng';transform:rotate(11deg);z-index:2}.mini-tree{position:absolute;left:32px;bottom:48px;width:130px;height:150px;border-bottom:var(--line)}.mini-tree b{display:block;height:100px;width:5px;background:var(--ink);position:absolute;bottom:0;left:65px;transform:rotate(6deg)}.mini-tree i{width:39px;height:39px;border:var(--line);border-radius:50%;background:var(--orange);position:absolute}.mini-tree i:nth-child(1){left:21px;top:13px}.mini-tree i:nth-child(2){left:58px;top:0;background:var(--blue)}.mini-tree i:nth-child(3){left:79px;top:34px;background:var(--pink)}.mini-tree i:nth-child(4){left:18px;top:59px;background:#fffdf7}.project-body{padding:46px 46px 38px;position:relative}.tag{color:var(--orange);margin:0 0 16px}.project h3{font-size:clamp(2rem,3.6vw,3.8rem);line-height:1.08;letter-spacing:-.08em;margin:0 0 20px;font-weight:900}.project h3 i{font-family:'Ma Shan Zheng';font-style:normal;font-weight:400;color:var(--orange);letter-spacing:0}.project h3 span{position:relative;z-index:0}.project h3 span:after{content:'';height:.31em;position:absolute;background:var(--yellow);left:-.04em;right:-.04em;bottom:.08em;z-index:-1;transform:rotate(-2deg)}.project-body>p:not(.tag){font-size:14px;line-height:1.85;max-width:390px}.metric-row{display:flex;flex-wrap:wrap;gap:10px 20px;border-top:1.5px dashed var(--ink);padding-top:18px;margin-top:25px}.metric-row span{font-size:11px;white-space:nowrap}.metric-row b{font:500 18px 'DM Mono';display:block;color:var(--orange)}.line-link{font:500 12px 'DM Mono';color:var(--ink);text-decoration:none;display:inline-block;margin-top:28px;border-bottom:1.5px solid var(--ink);padding-bottom:4px}.line-link b{font-size:20px;margin-left:8px}.project-half{min-height:490px}.project-half.blue{background:#d7ecff}.project-half.orange{background:#ffe7da}.project-half .project-body{padding:32px 38px}.project-half h3{font-size:clamp(2.15rem,3.6vw,3.5rem)}.bank-art{position:absolute;right:22px;bottom:25px;width:190px;height:145px}.card-card{position:absolute;left:0;top:10px;border:var(--line);border-radius:11px;background:var(--yellow);width:130px;height:85px;padding:15px;font:13px 'DM Mono';transform:rotate(-9deg);box-shadow:5px 5px 0 var(--ink)}.card-card b{font-size:35px;float:right}.bank-person{position:absolute;right:5px;bottom:0;font:50px 'DM Mono';line-height:.45;transform:rotate(4deg)}.bank-art>span{position:absolute;right:5px;top:13px;font:21px 'Ma Shan Zheng';color:var(--orange);transform:rotate(-8deg)}.flow-art{position:absolute;bottom:40px;right:30px;display:flex;align-items:center;gap:9px;transform:rotate(-4deg)}.flow-art b{font:12px 'DM Mono';border:var(--line);border-radius:50%;width:53px;height:53px;text-align:center;padding-top:18px;background:#fffdf7}.flow-art b:nth-of-type(2){background:var(--yellow)}.flow-art i{font-style:normal;font-size:23px}.flow-art span{position:absolute;right:-7px;top:-20px;color:var(--orange)}.project-wide{grid-column:1/-1;background:#eee9ff;display:grid;grid-template-columns:.9fr 1.1fr;min-height:410px}.project-wide .project-body{padding:46px}.project-wide .project-meta{padding:0 0 18px;border-bottom:0}.interview-art{border-right:var(--line);position:relative;overflow:hidden}.window{width:72%;height:190px;background:#fffdf7;border:var(--line);border-radius:8px;position:absolute;left:16%;top:95px;transform:rotate(-4deg);box-shadow:8px 8px 0 var(--ink);padding:30px 20px}.window>span{width:9px;height:9px;border:1.5px solid var(--ink);border-radius:50%;display:inline-block;margin-right:5px;position:relative;top:-18px}.window>span:first-child{background:var(--pink)}.chat-line{height:14px;border:1.5px solid var(--ink);margin:8px 0;border-radius:10px}.chat-line.a{width:65%;background:var(--blue)}.chat-line.b{width:46%;margin-left:auto;background:var(--yellow)}.chat-line.c{width:78%}.score{position:absolute;right:-23px;bottom:-22px;border:var(--line);border-radius:50%;background:var(--orange);width:70px;height:70px;text-align:center;padding-top:13px;font:32px 'DM Mono';transform:rotate(10deg)}.score small{font-size:15px}.sound{position:absolute;top:51px;left:12%;font:33px 'DM Mono';letter-spacing:2px;transform:rotate(-8deg)}.journey{padding-top:76px;padding-bottom:95px}.journey-top{display:grid;grid-template-columns:1fr 1fr;align-items:end}.journey h2 span{font-family:'Ma Shan Zheng';font-weight:400;color:var(--blue);letter-spacing:0}.route-doodle{justify-self:end;font:24px 'Ma Shan Zheng';transform:rotate(-6deg);margin:0 22px 10px 0}.route-doodle i{display:inline-block;border-top:var(--line);width:130px;margin:0 10px;position:relative}.route-doodle i:after{content:'鉃?;position:absolute;right:-11px;top:-19px;font:30px 'DM Mono'}.timeline{margin-top:67px}.timeline article{display:grid;grid-template-columns:180px 42px 1fr 110px;align-items:center;border-top:var(--line);padding:20px 0;min-height:91px;transition:.25s}.timeline article:last-child{border-bottom:var(--line)}.timeline article:hover{padding-left:12px;background:#fffdf7}.timeline h3{font-size:20px;margin:0;letter-spacing:-.05em}.timeline p{font-size:13px;margin:5px 0 0}.pin{width:18px;height:18px;border:var(--line);border-radius:50%;transform:rotate(13deg)}.orange-pin{background:var(--orange)}.blue-pin{background:var(--blue)}.yellow-pin{background:var(--yellow)}.pink-pin{background:var(--pink)}.stamp{font:10px 'DM Mono';border:1.5px dashed var(--orange);color:var(--orange);padding:8px 6px;text-align:center;transform:rotate(4deg)}.contact{background:var(--ink);color:var(--paper);padding-top:90px;padding-bottom:22px;position:relative;overflow:hidden}.contact .eyebrow{color:var(--yellow);position:relative}.contact h2{font-size:clamp(3.2rem,7.2vw,7.6rem);margin:20px 0 28px;position:relative}.contact h2 i{color:var(--yellow)}.email{color:var(--paper);font:clamp(13px,1.8vw,20px) 'DM Mono';text-decoration:none;border-bottom:1.5px solid var(--paper);padding-bottom:7px;position:relative}.email b{color:var(--orange);font-size:25px}.contact-foot{border-top:1px solid #575650;margin-top:120px;padding-top:18px;display:flex;justify-content:space-between;color:#b9b5a9}.contact-foot a{color:#b9b5a9;text-decoration:none}.contact-doodle{position:absolute;right:11vw;top:75px;width:230px;height:230px;border:2px solid var(--yellow);border-radius:48% 52% 45% 55%;color:var(--yellow);display:flex;align-items:center;justify-content:center;font:83px 'ZCOOL KuaiLe';transform:rotate(11deg)}.contact-doodle div{text-align:center;line-height:.65}.contact-doodle small{font:14px 'DM Mono';line-height:1.1;display:block;margin-top:15px}.contact-doodle>span{position:absolute;font:35px 'DM Mono';color:var(--orange)}.contact-doodle>span:first-child{left:-25px;top:12px}.contact-doodle>span:last-child{right:-22px;bottom:-10px;color:var(--blue)}.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease}.reveal.show{opacity:1;transform:none}.delay-1{transition-delay:.15s}@keyframes pulse{50%{transform:scale(.45);opacity:.45}}@media(max-width:760px){.nav{padding:0 5vw;height:65px}.nav nav{display:none}.nav-note{font-size:10px}.section{padding-left:6vw;padding-right:6vw}.hero{min-height:735px;display:block;padding-top:45px}.hero h1{font-size:3.5rem}.hero-doodle{height:330px;width:110%;margin-left:-4%;margin-top:3px;transform:scale(.82);transform-origin:top center}.scroll-hint{left:6vw;bottom:12px}.intro{display:block;padding-top:45px;padding-bottom:55px}.intro .section-label{margin-bottom:25px}.big-quote{font-size:2rem}.intro-bottom{margin-top:33px;grid-template-columns:90px 1fr;gap:20px}.intro-bottom>p{font-size:13px}.skills-cloud{grid-column:1/-1}.work{padding-top:48px;padding-bottom:55px}.work-heading{display:block;margin-bottom:35px}.work-heading .section-label{margin-bottom:25px}.work-heading>p{margin-top:20px}.projects{display:block}.project{margin-bottom:18px}.project-feature{display:flex;flex-direction:column}.project-feature>.project-meta{min-height:52px}.project-art{min-height:370px;border-right:0;border-bottom:var(--line);order:2}.project-feature .project-body{order:3}.project-body,.project-half .project-body,.project-wide .project-body{padding:30px 24px}.project h3{font-size:2.3rem}.project-half{min-height:440px}.project-wide{display:flex;flex-direction:column}.interview-art{min-height:300px;border-right:0;border-bottom:var(--line);order:2}.project-wide .project-body{order:1}.journey{padding-top:48px;padding-bottom:55px}.journey-top{display:block}.route-doodle{margin:22px 0 0}.timeline{margin-top:40px}.timeline article{grid-template-columns:92px 29px 1fr;padding:15px 0}.timeline .time{font-size:9px}.timeline h3{font-size:16px}.timeline p{font-size:11px}.stamp{display:none}.contact{padding-top:65px}.contact-doodle{opacity:.32;right:-33px;top:44px;transform:scale(.68) rotate(11deg)}.contact-foot{margin-top:95px;font-size:9px;gap:9px;flex-wrap:wrap}.contact-foot span:nth-child(2){display:none}}
