*,:after,:before{box-sizing:border-box}:root{font-size:16px}body{--color-text:#fffefc;--color-bg:#0f1011;--color-link:#fffefc;--color-link-hover:white;--color-gradient:linear-gradient(45deg,#36f,#39f 24%,#cf9efa);color:var(--color-text);background-color:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--cursor-stroke:white;--cursor-fill:none;--cursor-stroke-width:1px;margin:0;font-family:SF Pro Text,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:400;line-height:1;overflow:hidden scroll}.off__canvas{background:var(--color-bg);width:100%;height:auto;max-height:calc(100vh - 4rem - env(safe-area-inset-bottom));z-index:1502;flex-direction:column;margin:0;transition:all .4s ease-out;display:flex;position:fixed;top:0;left:0;overflow-y:auto;transform:translateY(-100%)}.active .off__canvas{transform:translate(0,0)}.off__canvas button.close__off-canvas{margin:auto}.active:after{content:"";z-index:1501;background:#0f101180;height:100%;display:block;position:fixed;inset:0;overflow:hidden}.canvas__bottom{z-index:1503;background:linear-gradient(#0f101100 0%,#0f1011 100%);align-self:auto;margin-top:2.5rem;padding-bottom:4rem;position:sticky;bottom:0}.off__canvas .about__text{margin-top:4rem}.about__text{max-width:720px;margin:auto;padding:0 1rem}.active body,.oh{overflow:hidden}.js .loading:before,.js .loading:after{content:"";z-index:5000;position:fixed}.js .loading:before{background:var(--color-bg);width:100%;height:100%;top:0;left:0}.js .loading:after{opacity:.4;background:var(--color-gradient);border-radius:50%;width:60px;height:60px;margin:-30px 0 0 -30px;animation:.7s linear infinite alternate forwards loaderAnim;top:50%;left:50%}@keyframes loaderAnim{to{opacity:1;transform:scale(.5)}}::selection{background:#00bae280}a{color:var(--color-link);outline:none;text-decoration:none}a:hover{color:var(--color-link-hover);outline:none}a:focus{background:#d3d3d3;outline:none}a:focus:not(:focus-visible){background:0 0}a:focus-visible{background:0 0;outline:2px solid #6219ff}.unbutton{font:inherit;background:0 0;border:0;margin:0;padding:0}.unbutton:focus{outline:none}main{padding:0}.cursor{display:none}.button{pointer-events:auto;cursor:pointer;white-space:nowrap;color:var(--color-link);background:0 0;border:none;border-radius:1rem;margin:0;padding:.625rem .75rem;font-size:.75rem;line-height:1;display:block;position:relative}.button:before,.button:after{width:100%;height:100%;position:absolute;top:0;left:0}.button.accent{background:#3e4042;transition:all .2s}.button.accent:hover{color:#0f1011;background-color:#fff}.button.primary{color:#fff;font-weight:700}.button--this>span{display:inline-block}.button--this:hover>span{opacity:0}.marquee{pointer-events:none;width:100%;position:absolute;top:0;left:0;overflow:hidden}.marquee__inner{--offset:1rem;--move-initial:calc(-25% + var(--offset));--move-final:calc(-50% + var(--offset));width:fit-content;transform:translate3d(var(--move-initial),0,0);opacity:0;animation:1s linear infinite paused marquee;display:flex;position:relative}.button--this:hover .marquee__inner{opacity:1;transition-duration:.4s;animation-play-state:running}.marquee span{text-align:center;white-space:nowrap;padding:.625rem 1rem;font-style:italic}.link{cursor:pointer;white-space:nowrap;color:var(--color-text);font-size:18px;position:relative}.link:after{pointer-events:none;background:currentColor;width:100%;height:1px;position:absolute;top:100%;left:0}@keyframes marquee{0%{transform:translate3d(var(--move-initial),0,0)}to{transform:translate3d(var(--move-final),0,0)}}.link__graphic{pointer-events:none;fill:none;stroke:var(--color-link);stroke-width:1px;position:absolute;top:0;left:0}.link__graphic--stroke path{stroke-dasharray:200;stroke-dashoffset:200px}.link:hover .link__graphic--stroke path{stroke-dashoffset:0}.link__graphic--scribble{top:1.25rem}.link__graphic--scribble path{transition:stroke-dashoffset .6s cubic-bezier(.7,0,.3,1)}.link:hover .link__graphic--scribble path{transition-duration:.3s;transition-timing-function:cubic-bezier(.8,1,.7,1)}.link--scribble{font-size:.875rem}.link--scribble:before{display:none}.mono{font-family:Space Mono,monospace}h1,h2,h3,h4,h5,h6,p{margin:0 0 .5rem;font-weight:400;line-height:1.6}h4{font-size:1.125rem;font-weight:500;line-height:1.2}h5{font-size:1rem;line-height:1.2}ul{flex-flow:column wrap;align-items:flex-start;row-gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.gradient{background-color:#ddd6f3;background-image:var(--color-gradient)}.site__header{z-index:1500;backdrop-filter:blur(16px);top:0;background-color:#0f101100;justify-content:space-between;align-items:center;width:100%;min-height:4rem;padding:0 1rem 0 .5rem;display:flex;position:fixed;inset:0% 0% auto}.header__item{display:flex}.site-title{flex-direction:row;place-content:center flex-start;align-items:center;display:flex}.profile{width:2.5rem;height:2.5rem;margin:.5rem;position:relative}.gradient-border-mask{border-radius:100%;width:2.5rem;height:2.5rem;position:relative}.gradient-border-mask:before{content:"";z-index:-1;background:linear-gradient(45deg,#f93 20%,#cf9efa 80%);border-radius:100%;position:absolute;inset:0;mask:radial-gradient(circle,#0000 63%,#000 64%)}.profile img{object-fit:cover;border-radius:100%;width:2rem;height:2rem;position:absolute;inset:4px}.site__header .title{margin:0;font-size:.875rem;font-weight:500}.job__role{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.site__header .job__role span{display:none}.type__tag{margin-bottom:1rem}.app__tag{color:#f5f8fd;background:#161a22;border:1px solid #1f2939;border-radius:2rem;align-items:center;margin:0 .5rem .75rem 0;padding:.625rem 1.125rem .625rem 1rem;display:inline-flex}.app__tag span{white-space:nowrap;margin-left:.5rem;font-size:.875rem;line-height:1}.heading{font-size:clamp(2rem,10vw,8rem);font-weight:400;line-height:1.2}.heading--item{margin:2rem 1rem 1rem}.heading .splitting .word,.heading .splitting .char{display:flex}.heading .splitting .whitespace{width:.25em;height:1.2em;display:inline-block}.char-wrap{display:inline-block;position:relative;overflow:hidden}.char{will-change:transform;display:inline-block}.heading>span{justify-content:center;font-size:clamp(2rem,10vw,8rem);display:flex}.heading>span:not(:first-child){margin-top:-.5rem}.item{margin:4rem 0}.item__imgwrap,.content__imgwrap{will-change:transform;align-items:center;width:100%;min-height:100%;max-height:calc(100vh - 4rem);display:flex;overflow:hidden}.item__img,.content__img{will-change:transform;background-position:50%;background-size:cover;width:100%;height:100%;min-height:120vw}.item__meta{text-align:center;margin:1rem;font-size:1rem;font-weight:500;line-height:1.6;overflow:hidden}.item__meta .date{text-transform:uppercase;letter-spacing:.06em;font-size:.6875rem}.item__meta-row{display:block;position:relative;overflow:hidden}.item__meta-row span{will-change:transform}.type__tag span{color:#f5f8fd;background-color:#161a22;border:1px solid #1f2939;border-radius:2px;margin:.25rem .5rem .25rem 0;padding:.5rem .75rem;font-size:.875rem;line-height:1;display:inline-block}.item__enter{will-change:transform;display:none}.item__enter-circle{fill:none;stroke:#fff;stroke-width:1px;will-change:transform,opacity}.item__excerpt{text-align:center;will-change:transform;margin:0 1rem 1rem;line-height:1.2}.item__excerpt-link{cursor:pointer;color:var(--color-text);font-size:.875rem;font-weight:500;line-height:1;display:inline-block;position:relative;overflow:hidden}.item__excerpt-link span{padding-bottom:.75rem;display:inline-block;position:relative}.item__excerpt-link span:after{content:"";opacity:.5;background:#fff;width:100%;height:1px;transition:opacity .3s;position:absolute;top:calc(100% - .5rem);left:0}.item__excerpt-link span:hover:after{opacity:1}.frame--footer{border-top:1px solid #33333329;flex-flow:wrap;place-content:center space-between;align-items:center;padding:0;display:flex}.social__links,.email{flex-flow:row;place-content:center flex-start;align-items:center;display:flex}.social,.email{margin:.5rem;padding:.5rem}.email{font-size:.875rem;font-weight:500}.social .svg__icon,.social .svg__icon svg{fill:#fff;width:1rem;height:1rem}.copyright--footer{width:100%;padding:.5rem 1rem}.copyright{color:#fff;margin:0;font-size:.75rem;font-weight:500;line-height:1}.content{z-index:2000;pointer-events:none;width:100%;height:100vh;position:fixed;top:0;right:0}.content .heading{margin:4rem 0;font-size:clamp(2rem,10vw,8rem);font-weight:400}.content .heading>span{justify-content:center;font-size:clamp(2rem,10vw,8rem)}.content__article{height:0;overflow:hidden}.content__article--open{pointer-events:auto;height:100%;padding:0 0 20vh;overflow-y:scroll}.content__article .heading{text-align:center}.content__text{will-change:transform;max-width:1920px;margin:0 auto;padding:0}.section__overview{gap:2rem;margin:4rem 0;display:grid}.project__meta h5{color:#9aa0a6}.about__text h4,.about__text p.smaller--paragraph{margin-bottom:.25rem}.about__text p,.project__info p,.project__meta p{margin-bottom:1.5rem}.tech__apps{margin-top:.75rem}.content__text img{max-width:100%;margin:0 auto .5rem;display:block}.project__info,.project__meta{padding:0 1rem}.project__info{grid-area:1/1;max-width:800px}.project__meta{grid-area:2/1}.project__meta h5{margin-bottom:0}.project__meta ul{margin:.5rem 0 2rem}.site-link{color:#9aa0a6;transition:color .3s}.site-link:after{content:"↗";margin-left:.25rem}.section__column--half{grid-template-columns:1fr 1fr;gap:0 .5rem;display:grid}.section__column--third{grid-template-columns:1fr 1fr 1fr;gap:0 .5rem;display:grid}.section__design,.section__video,.section__video--full{aspect-ratio:auto 16/9;background-color:#0f1011;max-width:100%;margin:0 auto .5rem}.section__design,.section__video{justify-content:center;align-items:center;display:flex}.section__design img{width:100%;max-width:1440px;height:100%;max-height:900px;margin:0 auto}.section__video video{width:100%;max-width:1280px;height:100%;max-height:720px;margin:auto}.section__video--full video{width:100%;height:auto;display:block}.section__column--half video,.section__column--third video{width:100%;height:auto}.content__back{opacity:0;cursor:pointer;mix-blend-mode:difference;color:#fff;align-items:center;display:flex;position:absolute;top:1rem;left:1rem}.content__article--open~.content__back{pointer-events:auto}.triangle--left{border-style:solid;border-width:4px 6px 4px 0;border-color:transparent var(--color-text)transparent transparent;width:6px;height:8px}.back__button{color:var(--color-text);margin-left:.5rem;font-size:.75rem;font-weight:500;line-height:2}@media screen and (width>=53em){h4{font-size:1.25rem}h5,p,li{font-size:1.125rem}.site__header button{display:block}.site__header .job__role span{display:inline-block}main{padding:4rem 2rem}.item{grid-template:"image image image enter"minmax(420px,60vh)"meta meta meta meta"". .excerpt."/1fr auto auto 1fr;margin:8vh 0 calc(8vh + 4rem);display:grid;position:relative}.item--invert{grid-template-columns:1fr auto auto 1fr;grid-template-areas:"enter image image image""meta meta meta meta"". .excerpt."}.item__imgwrap{border-radius:.25rem;grid-area:image}.item__img{width:100%;height:100%;min-height:100%}.item__enter{z-index:1000;grid-area:enter;justify-content:center;place-self:center;align-items:center;max-width:400px;max-height:400px;display:flex;position:relative}.item__enter-circle{pointer-events:none;cursor:pointer;flex:none}.item__meta{text-align:left;grid-area:meta;justify-self:start}.item--invert .item__meta{text-align:right;justify-self:end}.item__excerpt{grid-area:excerpt;margin:0}.item__excerpt p{margin:0 0 1.5rem}.heading--item{text-align:center;grid-area:1/1/2/5;place-self:center;margin:0}.content__back{left:2rem}.content__text{padding:0 1rem}.section__overview{grid-template-columns:1fr 2fr .33fr;gap:2rem;margin:8vh 0 calc(8vh + 4rem)}.project__info{grid-area:1/2}.project__meta{grid-area:1/1}.content__text img,.section__design,.section__video,.section__video--full{border-radius:.25rem;width:100%;margin:0 auto 1rem}.section__column--half,.section__column--third{gap:0 1rem}.section__video video,.section__video--full video,.section__column--half video,.section__column--third video{border-radius:.25rem}.site-link{font-size:1.125rem}.app__tag{padding:.75rem 1.25rem .75rem 1.125rem}.type__tag span,.app__tag span{font-size:1rem}}@media (any-pointer:fine){.cursor{pointer-events:none;z-index:5000;display:block;position:fixed;top:0;left:0}.cursor__inner{fill:var(--cursor-fill);stroke:var(--cursor-stroke);stroke-width:var(--cursor-stroke-width);opacity:.7}.no-js .cursor{display:none}}