.button{border:1px solid transparent;border-radius:14px;font-weight:700;cursor:pointer;transition:background-color .18s cubic-bezier(.4,0,.2,1),transform .18s cubic-bezier(.4,0,.2,1),box-shadow .18s cubic-bezier(.4,0,.2,1),border-color .18s cubic-bezier(.4,0,.2,1);outline:none;display:flex;align-items:center;justify-content:center;gap:.5rem;outline:1px solid transparent;outline-offset:-1px;background:var(--main-color);color:var(--text-color);box-shadow:0 10px 24px #030a1829;position:relative}.button:hover{background:var(--hover-color);transform:translateY(-2px);border-color:var(--outline-color);box-shadow:0 16px 30px #030a183d}.button:active{transform:scale(.94)}.button:disabled{cursor:not-allowed;opacity:.6}.button.size-tiny{padding:.25rem .5rem;font-size:.75rem}.button.size-small{padding:.5rem 1rem;font-size:.875rem}.button.size-normal{padding:.75rem 1.5rem;font-size:1rem}.button.size-big{padding:1rem 2rem;font-size:1.25rem}.button.size-giant{padding:1.5rem 3rem;font-size:1.5rem}.button.normal{--main-color: var(--accent-gradient);--outline-color: color-mix(in srgb, var(--color-4) 36%, transparent);--text-color: var(--on-color-4);--hover-color: linear-gradient(135deg, var(--color-4-105) 0%, var(--color-4) 100%)}.button.borderonly{--main-color: color-mix(in srgb, var(--color-3) 35%, transparent);--text-color: var(--on-background);--hover-color: color-mix(in srgb, var(--color-3-105) 56%, transparent);--outline-color: var(--glass-border)}.button.bad{--main-color: var(--bad);--outline-color: var(--bad-105);--text-color: var(--on-bad);--hover-color: var(--bad-105)}.button.secondary{--main-color: var(--surface-gradient);--text-color: var(--on-color-2);--outline-color: var(--glass-border);--hover-color: linear-gradient(180deg, var(--color-2-105) 0%, var(--color-2) 100%)}.button.bright{position:relative;color:var(--text-color);background:var(--main-color);transition:all .3s ease;overflow:hidden}.button.bright:hover{background:var(--hover-color)}.button.bright .feh-border-mask{position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%;padding:1px;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0) border-box;mask-composite:exclude}.button.bright .feh-border-glow{background:conic-gradient(from 0deg,transparent 0%,rgba(255,255,255,.7) 10%,rgba(255,255,255,.8),transparent 24%);position:absolute;top:50%;left:50%;width:500px;height:500px;transform:translate(-50%,-50%);transform-origin:0 0;animation:rotateShine 3s linear infinite}@keyframes rotateShine{0%{transform:rotate(0) translate(-50%,-50%)}to{transform:rotate(360deg) translate(-50%,-50%)}}
