:root{--shadow-cuttoff-fix: 1em;--border-width: clamp(1px, .0625em, 4px);--outline-width: calc(100% + var(--border-width));--outline-height: calc(100% + var(--border-width));--outline-top: calc(0% - var(--border-width) / 2);--outline-left: calc(0% - var(--border-width) / 2);--shine-width: calc(100% - var(--border-width));--shine-height: calc(100% - var(--border-width));--shine-top: calc(0% + var(--border-width) / 2);--shine-left: calc(0% + var(--border-width) / 2);--btn-shadow-width: calc(100% - var(--shadow-cuttoff-fix) - .25em);--btn-shadow-height: calc(100% - var(--shadow-cuttoff-fix) - .25em);--btn-shadow-top: calc(var(--shadow-cuttoff-fix) - .5em);--btn-shadow-left: calc(var(--shadow-cuttoff-fix) - .875em);--ring-width-1\.5: 1.5px;--color-brand-grey: #f0f0f0;--color-brand-black: #191919;--color-close-bg: #ebebeb80;--color-dark-notification-bg: #2d2d2de6;--color-text-primary: #323232;--color-text-light: #e5e5e5;--color-transparent: #0000;--color-transparent-white: #fff0;--color-black-03: #3246861f;--color-black-05: rgba(0, 0, 0, .05);--color-black-10: rgba(0, 0, 0, .1);--color-black-13: #3838380d;--color-black-15: #00000014;--color-black-26: #0000001a;--color-black-38: #00000010;--color-black-40: #2500b82c;--color-black-50: #9599ff9c;--glassmorphic-background-gradient-start: #ffffff3c;--glassmorphic-background-gradient-middle: rgba(255, 255, 255, .299);--glassmorphic-background-gradient-end: #ffffff0d;--color-white-rgba-20: rgba(255, 255, 255, .2);--color-white-rgba-25: rgba(255, 255, 255, .25);--color-white-rgba-30: rgba(255, 255, 255, .3);--color-white-50: #ffffff5e;--color-white-rgba-50: rgba(255, 255, 255, .269);--color-white-60: #ffffff60;--color-white-75: #ffffffbf;--background-color: rgba(255, 255, 255, .485);--color-shadow-primary: #0000000f;--color-mask-black: #000;--primary-text-color: black;--liquid-background-color: rgba(0, 0, 0, .04);--accent-color: rgb(10, 132, 255)}.dark{--glassmorphic-background-gradient-start: #0000003f;--glassmorphic-background-gradient-middle: #000000b8;--glassmorphic-background-gradient-end: #000000b6;--color-white-50: #302e2e4f;--color-transparent-white: #00000011;--primary-text-color: white;--liquid-background-color: rgba(255, 255, 255, .1);--background-color: rgba(0, 0, 0, .485)}.glassmorphic-button{--border-width: clamp(1px, .0625em, 4px);cursor:pointer;-webkit-tap-highlight-color:var(--color-transparent);pointer-events:auto;z-index:3;-webkit-backdrop-filter:blur(clamp(4px,.5em,16px));backdrop-filter:blur(clamp(4px,.5em,16px));background:linear-gradient(-75deg,var(--glassmorphic-background-gradient-start),var(--glassmorphic-background-gradient-middle),var(--glassmorphic-background-gradient-end));background-color:var(--background-color);border-radius:999vw;justify-content:center;align-items:center;transition:all .4s cubic-bezier(.25,1,.5,1);display:flex;position:relative;box-shadow:inset 0 .125em .125em var(--color-black-13),inset 0 -.125em .125em var(--color-white-50),0 .25em .125em -.125em var(--color-black-03),inset 0 0 .1em .25em var(--glassmorphic-background-gradient-middle),0 0 var(--color-transparent-white)}.glassmorphic-button:disabled{pointer-events:none}.glassmorphic-button:hover{-webkit-backdrop-filter:blur(.01em);backdrop-filter:blur(.01em);transform:scale(.975);box-shadow:inset 0 .125em .125em var(--color-black-13),inset 0 -.125em .125em var(--color-white-50),0 .15em .05em -.1em var(--color-black-40),inset 0 0 .05em .1em var(--color-white-50),0 0 var(--color-transparent-white)}.glassmorphic-button span:after{content:"";top:var(--shine-top);left:var(--shine-left);box-sizing:border-box;background:linear-gradient(var(--angle-2),var(--color-transparent-white) 0%,var(--color-white-50) 40% 50%,var(--color-transparent-white) 55%)!important;z-index:3;mix-blend-mode:screen;pointer-events:none;background-position:0%;background-repeat:no-repeat;background-size:200% 200%;border-radius:999vw;transition:background-position .5s cubic-bezier(.25,1,.5,1),--angle-2 .5s cubic-bezier(.25,1,.5,1);display:block;position:absolute;overflow:clip}.glassmorphic-button:hover span:after{background-position:25%}.glassmorphic-button:active span:after{--angle-2: -15deg;background-position:50% 15%}@media (hover: none) and (pointer: coarse){.glassmorphic-button span:after,.glassmorphic-button:active span:after{--angle-2: -45deg}}.glassmorphic-button:after{content:"";z-index:1;top:0;right:0;bottom:0;left:0;top:var(--outline-top);left:var(--outline-left);padding:var(--border-width);box-sizing:border-box;background:conic-gradient(from var(--angle-1) at 50% 50%,var(--color-black-50),var(--color-transparent) 5% 40%,var(--color-black-50) 50%,var(--color-transparent) 60% 95%,var(--color-black-50)),linear-gradient(180deg,var(--color-white-50),var(--color-white-50));box-shadow:inset 0 0 0 calc(var(--border-width) / 2) var(--color-white-50);border-radius:999vw;transition:all .4s cubic-bezier(.25,1,.5,1),--angle-1 .5s;position:absolute;-webkit-mask-image:linear-gradient(var(--color-mask-black) 0 0),linear-gradient(var(--color-mask-black) 0 0);mask-image:linear-gradient(var(--color-mask-black) 0 0),linear-gradient(var(--color-mask-black) 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.glassmorphic-button:hover:after{--angle-1: -125deg}.glassmorphic-button:active:after{--angle-1: -75deg}@media (hover: none) and (pointer: coarse){.glassmorphic-button:after,.glassmorphic-button:hover:after,.glassmorphic-button:active:after{--angle-1: -75deg}}.glassmorphic-button-wrap:has(button:hover) .glassmorphic-button-shadow{filter:blur(clamp(2px,.0625em,6px));transition:filter .4s cubic-bezier(.25,1,.5,1)}.glassmorphic-button-wrap:has(button:hover) .glassmorphic-button-shadow:after{top:calc(var(--shadow-cuttoff-fix) - .875em);opacity:1}.glassmorphic-button-wrap:has(button:active){transform:rotateX(25deg)}.glassmorphic-button-wrap:has(button:active) .glassmorphic-button{box-shadow:inset 0 .125em .125em var(--color-black-13),inset 0 -.125em .125em var(--color-white-50),0 .125em .125em -.125em var(--color-black-03),inset 0 0 .1em .25em var(--glassmorphic-background-gradient-middle),0 .225em .05em var(--color-black-13),0 .25em var(--color-white-75),inset 0 .25em .05em var(--color-black-38)}.glassmorphic-button-wrap:has(button:active) .glassmorphic-button-shadow{filter:blur(clamp(2px,.125em,12px))}.glassmorphic-button-wrap:has(button:active) .glassmorphic-button-shadow:after{top:calc(var(--shadow-cuttoff-fix) - .5em);opacity:.75}.glassmorphic-button-wrap:has(button:active) span{text-shadow:.025em .1em .05em var(--color-black-15)}.glassmorphic-button-wrap:has(.glassmorphic-button){display:none}
