@property --glass-angle-1{syntax:"<angle>";inherits:false;initial-value:-75deg}@property --glass-angle-2{syntax:"<angle>";inherits:false;initial-value:-45deg}:root{--glass-hover-time:400ms;--glass-hover-ease:cubic-bezier(0.25,1,0.5,1)}.dark-glass-wrap{position:relative;z-index:2;display:flex;border-radius:999vw;pointer-events:none;transition:transform var(--glass-hover-time) var(--glass-hover-ease)}.dark-glass-shadow{--shadow-pad:2em;position:absolute;width:calc(100% + var(--shadow-pad));height:calc(100% + var(--shadow-pad));top:calc(-1 * var(--shadow-pad) / 2);left:calc(-1 * var(--shadow-pad) / 2);filter:blur(clamp(2px,.125em,12px));overflow:visible;pointer-events:none}.dark-glass-shadow:after{content:"";position:absolute;inset:0;border-radius:999vw;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.18));width:calc(100% - var(--shadow-pad) - .25em);height:calc(100% - var(--shadow-pad) - .25em);top:calc(var(--shadow-pad) - .5em);left:calc(var(--shadow-pad) - .875em);padding:.125em;box-sizing:border-box;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;opacity:1;transition:all var(--glass-hover-time) var(--glass-hover-ease)}.dark-glass-btn{--border-w:clamp(1px,0.0625em,4px);all:unset;box-sizing:border-box;cursor:pointer;position:relative;pointer-events:auto;z-index:3;display:flex;align-items:center;justify-content:center;border-radius:999vw;background:linear-gradient(-75deg,hsla(0,0%,100%,.03),hsla(0,0%,100%,.08),hsla(0,0%,100%,.03));box-shadow:inset 0 .125em .125em hsla(0,0%,100%,.04),inset 0 -.125em .125em rgba(0,0,0,.3),0 .25em .125em -.125em rgba(0,0,0,.5),inset 0 0 .1em .25em hsla(0,0%,100%,.04),0 0 0 0 hsla(0,0%,100%,0);backdrop-filter:blur(clamp(1px,.125em,4px));-webkit-backdrop-filter:blur(clamp(1px,.125em,4px));-webkit-tap-highlight-color:transparent;transition:all var(--glass-hover-time) var(--glass-hover-ease)}.dark-glass-btn:hover{transform:scale(.975);backdrop-filter:blur(.01em);-webkit-backdrop-filter:blur(.01em);box-shadow:inset 0 .125em .125em hsla(0,0%,100%,.06),inset 0 -.125em .125em rgba(0,0,0,.35),0 .15em .05em -.1em rgba(0,0,0,.6),inset 0 0 .05em .1em hsla(0,0%,100%,.06),0 0 0 0 hsla(0,0%,100%,0)}.dark-glass-btn:not(.dark-glass-toggle) span{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;user-select:none;-webkit-user-select:none;font-weight:500;font-size:15px;color:hsla(0,0%,100%,.85);text-shadow:0 2px 1px rgba(0,0,0,.3);letter-spacing:-.02em;transition:all var(--glass-hover-time) var(--glass-hover-ease);padding:12px 18px}.dark-glass-btn:not(.dark-glass-toggle):hover span{text-shadow:.025em .025em .025em rgba(0,0,0,.4)}.dark-glass-btn:not(.dark-glass-toggle) span:after{content:"";display:block;position:absolute;z-index:3;width:calc(100% - var(--border-w));height:calc(100% - var(--border-w));top:calc(var(--border-w) / 2);left:calc(var(--border-w) / 2);box-sizing:border-box;border-radius:999vw;overflow:clip;background:linear-gradient(var(--glass-angle-2),hsla(0,0%,100%,0) 0,hsla(0,0%,100%,.12) 40% 50%,hsla(0,0%,100%,0) 55%);mix-blend-mode:screen;pointer-events:none;background-size:200% 200%;background-position:0 50%;background-repeat:no-repeat;transition:background-position calc(var(--glass-hover-time) * 1.25) var(--glass-hover-ease),--glass-angle-2 calc(var(--glass-hover-time) * 1.25) var(--glass-hover-ease)}.dark-glass-btn:not(.dark-glass-toggle):hover span:after{background-position:25% 50%}.dark-glass-btn:not(.dark-glass-toggle):active span:after{background-position:50% 15%;--glass-angle-2:-15deg}@media (hover:none) and (pointer:coarse){.dark-glass-btn:not(.dark-glass-toggle) span:after,.dark-glass-btn:not(.dark-glass-toggle):active span:after{--glass-angle-2:-45deg}}.dark-glass-btn:after{content:"";position:absolute;z-index:1;inset:0;border-radius:999vw;width:calc(100% + var(--border-w));height:calc(100% + var(--border-w));top:calc(-1 * var(--border-w) / 2);left:calc(-1 * var(--border-w) / 2);padding:var(--border-w);box-sizing:border-box;pointer-events:none;background:conic-gradient(from var(--glass-angle-1) at 50% 50%,hsla(0,0%,100%,.3),hsla(0,0%,100%,0) 5% 40%,hsla(0,0%,100%,.3) 50%,hsla(0,0%,100%,0) 60% 95%,hsla(0,0%,100%,.3)),linear-gradient(180deg,hsla(0,0%,100%,.12),hsla(0,0%,100%,.06));mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;box-shadow:inset 0 0 0 calc(var(--border-w) / 2) hsla(0,0%,100%,.08);transition:all var(--glass-hover-time) var(--glass-hover-ease),--glass-angle-1 .5s ease}.dark-glass-btn:hover:after{--glass-angle-1:-125deg}.dark-glass-btn:active:after{--glass-angle-1:-75deg}@media (hover:none) and (pointer:coarse){.dark-glass-btn:active:after,.dark-glass-btn:after,.dark-glass-btn:hover:after{--glass-angle-1:-75deg}}.dark-glass-wrap:has(.dark-glass-btn:hover) .dark-glass-shadow{filter:blur(clamp(2px,.0625em,6px));transition:filter var(--glass-hover-time) var(--glass-hover-ease)}.dark-glass-wrap:has(.dark-glass-btn:hover) .dark-glass-shadow:after{top:calc(var(--shadow-pad) - .875em);opacity:1}.dark-glass-wrap:has(.dark-glass-btn:active){transform:rotateX(25deg)}.dark-glass-wrap:has(.dark-glass-btn:active) .dark-glass-btn{box-shadow:inset 0 .125em .125em hsla(0,0%,100%,.04),inset 0 -.125em .125em rgba(0,0,0,.3),0 .125em .125em -.125em rgba(0,0,0,.5),inset 0 0 .1em .25em hsla(0,0%,100%,.04),0 .225em .05em 0 rgba(0,0,0,.15),0 .25em 0 0 hsla(0,0%,100%,.08),inset 0 .25em .05em 0 rgba(0,0,0,.3)}.dark-glass-wrap:has(.dark-glass-btn:active) .dark-glass-shadow{filter:blur(clamp(2px,.125em,12px))}.dark-glass-wrap:has(.dark-glass-btn:active) .dark-glass-shadow:after{top:calc(var(--shadow-pad) - .5em);opacity:.75}.dark-glass-wrap:has(.dark-glass-btn:active) .dark-glass-btn:not(.dark-glass-toggle) span{text-shadow:.025em .25em .05em rgba(0,0,0,.4)}.dark-glass-btn--fill{width:100%;height:100%}.dark-glass-btn--fill>span{width:100%;justify-content:space-between}.dark-glass-toggle{width:100%;height:100%;align-items:stretch;gap:4px;padding:4px;cursor:default}.dark-glass-toggle:hover{transform:none}.dark-glass-toggle-item{all:unset;cursor:pointer;position:relative;z-index:2;flex:1;display:flex;align-items:center;justify-content:center;padding-inline:16px;border-radius:999vw;color:hsla(0,0%,100%,.4);transition:color var(--glass-hover-time) var(--glass-hover-ease);-webkit-tap-highlight-color:transparent}.dark-glass-toggle-item:hover{color:hsla(0,0%,100%,.6)}.dark-glass-toggle-item--active{color:hsla(0,0%,100%,.9)}.dark-glass-toggle-indicator{position:absolute;inset:0;border-radius:999vw;pointer-events:none;overflow:hidden;border:1px solid hsla(0,0%,100%,.1);background:linear-gradient(-75deg,hsla(0,0%,100%,.06),hsla(0,0%,100%,.14),hsla(0,0%,100%,.06));box-shadow:inset 0 1px 1px hsla(0,0%,100%,.08),inset 0 -1px 1px rgba(0,0,0,.25),0 2px 4px -1px rgba(0,0,0,.4),inset 0 0 6px 1px hsla(0,0%,100%,.03)}.dark-glass-toggle-indicator:before{content:"";position:absolute;inset:0;border-radius:999vw;background:linear-gradient(180deg,hsla(0,0%,100%,.1),hsla(0,0%,100%,.02) 45%,transparent 55%);pointer-events:none}