@property --add-to-chat-angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}@property --add-to-chat-hold-scale{syntax: "<number>"; inherits: true; initial-value: 1;}.add-to-chat{display:inline-flex}.add-to-chat .glass-button__host{transform:none!important}.add-to-chat .glass-button__host>div,.add-to-chat__label{transition:transform .42s cubic-bezier(.34,1.56,.64,1);transform-origin:center}.add-to-chat .glass-button__host>div{--add-to-chat-hold-scale: 1;scale:var(--add-to-chat-hold-scale);transition:transform .42s cubic-bezier(.34,1.56,.64,1),--add-to-chat-hold-scale .55s cubic-bezier(.2,.8,.2,1)}.add-to-chat__label{position:relative;z-index:1;display:inline-flex;align-items:center;gap:10px;scale:calc(1 / var(--add-to-chat-hold-scale));filter:drop-shadow(0 0 0 rgb(255 255 255 / 0));transition:transform .42s cubic-bezier(.34,1.56,.64,1),filter .35s ease-out,color .35s ease-out}.add-to-chat .glass-button__host:has(button:active)>div{transform:scale(1.06);transition-duration:.16s}.add-to-chat .glass-button__host:has(button:active:not(:disabled))>div{--add-to-chat-hold-scale: 1.28;transition:transform .16s cubic-bezier(.34,1.56,.64,1),--add-to-chat-hold-scale 8s linear .45s}.add-to-chat[data-wave-variant=twitch] .glass-button__host:has(button:active:not(:disabled))>div{animation:add-to-chat-twitch 2.8s ease-in-out 1 forwards}.add-to-chat button:active:not(:disabled) .add-to-chat__label{transform:scale(.84);color:#fff;text-shadow:none;animation:add-to-chat-charge 2.8s ease-in-out infinite;transition-duration:.16s,.35s,.35s}.add-to-chat__hold-wave{position:absolute;inset:0;pointer-events:none;border-radius:inherit}.add-to-chat__water{position:absolute;inset:0;width:100%;height:100%;border-radius:inherit;pointer-events:none;filter:blur(.8px);mix-blend-mode:screen}.add-to-chat__hold-wave:before{content:"";position:absolute;top:50%;left:50%;width:100%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;border:2px solid rgb(255 255 255 / .65);box-shadow:0 0 7px #fff6,inset 0 0 7px #ffffff4d;filter:blur(5px);opacity:0;transform:scale(.08)}.add-to-chat button:active:not(:disabled) .add-to-chat__hold-wave:before{animation:add-to-chat-wave 2.8s linear infinite}@keyframes add-to-chat-charge{0%,52%,to{filter:drop-shadow(0 0 0 rgb(255 255 255 / 0)) drop-shadow(0 0 0 rgb(255 255 255 / 0))}12%{filter:drop-shadow(0 0 2px rgb(255 255 255 / .3)) drop-shadow(0 0 4px rgb(255 255 255 / .12))}24%{filter:drop-shadow(0 0 4px rgb(255 255 255 / .7)) drop-shadow(0 0 9px rgb(255 255 255 / .4))}30%{filter:drop-shadow(0 0 5px #fff) drop-shadow(0 0 14px rgb(255 255 255 / .85))}39%{filter:drop-shadow(0 0 10px rgb(255 255 255 / .4)) drop-shadow(0 0 22px rgb(255 255 255 / .2))}}@keyframes add-to-chat-twitch{0%{--add-to-chat-hold-scale: 1.06}24%{--add-to-chat-hold-scale: 1.15}38%{--add-to-chat-hold-scale: 1.1}58%{--add-to-chat-hold-scale: 1.17}to{--add-to-chat-hold-scale: 1.26}}@keyframes add-to-chat-wave{0%,28%{opacity:0;transform:scale(.18);filter:blur(8px)}36%{opacity:.9;transform:scale(.32);filter:blur(6px)}56%{opacity:.55;transform:scale(.65);filter:blur(5px)}to{opacity:0;transform:scale(1.12);filter:blur(7px)}}.add-to-chat .add-to-chat__button{min-height:52px;padding:0 24px;gap:10px;border-radius:999px;color:var(--paper);background:transparent;font-size:16px;font-weight:550;user-select:none;-webkit-user-select:none;touch-action:manipulation}.add-to-chat .add-to-chat__button:hover{color:#fff;text-shadow:0 0 12px rgb(255 255 255 / .52)}.add-to-chat .glass-button__cursor-glow{background:radial-gradient(circle 46px at var(--pointer-x) var(--pointer-y),rgb(255 255 255 / .48),rgb(255 255 255 / .16) 38%,transparent 72%)}.add-to-chat:has(button:focus-visible){outline:3px solid var(--lime);outline-offset:6px;border-radius:999px}.add-to-chat .glass-button__host>div:before{content:"";position:absolute;z-index:1;inset:-2px;border-radius:inherit;pointer-events:none;background:conic-gradient(from var(--add-to-chat-angle),transparent 0deg,rgb(255 255 255 / .22) 18deg,rgb(255 255 255 / .85) 36deg,#fff 52deg,rgb(255 255 255 / .48) 82deg,transparent 132deg 170deg,rgb(255 255 255 / .65) 222deg,rgb(255 255 255 / .18) 256deg,transparent 306deg 360deg);-webkit-mask:radial-gradient(ellipse at center,transparent 38%,rgb(0 0 0 / .3) 58%,rgb(0 0 0 / .85) 80%,#000 100%);mask:radial-gradient(ellipse at center,transparent 38%,rgb(0 0 0 / .3) 58%,rgb(0 0 0 / .85) 80%,#000 100%);filter:blur(3px);mix-blend-mode:screen;animation:add-to-chat-orbit 8s linear infinite}.add-to-chat .glass-button__host>div:after{content:"";position:absolute;z-index:1;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(ellipse 32% 85% at 36% 25%,rgb(255 255 255 / .32),rgb(255 255 255 / .1) 45%,transparent 75%),radial-gradient(ellipse 25% 65% at 64% 90%,rgb(255 255 255 / .18),transparent 75%);background-size:180% 160%;background-position:0% 30%;filter:blur(5px);mix-blend-mode:screen;animation:add-to-chat-light 7s ease-in-out infinite alternate}.add-to-chat[data-animated=false] .glass-button__host>div:before,.add-to-chat[data-animated=false] .glass-button__host>div:after{animation-play-state:paused}.add-to-chat:has(button:active) .glass-button__host>div:before,.add-to-chat:has(button:active) .glass-button__host>div:after{opacity:0}.add-to-chat:has(button:disabled) .glass-button__host>div:before,.add-to-chat:has(button:disabled) .glass-button__host>div:after{animation:none;opacity:.3}@keyframes add-to-chat-orbit{to{--add-to-chat-angle: 360deg}}@keyframes add-to-chat-light{to{background-position:100% 70%}}@media(prefers-reduced-motion:reduce){.add-to-chat .glass-button__host>div:before,.add-to-chat .glass-button__host>div:after{animation:none}}@media(prefers-reduced-motion:reduce){.add-to-chat .glass-button__host>div,.add-to-chat__label{transform:none!important;scale:1!important;animation:none!important}.add-to-chat .add-to-chat__hold-wave{display:none}.add-to-chat button .add-to-chat__label{animation:none}}@media(prefers-reduced-transparency:reduce){.add-to-chat .add-to-chat__button{background:var(--night)}}@media(forced-colors:active){.add-to-chat button .add-to-chat__label{animation:none;filter:none}.add-to-chat__hold-wave{display:none}.add-to-chat .glass-button__host>div:before,.add-to-chat .glass-button__host>div:after{display:none}.add-to-chat .add-to-chat__button{border:1px solid ButtonText;color:ButtonText;background:ButtonFace}.add-to-chat:has(button:focus-visible){outline-color:Highlight}}.add-to-chat__icon{display:inline-block;width:20px;height:20px;flex:0 0 20px;background-color:currentColor;mask-size:contain;mask-position:center;mask-repeat:no-repeat;-webkit-mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat}
