.button {
    min-height: 44px;
    padding: 0 20px;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    font-weight: 650;
    transition: transform var(--duration-fast), background var(--duration-fast), box-shadow var(--duration-fast);
}

.button:hover { transform: translateY(-1px); }
.button:active { transform: translateY(0); }
.button:focus-visible { outline: 3px solid rgba(88, 101, 232, 0.25); outline-offset: 2px; }

.button--primary {
    color: white;
    background: linear-gradient(135deg, #6572ee, var(--color-primary));
    box-shadow: 0 8px 18px rgba(88, 101, 232, 0.22);
}
.button--primary:hover { background: linear-gradient(135deg, #5966e9, var(--color-primary-dark)); }

.button--secondary {
    color: #515970;
    border-color: var(--color-border);
    background: #fff;
}
.button--secondary:hover { border-color: #c7cce0; background: #fafbff; }
.button--wide { width: 100%; }

.eyebrow {
    color: var(--color-primary);
    font-size: 12px;
    font-weight: 750;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.toast {
    position: fixed;
    left: 50%;
    bottom: 36px;
    z-index: 20;
    transform: translateX(-50%);
    padding: 12px 18px;
    border-radius: 10px;
    color: #fff;
    background: #24293c;
    box-shadow: 0 12px 30px rgba(21, 25, 43, 0.22);
    animation: toast-in 180ms ease-out;
}

@keyframes toast-in {
    from { opacity: 0; transform: translate(-50%, 8px); }
    to { opacity: 1; transform: translate(-50%, 0); }
}