:root{--ink:#1b1b19;--ink-2:#55554f;--ink-3:#77776f;--surface:#f2f2ef;--bg:#fff;--gutter:24px;--max:1120px;--mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);letter-spacing:-.011em;-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:15px;line-height:1.5}a{color:var(--ink);text-decoration:none}code,kbd,pre,samp{font-family:var(--mono)}a:hover{color:var(--ink-2)}:is(a:focus-visible,button:focus-visible){outline-offset:3px;border-radius:2px;outline:2px solid}::selection{background:var(--ink);color:var(--bg)}.page{flex-direction:column;align-items:center;min-height:100vh;display:flex;overflow-x:clip}.wrap{width:100%;padding:0 var(--gutter);justify-content:center;display:flex}.container{width:100%;max-width:var(--max);flex-direction:column;gap:72px;padding:36px 0 96px;display:flex}.site-header{grid-template-columns:repeat(12,minmax(0,1fr));align-items:center;gap:0 24px;display:grid}.site-logo{grid-column:1/span 3;justify-self:start;display:flex}.site-logo-img{width:auto;height:18px;display:block}.site-nav{display:contents}.site-nav a[data-active],.mobile-menu-nav a[data-active]{text-underline-offset:6px;text-decoration:underline;text-decoration-thickness:1px;-webkit-text-decoration-color:color-mix(in srgb, currentColor 35%, transparent);text-decoration-color:color-mix(in srgb, currentColor 35%, transparent)}.site-nav-projects{grid-column:4/span 3;justify-self:start}.site-nav-about{grid-column:7/span 3;justify-self:start}.site-nav-github{grid-column:10/span 3;justify-self:start;align-items:center;gap:4px;display:flex}.menu-button{cursor:pointer;width:44px;height:44px;color:inherit;background:0 0;border:0;grid-column:10/span 3;justify-content:center;justify-self:end;align-items:center;margin:-12px -12px -12px 0;padding:0;display:none}.menu-button svg{display:block}.site-header.is-inverted,.site-header.is-inverted a{color:#fff}.site-header.is-inverted .site-logo-img{filter:invert()}.mobile-menu{z-index:50;background:var(--bg);padding:36px var(--gutter);flex-direction:column;gap:48px;display:flex;position:fixed;inset:0}.mobile-menu-bar{justify-content:space-between;align-items:center;display:flex}.mobile-menu-bar .menu-button{color:var(--ink);display:flex}.mobile-menu-nav{flex-direction:column;display:flex}.mobile-menu-nav a{align-items:center;gap:6px;min-height:44px;display:flex}.hero{background:var(--surface);width:100%;height:max(360px,min(56.25vw,88vh,900px));position:relative;overflow:hidden}.hero-media{position:absolute;inset:0}.hero-media>.media-fill{aspect-ratio:16/9;width:auto;inset:0 auto auto 50%;transform:translate(-50%)}.hero-bar{padding:0 var(--gutter);justify-content:center;display:flex;position:relative}.hero-bar .site-header{width:100%;max-width:var(--max);padding:36px 0}.hero-bar .site-header a:hover{color:inherit;opacity:.7}.frame{background:var(--surface);border-radius:6px;position:relative;overflow:hidden}.frame:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #1b1b1912}.bleed{width:100vw;margin-left:calc(50% - 50vw)}.frame.is-bare:after{display:none}.frame.is-matted{padding:6%}.frame-screen{background:var(--bg);border-radius:6px;position:relative;overflow:hidden;box-shadow:0 0 0 1px #1b1b190f,0 12px 36px #1b1b1914}.ratio-16-9{aspect-ratio:16/9}.ratio-16-10{aspect-ratio:16/10}.ratio-4-5{aspect-ratio:4/5}.ratio-4-3{aspect-ratio:4/3}.media-fill{object-fit:cover;width:100%;height:100%;display:block;position:absolute;inset:0}.is-video{background:#000}.project-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,440px),1fr));gap:56px 32px;display:grid}.project-card{flex-direction:column;gap:16px;display:flex}.project-card:hover{color:var(--ink);opacity:.82}.project-card-text{flex-direction:column;gap:2px;min-width:0;display:flex}.project-card-name{font-weight:500}.project-card-tagline{color:var(--ink-2);text-wrap:pretty}.article{flex-direction:column;gap:40px;padding-top:20px;display:flex}.cols{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 24px;margin:0;display:grid}.col-label{flex-direction:column;grid-column:1;min-width:0;display:flex}.col-rest{grid-column:2/span 3;min-width:0}.col-all{grid-column:1/-1}.col-half-start{grid-column:1/span 2;min-width:0}.col-half-end{grid-column:3/span 2;min-width:0}.title{margin:0;font-size:15px;font-weight:500;line-height:1.5}.section-label{font-size:inherit;line-height:inherit;color:var(--ink-3);margin:0;font-weight:400}.muted,figcaption{color:var(--ink-3);text-wrap:pretty}.tagline{color:var(--ink-2);text-wrap:pretty;max-width:62ch;margin:0}.prose{flex-direction:column;gap:12px;max-width:62ch;display:flex}.prose p{text-wrap:pretty;margin:0;line-height:1.6}.inline-link{text-underline-offset:3px;text-decoration:underline}.rows{flex-direction:column;display:flex}.row{grid-template-columns:repeat(4,minmax(0,1fr));gap:0 24px;padding:14px 0;display:grid}.row:first-child{padding-top:0}.links{flex-direction:column;gap:4px;display:flex}.links a{align-self:flex-start;align-items:center;gap:6px;display:flex}.links a:hover{color:var(--ink-3)}.link-line{align-items:center;gap:10px;display:flex}.icon-arrow{flex-shrink:0}.stack{flex-direction:column;gap:12px;margin:0;display:flex}.photo-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:72px 24px;margin:32px 0 0;padding:0;list-style:none;display:grid}.photo{grid-column:var(--column);flex-direction:column;gap:8px;min-width:0;display:flex}.photo img{outline-offset:-1px;outline:1px solid #1b1b1912;width:100%;height:auto;display:block}.photo-caption{color:var(--ink-3);font-size:12px;line-height:1.4}.figures{flex-direction:column;gap:64px;padding-top:24px;display:flex}.figure-aside figcaption{grid-row:1;align-self:end}.figure-aside .frame{grid-row:1}.logo-stage{aspect-ratio:16/7;background:var(--surface);position:relative;overflow:hidden}.logo-glow,.logo-mark{position:absolute;top:50%;left:50%;translate:-50% -50%}.logo-glow{aspect-ratio:1;background:radial-gradient(closest-side, color-mix(in oklab, var(--logo) 30%, transparent), transparent);opacity:.75;border-radius:50%;height:115%}.logo-mark{width:auto;height:44%;overflow:visible}.logo-stage[data-ready]:not([data-seen]) .logo-mark{visibility:hidden}.logo-stage[data-seen] .logo-glow{animation:7s ease-in-out infinite logo-glow}.logo-stage:not([data-visible]) *,.logo-stage:not([data-visible]){animation-play-state:paused!important}@keyframes logo-glow{0%,to{opacity:.6;transform:scale(.92)}50%{opacity:.95;transform:scale(1.08)}}.logo-stage[data-seen] .drs-layer-1{animation:1.5s cubic-bezier(.2,.8,.2,1) .2s backwards drs-rise,6s ease-in-out 1.7s infinite drs-drift-1}.logo-stage[data-seen] .drs-layer-2{animation:1.5s cubic-bezier(.2,.8,.2,1) .55s backwards drs-rise,6s ease-in-out 2.05s infinite drs-drift-2}@keyframes drs-rise{0%{transform:translateY(64px)}}@keyframes drs-drift-1{50%{transform:translateY(-3px)}}@keyframes drs-drift-2{50%{transform:translateY(-5px)}}.layeris-layer{transform-box:fill-box;transform-origin:50%}.logo-stage[data-seen] .layeris-layer-1{animation:1.6s cubic-bezier(.2,.8,.2,1) .1s backwards layeris-in-1,9s ease-in-out 1.7s infinite layeris-float-1}.logo-stage[data-seen] .layeris-layer-2{animation:1.6s cubic-bezier(.2,.8,.2,1) .3s backwards layeris-in-2,11s ease-in-out 1.9s infinite layeris-float-2}.logo-stage[data-seen] .layeris-layer-3{animation:1.6s cubic-bezier(.2,.8,.2,1) .5s backwards layeris-in-3,10s ease-in-out 2.1s infinite layeris-float-3}@keyframes layeris-in-1{0%{opacity:0;transform:translate(-30px,-70px)rotate(-6deg)}}@keyframes layeris-in-2{0%{opacity:0;transform:translate(40px,-10px)rotate(4deg)}}@keyframes layeris-in-3{0%{opacity:0;transform:translate(-20px,70px)rotate(-3deg)}}@keyframes layeris-float-1{50%{transform:translate(10px,-12px)rotate(-2.5deg)}}@keyframes layeris-float-2{50%{transform:translate(-12px,4px)rotate(2deg)}}@keyframes layeris-float-3{50%{transform:translate(8px,12px)rotate(-1.5deg)}}.dataslope-half{transform-box:view-box;transform-origin:544px 136px}.logo-stage[data-seen] .dataslope-left{animation:1.6s cubic-bezier(.2,.8,.2,1) .15s backwards dataslope-in-left,8s ease-in-out 1.75s infinite dataslope-sway-left}.logo-stage[data-seen] .dataslope-right{animation:1.6s cubic-bezier(.2,.8,.2,1) .35s backwards dataslope-in-right,8s ease-in-out 1.95s infinite dataslope-sway-right}@keyframes dataslope-in-left{0%{opacity:0;transform:translate(-160px,120px)}}@keyframes dataslope-in-right{0%{opacity:0;transform:translate(160px,120px)}}@keyframes dataslope-sway-left{50%{transform:rotate(-3.5deg)}}@keyframes dataslope-sway-right{50%{transform:rotate(3.5deg)}}.logo-stage[data-seen] .r3m-slab-bottom{animation:1.2s cubic-bezier(.3,.9,.3,1) .1s backwards r3m-drop,6s ease-in-out 1.9s infinite r3m-spread-bottom}.logo-stage[data-seen] .r3m-slab-middle{animation:1.2s cubic-bezier(.3,.9,.3,1) .4s backwards r3m-drop}.logo-stage[data-seen] .r3m-slab-top{animation:1.2s cubic-bezier(.3,.9,.3,1) .7s backwards r3m-drop,6s ease-in-out 1.9s infinite r3m-spread-top}@keyframes r3m-drop{0%{opacity:0;transform:translateY(-70px)}}@keyframes r3m-spread-bottom{50%{transform:translateY(9px)}}@keyframes r3m-spread-top{50%{transform:translateY(-9px)}}@media (max-width:640px){.site-header{gap:0}.site-nav a{display:none}.menu-button{display:flex}.hero{--clip-h:400px;background:0 0;flex-direction:column;height:auto;display:flex}.hero-bar{order:-1}.hero-media{height:calc(var(--clip-h) * 895 / 1080);margin:0 var(--gutter);border-radius:6px;position:relative;inset:auto;overflow:hidden}.hero-media>.media-fill{top:calc(var(--clip-h) * -185 / 1080);height:var(--clip-h)}.hero-media:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #1b1b1912}.hero-bar .site-header.is-inverted,.hero-bar .site-header.is-inverted a{color:var(--ink)}.hero-bar .site-header.is-inverted .site-logo-img{filter:none}.col-label,.col-rest,.col-half-start,.col-half-end{grid-column:1/-1}.row{gap:4px 24px}.figures{gap:48px}.figure-aside figcaption{grid-row:2}.photo-grid{gap:32px 16px}.photo{grid-column:1/-1}.logo-stage{aspect-ratio:4/3}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.logo-stage *{animation:none!important}}