body {
    background: #f6f8fb;
}

.mq-auth-bg {
    background:
        radial-gradient(circle at top right, rgba(59, 130, 246, 0.16), transparent 35%),
        radial-gradient(circle at bottom left, rgba(16, 185, 129, 0.14), transparent 30%),
        #eef2f9;
}

.card {
    border: 0;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
}

.table td,
.table th {
    vertical-align: middle;
}

.status-badge {
    border-radius: 999px;
    padding: 3px 8px;
    font-size: 12px;
    font-weight: 600;
}

.status-active {
    background: #d1fae5;
    color: #065f46;
}

.status-expiring {
    background: #fef3c7;
    color: #92400e;
}

.status-expired {
    background: #fee2e2;
    color: #991b1b;
}

.status-no-qr {
    background: #e2e8f0;
    color: #334155;
}

.qr-thumb {
    width: 52px;
    height: 52px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.modal-preview-img {
    max-width: 100%;
    max-height: 72vh;
    border-radius: 10px;
    border: 1px solid #e2e8f0;
}