.project-template{--salmon:#DE826D;--cream:#F3E0D1;--peach:#E8B19D;--mauve:#A06069;--maroon:#62232D;--band-salmon:#DE826D22;--band-peach:#E8B19D22;--band-mauve:#A0606922;--band-maroon:#62232D22;--ink:#000;--band-about: #D56A6A;--band-tech: #FF8E86;--band-graph: #F2B3A5;--band-other: #F6D2CC;--band-about-h: #B8565F;--band-tech-h: #E26E63;--band-graph-h: #D99689;--band-other-h: #E9B7AF;--proj-head-h: 56px;--proj-nav-h: 40px;color:var(--ink);width:100%}.project-template,.project-template *{box-sizing:border-box}.project-template .proj-head{position:sticky;top:0;z-index:100;height:var(--proj-head-h);display:grid;grid-template-columns:auto 2fr 1fr;align-items:center;gap:12px;background:linear-gradient(90deg,#f7d9d1,#f3c2b6 55%,#f0b0b6)}.project-template .proj-logo{display:inline-flex;align-items:center;justify-content:center;line-height:0;margin-left:16px}.project-template .proj-logo img{width:26px;height:auto;display:block}.project-template .proj-head__text{font-size:clamp(16px,1.6vw,22px);line-height:1.1;padding:0 10px}.project-template .proj-head__title{margin:0;height:100%;width:100%;display:flex;align-items:center;padding:0 16px;justify-self:start;font-size:clamp(16px,1.6vw,22px);font-weight:400;background-color:#ffffffb3;border-left:1px solid rgba(0,0,0,.08)}.project-template .proj-nav{position:sticky;top:var(--proj-head-h);z-index:99;height:var(--proj-nav-h);display:grid;grid-template-columns:repeat(4,1fr)}.project-template .proj-nav__link{text-decoration:none;color:var(--ink);text-align:center;height:100%;display:grid;place-items:center;padding:0 10px;font-size:14px;transition:color .16s ease,background-color .16s ease,letter-spacing .16s ease,filter .16s ease}.project-template .proj-nav__link:nth-child(1){background:var(--band-about)}.project-template .proj-nav__link:nth-child(2){background:var(--band-tech)}.project-template .proj-nav__link:nth-child(3){background:var(--band-graph)}.project-template .proj-nav__link:nth-child(4){background:var(--band-other)}.project-template .proj-nav__link:hover,.project-template .proj-nav__link:focus-visible{color:var(--maroon);letter-spacing:.2em;filter:brightness(.97);font-weight:500}.project-template .proj-nav__link:nth-child(1):hover,.project-template .proj-nav__link:nth-child(1):focus-visible{background:var(--band-about-h)}.project-template .proj-nav__link:nth-child(2):hover,.project-template .proj-nav__link:nth-child(2):focus-visible{background:var(--band-tech-h)}.project-template .proj-nav__link:nth-child(3):hover,.project-template .proj-nav__link:nth-child(3):focus-visible{background:var(--band-graph-h)}.project-template .proj-nav__link:nth-child(4):hover,.project-template .proj-nav__link:nth-child(4):focus-visible{background:var(--band-other-h)}.project-template .proj-nav__link.is-active{color:var(--maroon);filter:brightness(.92)}.project-template .proj-body{padding:18px;display:grid;gap:22px;scroll-margin-top:calc(var(--proj-head-h) + var(--proj-nav-h) + 12px)}.project-template .proj-body{padding-top:24px}.project-template .proj-row3{display:grid;grid-template-columns:2fr 1fr;gap:26px}.project-template .proj-text{margin:0;white-space:pre-wrap;line-height:1.35}.project-template .proj-meta{margin:0;display:grid;row-gap:.6em}.project-template .proj-meta__item{display:grid;grid-template-columns:110px 1fr;column-gap:14px;align-items:baseline}.project-template .proj-meta dt{opacity:.75;position:relative;padding-right:14px}.project-template .proj-meta dt:after{content:":";position:absolute;right:4px;opacity:.9}.project-template .proj-meta dd{margin:0}.project-template .proj-gallery{width:100%;max-width:100vw;display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start;justify-content:flex-start}.project-template .proj-gallery__cell{height:min(50vh,320px);flex:0 1 auto;max-width:100%;background:#dedede;overflow:hidden;display:flex;align-items:center;justify-content:center}.project-template .proj-gallery__cell img,.project-template .proj-gallery__cell video,.project-template .proj-media{height:100%;width:auto;max-width:100%;display:block;object-fit:contain;object-position:center}.project-template .proj-row5{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:26px;align-items:start}.project-template .proj-col{min-width:0}@media (max-width: 900px){.project-template{--proj-head-h: 64px;--proj-nav-h: 44px}.project-template .proj-head{grid-template-columns:auto 1fr}.project-template .proj-head__title{grid-column:1 / -1;border-left:none;border-top:1px solid rgba(0,0,0,.08)}.project-template .proj-nav{grid-template-columns:1fr 1fr}.project-template .proj-row3{grid-template-columns:1fr}.project-template .proj-gallery__cell{height:min(50vh,280px)}.project-template .proj-row5{grid-template-columns:1fr}}@media (prefers-reduced-motion: reduce){.project-template .proj-nav__link{transition:none}.project-template .proj-nav__link:hover,.project-template .proj-nav__link:focus-visible{letter-spacing:normal;filter:none}.project-template .proj-gallery{grid-template-columns:1fr;grid-auto-rows:min(40vh,240px)}}.project-template .proj-desc-section{margin-bottom:14px}.project-template .proj-minihead{margin:0 0 8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--maroon)}.project-template .proj-desc{margin:0;line-height:1.35}.project-template .proj-bullets{margin:10px 0 0 18px;padding:0}.project-template .proj-bullets li{margin:6px 0}.project-template .proj-subposters{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:18px}.project-template .proj-poster{margin:0}.project-template .proj-poster__img{width:100%;height:auto;display:block;background:#dedede}.project-template .proj-caption{margin-top:6px;font-size:12px;opacity:.75}.project-template .proj-mainposter{width:100%}.project-template .proj-slider{margin-top:22px}.project-template .slider-container{position:relative;width:100%;overflow:hidden;padding:10px}.project-template .slider{display:flex;transition:transform .5s ease-in-out;will-change:transform}.project-template .slide{min-width:100%;display:flex;justify-content:center;align-items:center}.project-template .proj-slide-media{width:100%;height:auto;max-height:50vh;object-fit:contain;display:block}.project-template .navigation-buttons{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.project-template .navigation-buttons .prev,.project-template .navigation-buttons .next{pointer-events:auto;border:none;background:#ffffffa6;color:var(--maroon);width:44px;height:44px;font-size:20px;cursor:pointer;display:grid;place-items:center;transition:background-color .16s ease,transform .16s ease}.project-template .navigation-buttons .prev:hover,.project-template .navigation-buttons .next:hover{background:#ffffffd9;transform:scale(1.03)}@media (max-width: 900px){.project-template .proj-subposters{grid-template-columns:1fr}}@media (max-width: 520px){.project-template .proj-gallery__cell{height:min(50vh,240px)}}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-cyrillic-ext-wght-normal-BOeWTOD4.woff2) format("woff2-variations");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-cyrillic-wght-normal-DqGufNeO.woff2) format("woff2-variations");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-greek-ext-wght-normal-DlzME5K_.woff2) format("woff2-variations");unicode-range:U+1F00-1FFF}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-greek-wght-normal-CkhJZR-_.woff2) format("woff2-variations");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-vietnamese-wght-normal-CBcvBZtf.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-latin-ext-wght-normal-DO1Apj_S.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-latin-wght-normal-Dx4kXJAl.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--salmon:#DE826D;--cream:#F3E0D1;--peach:#E8B19D;--mauve:#A06069;--maroon:#62232D;--band-salmon:#DE826D22;--band-peach:#E8B19D22;--band-mauve:#A0606922;--band-maroon:#62232D22;--ink:#000;--gap: clamp(12px, 1.6vw, 24px);--intro-h: clamp(80px, 18vw, 200px);--hover-size: 1.5em;--foot-hover-size: 2em;--thumb-h: clamp(12px, 7vw, 35px);--zoom: 10;--logo-min: 28px;--logo-ideal: 4vw;--logo-max: 48px;--logo-hover-scale: 1.16;--fs-hero: clamp(18px, 4.4vw, 44px);--fs-sub: clamp(18px, 1.6vw, 20px);--fs-footer: clamp(14px, 1.5vw, 18px);--fs-proj: clamp(12px, 1.25vw, 16px);--fs-meta: .62em;--fs-meta-sup: .5em}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;color:var(--ink);font-family:Source Code Pro,source-code-pro,ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;-webkit-font-smoothing:antialiased;background:#fff}.main{grid-area:content;display:contents}.page-grid{min-height:100vh;display:grid;grid-template-columns:clamp(56px,6vw,88px) 1fr;grid-template-rows:var(--intro-h) 1fr auto;grid-template-areas:"logo intro" "logo content" "footer footer";column-gap:clamp(12px,2vw,28px)}.page-grid--project{grid-template-columns:1fr;grid-template-rows:1fr;grid-template-areas:"content";column-gap:0}.page-grid--project .main{display:block}.main--project{grid-area:content;display:block}.header{grid-area:logo;display:flex;align-items:flex-start;gap:12px;padding:clamp(30px,.6vw,30px);overflow:visible}.logo-link{display:inline-block;line-height:0;border-radius:6px;outline-offset:2px}.logo{width:clamp(var(--logo-min),var(--logo-ideal),var(--logo-max));height:auto;transform-origin:left top;will-change:transform,filter;transition:transform .25s cubic-bezier(.2,.7,.2,1),filter .2s ease}.logo-link:hover .logo,.logo-link:focus-visible .logo{transform:scale(var(--logo-hover-scale));filter:saturate(1.04) contrast(1.02)}.logo-link:focus-visible{outline:2px solid rgba(0,0,0,.28)}.top-nav{display:none}.foot{grid-area:footer;padding:clamp(8px,1.4vw,14px) clamp(12px,1.6vw,20px);font-size:var(--fs-footer);display:flex;align-items:center;flex-wrap:wrap;gap:clamp(6px,.8vw,12px)}.foot-link{color:inherit;text-decoration:none;transition:font-size .22s cubic-bezier(.2,.7,.2,1),letter-spacing .22s ease,color .18s ease}.foot-link:hover,.foot-link:focus-visible{font-size:var(--foot-hover-size);letter-spacing:.02em;color:var(--maroon);outline:none}.hero{grid-area:intro;position:relative;height:var(--intro-h);padding:clamp(30px,.6vw,30px) clamp(10px,1.6vw,20px) 0 0;overflow:visible;z-index:1}.intro{line-height:1.15;font-size:var(--fs-hero);max-width:100%;word-spacing:clamp(2px,.3vw,10px);letter-spacing:-.003em;margin:0}.intro .line{display:block}.mono{font-weight:400}.name{color:var(--peach);font-weight:700}.comma{margin-right:.15em}.sub{margin-top:clamp(10px,1.4vw,16px);max-width:720px;font-size:var(--fs-sub)}.grow-band{position:relative;display:inline;text-decoration:none;padding:0 .05em;line-height:1;transition:font-size .26s cubic-bezier(.2,.7,.2,1),color .18s ease}.grow-band:before{content:"";position:absolute;top:.15em;right:0;bottom:.06em;left:0;border-radius:4px;background:transparent;opacity:0;pointer-events:none;transition:opacity .18s ease,background-color .18s ease;z-index:-1}.grow-band:hover,.grow-band:focus-visible{font-size:var(--hover-size);outline:none}.grow-band:hover:before,.grow-band:focus-visible:before{opacity:1}.grow-band[data-role=tech]{color:var(--salmon)}.grow-band[data-role=graphic]{color:var(--mauve)}.grow-band[data-role=anything]{color:var(--maroon)}.grow-band[data-role=fany]:hover,.grow-band[data-role=fany]:focus-visible{color:var(--peach)}.grow-band[data-role=fany]:before{background:var(--band-peach)}.grow-band[data-role=tech]:before{background:var(--band-salmon)}.grow-band[data-role=graphic]:before{background:var(--band-mauve)}.grow-band[data-role=anything]:before{background:var(--band-maroon)}.grow-band.is-current{font-size:var(--hover-size)}.grow-band.is-current:before{opacity:1}.intro:has(.grow-band:hover) .grow-band.is-current:not(:hover){font-size:inherit}.intro:has(.grow-band:hover) .grow-band.is-current:not(:hover):before{opacity:0}.projects{grid-area:content;z-index:0}.projects.projects--grid{display:grid;column-gap:clamp(20px,2vw,28px);row-gap:clamp(2px,.4vw,8px);align-items:start;justify-items:start;align-content:start;grid-auto-rows:min-content;width:60vw;overflow:visible}.projects.techdesigner-page,.projects.graphicdesigner-page{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.proj-card{position:relative;margin:0;padding:0;overflow:visible}.proj-card-link{display:block;color:inherit;text-decoration:none}.proj-card-link:focus-visible{outline:2px solid rgba(160,96,105,.8);outline-offset:4px}.proj-row{position:relative;display:block;--row-lh: 1.02;font-size:var(--fs-proj);line-height:var(--row-lh)}.proj-row .row-top{display:grid;grid-template-columns:max-content auto auto auto;column-gap:clamp(10px,1.2vw,18px);align-items:end}.projects .title{display:inline-block;color:inherit;letter-spacing:0;word-spacing:0;padding-right:0;transition:color .22s ease,letter-spacing .35s cubic-bezier(.2,.7,.2,1),word-spacing .35s cubic-bezier(.2,.7,.2,1),padding-right .35s cubic-bezier(.2,.7,.2,1)}.proj-card:hover .title,.proj-card:focus-within .title{color:var(--maroon);letter-spacing:.03em;word-spacing:.12em;padding-right:.35em}.meta-block{display:flex;flex-direction:column;align-items:flex-start;line-height:1;gap:.15em;font-size:var(--fs-meta);color:#121212;transform:translateY(.05em)}.meta-block .num{font-variant-numeric:tabular-nums}.meta-block .label{text-transform:none;opacity:.9}.meta-sup{font-size:var(--fs-meta-sup);vertical-align:super;margin-left:.25em;color:#6a6a6a;letter-spacing:.01em}.meta-sup .num{font-variant-numeric:tabular-nums;margin-right:.15em}.meta-sup .label{text-transform:none}.thumb-wrap{position:relative;display:inline-block;overflow:visible}.thumb{position:relative;display:inline-block;width:100%;height:var(--thumb-h);border-radius:3px;overflow:hidden;background:#dedede;transform-origin:top left;transform:scale(1);z-index:0;will-change:transform,filter,box-shadow;transition:transform .36s cubic-bezier(.2,.7,.2,1),filter .26s ease,box-shadow .26s ease}.thumb img,.thumb video{width:100%;height:100%;object-fit:cover;display:block}.proj-card:hover .thumb,.proj-card:focus-within .thumb,.thumb:hover,.thumb:focus{transform:scale(var(--zoom));z-index:9999;box-shadow:0 14px 44px #00000047;filter:saturate(1.05) contrast(1.03)}@media (prefers-reduced-motion:reduce){.grow-band,.grow-band:before,.foot-link,.projects .title,.thumb,.logo{transition:none}}@media (max-width:860px){.projects.projects--grid{grid-template-columns:1fr;width:100%}:root{--intro-h: clamp(120px, 24vw, 200px)}}.content-scroll{grid-area:content;min-height:0;height:100%;overflow:auto;padding-right:clamp(6px,.6vw,12px)}.resume-grid{display:grid;grid-template-columns:3fr 2fr;gap:clamp(18px,3vw,36px) clamp(22px,3vw,48px);align-items:start;padding-right:clamp(4px,.4vw,8px)}.resume-h{margin:clamp(10px,1.6vw,18px) 0 clamp(6px,1vw,12px) 0;font-weight:700;font-size:clamp(12px,2.2vw,20px);letter-spacing:.02em;color:var(--mauve)}.resume-list{list-style:none;margin:0 0 clamp(18px,2.2vw,28px) 0;padding:0;display:grid;row-gap:clamp(10px,1.2vw,16px)}.resume-item{display:grid;grid-template-columns:clamp(16px,1.6vw,20px) 1fr;align-items:start;column-gap:clamp(8px,1vw,12px)}.star{width:clamp(14px,1.6vw,18px);height:auto;transform:translateY(2px);opacity:.9}.resume-item__body{min-width:0}.resume-line{font-size:var(--fs-proj);line-height:1.12}.resume-strong{font-weight:600}.resume-meta{font-size:clamp(12px,1vw,14px);color:#5e5e5e;margin-top:.15em}.reachout{font-size:var(--fs-proj);max-width:720px;margin-top:clamp(10px,1.4vw,16px)}
