@font-face{font-family:"Polo Hanken";src:url("fonts/HankenGrotesk-400.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Polo Hanken";src:url("fonts/HankenGrotesk-500.woff2") format("woff2");font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:"Polo Hanken";src:url("fonts/HankenGrotesk-600.woff2") format("woff2");font-style:normal;font-weight:600;font-display:swap}
:root{font-family:"Polo Hanken","Helvetica Neue",Arial,"PingFang TC","Microsoft JhengHei",sans-serif;color:#2c2c2c;background:#f3f3f3;font-synthesis:none;font-weight:400;font-size:14px;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body,h1,h2,p,ul,figure{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}a:hover,button:hover{color:#8f8f8f}a:focus-visible,button:focus-visible{outline:1px solid currentColor;outline-offset:5px}h1,h2{font-size:inherit;font-weight:500}ul{padding:0;list-style:none}[hidden]{display:none!important}.header{position:fixed;top:0;left:0;right:0;padding:24px 69px 0 30px;display:flex;justify-content:space-between;align-items:flex-start;z-index:10;pointer-events:none}.header a,.header button{pointer-events:auto}.name{font-size:18px;font-weight:600;line-height:21px;letter-spacing:-.35px}.header nav{display:grid;grid-template-rows:repeat(3,20px);grid-auto-flow:column;gap:4px 58px;font-size:14px;font-weight:600;line-height:20px;margin-top:-4px}.header nav a[aria-current]{color:#8f8f8f}.menu-toggle{display:none}body[data-page=index]{overflow:hidden}.home{height:100svh}.home-image,.work-preview{position:fixed;inset:0;pointer-events:none}.home-image picture,.work-preview picture{display:block;width:100%;height:100%}.home-image img,.work-preview img{width:100%;height:100%;object-fit:cover}.home-image::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgb(0 0 0 / .22))}body[data-page=index] .header{color:#fff;min-height:115px;background:linear-gradient(rgb(0 0 0 / .4),transparent)}.home-directory{position:fixed;bottom:30px;left:30px;right:30px;color:#fff;font-size:14px;line-height:22px;z-index:2}.home-directory a{display:inline-block}.home-directory a:hover{color:#ffffffa6}.home-directory .more{margin-top:20px;font-size:13px;text-decoration:underline;text-underline-offset:2px}.works{padding:196px 0 50px;min-height:100svh}.works-heading{display:flex;align-items:center;gap:18px;padding-left:30px;position:relative;z-index:2}.works-heading h1,.view-toggle{font-size:14px;font-weight:600;line-height:21px}.view-toggle button[aria-pressed=true]{text-decoration:line-through;pointer-events:none}.filters{display:flex;gap:30px;margin-top:23px;margin-left:50px;position:relative;z-index:2;font-size:13px;line-height:18.2px}.filters>div{display:flex;flex-direction:column}.filters a[aria-current]{color:#8f8f8f}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(121px,1fr));gap:10.5px 4px;margin:45px 4px 0;position:relative;z-index:2}.work-card{display:block;min-width:0}.work-card img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}.work-card h2{font-size:10px;line-height:13px;font-weight:400;height:40px;margin-top:10px;opacity:0;transition:opacity .2s}.work-card:hover h2,.work-card:focus-visible h2{opacity:1}.work-preview{opacity:0}.list{margin:45px 30px 0;position:relative;z-index:2}.list .work-card{width:fit-content;font-size:14px;line-height:22px}.list .work-card picture{display:none}.list .work-card h2{opacity:1;font-size:14px;line-height:22px;height:auto;margin:0}.previewing .work-preview{opacity:1}.previewing .works-heading,.previewing .filters,.previewing .list,.previewing .header{color:#fff}.previewing .header{mix-blend-mode:difference}.project{height:100svh;display:grid;grid-template-rows:72px minmax(0,1fr) 123px}.project-header{display:flex;justify-content:space-between;padding:24px 32px 0 30px;font-size:13px;align-items:flex-start}.project-header>div{display:flex;gap:17px}.project-stage{touch-action:pan-y;width:min(1190px,100%);min-height:0;margin:0 auto;position:relative;display:flex;align-items:center;justify-content:center}#project-image{width:100%;height:100%}#project-image picture{display:block;width:100%;height:100%}#project-image img{display:block;width:100%;height:100%;object-fit:contain}.image-navigation{position:absolute;top:0;bottom:0;width:50%;z-index:1;touch-action:pan-y}.image-back{left:0;cursor:w-resize}.image-next{right:0;cursor:e-resize}.project-footer{display:flex;justify-content:space-between;align-items:flex-end;padding:21px 30px 25px;font-size:13px;line-height:19.5px}.project-footer h1{font-size:13px;font-weight:400}.project-footer #detail-open{font-size:13px;text-decoration:underline;text-underline-offset:2px}.project-footer #count{white-space:nowrap}.text-page{padding:196px 30px 80px;max-width:860px;font-size:13px;line-height:1.9}.text-page h1,.text-page h2{font-size:13px;font-weight:500;line-height:1.9}.text-page p+p{margin-top:12px}.text-page section+section{margin-top:45px}.text-page h1+p{margin-top:20px}.text-page section h2+p{margin-top:12px}.about section{max-width:506px}.about .social-text{display:flex;flex-direction:column;align-items:flex-start}.contact h1{margin-bottom:36px}.contact .email{display:inline-block;margin-top:12px}.contact footer{margin-top:100px;font-size:11px}dialog{border:0;padding:60px 30px;margin:0;max-width:none;max-height:none;width:100%;height:100dvh;background:#f3f3f3;color:#2c2c2c}dialog::backdrop{background:#f3f3f3}dialog[open]{display:grid;place-items:center}#detail-close{position:absolute;top:24px;right:30px;font-size:13px}.detail-text{width:min(506px,100%);font-size:13px;line-height:1.9}.detail-text p{margin-top:20px}.detail-text a{display:inline-block;margin-top:40px;color:#8f8f8f;text-decoration:underline}body:has(dialog[open]){overflow:hidden}@media(max-width:834px){.header{padding:10px 15px 0;align-items:baseline}.name{font-size:18px;line-height:27px}.menu-toggle{display:block;font-size:15px;line-height:27px;font-weight:600}.header nav{display:none}.header.menu-open{height:100dvh;background:#f3f3f3;color:#2c2c2c!important;mix-blend-mode:normal!important}.header.menu-open nav{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0;position:absolute;inset:52px 0 60px;margin:0;pointer-events:auto}.header.menu-open nav a{font-size:25px;font-weight:500;line-height:42px}.menu-open .name,.menu-open .menu-toggle{position:relative;z-index:2}body:has(.menu-open){overflow:hidden}.home-directory{left:15px;right:15px;bottom:max(24px,env(safe-area-inset-bottom));font-size:13px;line-height:21px}.home-directory .more{margin-top:15px}.works{padding-top:157px}.works-heading{padding-left:15px;gap:17px}.works-heading h1,.view-toggle{font-size:15px}.filters{margin:19px 15px 0 28px;gap:30px}.grid{margin:31px 15px 0;grid-template-columns:repeat(auto-fill,minmax(116px,1fr));gap:30px 4px}.work-card h2{opacity:1;height:auto;min-height:26px;margin-top:7px;font-size:10px;line-height:13px}.list{margin:31px 15px 0}.list .work-card{padding:4px 0}.project{grid-template-rows:52px minmax(0,1fr) 88px}.project-header{padding:17px 15px 0}.project-header>div{gap:16px}.project-footer{padding:18px 15px max(15px,env(safe-area-inset-bottom));font-size:12px;line-height:18px}.project-footer h1,.project-footer #detail-open{font-size:12px}.project-stage{touch-action:pan-y;width:100%}.text-page{padding:157px 15px 60px;font-size:13px}.text-page section{max-width:506px}.text-page section+section{margin-top:36px}.contact footer{margin-top:70px}#detail-close{top:17px;right:15px;min-height:30px}dialog{padding:70px 30px}.detail-text{font-size:13px}.home-image img{object-position:62% 50%}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
