:root{color-scheme:dark;--bg: #0c0c0c;--ink: #f2f2f0;--soft: #a4a4a0;--dim: #6c6c69;--line: #2a2a28;--serif: var(--font-young-serif), "Instrument Serif", "Times New Roman", serif;--sans: var(--font-instrument-sans), system-ui, -apple-system, "Segoe UI", sans-serif;--mono: var(--font-jetbrains-mono), ui-monospace, Menlo, Consolas, monospace;--body-size: 17px;--body-leading: 1.6;--pad: clamp(20px, 4.5vw, 72px);box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-right:env(safe-area-inset-right,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);background:var(--bg)}*,*:before,*:after{box-sizing:inherit}html{scroll-behavior:smooth;scroll-padding-top:64px;background:var(--bg)}body{margin:0;background:var(--bg);color:var(--ink);font:400 var(--body-size) / var(--body-leading) var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:1px solid var(--ink);outline-offset:4px}.skip-link,.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link:focus{z-index:50;top:12px;left:12px;width:auto;height:auto;padding:10px 14px;margin:0;clip:auto;background:var(--ink);color:var(--bg)}.mono{color:var(--soft);font-family:var(--mono);font-size:12px;font-weight:300;letter-spacing:.02em}.muted{color:var(--soft)}.note{margin:0}nav{position:fixed;z-index:20;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:calc(18px + env(safe-area-inset-top,0px)) calc(var(--pad) + env(safe-area-inset-right,0px)) 16px calc(var(--pad) + env(safe-area-inset-left,0px));border-bottom:1px solid transparent;font:300 12px var(--mono);transition:background .3s,border-color .3s}nav.solid{border-color:var(--line);background:#0c0c0cd1;backdrop-filter:blur(10px)}nav .links{display:flex;gap:clamp(12px,3vw,34px)}nav a{color:var(--soft);transition:color .2s}nav a:hover,nav .name{color:var(--ink)}.hero{position:relative;display:grid;min-height:100svh;align-content:end;overflow:hidden;padding:0 var(--pad) clamp(36px,7vh,80px)}.hero canvas,.terrain-band canvas{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:pan-y}.terrain-touch-zone{display:none}@media(max-width:700px){.terrain-touch-zone{position:absolute;inset:0 0 50%;z-index:1;display:block;touch-action:none}}.hero:after{position:absolute;inset:0;background:linear-gradient(to top,var(--bg) 0%,rgb(12 12 12 / 78%) 22%,transparent 58%),linear-gradient(to right,rgb(12 12 12 / 80%),transparent 62%);content:"";pointer-events:none}.hero-content{position:relative;z-index:2;pointer-events:none}.hero-content a{pointer-events:auto}.tag{margin:0 0 clamp(16px,3vh,32px)}h1{margin:0;font:400 clamp(3.2rem,9vw,9rem) / .94 var(--serif);letter-spacing:-.035em}h1 span{display:block}h1 span+span{padding-left:clamp(0px,13vw,220px);font-style:italic}.under{display:grid;max-width:1200px;grid-template-columns:1fr;gap:28px;margin-top:clamp(28px,6vh,64px)}.under p{max-width:34ch;margin:0;color:var(--soft);font-size:clamp(17px,1.5vw,20px);line-height:1.45}.cta{display:flex;flex-wrap:wrap;gap:14px}.button{display:inline-block;padding:13px 22px;border:1px solid var(--ink);font:600 13px var(--mono);transition:background .25s,color .25s,border-color .25s}.main-button{background:var(--ink);color:var(--bg)}.main-button:hover{background:transparent;color:var(--ink)}.alt-button{border-color:var(--dim);color:var(--soft)}.alt-button:hover{border-color:var(--ink);color:var(--ink)}.hint{position:absolute;z-index:2;top:calc(74px + env(safe-area-inset-top,0px));right:calc(var(--pad) + env(safe-area-inset-right,0px));pointer-events:none}.load{transform:translateY(14px);animation:rise 1.1s cubic-bezier(.2,.7,.2,1) forwards;opacity:0}.delay-one{animation-delay:.15s}.delay-two{animation-delay:.45s}.delay-three{animation-delay:.75s}@keyframes rise{to{transform:none;opacity:1}}.section{position:relative;padding:clamp(80px,14vh,170px) var(--pad)}.wrap{max-width:1360px;margin:0 auto}.section-head{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:clamp(36px,7vh,80px)}.section-head h2{margin:0;font:400 clamp(2rem,4.5vw,4rem) / 1.02 var(--serif);letter-spacing:-.025em}.project{position:relative;display:grid;gap:18px;padding:42px 0 46px}.project h3{margin:0;font:400 clamp(1.3rem,2vw,1.8rem) / 1.14 var(--serif)}.project-corner{position:absolute;color:var(--dim);font:12px/1.05 var(--mono);opacity:0;transition:opacity .2s}.project:hover .project-corner,.project:focus-within .project-corner{opacity:1}.project-frame-char{display:inline-block}.project-frame-char:before{content:attr(data-char)}.project:hover .project-frame-char:before,.project:focus-within .project-frame-char:before{animation-duration:var(--flicker-duration);animation-timing-function:steps(1,end);animation-delay:var(--flicker-delay);animation-iteration-count:infinite}.project:hover .project-frame-char.horizontal:before,.project:focus-within .project-frame-char.horizontal:before{animation-name:horizontal-flicker}.project:hover .project-frame-char.vertical:before,.project:focus-within .project-frame-char.vertical:before{animation-name:vertical-flicker}.project:hover .project-frame-char.corner:before,.project:focus-within .project-frame-char.corner:before{animation-name:corner-flicker}@keyframes horizontal-flicker{0%,24%{content:"-"}25%,49%{content:"~"}50%,74%{content:"="}75%,to{content:"–"}}@keyframes vertical-flicker{0%,24%{content:"|"}25%,49%{content:"!"}50%,74%{content:"/"}75%,to{content:":"}}@keyframes corner-flicker{0%,24%{content:"+"}25%,49%{content:"x"}50%,74%{content:"*"}75%,to{content:"#"}}.project-corner.top-left{top:10px;left:0}.project-corner.top-right{top:10px;right:0;text-align:right}.project-corner.bottom-left{bottom:10px;left:0}.project-corner.bottom-right{right:0;bottom:10px;text-align:right}.project p{max-width:52ch;margin:10px 0 0;color:var(--soft)}.project-role{margin-top:2px;color:var(--dim)}.project-side{display:grid;align-content:start;gap:14px;color:var(--soft);font-size:15px}.project-side>div{display:grid}.label{margin-bottom:2px;color:var(--dim)}.repo-link{width:fit-content;transition:color .2s}.repo-link:hover{color:var(--ink)}.about{display:grid;gap:40px}.about-lead{max-width:22ch;margin:0;font:400 clamp(1.5rem,2.5vw,2.2rem) / 1.16 var(--serif);letter-spacing:-.015em}.about-inner{display:grid;gap:32px}.about-body{display:grid;max-width:58ch;gap:18px;color:var(--soft)}.about-body p{margin:0}.facts{display:grid;gap:10px;margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}.job{display:grid;gap:8px;padding:28px 0;border-top:1px solid var(--line)}.job:last-child{border-bottom:1px solid var(--line)}.job h3{margin:0;font:400 clamp(1.3rem,2vw,1.8rem) / 1.14 var(--serif)}.job h3 .mono{font-size:12px}.job p{max-width:60ch;margin:0;color:var(--soft);font-size:16px}.terrain-band{position:relative;height:clamp(220px,38vh,420px);overflow:hidden;mask-image:linear-gradient(to bottom,transparent,#000 45%)}.contact{padding-top:clamp(40px,8vh,90px)}.contact h2{margin:0 0 36px;font:400 clamp(2.4rem,6.5vw,6.5rem) / .96 var(--serif);letter-spacing:-.035em}.contact h2 em{display:block;padding-left:clamp(0px,9vw,150px)}.mail{display:inline-block;padding-bottom:4px;border-bottom:1px solid var(--dim);font-size:clamp(1.1rem,2.2vw,1.7rem);transition:border-color .25s}.mail:hover{border-color:var(--ink)}.social{display:flex;flex-wrap:wrap;gap:28px;margin-top:34px}.social a{transition:color .2s}.social a:hover{color:var(--ink)}footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding:28px calc(var(--pad) + env(safe-area-inset-right,0px)) calc(32px + env(safe-area-inset-bottom,0px)) calc(var(--pad) + env(safe-area-inset-left,0px));border-top:1px solid var(--line)}#tbtn{position:fixed;z-index:31;right:calc(var(--pad) + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));padding:10px 16px;border:1px solid var(--dim);background:#0c0c0cd9;color:var(--ink);font:300 12px var(--mono);cursor:pointer;backdrop-filter:blur(8px);transition:border-color .2s}#tbtn:hover{border-color:var(--ink)}#panel{position:fixed;z-index:30;inset:0 0 0 auto;width:min(350px,100vw - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px));overflow-y:auto;padding:calc(64px + env(safe-area-inset-top,0px)) calc(22px + env(safe-area-inset-right,0px)) calc(96px + env(safe-area-inset-bottom,0px)) calc(22px + env(safe-area-inset-left,0px));transform:translate(102%);visibility:hidden;border-left:1px solid var(--line);background:#0e0e0ef7;color:var(--soft);font:300 11px / 1.4 var(--mono);transition:transform .45s cubic-bezier(.2,.7,.2,1),visibility 0s linear .45s}#panel.open{transform:none;visibility:visible;transition-delay:0s}#panel h3{margin:28px 0 14px;padding-top:14px;border-top:1px solid var(--line);color:var(--ink);font:400 11px var(--mono)}#panel h3:first-child{margin-top:0;padding-top:0;border-top:0}.control-field{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;margin-bottom:14px}.control-field output{color:var(--ink)}.control-field input[type=range]{width:100%;height:18px;grid-column:1 / -1;margin:0;accent-color:var(--ink)}.control-field input[type=text]{grid-column:1 / -1;padding:7px 9px;border:1px solid var(--line);border-radius:0;background:var(--bg);color:var(--ink);font:400 12px var(--mono)}.control-field input[type=checkbox]{justify-self:end;accent-color:var(--ink)}#json{width:100%;height:220px;padding:10px;border:1px solid var(--line);border-radius:0;background:var(--bg);color:var(--soft);font:300 11px / 1.5 var(--mono);resize:vertical}.panel-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.panel-buttons button{padding:8px 12px;border:1px solid var(--dim);background:transparent;color:var(--ink);font:400 11px var(--mono);cursor:pointer;transition:border-color .2s}.panel-buttons button:hover{border-color:var(--ink)}#status{min-height:16px;margin-top:10px;color:var(--ink)}@media(min-width:860px){nav{font-size:14px}.under{grid-template-columns:minmax(0,1fr) auto;align-items:end;padding-left:clamp(0px,13vw,220px)}.section-head{grid-template-columns:3fr 9fr;align-items:baseline}.project{grid-template-columns:3fr 6fr 3fr;gap:32px}.about{grid-template-columns:3fr 9fr}.about-inner{grid-template-columns:7fr 5fr;gap:56px}.job{grid-template-columns:3fr 4fr 5fr;gap:32px}}@media(max-width:700px){nav{align-items:flex-start;flex-direction:column;gap:8px}nav .links{width:100%;justify-content:space-between;gap:8px;font-size:10px}.hint{display:none}footer span:last-child{display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.load{transform:none;animation:none;opacity:1}.project-corner,.project-frame-char:before,#panel{transition:none}.project-frame-char:before{animation:none!important}}
