.floating-nav{position:fixed;inset:0 auto auto 0;width:218px;padding:32px 24px 55px;display:block;z-index:20;background:linear-gradient(110deg,#000f 30%,#000b 65%,#0000 100%)}
.floating-nav .brand{display:block;font-size:17px;letter-spacing:-.5px;white-space:nowrap}.floating-nav .brand span{font-size:7px;letter-spacing:1.65px}
.floating-nav nav{display:flex;flex-direction:column;gap:7px;margin-top:30px;align-items:flex-start}
.floating-nav nav a{display:flex;align-items:center;gap:12px;min-height:44px;font-size:11px;font-weight:500;letter-spacing:1.8px;color:#ddd}
.nav-orbit{width:28px;height:28px;border:1px solid #777;border-radius:50%;display:grid;place-items:center;transition:background .2s,border-color .2s,box-shadow .2s}.nav-orbit svg{width:14px;height:14px;transition:transform .25s}
.floating-nav nav a:hover .nav-orbit,.floating-nav nav a:focus-visible .nav-orbit{background:#b829f7;border-color:#b829f7}.floating-nav nav a:hover svg{transform:rotate(45deg)}
.floating-nav nav a[aria-current] .nav-orbit{border-color:#b829f7;color:#eee;background:#b829f733;animation:nav-signal 9s ease-in-out infinite}
@keyframes nav-signal{0%,80%,100%{box-shadow:0 0 0 #b829f700}88%{box-shadow:0 0 16px #b829f777}}
.nav-toggle{display:none}
@media(min-width:701px){main{margin-left:218px}.hero{padding-left:5%;padding-right:5%}.hero h1{font-size:clamp(70px,9vw,145px)}.chapter{padding-left:5%;padding-right:5%}.chapter.right{padding-left:48%}.chapter h2{font-size:clamp(46px,6vw,90px)}.portrait-reveal,.work,.contact{padding-left:5%;padding-right:5%}}
@media(min-width:701px) and (max-width:1000px){.floating-nav{width:180px;padding-left:18px;padding-right:10px}.floating-nav .brand{font-size:15px}main{margin-left:180px}.chapter.right{padding-left:15%}.projects{grid-template-columns:1fr}.portrait-reveal figure{gap:25px}.portrait-reveal h2{font-size:36px}}
@media(max-width:700px){.floating-nav{width:100%;padding:18px 20px;display:flex;align-items:center;gap:16px;background:linear-gradient(#000e,#0009 65%,#0000)}.nav-toggle{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;min-width:44px;height:44px;border:1px solid #555;border-radius:50%;padding:10px}.nav-toggle span{display:block;height:1px;width:19px;background:#eee;transition:transform .2s,opacity .2s}.is-open .nav-toggle span:first-child{transform:translateY(6px) rotate(45deg)}.is-open .nav-toggle span:nth-child(2){opacity:0}.is-open .nav-toggle span:last-child{transform:translateY(-6px) rotate(-45deg)}.floating-nav nav{display:none;position:absolute;top:76px;left:20px;margin:0;padding:16px 24px 22px;background:#080808f5;border:1px solid #333;border-radius:18px;min-width:220px;box-shadow:0 20px 60px #000b}.floating-nav.is-open nav{display:flex}.floating-nav nav a{min-height:48px}.floating-nav .brand{font-size:16px}.hero{padding-top:155px}}
@media(prefers-reduced-motion:reduce){.floating-nav nav a[aria-current] .nav-orbit{animation:none}}
body:has(#motion[aria-pressed="true"]) .nav-orbit{animation:none!important}