@font-face{font-family:MiSans;src:url(/fonts/MiSans-Regular.woff2)format("woff2");font-weight:400;font-display:swap}@font-face{font-family:Dela Gothic One;src:url(/fonts/DelaGothicOne-Regular.woff2)format("woff2");font-weight:400;font-display:swap}:root{--accent:#e62f6e;--ink:#3d3d3d;--nav:#8c8c8c;--paper:#f3efe4;--page:#191919;--font-main:"MiSans", "Microsoft YaHei", "PingFang SC", sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{width:100%;min-width:320px;min-height:100%;margin:0;overflow:hidden}body{color:var(--nav);background:var(--page);font-family:var(--font-main)}a{color:inherit;text-decoration:none}button{color:inherit;font:inherit;background:0 0;border:0;padding:0}.site-loader{z-index:1000;background-color:var(--paper);opacity:1;visibility:visible;background-image:url(/paper.webp.webp);background-position:50%;background-size:cover;place-items:center;transition:opacity .42s,visibility 0s linear .42s;display:grid;position:fixed;inset:0}html.is-dark-first-frame .site-loader{background-color:var(--page);background-image:none}html.is-dark-first-frame .loader-word{color:#ededed}.site-loader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.loader-content{place-items:center;gap:12px;display:grid}.loader-animation{width:clamp(160px,30vw,320px);position:relative}.loader-animation img{width:100%;height:auto;display:block}.loader-last-frame{opacity:0;position:absolute;inset:0}.loader-animation.is-holding .loader-gif{opacity:0}.loader-animation.is-holding .loader-last-frame{opacity:1}.loader-word{color:var(--ink);font-family:"Dela Gothic One", var(--font-main);letter-spacing:.14em;margin:0;font-size:clamp(13px,1.4vw,18px);font-weight:400;line-height:1}.loader-word span{animation:.9s ease-in-out infinite loading-letter;animation-delay:calc(var(--letter-index) * .105s);display:inline-block}@keyframes loading-letter{0%,30%,to{transform:translateY(0)}15%{transform:translateY(-8px)}}.header{z-index:30;width:100%;color:var(--nav);justify-content:space-between;align-items:center;padding:16px 24px 0;font-size:12px;font-weight:500;line-height:1;display:flex;position:fixed;top:0;left:0}.nav{align-items:center;gap:65px;display:flex}.nav-link,.language{cursor:pointer;white-space:nowrap;transition:color .16s}.nav-link:hover,.nav-link:focus-visible,.nav-link.active{color:var(--accent)}.nav-link:focus-visible,.language:focus-visible,.work-stage:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.language-option{color:var(--nav);transition:color .12s}.language-option.active{color:var(--accent)}.header-tools{align-items:center;gap:16px;display:flex}.brand-mark{mix-blend-mode:screen;width:14px;height:22px;display:block;position:relative;overflow:hidden}.brand-mark img{width:35px;max-width:none;position:absolute;top:-2px;left:-10px}.detail-back{z-index:25;color:#9a9a9a;border:1px solid #ffffff2e;border-radius:999px;align-items:center;gap:7px;padding:7px 11px;font-size:12px;line-height:1;transition:color .18s,border-color .18s,transform .24s cubic-bezier(.22,1,.36,1);display:flex;position:fixed;top:56px;left:24px}.detail-back:hover,.detail-back:focus-visible{border-color:var(--accent);color:var(--accent);transform:translate(-3px)}.detail-back:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.animation-portfolio{width:100vw;height:100svh;min-height:560px;position:relative;overflow:hidden}.portfolio-menu{z-index:5;width:202px;animation:.7s cubic-bezier(.22,1,.36,1) both menu-enter;position:absolute;top:41%;left:2.1%}.portfolio-menu h1{color:var(--accent);font-family:"Dela Gothic One", var(--font-main);margin:0 0 11px;font-size:23px;font-weight:400;line-height:1}.category-list{gap:5px;display:grid}.category-link{isolation:isolate;color:#8b8b8b;grid-template-columns:56px 1fr;align-items:center;min-height:27px;padding:2px 6px;font-size:15.5px;font-weight:800;line-height:1;transition:color .26s;display:grid;position:relative}.category-link:before{content:"";z-index:-1;background:var(--accent);transform-origin:0;will-change:transform;transition:transform .46s cubic-bezier(.22,1,.36,1);position:absolute;inset:0;transform:scaleX(0)}.category-link>span{z-index:1;position:relative}.category-link:hover,.category-link:focus-visible,.category-link.active{color:#fff}.category-link.active{width:calc(100% + 18px)}.category-link.active:before{transform:scaleX(1)}.category-list:not(.is-switching) .category-link.active:hover:before,.category-link.active.is-collapsing:before,.category-link.active.is-entering:before{transform:scaleX(.018)}.category-link:focus-visible{outline-offset:2px;outline:2px solid #fff}.scroll-hint{z-index:4;color:#767676;white-space:nowrap;opacity:1;visibility:visible;width:max-content;margin:0;font-size:11px;font-weight:600;line-height:1;transition:opacity .32s,visibility 0s linear .32s;animation:2.4s ease-in-out infinite hint-pulse;position:absolute;top:47.5%;left:27.5%;transform:translateY(-50%)}.scroll-hint.is-hidden{opacity:0;visibility:hidden;animation:none}.work-stage{z-index:2;touch-action:pan-y;cursor:grab;outline:none;position:absolute;inset:11% 0 0;overflow:hidden}.work-stage.is-dragging{cursor:grabbing}.work-card{--tilt-x:0deg;--tilt-y:0deg;transform-origin:50%;will-change:transform, opacity;border-radius:10px;width:clamp(224px,17.6vw,286px);margin:0;animation:.76s cubic-bezier(.22,1,.36,1) both card-enter;position:absolute;top:0;left:0}.work-card:nth-child(2){animation-delay:80ms}.work-card:nth-child(3){animation-delay:.16s}.work-card:nth-child(4){animation-delay:.24s}.work-card:nth-child(5){animation-delay:.32s}.work-card:focus-visible{outline:2px solid var(--accent);outline-offset:6px}.work-card-inner{border-radius:inherit;width:100%;transform:perspective(560px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));transform-style:preserve-3d;will-change:transform;background:#fff;transition:transform .16s ease-out,filter .16s ease-out;display:block;position:relative;overflow:hidden;box-shadow:0 12px 34px #0000002e}.work-card:is(:hover,:focus-visible,.is-tilting) .work-card-inner{filter:drop-shadow(0 24px 20px #00000061);transform:perspective(560px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateY(-6px) scale(1.045)}.work-card img{-webkit-user-select:none;user-select:none;width:100%;height:auto;display:block}@keyframes menu-enter{0%{opacity:0;transform:translate(-18px)}}@keyframes card-enter{0%{opacity:0;filter:blur(8px)}}@keyframes hint-pulse{0%,to{opacity:.45}50%{opacity:1}}@media (width<=900px){.header{padding:22px 18px 0}.nav{gap:20px}.nav-link:nth-child(n+4){display:none}.detail-back{top:58px;left:18px}.portfolio-menu{width:min(170px,46vw);top:25%;left:18px}.portfolio-menu h1{font-size:18px}.category-link{grid-template-columns:42px 1fr;min-height:20px}.scroll-hint{width:max-content;top:43%;left:18px;transform:none}.work-stage{inset:48% 0 0}.work-card{border-radius:8px;width:clamp(210px,64vw,280px)}}@media (prefers-reduced-motion:reduce){.portfolio-menu,.scroll-hint,.work-card{animation:none}.work-card-inner{transition:none}}
