.button{--shadow-color:var(--color-text);--shadow-color-hover:var(--shadow-color);--shadow-color-second:var(--shadow-color-hover);--shadow-second-gap:0px;min-height:var(--target-min);background:var(--color-ground);color:var(--color-text);font-size:var(--button-size,var(--type-link));box-shadow:var(--shadow-x) var(--shadow-y) 0 var(--shadow-color);align-items:center;gap:.4em;padding:.2em .6em;line-height:1;text-decoration:none;display:inline-flex;position:relative}.button__icon{width:.8em;height:.8em}.button--icon{min-width:var(--target-min);border:var(--tile-border) solid var(--color-on-space);justify-content:center;padding-inline:0}.button--discord{background:var(--brand-discord)}.button--snapchat{background:var(--brand-snapchat)}.button--x{background:var(--brand-x)}.button--icon .button__icon *{fill:var(--color-on-space)}.icon__discord{fill:var(--brand-discord)}.icon__snapchat{fill:var(--brand-snapchat);stroke:var(--brand-snapchat-line);stroke-width:.9px;stroke-linejoin:round}.icon__x{fill:var(--brand-x)}.icon__twitch{fill:var(--brand-twitch)}.icon__youtube{fill:var(--brand-youtube)}.icon__tiktok-cyan{fill:var(--brand-tiktok-cyan)}.icon__tiktok-red{fill:var(--brand-tiktok-red)}.icon__tiktok-ink{fill:var(--brand-tiktok-ink)}@media (prefers-reduced-motion:no-preference){.button{transition:transform var(--dur-hover) steps(2, jump-end), box-shadow var(--dur-hover) steps(2, jump-end)}}.button:focus-visible{transform:translate(calc(var(--lift-x) * -1), calc(var(--lift-y) * -1));box-shadow:calc(var(--shadow-x) + var(--lift-x)) calc(var(--shadow-y) + var(--lift-y)) 0 var(--shadow-color-hover), calc(var(--shadow-x) + var(--lift-x) + var(--shadow-second-gap)) calc(var(--shadow-y) + var(--lift-y) + var(--shadow-second-gap)) 0 var(--shadow-color-second)}@media (hover:hover){.button:hover{transform:translate(calc(var(--lift-x) * -1), calc(var(--lift-y) * -1));box-shadow:calc(var(--shadow-x) + var(--lift-x)) calc(var(--shadow-y) + var(--lift-y)) 0 var(--shadow-color-hover), calc(var(--shadow-x) + var(--lift-x) + var(--shadow-second-gap)) calc(var(--shadow-y) + var(--lift-y) + var(--shadow-second-gap)) 0 var(--shadow-color-second)}}.button:active{transform:translate(var(--shadow-x), var(--shadow-y));box-shadow:0 0 0 0 var(--shadow-color)}@media (forced-colors:active){.button{border:2px solid buttontext}.button__icon *{fill:currentColor}}.button__crown{left:var(--button-crown-left);bottom:calc(100% - var(--button-crown-sink));width:var(--button-crown-size);height:auto;transform:rotate(var(--button-crown-lean));transform-origin:50% 100%;pointer-events:none;position:absolute}.button--primary{--shadow-color:var(--color-primary)}.button--youtube{--shadow-color-hover:var(--brand-youtube)}.button--tiktok{--shadow-color-hover:var(--brand-tiktok-cyan);--shadow-color-second:var(--brand-tiktok-red);--shadow-second-gap:var(--shadow-glitch)}
