#main{position:relative}
.project-flow{position:absolute;right:max(76px,calc(var(--pad) + 20px));width:1px;z-index:2;pointer-events:none;--flow-read:0}
.project-flow-track{position:absolute;inset:0;background:#5e65523d;overflow:hidden}
.project-flow-fill{position:absolute;inset:0;background:#a8b68b72;transform:scaleY(var(--flow-read));transform-origin:top}
.project-flow-pulse{position:absolute;top:-100px;left:0;width:1px;height:100px;background:linear-gradient(transparent,#ff673b,#ffe2b7);animation:project-flow-travel 13s linear infinite paused}
.project-flow.is-flowing .project-flow-pulse{animation-play-state:running}
.project-flow-marker{position:absolute;left:0;display:flex;align-items:center;transform:translateY(-50%);color:#888e7e}
.project-flow-marker i{position:absolute;width:9px;height:9px;left:-4px;border:1px solid #727b65;border-radius:50%;background:var(--bg)}
.project-flow-marker b{position:absolute;right:13px;font:10px/1.2 var(--body);font-weight:600;letter-spacing:.04em}
.project-flow-marker.is-reached{color:var(--accent)}
.project-flow-marker.is-reached i{background:var(--accent);border-color:var(--accent);box-shadow:0 0 12px #ff673b38}
.engineer-card{position:relative;isolation:isolate}
.engineer-card-select{position:absolute;inset:0;width:100%;height:100%;padding:0;background:none;border:0;cursor:pointer;z-index:1}
.engineer-card-select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.engineer-card>.portfolio-link,.engineer-card>.button{position:relative;z-index:2}
@keyframes project-flow-travel{from{top:-100px}to{top:calc(100% + 100px)}}
@media(min-width:701px){#start>.page,#works>.page,#build>.page{padding-right:76px}}
@media(max-width:700px){
  .project-flow{right:auto;left:14px}
  .project-flow-marker b{right:auto;left:8px;font-size:8px;letter-spacing:0}
  .project-flow-marker i{width:7px;height:7px;left:-3px}
  #start>.page,#works>.page,#build>.page{padding-left:24px}
}
@media(prefers-reduced-motion:reduce){.project-flow-pulse{display:none;animation:none}}