:root{--bg:#111;--fg:#fff;--muted:#a4a4a4;--line:#555;--accent:#f01316;--overlay:rgba(20,20,20,.94)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,'Helvetica Neue','PingFang SC',sans-serif}body.light{--bg:#ecece8;--fg:#151515;--muted:#666;--line:#b4b4b4;--overlay:rgba(235,235,231,.96)}button,a{color:inherit;-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{text-decoration:none}button{border:0;background:transparent}button:focus-visible,a:focus-visible{outline:2px solid #00f0ff;outline-offset:6px}[hidden]{display:none!important}header{position:fixed;inset:0 0 auto;height:135px;display:flex;align-items:center;justify-content:space-between;padding:0 3%;z-index:30;pointer-events:none}.wordmark{font-size:43px;letter-spacing:-8px;font-weight:300;width:98px;white-space:nowrap;pointer-events:auto}.wordmark span{display:inline-block;font-weight:200;margin:0 9px 0 6px}.square{height:43px;width:43px;border:2px solid currentColor;display:grid;place-items:center;font-size:30px;line-height:1;pointer-events:auto}.square:hover{background:var(--fg);color:var(--bg)}#headerLine{font-size:15px;max-width:73%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0 40px 0 auto}.menu-lines{width:15px;height:12px;border-top:2px solid;border-bottom:2px solid}.menu-open .menu-lines{width:19px;height:19px;border:0;position:relative}.menu-open .menu-lines:before,.menu-open .menu-lines:after{content:'';position:absolute;top:8px;left:0;width:19px;height:2px;background:currentColor;transform:rotate(45deg)}.menu-open .menu-lines:after{transform:rotate(-45deg)}.view{min-height:100svh}.showcase{position:relative;height:100svh;overflow:hidden;background:#050606;color:white;touch-action:pan-x}.scenes,.scene,.scene-image,.shade{position:absolute;inset:0}.scene{visibility:hidden;opacity:0;transition:opacity .85s,visibility .85s;overflow:hidden}.scene.active{visibility:visible;opacity:1}.scene-image{width:100%;height:100%;object-fit:cover;transform:scale(1.06) translate(var(--mx,0px),var(--my,0px));transition:transform 1.3s ease}.scene.active .scene-image{animation:arrive 1.1s ease-out}.scene-type{position:absolute;left:28%;top:35%;font-size:clamp(60px,11vw,180px);letter-spacing:-.065em;font-weight:700;line-height:.93;max-width:65%;text-shadow:0 2px 40px #0003}.scene-type small{display:block;font-size:14px;letter-spacing:.04em;margin-top:25px;font-weight:400}.scene-0 .scene-image{filter:brightness(.85)}.scene-1{background:#161616}.scene-1 .scene-image{filter:brightness(.5);object-position:70% center}.scene-2 .scene-image{filter:brightness(.65)}.scene-3{background:#d8d8d2;color:#111}.scene-3 .scene-image{filter:brightness(.7);opacity:.35}.scene-4{background:#001519}.scene-4 .scene-image{filter:brightness(.5);object-position:right center}.shade{background:linear-gradient(180deg,#0005,transparent 35%,transparent 65%,#0007);pointer-events:none}.project-heading{position:absolute;top:163px;left:3%;max-width:275px;z-index:2}.project-heading h1{font-size:25px;line-height:1.08;font-weight:700;margin:0;letter-spacing:-.035em;white-space:pre-line}.badge{background:var(--accent);color:#fff;border-radius:60px;display:inline-flex;align-items:center;justify-content:center;font-weight:bold;line-height:1;font-size:15px;padding:7px 11px}.project-heading>.badge{position:absolute;right:5px;top:58px;transform:translateX(40%)}.project-heading p{font-size:14px;margin:18px 0 24px;color:#c7c7c7}.text-link{font-size:14px;padding:0 0 7px;border-bottom:1px solid #aaa}.text-link span{margin-left:20px}.center-explore{position:absolute;top:58%;left:50%;transform:translate(-50%,-50%);border:1px solid #ffffff70;width:78px;height:78px;border-radius:50%;display:flex;gap:8px;align-items:center;justify-content:center;font-size:11px;letter-spacing:.05em;background:#0003;transition:.3s}.center-explore:hover{background:var(--accent);border-color:var(--accent);width:90px;height:90px}.showcase-caption{position:absolute;left:34%;bottom:90px;font-size:11px;letter-spacing:.04em;display:flex;gap:35px;color:#bababa}.pager{position:absolute;right:3%;bottom:50px;display:flex;gap:15px;align-items:center}.pager .square{height:38px;width:42px;font-family:Arial}.pager .square+ .square{border-top:0}.page-count{display:flex;align-items:center;flex-direction:column;gap:8px;font-size:12px}.count-line{width:1px;height:30px;background:#fff9}.scroll-hint{position:absolute;left:50%;bottom:32px;transform:translateX(-50%);font-size:10px;letter-spacing:.1em;color:#aaa}.scroll-hint span{margin-left:12px}.side-tab{position:fixed;right:0;top:42%;width:48px;height:170px;background:white;color:#111;z-index:15;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:14px 8px}.side-tab b{font-size:24px}.side-tab span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;font-weight:700}footer{position:fixed;bottom:34px;left:3%;z-index:16;font-size:12px;font-weight:600;pointer-events:none}footer a{pointer-events:auto}footer>div{display:flex;gap:15px}footer>div>span{display:none}footer p{margin:10px 0 0;font-size:11px}footer p span{color:var(--muted);margin-left:5px}body[data-view="home"] header,body[data-view="home"] footer{color:#fff}body[data-view="experience"] footer,body[data-view="about"] footer{position:relative;padding:30px 3%;left:auto;bottom:auto;background:var(--bg)}body[data-view="experience"] header,body[data-view="about"] header{background:var(--bg)}.archive{padding:145px 8.2% 40px 21%}.filters{position:fixed;left:3%;top:190px;z-index:5;display:flex;flex-direction:column;align-items:start;width:17%;max-height:calc(100dvh - 230px);overflow:auto;scrollbar-width:none}.filter{font-size:clamp(40px,6.5vw,108px);font-weight:700;line-height:1.1;letter-spacing:-.055em;color:transparent;-webkit-text-stroke:1px var(--fg);padding:0 0 10px;text-align:left;transition:color .25s}.filter[aria-pressed="true"],.filter:hover{color:var(--fg);-webkit-text-stroke:0}.filter small{font-size:11px;letter-spacing:0;display:none;color:var(--muted);-webkit-text-stroke:0}.filter[aria-pressed="true"] small{display:block;margin:4px 0 10px;font-weight:400}.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.tile{height:320px;position:relative;overflow:hidden;background:#242424;text-align:left;padding:0;color:white}.tile img{width:100%;height:100%;object-fit:cover;transition:transform .6s;display:block}.tile:hover img{transform:scale(1.07)}.tile-title{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:17px;font-size:clamp(25px,3vw,52px);line-height:1;letter-spacing:-.045em;font-weight:700;white-space:pre-line}.tile.red{background:#f21429}.tile.cyan{background:#00bed6;color:#072c32}.tile.silver{background:#deded6;color:#222}.tile.yellow{background:#ddea2b;color:#222}.tile.dark{background:#202020;color:#fff}.tile-caption{position:absolute;inset:auto 0 0;padding:35px 15px 16px;background:linear-gradient(transparent,#000b);color:#fff;transform:translateY(100%);transition:transform .3s;font-size:14px}.tile:hover .tile-caption,.tile:focus-visible .tile-caption{transform:translateY(0)}.tile .tile-num{position:absolute;top:12px;left:12px;font-size:10px;letter-spacing:.05em}.tile .badge{position:absolute;top:12px;right:12px;font-size:10px;padding:6px 9px}.archive-note{font-size:12px;color:var(--muted);margin:30px 0;line-height:1.6}.about{padding:180px 12% 70px}.about-kicker{font-size:14px}.about h1{font-size:clamp(65px,8.8vw,145px);line-height:1.03;letter-spacing:-.06em;margin:45px 0 65px}.about h1 em{font-style:normal;color:var(--accent)}.about-bottom{display:grid;grid-template-columns:1fr 1.4fr;gap:60px;border-top:1px solid var(--line);padding-top:30px}.about-bottom>p{font-size:23px;margin:0;line-height:1.4}.about-bottom>div p{font-size:16px;line-height:1.9;margin:0 0 18px;color:var(--muted)}dialog{color:var(--fg);border:0;max-width:none;max-height:none}dialog::backdrop{background:transparent}body:has(dialog[open]){overflow:hidden}#menu{position:fixed;inset:0;width:100%;height:100dvh;background:var(--overlay);padding:0;backdrop-filter:blur(8px);overflow:auto}body.menu-open header{color:var(--fg);z-index:40}body.menu-open #headerLine{opacity:0}.menu-content{display:grid;grid-template-columns:1.7fr 1fr;gap:65px;width:min(1080px,74%);margin:24vh auto 130px}.menu-content nav{display:flex;flex-direction:column;align-items:flex-start}.menu-content nav a{font-size:clamp(48px,6.8vw,108px);font-weight:700;line-height:1.35;letter-spacing:-.045em;position:relative}.menu-content nav a:hover{color:var(--muted)}.menu-content nav .badge{font-size:.38em;position:absolute;right:-45px;top:0;padding:13px 20px}.menu-content aside{padding-top:12px}.menu-content h2{font-size:22px;margin:0 0 22px}.direction-link{display:block;width:100%;text-align:left;border-top:1px solid var(--line);padding:15px 0;font-size:16px;font-weight:bold;line-height:1.3}.direction-link small{display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:5px}.direction-link:hover{color:var(--accent)}.theme-toggle{position:absolute;bottom:40px;right:3%;display:flex;align-items:center;gap:15px;font-size:14px;font-weight:600}.theme-toggle span{font-size:34px}#case{position:fixed;inset:0;width:100%;height:100dvh;margin:0;overflow:auto;background:var(--bg);padding:0 6% 70px}.case-toolbar{height:125px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:var(--bg);z-index:3;font-size:13px}.case-title{font-size:clamp(42px,6vw,90px);line-height:1.03;letter-spacing:-.045em;max-width:1000px;margin:55px 0 25px}.case-subtitle{font-size:23px;margin-bottom:25px}.placeholder{font-size:12px;color:var(--muted);border:1px solid var(--line);padding:8px 12px;display:inline-block}.case-cover{width:100%;height:50vh;object-fit:cover;margin:40px 0 20px;display:block}.case-intro{font-size:22px;line-height:1.6;max-width:800px;margin:40px 0}.case-story{display:grid;grid-template-columns:1fr 2fr;gap:50px;border-top:1px solid var(--line);padding:40px 0}.case-story h3{font-size:14px;margin:0;font-weight:400;line-height:1.7}.case-story p{font-size:19px;line-height:1.8;margin:0;color:var(--muted)}.next-case{width:100%;text-align:right;border-top:1px solid var(--line);padding:35px 0;font-size:22px}.next-case:hover{color:var(--accent)}@keyframes arrive{from{transform:scale(1.12)}to{transform:scale(1.06)}}@media(min-width:1800px){.gallery{grid-template-columns:repeat(5,minmax(0,1fr))}.tile{height:390px}}@media(max-width:1000px){.gallery{grid-template-columns:repeat(3,minmax(0,1fr))}.tile{height:280px}.showcase-caption{display:none}.menu-content{width:82%;gap:55px}.menu-content nav a{font-size:7vw}.project-heading{max-width:230px}.project-heading h1{font-size:23px}}@media(max-width:640px){header{height:90px;padding:0 6%}.wordmark{font-size:34px;width:80px}.square{width:36px;height:36px}.menu-lines{width:13px;height:10px}#headerLine{font-size:11px;max-width:40%;margin:0 15px 0 auto}.project-heading{top:123px;left:6%;max-width:225px}.project-heading h1{font-size:23px}.project-heading p{font-size:12px}.project-heading>.badge{right:0;top:35px}.project-heading .text-link{font-size:12px}.scene-type{left:9%;top:44%;font-size:18vw;max-width:85%}.scene-type small{font-size:11px;max-width:230px;line-height:1.6}.center-explore{top:68%;height:62px;width:62px;font-size:10px}.pager{right:6%;bottom:27px;gap:10px}.pager .square{width:34px;height:34px}.side-tab{width:33px;height:133px;padding:10px 5px;top:46%}.side-tab b{font-size:20px}.side-tab span{font-size:10px}footer{bottom:28px;left:6%;max-width:65%;font-size:11px}footer>div{gap:12px}footer p{font-size:10px;line-height:1.6}footer p span{display:block;margin:0}.scroll-hint{display:none}.archive{padding:175px 11% 20px 6%}.filters{position:fixed;top:90px;left:0;width:100%;max-height:none;background:var(--bg);flex-direction:row;gap:23px;align-items:start;padding:12px 6%;z-index:20;overflow:auto}.filter{font-size:31px;white-space:nowrap;padding:0}.filter small,.filter[aria-pressed="true"] small{display:none}.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.tile{height:245px}.tile-title{font-size:30px;padding:13px}.tile-caption{transform:none;font-size:11px;padding:25px 10px 12px}.tile-num{display:none}.tile .badge{font-size:9px}.menu-content{display:block;margin:140px 7% 100px;width:auto}.menu-content nav a{font-size:53px;line-height:1.4}.menu-content nav .badge{right:-30px;padding:9px 12px}.menu-content aside{margin-top:40px}.menu-content h2{font-size:18px}.direction-link{font-size:14px;padding:12px 0}.theme-toggle{position:relative;bottom:auto;right:auto;margin:20px 7% 30px auto;width:max-content}.about{padding:150px 7% 35px}.about h1{font-size:17vw;margin-bottom:45px}.about-bottom{grid-template-columns:1fr;gap:25px}.about-bottom>p{font-size:22px}.about-bottom>div p{font-size:15px}.case-toolbar{height:90px;font-size:11px}.case-title{font-size:42px;overflow-wrap:anywhere;margin-top:35px}.case-subtitle{font-size:19px}.case-story{grid-template-columns:1fr;gap:20px;padding:30px 0}.case-story p{font-size:17px}.case-intro{font-size:19px}.case-cover{height:35vh}.next-case{font-size:18px}.archive-note{font-size:11px}body[data-view="experience"] footer,body[data-view="about"] footer{padding:25px 6%;max-width:100%}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

#menuClose{position:absolute;top:46px;right:3%}.menu-brand{position:absolute;top:43px;left:3%}body.menu-open header{visibility:hidden}@media(max-width:640px){#menuClose{top:27px;right:6%}.menu-brand{top:25px;left:6%}}