.toggld-btn{--btn-lip-size:4px;justify-content:center;align-items:center;gap:var(--space-2);border-radius:var(--radius-md);border:var(--outline-w) solid var(--w-outline);font-family:var(--font-heading);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;transition:transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), background-color var(--dur-fast) var(--ease-out), opacity var(--dur-fast) var(--ease-out);font-weight:700;line-height:1;display:inline-flex;position:relative;transform:translateY(0)}.toggld-btn:focus-visible{outline:3px solid var(--w-accent);outline-offset:2px}.toggld-btn:active:not(:disabled){transform:translateY(var(--btn-lip-size));--btn-lip-size:1px}.toggld-btn:disabled{cursor:not-allowed;opacity:.55}.toggld-btn--sm{height:36px;padding:0 var(--space-4);font-size:.875rem}.toggld-btn--md{height:48px;padding:0 var(--space-5);font-size:1rem}.toggld-btn--lg{height:60px;padding:0 var(--space-6);font-size:1.15rem}.toggld-btn--full{width:100%;display:flex}.toggld-btn--primary{background-color:var(--w-accent);color:var(--w-accent-ink);--btn-lip:color-mix(in srgb, var(--w-accent) 55%, #000);box-shadow:inset 0 calc(-1 * var(--btn-lip-size)) 0 0 var(--btn-lip), var(--shadow-pop)}.toggld-btn--secondary{background-color:var(--w-bg-2);color:var(--w-ink);--btn-lip:color-mix(in srgb, var(--w-bg-2) 55%, var(--w-outline));box-shadow:inset 0 calc(-1 * var(--btn-lip-size)) 0 0 var(--btn-lip), var(--shadow-pop)}.toggld-btn--danger{background-color:var(--w-danger);color:var(--w-accent-ink);--btn-lip:color-mix(in srgb, var(--w-danger) 55%, #000);box-shadow:inset 0 calc(-1 * var(--btn-lip-size)) 0 0 var(--btn-lip), var(--shadow-pop-danger)}.toggld-btn--ghost{color:var(--w-ink);box-shadow:none;background-color:#0000;border-color:#0000}.toggld-btn--ghost:active:not(:disabled){transform:translateY(2px)}.toggld-btn--pending{cursor:wait}.toggld-btn__spinner{animation:toggld-btn-spin var(--dur-slow) linear infinite;flex-shrink:0}@keyframes toggld-btn-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.toggld-btn__label{align-items:center;display:inline-flex}@media (forced-colors:active){.toggld-btn{border-color:canvastext}.toggld-btn:focus-visible{outline-color:highlight}}
