.workbench{overflow-anchor:none}.workbench:not(.enhanced){grid-template-columns:1fr}.workbench:not(.enhanced) .work-index{display:none}
/* Keep touch targets comfortable without blocking native page scrolling or zoom. */
html{-webkit-text-size-adjust:100%;color-scheme:dark}
.wrap{width:calc(100% - 2 * max(var(--gutter),env(safe-area-inset-left,0px),env(safe-area-inset-right,0px)))}
.nav{padding-top:env(safe-area-inset-top,0px)}footer{padding-bottom:calc(28px + env(safe-area-inset-bottom,0px))}
button,a{touch-action:manipulation}button{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
button:active{filter:brightness(1.15)}input{font:inherit;font-size:16px}input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.work-panel:focus-visible{outline:2px solid var(--accent);outline-offset:8px}.email{overflow-wrap:anywhere}
.work-mobile-nav{display:none}
.monument{display:flex;animation:none}.monument>span{display:inline-block}.monument>span:nth-child(2){animation-delay:70ms}.monument>span:nth-child(3){animation-delay:140ms}.monument>span:nth-child(4){animation-delay:210ms}
html[data-motion=full] .monument>span{animation:letter-arrive 950ms var(--ease-out) both}@keyframes letter-arrive{from{opacity:.2;transform:translateY(15%) rotate(3deg)}to{opacity:1;transform:translateY(0) rotate(0)}}
.work-heading{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:58px}.work-heading h2{font-size:clamp(40px,5.5vw,76px);max-width:650px}.work-heading p{color:var(--light);max-width:340px}.workbench{display:grid;grid-template-columns:30% minmax(0,1fr);gap:5%}.work-index{align-self:start;position:sticky;top:30px}.project-tabs{display:flex;flex-direction:column;gap:6px}.work-tab{position:relative;text-align:left;background:transparent;color:#94a7b7;border:0;padding:22px 22px 24px;min-height:100px;isolation:isolate}.work-tab::before{content:"";position:absolute;inset:0;z-index:-1;background:#182e3c;clip-path:inset(0 100% 0 0);transition:clip-path 250ms var(--ease-in-out)}.work-tab[aria-selected=true]::before{clip-path:inset(0)}.work-tab[aria-selected=true]{color:var(--ink)}.tab-name{display:block;font-size:clamp(24px,2.5vw,36px);letter-spacing:-.05em;line-height:1.12}.tab-meta{display:flex;justify-content:space-between;gap:10px;font-size:14px;margin-top:12px;color:var(--muted)}.tab-meta>span{font-size:22px;line-height:1;transition:transform 250ms var(--ease-out)}.work-tab[aria-selected=true] .tab-meta{color:var(--accent)}.work-tab[aria-selected=true] .tab-meta>span{transform:rotate(45deg)}.work-index-bottom{padding:30px 22px;display:flex;flex-direction:column;gap:30px;font-size:14px;color:var(--muted)}.next-project{background:transparent;border:0;color:var(--ink);padding:8px 0;min-height:44px;text-align:left;display:flex;justify-content:space-between;gap:20px;font-size:16px}.next-project span{transition:transform 180ms var(--ease-out)}
.work-panel{min-width:0;margin-bottom:70px}.work-panel[hidden]{display:none}.workbench.enhanced .work-panel{margin:0}.experiment{background:#0d1b27;overflow:hidden;position:relative}.experiment-top{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:25px 28px 0;color:var(--ink);font-size:18px}.experiment-state{font-size:13px;color:var(--muted);white-space:nowrap}.experiment-screen{height:390px;position:relative;overflow:hidden}.experiment-screen>img{width:100%;height:100%;object-fit:contain}.experiment-screen canvas{position:absolute;inset:0;width:100%;height:100%;display:none}.experiment.ready canvas{display:block}.experiment.ready img{visibility:hidden}.experiment-controls{display:flex;gap:20px;align-items:center;padding:0 28px 22px;min-height:66px;font-size:14px}.experiment-controls label{white-space:nowrap;color:var(--light)}.experiment-controls input{width:100%;max-width:210px;min-width:45px;accent-color:var(--accent);cursor:ew-resize;min-height:44px}.experiment-action{margin-left:auto;display:flex;gap:14px;align-items:center;justify-content:space-between;white-space:nowrap;background:#254454;color:var(--ink);border:0;padding:12px 16px;min-height:44px;font-size:14px;transition:transform 150ms var(--ease-out),background-color 180ms ease}.experiment-action:active{transform:scale(.96)}.experiment-caption{padding:16px 28px 20px;background:#10212e;color:var(--muted);font-size:13px;line-height:1.5}.experiment-prompt{color:var(--light)}.work-story{display:grid;grid-template-columns:1fr;gap:24px;margin-top:34px}.work-story h3{font-size:clamp(28px,3.5vw,46px);letter-spacing:-.05em;max-width:680px}.work-intro{margin-top:18px;color:var(--light);max-width:620px;font-size:18px}.work-facts{display:grid;grid-template-columns:1.2fr 1fr;gap:0 35px}.work-facts h4{display:none}.work-facts>p{color:var(--light);font-size:16px;grid-column:1}.work-facts>p+p{margin-top:18px}.work-facts dl{grid-column:2;grid-row:1 / span 3;margin:0;font-size:14px}.work-facts dl>div+div{margin-top:16px}.work-facts dt{color:var(--muted)}.work-facts dd{margin:4px 0 0;color:var(--ink)}.work-panels{min-width:0}.workbench:not(.enhanced) .project-tabs,.workbench:not(.enhanced) .work-index-bottom{display:none}.projects-end{margin-top:55px}
.nav nav a{position:relative}.nav nav a::after{content:"";position:absolute;bottom:6px;left:0;right:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 200ms var(--ease-out)}.button span{transition:transform 200ms var(--ease-out)}.button:focus-visible span{transform:translate(3px,-3px)}.socials a{transition:color 180ms ease}.toolkit{align-items:start}.toolkit p{display:flex;flex-wrap:wrap;gap:10px 20px}.toolkit p span{display:inline-block;transition:color 180ms ease,transform 180ms var(--ease-out)}
@media(hover:hover) and (pointer:fine){.button:hover span{transform:translate(3px,-3px)}.socials a:hover{color:var(--accent)}.work-tab:hover{color:var(--ink)}.work-tab:hover .tab-meta>span{transform:translate(3px,-3px)}.next-project:hover span{transform:translateX(5px)}.experiment-action:hover{background:#355c70}.nav nav a:hover::after{transform:scaleX(1)}.nav nav a:hover{text-decoration:none}.toolkit p span:hover{color:var(--accent);transform:translateY(-3px)}}
@media(max-width:1050px){.workbench{grid-template-columns:28% minmax(0,1fr);gap:4%}.work-tab{padding:20px 16px}.tab-name{font-size:25px}.work-facts{grid-template-columns:1fr;gap:24px}.work-facts dl{grid-column:1;grid-row:auto;display:grid;grid-template-columns:1fr 1fr;gap:18px}.work-facts dl>div+div{margin:0}.experiment-top{padding:24px 20px 0}.experiment-controls{padding-inline:20px;flex-wrap:wrap;gap:10px}.experiment-screen{height:340px}.experiment-caption{padding-inline:20px}.experiment-controls input{flex:1}.work-heading h2{font-size:50px}}
@media(max-width:700px){.work-heading{display:block;margin-bottom:30px}.work-heading h2{font-size:40px}.work-heading p{margin-top:20px}.workbench{display:block}.work-index{position:static;margin-bottom:22px}.project-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px}.work-tab{min-height:90px;padding:16px}.tab-name{font-size:22px}.tab-meta{font-size:12px;margin-top:10px;gap:4px}.tab-meta>span{font-size:18px}.work-index-bottom{display:none}.experiment-top{padding:22px 18px 0;font-size:16px;gap:12px}.experiment-state{font-size:12px}.experiment-screen{height:290px}.experiment-controls{padding:0 18px 18px;font-size:13px}.experiment-action{font-size:13px;padding:12px}.experiment-caption{padding:14px 18px;font-size:12px}.work-story{margin-top:26px}.work-story h3{font-size:30px}.work-intro{font-size:16px;margin-top:16px}.work-facts{gap:22px}.work-facts>p{font-size:16px}.projects-end{margin-top:36px}.work-heading p br{display:none}}
@media(max-width:700px){.tab-meta,.experiment-state,.experiment-caption{font-size:13px}.work-tab{padding:16px 12px}}
@media(max-width:700px){
  .work-mobile-nav{display:flex;justify-content:space-between;gap:12px;margin-top:28px}
  .work-mobile-nav button{flex:1;min-height:48px;padding:12px 10px;border:0;background:#182e3c;color:var(--ink);font-size:14px}
  .project-tabs{scroll-margin-top:22px}.work-tab{display:flex;flex-direction:column;justify-content:space-between;align-items:stretch}.tab-name{min-height:46px}.tab-meta{align-items:center;min-height:38px}.tab-meta>span{flex-shrink:0}
  .experiment-controls:has(input){display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 14px}
  .experiment-controls input{max-width:none;width:100%;margin:0;min-height:44px}
  .experiment-controls:has(input) .experiment-action{grid-column:1/-1;width:100%;margin:0;justify-content:center}
  .experiment-top{align-items:start}.experiment-top>span:first-child{max-width:75%}
  .work-facts dl{gap:20px}.socials a{min-height:44px;display:inline-flex;align-items:center}
  .motion-controls button{min-width:48px}.footer-bottom a{min-height:44px;display:inline-flex;align-items:center}
}
@media(max-width:360px){:root{--gutter:18px}.nav nav{gap:12px}.nav .brand{font-size:20px}.work-heading h2{font-size:36px}.tab-name{font-size:20px}.tab-meta{font-size:13px}.work-story h3{font-size:28px}.experiment-top{padding-inline:16px}.experiment-controls{padding-inline:16px}.work-facts dl{grid-template-columns:1fr}}
html[data-motion=off] *,html[data-motion=off] *::before,html[data-motion=off] *::after{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){html[data-motion=full] .work-tab::before{transition:clip-path 250ms var(--ease-in-out)!important}html[data-motion=full] .tab-meta>span,html[data-motion=full] .next-project span,html[data-motion=full] .button span{transition:transform 200ms var(--ease-out)!important}html[data-motion=full] .monument>span{animation:letter-arrive 950ms var(--ease-out) both!important}html[data-motion=full] .monument>span:nth-child(2){animation-delay:70ms!important}html[data-motion=full] .monument>span:nth-child(3){animation-delay:140ms!important}html[data-motion=full] .monument>span:nth-child(4){animation-delay:210ms!important}}

/* A personal introduction; the navigation wordmark carries the brand. */
.hero{min-height:auto;padding:72px 0 96px;justify-content:flex-start}
.hero-title{font:500 clamp(44px,6.2vw,88px)/1.08 Onest,Arial,sans-serif;letter-spacing:-.055em;color:var(--ink);max-width:850px;text-wrap:balance}
.hero-bottom{margin-top:48px;align-items:start}
.internship{padding-top:0;align-self:start}
.footer-name{font-size:36px;line-height:1.1;text-transform:lowercase;letter-spacing:-.07em}
@media(max-width:650px){.hero{padding:44px 0 64px}.hero-title{font-size:clamp(38px,10.8vw,60px)}.hero-bottom{margin-top:32px;gap:36px}.footer-name{font-size:28px}}
