@font-face{font-family:Onest;src:url('./fonts/Onest-Variable.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
:root{font-family:Onest,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#3b4457;background:#fff;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;overflow:hidden}button{font:inherit;color:inherit;touch-action:manipulation}button,canvas{-webkit-tap-highlight-color:transparent}
h1{font-size:20px;font-weight:500;letter-spacing:-.65px;line-height:1.3;margin:0 0 10px}
#stage{height:100svh;width:100%;position:relative}#cube{width:100%;height:100%;display:block;touch-action:none;outline:none;cursor:grab}#cube:focus-visible{outline:1px solid #adc9eb;outline-offset:-5px}#cube.pointer-focus:focus-visible{outline:none}#cube.dragging{cursor:grabbing!important}
#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#fff;transition:opacity .45s;z-index:1}#loading.loaded{opacity:0;pointer-events:none}#loading[hidden]{display:none}.loading-cube{width:16px;height:16px;border:1px solid #adc9eb;animation:loading 2s infinite}@keyframes loading{50%{transform:rotate(90deg);border-radius:5px}}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.project-tooltip{position:fixed;z-index:4;width:max-content;max-width:calc(100vw - 24px);height:34px;padding:0 12px;white-space:nowrap;display:flex;align-items:center;justify-content:center;text-align:center;background:#fffffff5;border:1px solid #e9e9e5;border-radius:0;box-shadow:0 4px 18px #00000006;color:#252525;font:400 14.3px/16px Onest,sans-serif;letter-spacing:0;pointer-events:none;opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .18s ease,transform .24s ease,visibility 0s .18s}.project-tooltip.is-visible{opacity:1;visibility:visible;transform:none;transition-delay:0s}


@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}





.project-page{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:#fff;color:#191919;overflow:auto;overscroll-behavior:contain;opacity:0;transform:translateY(14px);transition:opacity .22s ease,transform .4s cubic-bezier(.2,.75,.2,1)}
.project-page.is-open{opacity:1;transform:none}.project-page::backdrop{background:#fff;backdrop-filter:none}
.project-topbar{height:96px}.project-close{position:fixed;top:24px;right:28px;z-index:2}
.gallery-controls button{border:0;background:none;display:grid;place-items:center;cursor:pointer;color:#181818;padding:0;transition:background .2s,transform .2s}
.project-page button:focus-visible{outline:1px solid #191919;outline-offset:5px}
.project-layout{min-height:calc(100svh - 96px);display:grid;grid-template-columns:minmax(220px,.7fr) minmax(0,2.3fr);gap:4vw;padding:24px 48px 36px;align-items:start}
.project-copy{max-width:380px;padding:0}.project-copy h1{font-family:Onest,sans-serif;font-weight:700;font-size:clamp(32px,3.6vw,56px);line-height:1.1;letter-spacing:-1.7px;margin:0 0 28px}.project-description{white-space:pre-line;font-size:14px;line-height:1.85;color:#72726e;margin:0}.project-credit{font:400 11px/1.65 Onest,sans-serif;color:#72726e;margin:20px 0 0}
.project-gallery{min-width:0;align-self:start}.project-gallery figure{margin:0}.project-visual{position:relative;width:100%;aspect-ratio:1.5;background:#fff;touch-action:pan-y;cursor:pointer;outline:none;overflow:hidden}.project-visual:focus-visible{outline:1px solid #191919;outline-offset:4px}.project-image{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;object-position:center top;background:#fff;opacity:1;transition:opacity .18s ease;pointer-events:none;user-select:none}.project-image.entering{opacity:0}.project-caption{margin-top:15px;font-size:11px;color:#888883;letter-spacing:.15px}
.gallery-controls{display:flex;align-items:center;gap:20px;height:36px;margin-top:12px}.gallery-controls>.gallery-prev,.gallery-controls>.gallery-next{width:36px;height:36px;border:1px solid #e2e2dd;border-radius:50%}.gallery-controls>.gallery-prev:hover,.gallery-controls>.gallery-next:hover{background:#f1f1ed;transform:scale(1.06)}.gallery-controls svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.3}.gallery-count{font-size:10px;font-variant-numeric:tabular-nums;letter-spacing:1px;color:#6b6b65;min-width:45px}.gallery-dots{min-width:0;display:flex;align-items:center;justify-content:flex-end;gap:2px;flex:1}.gallery-dots button{flex:1 1 24px;min-width:12px;max-width:24px;width:24px;height:30px;position:relative}.gallery-dots button::after{content:'';width:4px;height:4px;border-radius:50%;background:#ccc;transition:transform .2s,background .2s}.gallery-dots button.active::after{background:#191919;transform:scale(1.4)}
@media(min-width:761px){.project-visual{max-height:calc(100svh - 220px)}}
.project-copy h1{overflow-wrap:anywhere}.project-copy h1.is-long-title{font-size:clamp(24px,2.4vw,40px);letter-spacing:-.8px}
@media(min-width:1700px){.project-layout{max-width:1880px;margin:auto;gap:80px}}
@media(max-width:760px){.project-topbar{height:80px}.project-close{top:18px;right:18px}.project-layout{min-height:0;grid-template-columns:1fr;padding:16px 24px 28px;gap:28px}.project-copy{max-width:500px}.project-copy h1{font-size:38px;margin-bottom:20px;letter-spacing:-1px}.project-description{font-size:13px;line-height:1.75}.project-credit{font-size:10px;margin-top:16px}.project-visual{max-height:75svh}.project-caption{font-size:10px}}
@media(max-height:540px) and (min-width:761px){.project-topbar{height:70px}.project-layout{min-height:0;padding-top:0;gap:32px}.project-copy h1{font-size:32px;margin-bottom:15px}.project-description{font-size:12px}.project-visual{max-height:calc(100svh - 170px)}}
@media(max-width:760px){.project-copy h1.is-long-title{font-size:clamp(30px,9.5vw,38px)}}
html[data-layout="home"]{color:#000}html[data-layout="home"] body{overflow-x:hidden;overflow-y:auto}
.home-frame{--menu-gap:92px;--bottom-gap:46px;--home-lift:clamp(24px,calc(24px + (100svh - 623px)*.24),100px);display:flex;flex-direction:column;align-items:center;height:100svh;min-height:100svh;padding-bottom:calc(var(--bottom-gap) + var(--menu-gap)*.15);background:#fff}
.home-frame #stage{height:auto;min-height:260px;width:100%;flex:1 0 260px}
.home-intro{position:relative;top:calc(-1*var(--home-lift));margin-top:26px;text-align:center;max-width:calc(100% - 40px)}
.home-intro h1{font:700 36px/44px Onest,sans-serif;letter-spacing:0;margin:0}
.greeting-button{position:relative;display:inline-block;padding:0;border:0;background:none;color:#000;font:inherit;line-height:inherit;letter-spacing:inherit;cursor:pointer}
.greeting-button:focus-visible{outline:1px solid #000;outline-offset:5px}
.pixel-person{position:absolute;left:calc(100% + 10px);top:0;width:40px;height:40px;object-fit:contain;image-rendering:pixelated;pointer-events:auto;cursor:pointer;user-select:none;-webkit-user-drag:none}
.home-intro p{font:400 20px/24px Onest,sans-serif;letter-spacing:0;max-width:680px;margin:14px auto 0;color:#000;text-wrap:balance}
.home-menu{position:relative;top:calc(-1*var(--home-lift));display:flex;justify-content:space-between;width:min(637.5px,calc(70% + 116.4px));gap:16.8px;margin-top:calc(var(--menu-gap)*.85)}
.home-menu a{display:block;min-width:120px;height:28px;line-height:28px;background:#000;color:#fff;text-align:center;text-decoration:none;font-size:20px;font-weight:400;transition:background .15s,transform .15s}
.home-menu a:hover{background:#363636;transform:translateY(-2px)}.home-menu a:focus-visible{outline:1px solid #000;outline-offset:4px}
.home-contacts{position:relative;top:calc(-1*var(--home-lift));display:flex;align-items:center;justify-content:center;gap:7px;margin-top:22px;font:400 14px/20px Onest,sans-serif;flex:none}
.home-contacts a{color:#000;text-decoration:none;text-underline-offset:3px}.home-contacts a:hover{text-decoration:underline}.home-contacts a:focus-visible{outline:1px solid #000;outline-offset:4px}
.site-back{position:fixed;top:24px;right:28px;z-index:3}
.single-message{min-height:100svh;display:grid;place-items:center;color:#000;background:#fff}.single-message p{margin:0;font:400 14px/1.5 Onest,sans-serif}
.about-page{overflow:auto;color:#000;min-height:100svh;display:grid;place-items:center}.about-copy{width:min(420px,calc(100% - 48px));padding:72px 0;text-align:center}.about-copy h1{font:700 28px/1.2 Onest,sans-serif;letter-spacing:-.6px;margin-bottom:24px}.about-copy p{font-size:14px;line-height:1.8;margin:0}.about-copy small{display:block;font-size:10px;margin-top:30px;color:#82827c}
.projects-index{overflow:auto;color:#000}.section-shell{max-width:1120px;margin:auto;padding:74px 36px 70px}.projects-header{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-bottom:40px}.projects-header h1{font:700 28px/1.2 Onest,sans-serif;letter-spacing:-.6px;margin:0}.project-filters{display:flex;align-items:center;gap:clamp(24px,5vw,76px)}.project-filters button{border:0;background:none;border-radius:0;padding:4px 0;color:#000;font:400 20px/1.4 Onest,sans-serif;cursor:pointer;text-underline-offset:6px;text-decoration-thickness:1px;touch-action:manipulation}.project-filters button:hover,.project-filters button[aria-pressed="true"]{text-decoration-line:underline}.project-filters button:focus-visible{outline:none;text-decoration-line:underline;text-decoration-thickness:2px}.project-list{display:flex;flex-direction:column;gap:64px;overflow-anchor:none}.project-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 28px}.project-group[hidden]{display:none}
.project-entry{position:relative;text-align:left;border:0;background:none;padding:0;cursor:pointer;min-width:0;color:#000}.project-entry img{display:block;width:100%;aspect-ratio:1.5;object-fit:cover;background:#fff;transition:filter .2s}.project-entry:hover img{filter:brightness(.97)}.project-entry>span{display:block;font-size:14px;margin-top:14px}.project-entry small{display:block;font-size:10px;color:#8b8b85;margin-top:5px}.project-entry:focus-visible{outline:1px solid #000;outline-offset:8px}
@media(min-width:601px) and (max-width:940px){.home-frame{--menu-gap:64px}.home-menu{width:calc(100% - 69.6px);gap:12.6px}.home-menu a{min-width:0;flex:1;font-size:18px}}
@media(max-width:600px){.home-frame{--menu-gap:48px;--bottom-gap:28px;--home-lift:clamp(0px,calc((100svh - 700px)*.32),48px)}.home-frame #stage{height:auto;min-height:230px;flex:1 0 230px}.home-intro{margin-top:24px}.home-intro h1{font-size:clamp(30px,9.2vw,36px)}.greeting-button{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}.pixel-person{position:static;flex:none}.home-intro p{font-size:20px;line-height:26px}.home-menu{left:0;display:grid;grid-template-columns:repeat(2,120px);gap:18px 36px}.home-menu a{position:relative}.home-menu a::after{content:'';position:absolute;inset:-8px -8px}.site-back{top:18px;right:18px}.section-shell{padding:72px 24px 40px}.projects-header{align-items:flex-start;flex-direction:column;gap:20px;margin-bottom:28px}.projects-header h1{font-size:26px}.project-filters{width:100%;justify-content:space-between;gap:16px}.project-filters button{font-size:18px}.project-list{gap:48px}.project-group{grid-template-columns:1fr;gap:30px}}
@media(max-height:540px) and (min-width:601px){.home-intro{margin-top:24px}.home-frame{--menu-gap:56px;--bottom-gap:26px}}
.home-intro,.home-menu,.home-contacts{transition:transform .7s cubic-bezier(.3,0,.15,1),opacity .35s ease;will-change:transform}
html.game-mode body,html.game-transition body{overflow:hidden}
.game-mode .home-intro,.game-mode .home-menu,.game-mode .home-contacts,html[data-start-game="true"] .home-intro,html[data-start-game="true"] .home-menu,html[data-start-game="true"] .home-contacts{transform:translateY(100svh);opacity:0;pointer-events:none}
.game-controls{position:fixed;z-index:5;left:50%;bottom:46px;width:519.6px;max-width:calc(100vw - 39.2px);display:flex;gap:16.8px;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,80px);transition:opacity .25s ease,transform .6s cubic-bezier(.2,.75,.2,1),visibility 0s .3s}
.game-mode .game-controls{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);transition-delay:.2s}
.game-controls button{position:relative;flex:1;min-width:0;padding:0 6px;border:0;border-radius:0;height:28px;line-height:28px;background:#000;color:#fff;font:400 20px/28px Onest,sans-serif;white-space:nowrap;cursor:pointer;transition:background .15s,opacity .2s}
.game-controls button:hover{background:#363636}.game-controls button:disabled{opacity:.4;cursor:wait}.game-controls button:focus-visible{outline:1px solid #000;outline-offset:4px}
.game-controls #game-timer{font-variant-numeric:tabular-nums}
.about-dialog{--about-scale:1.25;--about-side:min(calc(760px * var(--about-scale)),calc(100vw - 32px),calc(100svh - 32px));width:var(--about-side);height:var(--about-side);aspect-ratio:1;max-width:none;max-height:none;padding:calc(68px * var(--about-scale)) calc(36px * var(--about-scale)) calc(36px * var(--about-scale));border:3px solid #171717;border-radius:0;background:#fff;color:#000;box-shadow:0 24px 100px #0000000d;overflow:hidden;opacity:0;transform:translateY(36px) scaleY(.9);transform-origin:center bottom;transition:opacity .3s,transform .5s cubic-bezier(.2,.75,.2,1)}
.about-dialog.is-open{opacity:1;transform:none}.about-dialog::backdrop{background:#ffffffd6;backdrop-filter:blur(4px)}
.window-close{width:32px;height:32px;padding:6px;border:0;border-radius:0;display:grid;place-items:center;background:#fff;color:#000;text-decoration:none;cursor:pointer}.window-close:hover{background:#000;color:#fff}.window-close svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.5}.window-close:focus-visible{outline:1px solid #000;outline-offset:3px}
.about-close{position:absolute;right:calc(16px * var(--about-scale));top:calc(16px * var(--about-scale));width:calc(32px * var(--about-scale));height:calc(32px * var(--about-scale));padding:calc(6px * var(--about-scale))}
.about-scroll{height:100%;overflow:auto;overscroll-behavior:contain;scrollbar-width:none;padding-right:calc(12px * var(--about-scale))}.about-scroll::-webkit-scrollbar{display:none;width:0;height:0}.about-scroll:focus-visible{outline:calc(1px * var(--about-scale)) solid #000;outline-offset:calc(5px * var(--about-scale))}
.about-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:calc(28px * var(--about-scale));align-items:start}.about-photo{margin:0;position:sticky;top:0;max-width:100%}.about-photo img{display:block;width:100%;height:auto;object-fit:contain;background:#f2f2ef}
.resume{min-width:0}.resume h1{overflow-wrap:anywhere;font:700 calc(29px * var(--about-scale))/1.1 Onest,sans-serif;letter-spacing:calc(-.7px * var(--about-scale));margin:0 0 calc(12px * var(--about-scale))}.resume-role{font:400 calc(12px * var(--about-scale))/1.65 Onest,sans-serif;margin:0 0 calc(24px * var(--about-scale))}.resume-sections p,.resume-projects li{font:400 calc(12px * var(--about-scale))/1.65 Onest,sans-serif;margin:0}.resume-sections section{margin-top:calc(22px * var(--about-scale))}.resume-sections h2,.resume-experience>h2{font:700 calc(13px * var(--about-scale))/1.4 Onest,sans-serif;margin:0 0 calc(6px * var(--about-scale))}.resume-sections .resume-formula{margin-bottom:calc(12px * var(--about-scale));overflow-wrap:anywhere}.resume-experience{margin-top:calc(28px * var(--about-scale))}.resume-job{margin-top:calc(22px * var(--about-scale))}.resume-position{display:flex;flex-wrap:wrap;justify-content:space-between;gap:calc(4px * var(--about-scale)) calc(10px * var(--about-scale));font:400 calc(12px * var(--about-scale))/1.65 Onest,sans-serif;margin:0 0 calc(3px * var(--about-scale))}.resume-years{white-space:nowrap}.resume-job h3{font:700 calc(13px * var(--about-scale))/1.4 Onest,sans-serif;margin:0}.resume-projects summary{display:block;width:max-content;max-width:100%;list-style:none;cursor:pointer;color:#777;font:400 calc(12px * var(--about-scale))/1.5 Onest,sans-serif;padding:calc(4px * var(--about-scale)) 0}.resume-projects summary::-webkit-details-marker{display:none}.resume-projects summary::after{content:' +';white-space:pre;font:inherit}.resume-projects[open] summary::after{content:' −'}.resume-projects summary:hover{text-decoration:underline;text-underline-offset:calc(3px * var(--about-scale))}.resume-projects summary:focus-visible{outline:calc(1px * var(--about-scale)) solid #000;outline-offset:calc(3px * var(--about-scale))}.resume-projects ul{margin:calc(9px * var(--about-scale)) 0 0;padding-left:calc(15px * var(--about-scale))}.resume-projects li+li{margin-top:calc(7px * var(--about-scale))}
@media(max-width:600px){.home-menu{width:min(256.8px,calc(100% - 40px));grid-template-columns:repeat(2,minmax(0,120px));justify-content:center;gap:12.6px 16.8px}.home-menu a{min-width:0}.home-contacts{margin-top:22px}.about-dialog{padding:calc(62px * var(--about-scale)) calc(24px * var(--about-scale)) calc(28px * var(--about-scale))}.about-scroll{padding-right:calc(8px * var(--about-scale))}.about-layout{grid-template-columns:1fr;gap:calc(24px * var(--about-scale))}.about-photo{position:static;width:calc(130px * var(--about-scale))}.resume h1{font-size:calc(28px * var(--about-scale))}.resume-role{margin-bottom:calc(18px * var(--about-scale))}.resume-role,.resume-position,.resume-sections p,.resume-projects li{font-size:calc(13px * var(--about-scale))}.resume-sections section{margin-top:calc(18px * var(--about-scale))}.resume-projects summary{font-size:calc(13px * var(--about-scale));padding-top:calc(8px * var(--about-scale));padding-bottom:calc(8px * var(--about-scale))}}
@media(max-width:600px){.game-controls{bottom:36px;width:342.6px;max-width:calc(100vw - 37.4px);gap:12.6px}.game-controls button{height:32px;line-height:32px}.game-controls button::after{content:'';position:absolute;inset:-7px 0}}
@media(max-width:360px){.game-controls button{font-size:18px}}
@media(max-width:760px){.gallery-controls{gap:12px}.gallery-dots{gap:0}}
body:has(.project-page[open]),body:has(.about-dialog[open]){overflow:hidden}
html[data-boot="loading"] .home-intro,html[data-boot="loading"] .home-menu,html[data-boot="loading"] .home-contacts{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(28px)}
html[data-boot="revealing"] .home-menu{transition-delay:.08s}html[data-boot="revealing"] .home-contacts{transition-delay:.16s}
html[data-boot="loading"] #cube{cursor:wait}

@media(min-width:601px) and (max-height:600px){.about-layout{grid-template-columns:1fr}.about-photo{position:static;width:calc(130px * var(--about-scale))}}

.contacts-dialog{width:min(380px,calc(100vw - 32px));max-width:none;max-height:calc(100svh - 32px);padding:62px 32px 32px;border:3px solid #171717;border-radius:0;background:#fff;color:#000;overflow:auto;opacity:0;transform:translateY(14px);transition:opacity .22s ease,transform .3s cubic-bezier(.2,.75,.2,1)}
.contacts-dialog.is-open{opacity:1;transform:none}.contacts-dialog::backdrop{background:#ffffffd6;backdrop-filter:blur(4px)}.contacts-close{position:absolute;right:16px;top:16px}.contact-links{display:grid;gap:12px}.contact-links a{width:max-content;max-width:100%;color:#000;text-decoration:none;font:400 18px/1.5 Onest,sans-serif;overflow-wrap:anywhere}.contact-links a:hover{text-decoration:underline;text-underline-offset:4px}.contact-links a:focus-visible{outline:1px solid #000;outline-offset:4px}
body:has(.contacts-dialog[open]){overflow:hidden}
.project-notice{position:fixed;z-index:20;left:0;top:0;width:max-content;max-width:calc(100vw - 24px);padding:13px 20px;border:2px solid #171717;background:#fff;color:#171717;font:400 14px/1.45 Onest,sans-serif;text-align:center;pointer-events:none;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .25s ease,transform .3s ease,visibility 0s .3s}
.project-notice.is-visible{opacity:1;visibility:visible;transform:translateY(0);transition-delay:0s}
body:has(.project-notice.is-visible) .project-tooltip{opacity:0;visibility:hidden}
@media(prefers-reduced-motion:reduce){.project-notice{transition:none;transform:none}}
.resume-job-description{max-width:calc(240px * var(--about-scale));color:#777;font:400 calc(12px * var(--about-scale))/1.5 Onest,sans-serif;margin:calc(4px * var(--about-scale)) 0 0}
@media(max-width:600px){.resume-job-description{font-size:calc(13px * var(--about-scale))}}