*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:#000;color:#eee;font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid #b829f7;outline-offset:7px}header{position:absolute;z-index:5;top:0;width:100%;padding:35px 5%;display:flex;justify-content:space-between;align-items:center}.brand{font-size:19px;font-weight:800;letter-spacing:-.7px}.brand span{display:block;font-size:8px;font-weight:400;letter-spacing:2.5px;margin-top:7px;color:#ddd}nav{display:flex;gap:40px;font-size:12px}.visual{position:fixed;inset:0;pointer-events:none;z-index:-1}canvas{width:100%;height:100%;display:block}.fallback{position:absolute;left:48%;top:25%;width:40vw;height:40vw;border:2px solid #b829f7;border-radius:50%;box-shadow:0 0 90px #b829f744,inset 0 0 80px #b829f733;transform:rotate(-35deg) scaleY(.55);z-index:-1}.webgl .fallback{display:none}.hero{min-height:100svh;padding:170px 8% 55px;position:relative}.eyebrow{font-size:10px;letter-spacing:2.4px;font-weight:600;color:#ddd}.hero h1{font-size:clamp(80px,10.4vw,160px);line-height:.89;letter-spacing:-.075em;margin:42px 0 28px;font-weight:600}em{font-style:normal;color:#b829f7}p{font-size:16px;line-height:1.7;color:#ddd;max-width:390px}.scroll{display:flex;align-items:center;gap:45px;font-size:9px;letter-spacing:2px;margin-top:50px}.scroll span{font-size:24px}.coordinate{position:absolute;right:5%;bottom:55px;font-size:9px;letter-spacing:2px;color:#ddd}.chapter{min-height:100svh;padding:22vh 8% 15vh;display:flex;flex-direction:column;justify-content:center}.chapter h2,.work h2,.contact h2{font-size:clamp(48px,6.5vw,100px);line-height:1.02;letter-spacing:-.06em;font-weight:500;margin:35px 0 20px}.chapter.right{padding-left:56%}.annotation{font-size:9px;letter-spacing:2px;color:#b829f7;margin-top:38px}.text-link{font-size:13px;margin-top:25px}.work{background:#000;padding:120px 8%;border-top:1px solid #222}.section-top{display:flex;justify-content:space-between;font-size:9px;letter-spacing:2px}.projects{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:70px}.project-art{height:260px;display:flex;position:relative;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#b829f71c,transparent 70%);border:1px solid #252525;font-size:150px;color:#b829f7;overflow:hidden;transition:background .3s,transform .3s}.project-art i{font-size:18px;font-style:normal;position:absolute;right:20px;top:20px;color:#eee}.projects a:hover .project-art{background:#b829f72a;transform:translateY(-5px)}.hardware{background:repeating-linear-gradient(0deg,transparent,transparent 23px,#ffffff09 24px),repeating-linear-gradient(90deg,transparent,transparent 23px,#ffffff09 24px)}.radio{border-radius:50% 50% 0 0}.projects small{display:block;font-size:9px;letter-spacing:1.5px;margin-top:28px;color:#ddd}.projects h3{font-size:32px;line-height:1.08;font-weight:500;letter-spacing:-1px}.projects p{font-size:14px;min-height:95px}.projects b{font-size:11px;font-weight:400}.contact{padding:120px 8% 25px;background:#080808}.contact>a{display:inline-block;margin:25px 0 100px;font-size:clamp(16px,2.5vw,32px);border-bottom:1px solid #555;padding-bottom:12px}footer{border-top:1px solid #333;padding-top:30px;display:flex;gap:25px;justify-content:space-between;font-size:9px;letter-spacing:1px}footer button{font-size:9px;letter-spacing:1px}.progress{position:fixed;bottom:0;left:0;height:2px;background:#b829f7;width:0;z-index:10}.skip{position:fixed;top:-60px;left:20px;background:#000;padding:15px;z-index:20}.skip:focus{top:10px}@media(max-width:700px){header{padding:25px 6%}nav{gap:18px;font-size:10px}.brand{font-size:15px}.brand span{font-size:6px}.hero{padding:155px 7% 40px}.hero h1{font-size:91px}.hero p{font-size:14px;max-width:290px}.coordinate{display:none}.chapter,.chapter.right{padding:20vh 7%;justify-content:flex-end}.chapter h2{font-size:56px}.chapter p{font-size:15px;max-width:310px;text-shadow:0 2px 15px #000}.projects{grid-template-columns:1fr;gap:60px}.project-art{height:260px}.projects p{min-height:0}.work{padding:80px 7%}.contact{padding:80px 7% 30px}.section-top>span:last-child{display:none}footer{flex-wrap:wrap;line-height:2}.fallback{width:80vw;height:80vw;left:30%;top:35%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media(max-width:700px){.visual:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0008 0%,#0009 55%,transparent 85%)}.hero h1{font-size:clamp(70px,23vw,91px)}}
 .fallback:after{content:'';position:absolute;width:48%;height:90%;left:26%;top:5%;border-radius:50%;background:repeating-linear-gradient(0deg,#66347b 0px,#b58bc8 9px,#48205f 18px);box-shadow:inset -25px -10px 40px #000;transform:scaleY(1.8)}
 .fallback:after{display:none}.fallback{border:35px solid #b829f7;border-top-color:#dddddd;border-bottom-color:#68118e;transform:rotate(-35deg) scaleY(.65)}
 .fallback{border:0;border-radius:0;box-shadow:none;background:url('network.svg') center/contain no-repeat;transform:none}.fallback:after{display:none}
.portrait-reveal{position:relative;background:transparent;padding:12vh 8% 16vh}.portrait-reveal figure{margin:0 auto;max-width:1080px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;justify-content:center;gap:clamp(48px,6vw,88px)}.portrait-reveal img{display:block;width:100%;height:auto;border-radius:24px;filter:contrast(1.04);-webkit-mask-image:radial-gradient(ellipse 77% 77% at 50% 48%,#000 66%,rgba(0,0,0,.96) 72%,rgba(0,0,0,.6) 83%,transparent 100%);mask-image:radial-gradient(ellipse 77% 77% at 50% 48%,#000 66%,rgba(0,0,0,.96) 72%,rgba(0,0,0,.6) 83%,transparent 100%)}.portrait-reveal figcaption{padding-bottom:0}.portrait-reveal h2{font-size:clamp(38px,4.1vw,60px);line-height:1.02;letter-spacing:-.055em;font-weight:500;margin:28px 0 24px}.portrait-reveal p{font-size:15px}@media(max-width:700px){.portrait-reveal{padding:75px 7% 95px}.portrait-reveal figure{display:flex;flex-direction:column;gap:38px;align-items:stretch}.portrait-reveal figcaption{order:initial}.portrait-reveal h2{font-size:44px}.portrait-reveal img{width:min(100%,420px);margin:0 auto;border-radius:20px;-webkit-mask-image:radial-gradient(ellipse 82% 82% at 50% 48%,#000 70%,rgba(0,0,0,.9) 80%,transparent 100%);mask-image:radial-gradient(ellipse 82% 82% at 50% 48%,#000 70%,rgba(0,0,0,.9) 80%,transparent 100%)}}
