@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Noto+Sans+SC:wght@400;450;500;550;600;650;700;750;800&display=swap');

:root{--paper:#f7f7f2;--ink:#252520;--muted:#82827a;--line:#deded5;--accent:#e65b35;--mono:'DM Sans',Arial,sans-serif;--sans:'DM Sans','Noto Sans SC','Microsoft YaHei',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:32px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:14px;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:5px}::selection{background:#ecd5bd;color:#252520}.wrap{width:calc(100% - 112px);max-width:1328px;margin-inline:auto}.orange{color:var(--accent)}.site-header{height:112px;display:flex;align-items:center;border-bottom:1px solid var(--line);justify-content:space-between}.brand{display:flex;gap:12px;align-items:center}.brand-mark{width:29px;height:29px}.brand>span{font-size:20px;font-weight:650;letter-spacing:1.5px;line-height:1.2}.brand-en{display:block;font-size:8px;font-weight:500;letter-spacing:1.3px;margin-top:6px}.site-header nav{display:flex;gap:36px;margin-left:70px;font-size:12px}.site-header nav a{position:relative;padding:10px 0}.site-header nav a:hover{color:var(--accent)}.nav-dot{display:inline-block;background:var(--accent);width:4px;height:4px;border-radius:50%;vertical-align:top;margin:2px 0 0 5px}.header-note{font-size:10px;letter-spacing:.6px;display:flex;align-items:center;gap:8px;color:#6d6d64}.header-note>span{width:5px;height:5px;border-radius:50%;background:#7f8c67}.hero{padding-top:62px}.hero-kicker{display:flex;gap:12px;align-items:center;font-size:10px;letter-spacing:1.1px}.tiny-cross{font-size:19px;color:var(--accent);line-height:1}.slash{color:#a6a69b;margin:0 2px}.hero-main{display:flex;justify-content:space-between;padding:34px 0 48px;gap:40px}.hero h1{font-size:clamp(54px,5.4vw,82px);line-height:1.32;font-weight:650;letter-spacing:-3.4px;margin:0}.hero-description{font-size:12px;line-height:2.1;color:#77776d;margin:22px 0 0;letter-spacing:.5px}.hero-link{display:inline-flex;align-items:center;gap:33px;font-size:11px;margin-top:30px;font-weight:500}.hero-link>span{font-size:19px;transition:transform .2s}.hero-link:hover>span{transform:translateY(4px)}.hero-aside{width:270px;padding-top:4px;display:flex;flex-direction:column;align-items:flex-start}.asterisk{width:116px;height:116px;margin:0 0 22px 2px;color:var(--accent);transform:rotate(8deg);transition:transform .8s cubic-bezier(.22,1,.36,1)}.hero-aside:hover .asterisk{transform:rotate(68deg)}.hero-aside p{font-family:Georgia,'Times New Roman',serif;font-size:32px;line-height:1.2;letter-spacing:-1px;margin:0 0 21px}.hero-aside p em{font-weight:400}.hero-aside>span{font-size:8px;letter-spacing:1.3px;line-height:1.9;color:var(--muted)}.hero-bottom{border-top:1px solid var(--line);padding:17px 0;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;color:#87877b}.hero-bottom>span:last-child{font-size:8px;letter-spacing:1.5px}.hero-bottom i{font-style:normal;margin:0 8px;color:var(--accent)}.work-section{padding-top:68px}.section-heading{display:flex;align-items:center;justify-content:space-between}.section-title{display:flex;align-items:flex-start;gap:16px}.section-number{font-family:var(--mono);font-size:10px;color:#8c8c80;letter-spacing:1px}.section-title>.section-number{margin-top:8px}.section-title h2,.about-label h2{font-size:24px;line-height:1.25;letter-spacing:-.6px;font-weight:550;margin:0}.section-title h2>span,.about-label h2>span{display:block;font-size:10px;letter-spacing:.1px;color:var(--muted);font-weight:400;margin-top:9px}.project-count{font-family:var(--mono);font-size:11px;color:var(--muted);margin:5px 0 0 -6px}.section-heading>p{font-size:10px;color:var(--muted);letter-spacing:.5px}.work-toolbar{display:flex;align-items:center;justify-content:space-between;margin-top:30px;border-bottom:1px solid var(--line);padding-bottom:14px;gap:20px}.filters{display:flex;gap:7px;flex-wrap:wrap}.filter{background:none;border:0;padding:8px 15px;border-radius:4px;font-size:10px;color:#77776e;transition:background .2s,color .2s}.filter.active{background:var(--ink);color:var(--paper)}.filter:not(.active):hover{background:#eaeae2;color:var(--ink)}.filter>span{font-size:8px;margin-left:8px;color:#b7b7a9}.search-box{display:flex;align-items:center;gap:8px;color:#86867a;max-width:150px}.search-box input{width:95px;background:transparent;border:0;border-bottom:1px solid transparent;border-radius:0;padding:5px 0;font-size:10px;outline-offset:2px}.search-box:focus-within{color:var(--ink)}.search-box input::placeholder{color:#8b8b80}.demo-notice{font-size:9px;color:#929286;display:flex;align-items:center;gap:6px;margin:14px 0 19px;letter-spacing:.2px}.demo-notice>span{height:4px;width:4px;border-radius:50%;background:#b7b7a4}.projects-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px 28px}.project-card[hidden]{display:none}.project-cover{display:block;position:relative;overflow:hidden;border-radius:3px;isolation:isolate}.art{width:100%;aspect-ratio:1.4;position:relative;overflow:hidden;transition:transform .65s cubic-bezier(.22,1,.36,1);container-type:inline-size}.project-cover:hover .art{transform:scale(1.025)}.cover-open{position:absolute;right:18px;top:18px;width:32px;height:32px;border-radius:50%;background:#f7f7f2ed;display:grid;place-items:center;font-size:19px;opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s;box-shadow:0 1px 10px #00000008}.project-cover:hover .cover-open,.project-cover:focus-visible .cover-open{opacity:1;transform:translateY(0)}.project-meta{display:flex;justify-content:space-between;margin-top:20px;font-size:9px;color:#7c7c70}.meta-divider{color:#b5b5a8;margin:0 7px}.project-number{font-family:var(--mono);font-size:10px;color:#9d9d90}.project-title{display:flex;align-items:center;justify-content:space-between;margin:9px 0 5px}.project-title h3{font-family:var(--sans);font-size:24px;letter-spacing:-.8px;font-weight:550;margin:0}.project-title>span{font-size:24px;line-height:1;transition:transform .2s;font-weight:400}.project-title:hover>span{transform:translate(3px,-3px);color:var(--accent)}.project-subtitle{font-size:11px;color:#7f7f72;margin:7px 0 15px;letter-spacing:.2px}.project-tags{display:flex;gap:7px;flex-wrap:wrap}.project-tags>span{font-size:8px;padding:4px 7px;border:1px solid #e1e1d8;border-radius:3px;color:#868678}.work-end{margin-top:45px;border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between;color:#929284;font-size:9px;letter-spacing:.7px}.work-end>span:first-child{font-size:8px;letter-spacing:1.2px}.work-end i{font-style:normal;font-size:15px;color:var(--accent);margin-left:8px}.about-section{display:grid;grid-template-columns:1fr 2fr;gap:50px;padding:64px 0 70px;margin-top:74px;border-top:1px solid var(--line)}.about-label{display:flex;align-items:flex-start;gap:16px}.about-label>.section-number{margin-top:6px}.about-label h2{font-size:20px}.about-statement{font-size:34px;letter-spacing:-1px;font-weight:500;margin:0 0 22px}.about-statement>span{color:#8d8e7e}.about-description{max-width:600px;font-size:12px;line-height:2.15;color:#7a7b6f;letter-spacing:.3px;margin:0}.about-bottom{margin-top:27px;display:flex;justify-content:space-between;align-items:center;gap:20px}.about-tags{display:flex;gap:16px;font-size:9px;color:#7b7d6d}.about-tags>span:before{content:'+';margin-right:5px;color:#a5a593}.about-signoff{font-family:Georgia,serif;font-style:italic;font-size:13px;color:#7d7e6f}.contact-link{font-size:11px;color:var(--accent)}.site-footer{border-top:1px solid var(--line);min-height:109px;display:flex;align-items:center;justify-content:space-between;gap:25px}.footer-brand{font-size:14px;font-weight:550;letter-spacing:1px}.footer-brand>span{font-size:9px;font-weight:400;letter-spacing:.5px;color:#979788;margin-left:23px}.copyright{font-size:9px;color:#979788}.back-top{font-size:10px;display:flex;gap:30px;align-items:center}.back-top>span{font-size:18px}.empty-state{text-align:center;padding:70px 15px}.empty-state[hidden]{display:none}.empty-state>span{font-size:48px;color:var(--accent)}.empty-state h3{font-size:20px;font-weight:500}.empty-state p{font-size:12px;color:var(--muted)}.empty-state button{margin-top:12px;background:var(--ink);color:var(--paper);border:0;padding:12px 20px;border-radius:3px;font-size:12px}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:20px;z-index:10;background:var(--ink);color:white;padding:14px}.skip-link:focus{top:10px}
/* Each cover is composed in HTML/SVG, so it remains crisp at every size. */
.art-coordinate{position:absolute;top:6.5%;left:6%;font-family:var(--mono);font-size:1.15cqw;letter-spacing:1px;opacity:.6}.art-bottom{position:absolute;bottom:5.5%;left:6%;font-family:Georgia,serif;font-size:1.65cqw;font-style:italic;opacity:.7}.cover-index{position:absolute;bottom:5.5%;right:6%;font-family:var(--mono);font-size:1.1cqw;opacity:.55;letter-spacing:1px}.art-orbit{background:#dce1d2;color:#4b5746}.music-app{position:absolute;width:79%;height:69%;left:10.5%;top:17%;display:flex;border-radius:5px;background:#f7f8f0;box-shadow:0 15px 35px #3d503522,0 2px 6px #3d50350a;overflow:hidden;transform:rotate(-3deg)}.music-sidebar{width:27%;background:#ebeee3;padding:7% 4% 3%;font-family:var(--mono);position:relative}.music-sidebar>b{font-size:3cqw;letter-spacing:-1px;display:block;margin-bottom:24%}.music-sidebar>b>span{font-size:1.1cqw;vertical-align:top;margin-left:2px}.music-nav{display:flex;gap:8%;padding:8% 0;font-size:1.2cqw;color:#89907c;white-space:nowrap}.music-nav.active{color:#445340}.music-sidebar small{display:block;font-size:.75cqw;letter-spacing:.5px;margin:30% 0 6%;white-space:nowrap;color:#9b9f90}.sidebar-bottom{position:absolute;bottom:8%;font-size:1.05cqw;color:#9b9f90;white-space:nowrap}.music-content{padding:4% 6% 2%;width:73%;position:relative}.music-top{font-size:.8cqw;color:#9a9f90;letter-spacing:.8px;display:flex;justify-content:space-between}.music-top>span{font-size:1.5cqw;line-height:.8}.music-greeting{font-family:Georgia,serif;font-size:3.2cqw;line-height:1.08;letter-spacing:-.5px;margin-top:6%}.record-scene{position:relative;width:75%;height:32%;margin:4% auto 3%}.album{position:absolute;z-index:2;background:#566849;width:55%;height:100%;box-shadow:2px 0 8px #17231728;padding:7%;color:#eeebdb;overflow:hidden}.album>span{font-family:var(--mono);font-size:1.35cqw;font-weight:500;line-height:1.2;display:block;position:relative;z-index:2;letter-spacing:1px}.album small{position:absolute;bottom:7%;font-size:.45cqw;letter-spacing:.7px}.album-sun{position:absolute;bottom:-10%;right:-18%;width:90%;height:95%;border-radius:50%;background:linear-gradient(130deg,#cac1a2,#828a68 65%,#647353);opacity:.85}.vinyl{position:absolute;left:26%;top:1%;height:98%;aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,#252c23 0 1px,#343c2e 2px 3px);box-shadow:2px 2px 5px #0002;display:grid;place-items:center}.vinyl i{height:32%;aspect-ratio:1;background:#c5b68d;border-radius:50%;display:grid;place-items:center}.vinyl i:after{content:'';width:12%;height:12%;background:#283021;border-radius:50%}.song-title{font-size:1.5cqw;font-weight:500;display:flex;justify-content:space-between}.song-title>span{font-size:2cqw;font-weight:400}.song-artist{font-size:.85cqw;color:#969c89;margin-top:2%}.player-progress{height:2px;background:#dce0d2;margin-top:5%}.player-progress>i{display:block;width:36%;height:100%;background:#66765a}.player-controls{display:flex;align-items:center;justify-content:space-between;width:62%;margin:4% auto 0;font-size:1.3cqw}.player-controls>b{width:3.4cqw;height:3.4cqw;background:#5c6e4e;border-radius:50%;display:grid;place-items:center;color:#f7f8f0;font-size:1.4cqw;line-height:1}.art-flow{background:#eedad0;color:#856e60}.flow-app{position:absolute;left:7%;top:19%;width:86%;height:67%;background:#fbf9f5;box-shadow:0 18px 28px #97644914,0 2px 4px #9764490a;border-radius:5px;transform:rotate(2deg);overflow:hidden}.flow-toolbar{height:13%;border-bottom:1px solid #e9e5df;display:flex;align-items:center;padding:0 4%;gap:8%;background:#fffdf8;font-family:var(--mono);white-space:nowrap}.flow-toolbar>b{font-size:2.1cqw;letter-spacing:-.6px;display:flex;gap:5px;align-items:center;color:#55564e}.flow-toolbar>b>i{font-size:2.1cqw;color:#dc926d;font-style:normal}.flow-toolbar>span{font-size:.9cqw;color:#a4a398}.flow-toolbar em{font-style:normal;margin:0 5px;color:#c6c3ba}.flow-toolbar small{font-size:.8cqw;color:#9a9e8f;margin-left:auto}.flow-toolbar small i{width:3px;height:3px;display:inline-block;border-radius:50%;background:#93a47b;margin-right:3px}.flow-canvas{height:87%;position:relative;background-image:radial-gradient(#c7c6bd85 .7px,transparent .7px);background-size:9px 9px}.flow-canvas-label{position:absolute;left:5%;top:7%;font-size:1.6cqw;font-weight:500;color:#65675d}.flow-canvas-label span{display:block;font-size:.8cqw;font-weight:400;color:#a3a598;margin-top:5%}.connections{position:absolute;left:0;top:0;width:100%;height:100%;fill:none;stroke:#c6b49f;stroke-width:1.4}.flow-node{position:absolute;width:24%;height:25%;padding:3%;background:#fffffbed;border:1px solid #e2dfd4;border-radius:4px;box-shadow:0 3px 5px #75634e08;color:#65665b}.flow-node>b{font-size:1.15cqw;display:block;white-space:nowrap;margin-top:5%;font-weight:500}.flow-node>small{font-size:.65cqw;display:block;color:#aaa99c;white-space:nowrap;margin-top:4%}.node-icon{height:1.8cqw;width:1.8cqw;display:grid;place-items:center;font-size:1.2cqw;color:#b18760;background:#f2e5d5;border-radius:2px}.flow-node>i{width:4px;height:4px;border-radius:50%;position:absolute;right:-3px;top:50%;border:1px solid #bfae98;background:#fff}.node-one{left:3%;top:37%}.node-two{left:40%;top:18%}.node-three{left:40%;top:64%}.node-four{left:75%;top:41%;width:23%}.node-two .node-icon{background:#ecdfd5;color:#ac815e}.node-three .node-icon{background:#e3e8db;color:#8e9a79}.node-four .node-icon{background:#dfe7d5;color:#879c70}.canvas-controls{position:absolute;bottom:5%;right:4%;padding:1.2% 2%;background:#fffdf8;border:1px solid #e6e1d6;border-radius:2px;font-size:1cqw;display:flex;gap:8px;color:#9a9a8f}.art-form{background:#292f2a;color:#d7d5c2}.art-form .art-coordinate{opacity:.5}.form-drawing{width:100%;height:100%;position:absolute;top:-2%;left:0}.form-title{position:absolute;left:6%;bottom:8%;font-family:Georgia,serif;font-size:6.5cqw;font-style:italic;line-height:1;letter-spacing:-1px}.form-title>span{display:block;font-family:var(--sans);font-size:1.1cqw;letter-spacing:1px;font-style:normal;opacity:.6;margin-top:10%}.art-form .cover-index{bottom:8%}.art-margin{background:#e3dfeb;color:#797185}.note-window{position:absolute;left:9%;top:17%;width:82%;height:70%;background:#fbfaf6;box-shadow:0 15px 25px #6e5f761a;display:flex;overflow:hidden;border-radius:3px;transform:rotate(-2deg)}.note-sidebar{position:relative;padding:5% 3.5%;width:31%;background:#f0edf2;font-family:var(--mono)}.note-sidebar>b{font-family:Georgia,serif;font-size:3.5cqw;line-height:1;letter-spacing:-1px;color:#5b5265}.note-sidebar>b>span{font-size:1.7cqw;letter-spacing:-.5px}.note-sidebar>small{display:block;font-size:.7cqw;letter-spacing:.8px;color:#b0a7b4;margin:20% 0 9%}.note-sidebar>span{display:block;white-space:nowrap;font-size:.95cqw;padding:7% 0;color:#9b92a2}.note-sidebar>span i{font-size:.7cqw;float:right;font-style:normal}.note-sidebar>span.selected{color:#75687d}.note-new{position:absolute;bottom:7%;font-size:1.1cqw;color:#8a7d91}.note-page{width:69%;padding:6% 7%;color:#665f67}.note-date{display:flex;justify-content:space-between;color:#b5acae;font-family:var(--mono);font-size:.75cqw;letter-spacing:.8px;white-space:nowrap}.note-date>span{font-size:1.8cqw;line-height:.5}.note-page h3{font-family:Georgia,serif;font-weight:400;font-size:4cqw;line-height:1.12;letter-spacing:-.7px;margin:10% 0 9%}.note-page>p{font-family:Georgia,serif;font-size:1.35cqw;line-height:1.8;color:#a29a9f;margin:0}.note-rule{height:1px;background:#e8e1e2;margin:9% 0}.note-page>p.note-chinese{font-family:var(--sans);font-size:1cqw;line-height:1.9;color:#a89fa5}.note-tag{font-family:var(--mono);font-size:.85cqw;color:#a79bac;margin-top:9%}
/* Project pages */
.project-detail{padding-top:38px}.detail-back{font-size:11px;color:var(--muted);display:inline-block}.detail-back:hover{color:var(--accent)}.detail-heading{display:flex;justify-content:space-between;align-items:flex-end;padding:52px 0 38px}.detail-eyebrow{font-size:10px;color:var(--muted)}.detail-eyebrow>span{margin:0 10px}.detail-heading h1{font-size:76px;font-weight:500;letter-spacing:-4px;margin:12px 0}.detail-subtitle{font-size:15px;color:var(--muted);margin-bottom:0}.detail-number{font-size:80px;font-weight:400;color:#deded3;letter-spacing:-4px}.detail-cover{border-radius:4px;overflow:hidden}.detail-cover>.art{aspect-ratio:1.8}.detail-cover .art-coordinate{font-size:.8cqw}.detail-cover .art-bottom{font-size:1.2cqw}.detail-cover .cover-index{font-size:.8cqw}.detail-cover .music-app{width:62%;left:19%;height:74%;top:14%}.detail-cover .flow-app{width:72%;left:14%;height:74%;top:14%}.detail-cover .note-window{width:66%;left:17%;height:76%;top:13%}.detail-cover .music-greeting{font-size:2.8cqw}.detail-cover .note-page h3{font-size:3.2cqw}.detail-cover .note-sidebar>b{font-size:2.8cqw}.detail-cover .note-page>p{font-size:1.1cqw}.detail-cover .flow-node>b{font-size:1cqw}.detail-cover .flow-node>small{font-size:.6cqw}.detail-cover .form-drawing{height:105%;top:-10%}.detail-body{display:grid;grid-template-columns:1fr 2fr;gap:60px;padding:60px 0 70px}.detail-tags{margin:20px 0 25px;display:flex;flex-wrap:wrap;gap:7px;max-width:240px}.detail-tags span{font-size:10px;border:1px solid var(--line);padding:5px 8px;border-radius:3px;color:var(--muted)}.detail-external{font-size:12px;display:block;margin-top:15px}.detail-body h2{font-size:20px;font-weight:500;margin:0 0 20px}.detail-body h2:not(:first-child){margin-top:38px}.detail-body p,.detail-body li{font-size:13px;line-height:2.1;color:#77796d}.detail-body ul{padding-left:18px}.detail-body .detail-demo{font-size:11px;padding:18px;border-left:2px solid #c9c9b9;background:#efefe7;margin-top:32px}.detail-next{border-top:1px solid var(--line);padding:28px 0 50px;display:flex;align-items:center;font-size:26px;gap:25px}.detail-next>span:first-child{font-size:10px;color:var(--muted);margin-right:auto}.detail-next>span:last-child{color:var(--accent);font-size:34px}.not-found{padding-top:90px;padding-bottom:100px}.not-found h1{font-size:clamp(36px,5vw,70px);font-weight:550;letter-spacing:-2px;line-height:1.4}
@media(min-width:1600px){.hero h1{font-size:88px}.hero-main{padding-top:42px;padding-bottom:60px}.hero-aside{width:310px}.hero-aside p{font-size:38px}.asterisk{width:135px;height:135px}.hero-description{font-size:14px}.work-section{padding-top:80px}}
@media(max-width:1000px){.wrap{width:calc(100% - 64px)}.site-header{height:94px}.header-note{font-size:9px}.site-header nav{margin-left:0;gap:24px}.hero{padding-top:48px}.hero h1{font-size:64px}.hero-aside{width:200px}.hero-aside p{font-size:29px}.asterisk{width:102px;height:102px}.hero-description{font-size:11px}.projects-grid{gap:40px 22px}.about-section{gap:30px;grid-template-columns:1fr 2fr}.about-statement{font-size:29px}.about-bottom{flex-wrap:wrap;gap:16px}.footer-brand>span{display:none}}
@media(max-width:680px){.wrap{width:calc(100% - 40px)}.site-header{height:84px}.brand-mark{width:25px;height:25px}.brand{gap:9px}.brand>span{font-size:18px}.brand-en{font-size:7px}.header-note{display:none}.site-header nav{gap:22px;font-size:11px}.hero{padding-top:36px}.hero-kicker{font-size:8px;gap:8px;letter-spacing:.7px}.tiny-cross{font-size:17px}.hero-main{padding-top:28px;padding-bottom:34px;gap:10px}.hero h1{font-size:clamp(45px,10.5vw,66px);letter-spacing:-2px;line-height:1.35}.hero-description{font-size:10px;line-height:2.1;margin-top:19px}.hero-link{font-size:10px;margin-top:23px;gap:26px}.hero-aside{width:94px;flex-shrink:0;padding-top:9px;align-items:flex-end}.asterisk{width:70px;height:70px;margin-bottom:25px}.hero-aside p{font-size:18px;letter-spacing:-.5px;line-height:1.2;text-align:right;margin-bottom:15px}.hero-aside>span{font-size:5px;letter-spacing:.5px;text-align:right;line-height:1.9}.hero-bottom{font-size:8px;padding:14px 0;letter-spacing:.3px}.hero-bottom>span:last-child{font-size:6px;letter-spacing:.7px}.hero-bottom i{margin:0 3px}.work-section{padding-top:44px}.section-title{gap:10px}.section-title h2{font-size:22px}.section-title h2>span{font-size:9px}.section-number{font-size:8px}.section-title>.section-number{margin-top:7px}.project-count{font-size:9px;margin-left:-1px}.section-heading>p{font-size:9px}.work-toolbar{margin-top:24px;gap:10px;align-items:center;padding-bottom:12px}.filters{gap:2px;flex-wrap:nowrap}.filter{font-size:9px;padding:7px 9px}.filter>span{display:none}.search-box{max-width:93px;gap:4px}.search-box input{width:68px;font-size:9px}.search-box svg{width:13px}.demo-notice{font-size:8px;margin-top:12px;margin-bottom:16px}.projects-grid{grid-template-columns:1fr;gap:34px}.project-meta{margin-top:16px;font-size:9px}.project-title h3{font-size:24px}.project-subtitle{font-size:11px;margin-bottom:12px}.project-tags>span{font-size:8px}.cover-open{opacity:1;width:27px;height:27px;right:12px;top:12px;font-size:17px}.art-coordinate{font-size:1.25cqw}.art-bottom{font-size:1.9cqw}.cover-index{font-size:1.3cqw}.work-end{margin-top:30px;font-size:8px}.work-end>span:first-child{font-size:7px}.about-section{grid-template-columns:1fr;margin-top:45px;padding:32px 0 40px;gap:27px}.about-label{gap:10px}.about-label h2{font-size:20px}.about-label h2>span{font-size:9px}.about-statement{font-size:29px;margin-bottom:16px}.about-description{font-size:11px;line-height:2.1}.about-bottom{margin-top:23px}.about-tags{font-size:9px;gap:13px}.about-signoff{font-size:12px}.site-footer{min-height:90px;gap:10px;flex-wrap:wrap}.footer-brand{font-size:13px}.copyright{font-size:8px}.back-top{font-size:9px;gap:10px}.back-top>span{font-size:16px}.project-detail{padding-top:25px}.detail-heading{padding-top:35px;gap:15px}.detail-heading h1{font-size:53px;letter-spacing:-2px}.detail-subtitle{font-size:12px}.detail-number{font-size:56px}.detail-cover>.art{aspect-ratio:1.25}.detail-cover .music-app{width:84%;left:8%;height:62%;top:19%}.detail-cover .music-greeting{font-size:3.5cqw}.detail-cover .note-window{width:86%;left:7%;height:65%;top:17%}.detail-cover .note-page h3{font-size:4cqw}.detail-cover .note-sidebar>b{font-size:3.5cqw}.detail-cover .note-page>p{font-size:1.35cqw}.detail-cover .flow-app{width:88%;left:6%;height:62%;top:19%}.detail-cover .flow-node>b{font-size:1.15cqw}.detail-cover .flow-node>small{font-size:.65cqw}.detail-cover .art-coordinate{font-size:1.15cqw}.detail-cover .art-bottom{font-size:1.8cqw}.detail-cover .cover-index{font-size:1.2cqw}.detail-body{grid-template-columns:1fr;padding:30px 0 40px;gap:20px}.detail-tags{max-width:none;margin-top:12px;margin-bottom:0}.detail-body h2{font-size:18px;margin-bottom:12px}.detail-body p,.detail-body li{font-size:12px}.detail-next{font-size:21px;padding-bottom:35px;gap:15px}.detail-next>span:last-child{font-size:27px}}
@media(max-width:370px){.wrap{width:calc(100% - 32px)}.hero-aside{width:70px}.hero-aside p{font-size:16px}.asterisk{width:56px;height:56px}.hero h1{font-size:43px}.hero-description{font-size:9px}.filter{padding-inline:7px}.search-box{max-width:75px}.search-box input{width:53px}.section-heading>p{font-size:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

.cover-image{display:block;width:100%;height:auto;aspect-ratio:1.4;object-fit:cover;transition:transform .65s cubic-bezier(.22,1,.36,1)}.project-cover:hover .cover-image{transform:scale(1.025)}.detail-cover>.cover-image{aspect-ratio:1.8}@media(max-width:680px){.detail-cover>.cover-image{aspect-ratio:1.25}}