@font-face{font-family:GeistMono;src:url('/fonts/geist-mono.woff2') format('woff2');font-display:swap}
.developer{background:#243bd1;color:#e9eeff}
.dev-header{position:absolute;inset:5% 5% auto;display:flex;align-items:center;gap:5%;font-size:clamp(8px,1.05cqw,15px);line-height:1.5}
.dev-logo{font-weight:650;font-size:clamp(25px,4.1cqw,60px);letter-spacing:-.075em;line-height:1}
.dev-logo>span{color:#ffb9dd}.dev-status{margin-left:auto}
.dev-copy{position:absolute;left:5%;top:25%;z-index:2;pointer-events:none}
.dev-copy>p{font-size:clamp(8px,1.05cqw,15px);margin-bottom:5%;color:#c2ceff}
.dev-copy h2{font-size:clamp(36px,7.8cqw,120px);font-weight:500;line-height:.96;letter-spacing:-.065em}
.dev-copy>span{display:block;margin-top:6%;font-size:clamp(9px,1.2cqw,17px);line-height:1.5;color:#c2ceff}
.dev-art{position:absolute;left:57%;top:18%;width:38%;height:53%;perspective:1000px;display:grid;place-items:center}
.dev-object{position:absolute;width:17cqw;height:17cqw;transform-style:preserve-3d;transform:rotateX(-24deg) rotateY(-33deg) rotateZ(9deg);z-index:2}
.dev-face{position:absolute;inset:0;display:grid;place-items:center;backface-visibility:hidden;font:400 7cqw/1 GeistMono,monospace;border:1px solid #e9eeff66}
.dev-front{background:#ffb9dd;color:#243bd1;transform:translateZ(8.5cqw)}
.dev-right{background:#a482d4;color:#172a79;transform:rotateY(90deg) translateZ(8.5cqw)}
.dev-top{background:#ffe2f0;color:#243bd1;transform:rotateX(90deg) translateZ(8.5cqw)}
.dev-orbit{position:absolute;width:31cqw;height:31cqw;border:1px solid #afc2ff99;border-radius:50%;transform:rotateX(62deg) rotateZ(-28deg);box-shadow:0 0 0 2.5cqw #a3b9ff08,0 0 0 5cqw #a3b9ff05}
.dev-axis{position:absolute;font:400 1.1cqw GeistMono,monospace;color:#a4baff}.dev-axis-x{right:0;top:57%}.dev-axis-y{left:43%;top:0}
.dev-work{position:absolute;inset:auto 5% 10%;z-index:3}
.dev-work-heading{display:flex;justify-content:space-between;font-size:clamp(8px,.95cqw,13px);color:#c2ceff;margin-bottom:2%}
.dev-projects{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #b7caff55}
.dev-projects button{position:relative;min-width:0;background:none;color:inherit;text-align:left;border:0;border-bottom:2px solid transparent;padding:5% 6% 5% 0;opacity:.7}
.dev-projects button+button{padding-left:7%;border-left:1px solid #b7caff55}
.dev-projects button[aria-pressed=true]{opacity:1;border-bottom-color:#ffb9dd}
.dev-projects button[aria-pressed=true]:after{content:'↗';position:absolute;right:7%;top:20%;color:#ffb9dd;font-size:1.5cqw}
.dev-projects button:hover{opacity:1;background:#e9eeff08}.dev-projects button:focus-visible{outline:2px solid #ffb9dd;outline-offset:-4px}
.dev-projects button>span{display:block;font-size:clamp(12px,1.7cqw,24px);letter-spacing:-.025em}
.dev-projects small{display:block;font-size:clamp(7px,.9cqw,13px);margin-top:6px;color:#c2ceff}
.dev-footer{position:absolute;inset:auto 0 0;height:7%;padding:0 5%;background:#122054;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:clamp(7px,.85cqw,12px)}
.dev-footer code{font:400 clamp(8px,1cqw,14px) GeistMono,monospace;white-space:nowrap}.dev-footer code span{color:#ffb9dd}.dev-footer b{font-weight:400;color:#b7caff}.dev-footer>span{color:#aab9e7}
.dev-announcement{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
[data-project=orbit] .dev-object{transform:rotateX(-15deg) rotateY(-55deg) rotateZ(-18deg) scale(.8)}
[data-project=orbit] .dev-orbit{transform:rotateX(18deg) rotateZ(22deg) scale(.95);border-width:3px}
[data-project=grid] .dev-object{transform:rotateX(-35deg) rotateY(-45deg) rotateZ(0deg) scale(.88)}
[data-project=grid] .dev-face{background-color:#d8e4ff;background-image:linear-gradient(#243bd133 1px,transparent 1px),linear-gradient(90deg,#243bd133 1px,transparent 1px);background-size:25% 25%;color:#243bd1}
[data-project=grid] .dev-orbit{transform:rotateX(55deg) rotateZ(45deg);border-radius:0}
@container(max-width:600px){
 .dev-header{top:5%;gap:8%;font-size:2.1cqw}.dev-logo{font-size:8cqw}.dev-status{display:none}
 .dev-copy{top:20%;left:6%}.dev-copy>p{font-size:2.3cqw;margin-bottom:5%}.dev-copy h2{font-size:12cqw}.dev-copy>span{font-size:2.4cqw;margin-top:5%}
 .dev-art{left:48%;top:40%;width:48%;height:29%}.dev-object{width:23cqw;height:23cqw}.dev-face{font-size:10cqw}.dev-front{transform:translateZ(11.5cqw)}.dev-right{transform:rotateY(90deg) translateZ(11.5cqw)}.dev-top{transform:rotateX(90deg) translateZ(11.5cqw)}.dev-orbit{width:43cqw;height:43cqw}.dev-axis{font-size:2.5cqw}
 .dev-work{bottom:10%}.dev-work-heading{font-size:2cqw;margin-bottom:4%}.dev-projects button{padding-top:12%;padding-bottom:12%}.dev-projects button>span{font-size:3.5cqw}.dev-projects small{font-size:1.9cqw;max-width:12ch;line-height:1.4}.dev-projects button[aria-pressed=true]:after{font-size:3cqw;top:10%;right:5%}
 .dev-footer{font-size:1.8cqw}.dev-footer code{font-size:2cqw}.dev-footer>span{max-width:12ch;text-align:right}
}

@media(max-width:650px){
 .developer.is-full .dev-header{font-size:11px;gap:24px}.developer.is-full .dev-logo{font-size:35px}
 .developer.is-full .dev-copy{top:19%}.developer.is-full .dev-copy>p{font-size:11px}.developer.is-full .dev-copy h2{font-size:clamp(44px,12cqw,70px)}.developer.is-full .dev-copy>span{font-size:13px}
 .developer.is-full .dev-art{left:33%;width:62%;top:43%;height:23%}.developer.is-full .dev-object{width:29cqw;height:29cqw}.developer.is-full .dev-face{font-size:12cqw}.developer.is-full .dev-front{transform:translateZ(14.5cqw)}.developer.is-full .dev-right{transform:rotateY(90deg) translateZ(14.5cqw)}.developer.is-full .dev-top{transform:rotateX(90deg) translateZ(14.5cqw)}.developer.is-full .dev-orbit{width:53cqw;height:53cqw}
 .developer.is-full .dev-work-heading{font-size:10px}.developer.is-full .dev-projects button>span{font-size:15px}.developer.is-full .dev-projects small{font-size:10px}.developer.is-full .dev-footer code{font-size:9px}.developer.is-full .dev-footer>span{font-size:8px}
}