.scy-btn {
    align-items: center;
    border: 1px solid transparent;
    border-radius: var(--scy-radius-pill);
    cursor: pointer;
    display: inline-flex;
    font-family: var(--scy-font-sans);
    font-weight: 600;
    gap: var(--scy-space-2);
    justify-content: center;
    line-height: 1;
    transition: transform 120ms ease, box-shadow 120ms ease, background-color 120ms ease, border-color 120ms ease;
}

.scy-btn:hover {
    transform: translateY(-1px);
}

.scy-btn--primary {
    background: var(--scy-color-primary);
    box-shadow: var(--scy-shadow-sm);
    color: var(--scy-color-surface);
}

.scy-btn--primary:hover {
    background: var(--scy-color-primary-strong);
}

.scy-btn--secondary {
    background: var(--scy-color-surface);
    border-color: var(--scy-color-border);
    color: var(--scy-color-ink-strong);
}

.scy-btn--ghost {
    background: transparent;
    color: var(--scy-color-primary-strong);
}

.scy-btn--sm {
    font-size: 0.875rem;
    min-height: 2.25rem;
    padding: 0.625rem 0.875rem;
}

.scy-btn--md {
    font-size: 0.95rem;
    min-height: 2.75rem;
    padding: 0.75rem 1.15rem;
}

.scy-btn--lg {
    font-size: 1rem;
    min-height: 3.125rem;
    padding: 0.95rem 1.4rem;
}

.scy-btn--disabled,
.scy-btn:disabled {
    cursor: not-allowed;
    opacity: 0.55;
    transform: none;
}

.scy-btn__icon {
    font-size: 1em;
}