.vdct-checkin {
    --vdct-checkin-accent: var(--vdct-primary, #e72d6d);
    --vdct-checkin-success: var(--vdct-success, #15965c);
    max-width: 680px;
    margin: 20px auto;
    padding: 16px;
    color: var(--vdct-text, #231b20);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.vdct-checkin__header { margin-bottom: 20px; }
.vdct-checkin__header span { color: var(--vdct-checkin-accent); font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.vdct-checkin__header h1 { margin: 4px 0; font-size: clamp(32px, 8vw, 50px); }
.vdct-checkin__header p { margin: 0; color: #687086; }
.vdct-checkin__scanner, .vdct-checkin__result, .vdct-checkin__manual, .vdct-checkin--denied { padding: 18px; border: 1px solid #eee4e8; border-radius: var(--vdct-radius, 16px); background: var(--vdct-surface, #fff); box-shadow: var(--vdct-shadow); }
.vdct-checkin__camera { position: relative; overflow: hidden; aspect-ratio: 1; border-radius: 16px; background: #111522; }
.vdct-checkin__camera video { width: 100%; height: 100%; object-fit: cover; }
.vdct-checkin__frame { position: absolute; inset: 17%; border: 3px solid #fff; border-radius: 20px; box-shadow: 0 0 0 999px rgba(0, 0, 0, .35); }
.vdct-checkin__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.vdct-checkin button { min-height: 46px; padding: 10px 14px; border: 0; border-radius: 12px; font: inherit; font-weight: 800; cursor: pointer; }
.vdct-checkin__primary, .vdct-checkin__confirm { background: var(--vdct-checkin-accent); color: #fff; }
.vdct-checkin__actions button:not(.vdct-checkin__primary), .vdct-checkin__manual-toggle { background: #eff0f5; color: #30384b; }
.vdct-checkin__message { min-height: 24px; margin: 12px 0 0; color: #5f687c; text-align: center; }
.vdct-checkin__result { margin-top: 16px; }
.vdct-checkin__state { display: inline-flex; padding: 7px 11px; border-radius: 999px; background: #edf0f5; font-size: 13px; font-weight: 900; }
.vdct-checkin__result[data-state="valid"] .vdct-checkin__state, .vdct-checkin__result[data-state="checked_in"] .vdct-checkin__state { background: #e5f8ed; color: var(--vdct-checkin-success); }
.vdct-checkin__result[data-state="already_used"] .vdct-checkin__state, .vdct-checkin__result[data-state="invalid"] .vdct-checkin__state { background: #fde9e9; color: #a22121; }
.vdct-checkin__result h2 { margin: 14px 0; font-size: 26px; }
.vdct-checkin__result dl { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 0 0 18px; }
.vdct-checkin__result dl div { min-width: 0; }
.vdct-checkin__result dt { color: #7b8395; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.vdct-checkin__result dd { margin: 3px 0 0; overflow-wrap: anywhere; font-weight: 700; }
.vdct-checkin__confirm { width: 100%; }
.vdct-checkin__manual { margin-top: 16px; box-shadow: none; }
.vdct-checkin__manual-toggle { width: 100%; }
.vdct-checkin__manual form { margin-top: 16px; }
.vdct-checkin__manual label { display: block; margin-bottom: 7px; font-weight: 700; }
.vdct-checkin__manual form div { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.vdct-checkin__manual input { min-width: 0; padding: 11px 12px; border: 1px solid #cbd0dc; border-radius: 10px; font: inherit; }
.vdct-checkin__manual form button { background: #252c3d; color: #fff; }
.vdct-checkin__manual-results { display: grid; gap: 8px; margin-top: 12px; }
.vdct-checkin__manual-results button { background: #f4f2fc; color: #3b2b72; text-align: left; }
@media (max-width: 480px) {
    .vdct-checkin { padding: 10px; }
    .vdct-checkin__scanner, .vdct-checkin__result, .vdct-checkin__manual { padding: 14px; border-radius: 16px; }
    .vdct-checkin__result dl { grid-template-columns: 1fr; }
    .vdct-checkin__manual form div { grid-template-columns: 1fr; }
}