:root{color:#191919;background:#fff;font-family:"SFMono-Regular","IBM Plex Mono","Roboto Mono","Consolas","Liberation Mono",monospace;font-size:13px;font-synthesis:none;--gutter:24px;--muted:#777}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;border:0;padding:0;background:none;cursor:pointer}button:focus-visible,a:focus-visible{outline:1px solid currentColor;outline-offset:4px}[hidden]{display:none!important}
.header{height:72px;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:#fff;z-index:5}
html{scroll-padding-top:72px}
.wordmark{font-size:25px;font-weight:400;letter-spacing:-1.7px;line-height:1}
.header-note{font-size:9px;letter-spacing:.09em;color:#999;margin-left:auto;margin-right:38px}.header-note span{color:#ccc}
.menu-toggle{width:24px;height:24px;position:relative;display:grid;align-content:center;gap:5px;padding:3px;z-index:7}
.menu-toggle i{display:block;height:1px;background:#222;transition:transform .2s,opacity .2s}
.menu-toggle[aria-expanded=true] i:nth-child(1){transform:translateY(6px) rotate(45deg)}.menu-toggle[aria-expanded=true] i:nth-child(2){opacity:0}.menu-toggle[aria-expanded=true] i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.nav{position:absolute;right:0;top:0;padding:72px 24px 28px 24px;min-width:226px;background:#fff;z-index:6;box-shadow:-10px 12px 30px rgba(0,0,0,.025);display:flex;flex-direction:column;gap:20px;animation:appear .18s ease}
.nav a{font-size:13px}.nav a:hover,.nav a[aria-current=page]{text-decoration:underline;text-underline-offset:4px}.nav-note{font-size:9px;line-height:1.6;color:#999;border-top:1px solid #ececec;padding-top:16px;margin-top:6px}
.projects{padding:0 var(--gutter) 28px}
.feed{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:21px 24px}
.project-card{display:block;min-width:0;cursor:pointer}.cover{position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;background:#efefed}.cover img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.45);transition:filter .3s}.project-card:hover .cover img{filter:saturate(1)}.project-card:focus-visible .cover{outline:1px solid #000}
.caption{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-top:9px;font-size:11px;line-height:1.4}.caption .category{color:#888;white-space:nowrap;font-size:10px}.project-card:hover .caption span:first-child{text-decoration:underline;text-underline-offset:3px}
.sentinel{height:1px}.archive-footer{border-top:1px solid #e9e9e9;margin-top:42px;padding-top:15px;display:flex;align-items:center;gap:18px;font-size:10px;color:#777}.archive-footer button{margin-left:auto;color:#222}
.plain{margin:50px auto 90px;width:min(680px,calc(100% - 48px));padding-top:16px;line-height:1.7;animation:appear .22s ease}.eyebrow,.small{font-size:11px;color:var(--muted)}.plain h1{font-size:clamp(32px,5vw,58px);font-weight:400;letter-spacing:-.07em;line-height:1.15;margin:24px 0 30px}.lead{font-size:19px;line-height:1.55;letter-spacing:-.035em;max-width:620px}.plain p{max-width:580px}.plain h2{font-size:18px;font-weight:400;letter-spacing:-.04em;margin:12px 0}.note{border-top:1px solid #ddd;padding:22px 0;margin-top:20px}.note p{margin:0}.list-row{display:grid;grid-template-columns:40px 1fr 15px;gap:12px;border-top:1px solid #ddd;padding:18px 0}.list-row small{font-size:10px;color:#777}
.viewer{background:#080808;color:#f4f4f4;border:0;padding:0;max-width:none;max-height:none;width:100%;height:100%;height:100dvh;margin:0;overflow-y:auto;overflow-x:hidden;position:fixed;inset:0;overscroll-behavior:contain;scroll-padding-top:72px}.viewer::backdrop{background:#080808}.viewer[open]{display:block;animation:appear .18s ease}body.viewer-open{overflow:hidden}
.project-header{height:72px;position:sticky;top:0;z-index:3;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 var(--gutter);background:#080808;border-bottom:1px solid #222}
.back-to-feed{justify-self:start;font-size:12px}.back-to-feed:hover,.project-footer button:hover:not(:disabled){text-decoration:underline;text-underline-offset:4px}.project-count{font-size:10px;color:#999;white-space:nowrap}
.viewer-close{justify-self:end;font-size:30px;line-height:1;font-weight:200;width:32px;height:40px;text-align:right}
.viewer-body{width:calc(100% - 2 * var(--gutter));max-width:1500px;margin:0 auto;padding:32px 0 35px}
.project-intro{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:4px 16px;margin:0 0 28px}
.project-intro h1{font-size:clamp(22px,3vw,38px);font-weight:400;letter-spacing:-.065em;line-height:1.15;margin:0}
.viewer-meta{font-size:11px;margin:0;color:#aaa;white-space:nowrap}.demo-label{display:block;color:#888;font-size:9px;letter-spacing:.025em;grid-column:1/-1}
.project-blocks{display:flex;flex-direction:column;gap:44px}
.project-figure{margin:0;min-width:0}.project-figure img{display:block;width:100%;height:auto;object-fit:contain;background:#141414}.project-blocks>.project-figure img{max-height:92vh}.project-figure figcaption{display:flex;justify-content:space-between;gap:12px;padding:8px 0 0;color:#aaa;font-size:10px;line-height:1.45}.project-figure figcaption a{margin-left:auto;color:#888;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.project-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gutter);align-items:start}.project-gallery .project-figure img{aspect-ratio:3/2;object-fit:cover}
.project-text{width:min(100%,760px);margin:0 auto;padding:12px 0;font-size:15px;line-height:1.8;color:#ddd}.project-text p{margin:0}.project-text p+p{margin-top:16px}.project-text h2{font-size:18px;letter-spacing:-.035em;font-weight:400;margin:0 0 18px;color:#fff}
.project-footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin-top:48px;padding-top:20px;border-top:1px solid #333;color:#bbb;font-size:11px}.project-footer button:first-child{justify-self:start}.project-footer button:last-child{justify-self:end}.project-footer button:disabled{opacity:.3;cursor:default}
@keyframes appear{from{opacity:0}to{opacity:1}}
@media(max-width:700px){:root{--gutter:12px}html,.viewer{scroll-padding-top:60px}.header,.project-header{height:60px}.wordmark{font-size:22px}.header-note{display:none}.feed{grid-template-columns:1fr;gap:21px}.cover{aspect-ratio:3/2}.caption{font-size:10px;padding-top:7px}.caption .category{font-size:9px}.nav{padding-top:60px;min-width:180px}.viewer-body{padding-top:23px}.project-intro{grid-template-columns:1fr;gap:8px;margin-bottom:22px}.project-meta{white-space:normal}.project-blocks{gap:27px}.project-gallery{grid-template-columns:1fr;gap:22px}.project-gallery .project-figure img{aspect-ratio:auto;object-fit:contain}.project-text{font-size:13px;line-height:1.8;padding:8px 3px}.project-footer{font-size:10px;gap:8px;margin-top:34px}.plain{margin-top:26px}.archive-footer{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
.empty-feed{min-height:55vh;display:grid;place-items:center;color:#777}.project-figure video{display:block;width:100%;max-height:85vh;background:#080808}.note audio{display:block;width:100%;margin:16px 0}.plain a{text-decoration:underline;text-underline-offset:4px}.plain p{white-space:pre-line}