.button {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0 1rem;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    font-weight: 800;
    line-height: 1.1;
    text-align: center;
    text-decoration: none;
    transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

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

.button--primary {
    border-color: var(--color-border-strong);
    background: linear-gradient(135deg, rgba(0, 214, 255, 0.94), rgba(10, 125, 255, 0.86));
    box-shadow: var(--shadow-cyan);
    color: #021018;
}

.button--secondary {
    border-color: var(--color-border);
    background: rgba(216, 227, 236, 0.1);
    color: var(--color-text);
}

.button--ghost {
    border-color: var(--color-border);
    background: rgba(216, 227, 236, 0.06);
    color: var(--color-text);
}

.button--compact {
    min-height: 38px;
    padding-inline: 0.85rem;
    font-size: 0.9rem;
}

.button--large {
    min-height: 54px;
    padding-inline: 1.3rem;
    font-size: 1rem;
}

.button--disabled {
    border-color: rgba(154, 168, 180, 0.22);
    background: rgba(154, 168, 180, 0.08);
    color: var(--color-soft);
}

.button--disabled:hover {
    transform: none;
}