/* Original transparent glass controls. Text stays separate from the optical layers. */
.navigation{background:linear-gradient(145deg,#ffffff0c,#ffffff02 55%,#c6e3ff07);border-color:#e2f2ff26;box-shadow:inset 0 1px 0 #ffffff24,inset 0 -1px 0 #0005,0 8px 28px #0003;backdrop-filter:blur(10px) saturate(140%);-webkit-backdrop-filter:blur(10px) saturate(140%)}
.liquid-button{
 --lx:50%;--ly:35%;--liquid-x:0px;--liquid-y:0px;--liquid-rx:0deg;--liquid-ry:0deg;--liquid-angle:115deg;
 position:relative;isolation:isolate;overflow:hidden;border-radius:999px;cursor:pointer;
 color:#f2f6fa;background:#ffffff04;border:1px solid #edf7ff42;
 box-shadow:0 5px 18px #0002,inset 0 1px 0 #ffffff28,inset 0 -1px 0 #0005;
 text-shadow:0 1px 3px #0007;transform:translateZ(0);
 transition:transform .65s cubic-bezier(.18,.85,.25,1.3),box-shadow .4s,border-color .4s,background-color .4s;
 -webkit-backdrop-filter:none;backdrop-filter:none;
}
.liquid-button::before{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;padding:1px;
 background:linear-gradient(var(--liquid-angle),#fff9 0%,#d9f2ff18 28%,#cbd9ef0c 47%,#e2f0ff5c 72%,#fff9 100%);
 -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;
 mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:.52;transition:opacity .4s;
}
.liquid-button::after{content:'';position:absolute;z-index:1;inset:1px;border-radius:inherit;pointer-events:none;
 box-shadow:inset 0 2px 3px #ffffff14,inset 1px 0 2px #d6f3ff0c,inset 0 -3px 6px #050b164d;
 transition:box-shadow .4s;
}
.liquid-button .liquid-surface{position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;
 background:linear-gradient(160deg,#fff1,#fff0 44%,#c5dcf908);backdrop-filter:blur(5px) saturate(150%) brightness(1.08);-webkit-backdrop-filter:blur(5px) saturate(150%) brightness(1.08);
 transition:background .35s;
}
.liquid-button .liquid-light{position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:inherit;opacity:0;
 background:radial-gradient(ellipse 105px 70px at var(--lx) var(--ly),#ffffff40, #e3f4ff12 43%,transparent 75%),linear-gradient(var(--liquid-angle),#c3ecff0d,transparent 32%,#fff0 58%,#dcd6ff13);
 transition:opacity .42s;
}
.liquid-button .liquid-content{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:space-between;gap:inherit;
 margin:0;font:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;pointer-events:none;
}
.liquid-button .liquid-content>span{transition:transform .45s cubic-bezier(.2,.8,.2,1);font-size:21px;line-height:1}
.navigation .liquid-button{border-color:transparent;background:transparent;box-shadow:none;min-height:38px;display:flex;align-items:center;justify-content:center;padding:9px 17px;transition:transform .65s cubic-bezier(.18,.85,.25,1.3),background .35s,box-shadow .35s}
.navigation .liquid-button::before{opacity:0}
.navigation .liquid-button::after{opacity:0}
.navigation .liquid-button .liquid-surface{opacity:0}
.navigation .liquid-button .liquid-content{margin:0;gap:10px}
.navigation .liquid-button .liquid-content>span{margin:0;font-size:15px}
.navigation .liquid-button.active{background:#edf5ff0c;box-shadow:inset 0 1px 0 #fff2,inset 0 -1px 0 #fff1}
.navigation .liquid-button.active::before{opacity:.28}
.project-link.liquid-button,.hero-cta.liquid-button{background:#ffffff04}
.liquid-button:focus-visible{outline:2px solid #d7f1ff;outline-offset:5px;border-color:#f1faff80;box-shadow:0 0 24px #c4eaff15,inset 0 1px 1px #ffffff66}
.liquid-button:focus-visible .liquid-light{opacity:.7}
@media(hover:hover) and (pointer:fine){
 .liquid-button:hover,.liquid-button.is-liquid-hover{background:#ffffff08;border-color:#f1f9ff75;
  box-shadow:0 10px 27px #0004,0 0 22px #d9eaff0c,inset 0 1px 1px #ffffff80,inset 0 -1px 1px #dcf1ff38,inset 1px 0 1px #c7e7ff40;
  transform:perspective(700px) translate3d(var(--liquid-x),calc(var(--liquid-y) - 2px),0) rotateX(var(--liquid-rx)) rotateY(var(--liquid-ry)) scale(1.025);
 }
 .liquid-button:hover::before,.liquid-button.is-liquid-hover::before{opacity:1}
 .liquid-button:hover::after{box-shadow:inset 0 3px 5px #ffffff24,inset 1px 0 3px #d6f3ff24,inset 0 -4px 7px #050b1670}
 .liquid-button:hover .liquid-light,.liquid-button.is-liquid-hover .liquid-light{opacity:1}
 .liquid-button:hover .liquid-content>span{transform:translate(2px,-1px)}
 .navigation .liquid-button:hover .liquid-surface,.navigation .liquid-button:hover::after{opacity:1}
 .navigation .liquid-button:hover{background:#ffffff07;box-shadow:inset 0 1px 1px #ffffff5c,inset 0 -1px 1px #e5f5ff24,0 4px 14px #0002}
 .work-item summary:hover .work-toggle{border-color:#f1faff80;background:linear-gradient(135deg,#ffffff28,#ffffff04);box-shadow:inset 0 1px 1px #fff8,inset 0 -1px 2px #fff2,0 0 18px #b5dcff12}
}
.liquid-button:active{transform:scale(.97);transition:transform .12s ease-out;box-shadow:inset 0 2px 6px #0005,inset 0 1px 1px #fff6;background:#ffffff12}
.liquid-button:active .liquid-light{opacity:.85}
@media(max-width:700px){.navigation .liquid-button{padding:8px 10px;min-height:36px}.navigation .liquid-button:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.liquid-button,.liquid-button:hover,.liquid-button:active{transform:none;transition:none}.liquid-button:hover .liquid-content>span{transform:none}.liquid-button .liquid-light{background:linear-gradient(145deg,#ffffff20,transparent 70%)}.liquid-button::before,.liquid-button::after,.liquid-button .liquid-content>span{transition:none}}
@supports not ((backdrop-filter:blur(5px)) or (-webkit-backdrop-filter:blur(5px))){.navigation{background:#0c1420f2}.liquid-button{background:#17212dde}.liquid-button .liquid-surface{background:linear-gradient(145deg,#ffffff16,#ffffff04)}}
@media(forced-colors:active){.liquid-button{border:1px solid ButtonText}.liquid-button::before,.liquid-button::after,.liquid-surface,.liquid-light{display:none}}