.head{position:relative;z-index:2;background:var(--page)}.head-in{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}.head-name{display:flex;flex-direction:column;justify-content:flex-end;padding:calc(var(--cell) * 10) 32px 22px 0;container-type:inline-size}.name{margin:0 0 calc(5.6px - .12em);font-size:min(75px,11cqi);line-height:.92;font-weight:400;letter-spacing:-.035em;text-transform:uppercase;white-space:nowrap}.name.wraps{white-space:normal;text-wrap:balance}.head-tag{position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:calc(var(--cell) * 10) 0 22px 32px}.divider{position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--line-div);transform-origin:top;transform:scaleY(0);transition:transform .9s var(--ease-out) .2s}.tag{font-size:20px;line-height:23.6px;letter-spacing:-.01em;text-transform:uppercase;text-align:justify;text-align-last:justify}.name,.tag{transform:translateY(28px);opacity:0;transition:transform .9s var(--ease-out),opacity .6s var(--ease-soft)}.tag{transition-delay:.12s}.hero-in .name,.hero-in .tag,.rm .name,.rm .tag{transform:none;opacity:1}.hero-in .divider,.rm .divider{transform:none}.rm .name,.rm .tag,.rm .divider{transition:none}.hero{position:relative;height:var(--hero-h, 648px);border-top:1px solid var(--line-hero);overflow:hidden;touch-action:pan-y}.hero-cv{position:absolute;left:0;top:0}.main{position:relative;display:flex;flex-direction:column}.intro{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding-top:calc(var(--cell) * 12)}.intro-line{max-width:21em;font-size:40px;line-height:1.16;letter-spacing:-.02em;text-wrap:pretty}#work{margin-top:0!important;padding:24px 0 140px}.rail{position:relative;padding:32px 0 40px;padding-left:var(--colx, var(--gut));overflow:hidden;user-select:none;-webkit-user-select:none}.track{display:flex;align-items:flex-start;gap:calc(var(--cell) * 2);width:max-content;height:calc(var(--cell) * 38);transform:translate(calc(var(--cell) * -32 * var(--act, 0)));transition:transform .6s var(--ease-io)}.rm .track,.rm .tile,.rm .tile .mock .ph,.rm .tile .mock .win,.rm .tile .mock .sheet{transition:none}.sc{position:relative;display:block;flex:none;color:var(--ink);text-decoration:none}.sc:hover{color:var(--ink)}.sc:focus-visible{outline:none}.sc:focus-visible .tile{box-shadow:inset 0 0 0 3px var(--ink)}.tile{display:block;width:calc(var(--cell) * 30);height:calc(var(--cell) * 20);padding:var(--cell);background:var(--surface);clip-path:var(--step12);transition:width .5s var(--ease-io),height .5s var(--ease-io),background .2s var(--ease-soft)}.sc.act .tile{width:calc(var(--cell) * 48);height:calc(var(--cell) * 38)}.sc:not(.act):hover .tile{background:var(--surface-2)}.tile .mock,.tile .mock.film{width:100%;height:100%;overflow:visible;isolation:isolate}.tile .mock:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:var(--card);clip-path:var(--step8)}.tile .clip-stage{inset:calc(var(--cell) * -1)}.tile .mock .win{width:390px;height:250px}.tile .mock .sheet{width:290px}.tile .mock .ph{transform:scale(calc(var(--k) * .3));transition:transform .5s var(--ease-io)}.sc.act .mock .ph{transform:scale(calc(var(--k) * .56))}.tile .mock .win,.tile .mock .sheet{transform:scale(calc(var(--k) * .3));transition:transform .5s var(--ease-io)}.sc.act .mock .win{transform:scale(calc(var(--k) * .53))}.sc.act .mock .sheet{transform:scale(calc(var(--k) * .62))}.info{display:none}.sc.act .info{position:absolute;left:calc(100% + var(--cell) * 3);bottom:0;display:flex;flex-direction:column;width:calc(var(--cell) * 70)}.sct{font-size:calc(var(--cell) * 4);line-height:1.05;letter-spacing:-.03em}.see-all{display:flex;margin-top:calc(var(--cell) * 4)}.see-arrow{transition:transform .2s steps(1,end)}.see-all .btn:hover .see-arrow{transform:translate(2px)}.rm .see-arrow{transition:none}.float{position:absolute;left:0;right:0;top:calc(32px + var(--cell) * 10 - 22px);z-index:2;height:0;pointer-events:none}.float .arrow-btn{position:absolute;top:0;pointer-events:auto}.float .prev{left:var(--gut)}.float .next{right:var(--gut)}.sc:hover .hov-sw i:nth-child(odd){animation:bob .9s var(--ease-io) infinite}.sc:hover .hov-sw i:nth-child(2n){animation:bob .9s var(--ease-io) .45s infinite}@keyframes bob{50%{transform:translateY(-3px)}}.rm .sc:hover .hov-sw i{animation:none}.sc:hover .hov-tog{background:#d3d3cf}.sc:hover .hov-tog i{margin-left:0}.sc:hover .hov-pill{background:var(--ac);color:#fff}.rows{display:flex;flex-direction:column}.ed{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 56px;padding:120px 0}.ed .body p{margin:0 0 16px;max-width:56ch}.note{font-size:13px;line-height:20px;color:var(--muted)}.moon{width:max-content;margin-bottom:28px;outline-offset:6px}.proc{padding:40px 0 120px}.proc-lede{margin-top:20px;max-width:40ch}.dia{position:relative;height:calc(var(--cell) * 28);margin-top:56px;overflow:hidden}.dia canvas{position:absolute;right:0;top:0}.cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 28px;margin-top:40px}.cols>div{transition:opacity .3s var(--ease-soft)}.cols>div.dim{opacity:.45}.colt{display:flex;align-items:center;gap:10px;font-size:16px;line-height:24px;font-weight:500}.num{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--inverse);color:var(--on-inverse);font:500 10px/1 var(--mono)}.cold{margin-top:10px;max-width:34ch;font-size:14px;line-height:21px;color:var(--muted)}.tools{padding:40px 0 140px}.lab{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin-top:56px}@media (max-width: 1023px){.lab{grid-template-columns:repeat(2,minmax(0,1fr))}}.tcard{display:flex;flex-direction:column;align-items:center;color:var(--ink);text-decoration:none}.tcard:hover{color:var(--ink)}.frame{position:relative;display:block;width:100%;aspect-ratio:4 / 3;background:var(--surface);overflow:hidden;clip-path:var(--step12)}.frame canvas{position:absolute;left:0;top:0}.ct{margin-top:26px;font-size:30px;line-height:1.3;font-weight:500;letter-spacing:-.02em;text-align:center}.cd{max-width:34ch;margin-top:8px;color:var(--muted);text-align:center;text-wrap:pretty}.contact{padding:40px 0 120px}.marq{width:100%;height:calc(var(--cell) * var(--marq-rows, 16));overflow-x:clip;overflow-y:visible}.marq canvas{display:block}.contact-in{display:flex;flex-direction:column;align-items:center;gap:22px;margin-top:64px;text-align:center}.contact-in .muted{margin-top:8px;max-width:40ch;text-wrap:pretty}.links{display:flex;flex-wrap:wrap;justify-content:center;gap:0 18px}.links a{display:inline-flex;align-items:center;min-height:44px}@media (min-width: 1024px) and (max-height: 800px){.head-name,.head-tag{padding-top:min(calc(var(--cell) * 10),80px)}}@media (max-width: 1023px){.head-in{grid-template-columns:1fr;padding-top:92px}.head-name{padding:20px 0 8px}.name{font-size:min(75px,11.3cqi);margin:0}.head-tag{padding:0 0 18px}.divider{display:none}.tag{font-size:16px;text-align:left;text-align-last:left}}.rail{--tw: min(82vw, 340px)}@media (min-width: 721px){.rail{--tw: min(46vw, 420px)}}@media (max-width: 1023px),(hover: none),(pointer: coarse){.rail{padding:24px 0;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:var(--colx, var(--gut));padding-left:var(--colx, var(--gut));padding-right:var(--colx, var(--gut));scrollbar-width:none}.rail::-webkit-scrollbar{display:none}.rail.panning{scroll-snap-type:none}.track{transform:none!important;gap:14px;height:auto}.float{display:none}.sc{scroll-snap-align:start}.tile,.sc.act .tile{width:var(--tw);height:calc(var(--tw) * .76)}.tile .mock .ph,.sc.act .mock .ph{transform:scale(.8)}.tile .mock .win,.sc.act .mock .win{transform:scale(.66)}.tile .mock .sheet,.sc.act .mock .sheet{transform:scale(.8)}.info,.sc.act .info{position:static;display:flex;flex-direction:column;gap:6px;width:auto;margin-top:12px}.sct{font-size:22px}}@media (max-width: 720px){.intro{flex-direction:column;padding-top:calc(var(--cell) * 10)}.intro-line{font-size:26px}.ed{grid-template-columns:1fr;padding:80px 0}.lab{grid-template-columns:minmax(0,1fr);gap:40px}.cols{grid-template-columns:minmax(0,1fr)}.frame{aspect-ratio:2 / 1}.ct{margin-top:18px;font-size:24px}}