.btn-variant-default{background-color:var(--color-surface-primary)}.btn-variant-default:hover{background:linear-gradient(var(--color-white-10),var(--color-white-10)),var(--color-surface-primary)}.btn-variant-default:active{background:var(--color-blue-700)}.btn-variant-sub{background-color:var(--color-surface-default)}.btn-variant-sub:hover{background:linear-gradient(var(--color-white-10),var(--color-white-10)),var(--color-surface-default)}.btn-variant-sub:active{background:linear-gradient(var(--color-white-30),var(--color-white-30)),var(--color-surface-default)}.btn-variant-line{border:1px solid var(--color-white-100);background-color:transparent}.btn-variant-line:hover{background-color:var(--color-white-10)}.btn-variant-line:active{background-color:var(--color-white-30)}.btn-variant-gradient{background:linear-gradient(100deg,var(--color-blue-500) 0,var(--color-purple-500) 100%)}.btn-variant-gradient:hover{background:linear-gradient(100deg,color-mix(in srgb,var(--color-blue-500) 90%,white) 0,color-mix(in srgb,var(--color-purple-500) 90%,white) 100%)}.btn-variant-gradient:active{background:linear-gradient(100deg,color-mix(in srgb,var(--color-blue-500) 80%,black) 0,color-mix(in srgb,var(--color-purple-500) 80%,black) 100%)}.btn-variant-ghost{background-color:transparent}.btn-variant-ghost:hover{background-color:var(--color-white-10)}.btn-variant-ghost:active{background-color:var(--color-white-30)}