.btn {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: 0.85rem 1.6rem;
    border-radius: var(--radius-md);
    font-weight: 600;
    font-size: 1rem;
    border: none;
    cursor: pointer;
    transition: transform var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);
}
.btn-primary { background: var(--color-primary); color: #fff; box-shadow: var(--shadow-sm); }
.btn-primary:hover { background: var(--color-primary-dark); box-shadow: var(--shadow-md); transform: translateY(-1px); }
.card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-4); box-shadow: var(--shadow-sm); }
.card-status { font-weight: 700; }
.card-status[data-state="ok"] { color: var(--color-success); }
.card-status[data-state="error"] { color: var(--color-danger); }