:root { color-scheme: light; }
[x-cloak]{ display:none !important; }

.container { max-width: 1100px; margin: 0 auto; padding: 16px; }
.card { border-radius: 16px; }

.qr-preview-card { display: flex; flex-direction: column; }
.qr-preview-body { display: flex; flex-direction: column; gap: 12px; flex: 1 1 auto; min-height: 0; }
.qr-preview-img-wrap { flex: 1 1 auto; min-height: 0; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.qr-preview-img { width: 100%; height: 100%; object-fit: contain; }

@media (min-width: 1024px) {
  .qr-cols { align-items: start; }
}

.hint-copied { color: rgb(147 197 253); background-color: rgba(59, 130, 246, 0.14); border-color: rgba(59, 130, 246, 0.35); }
.hint-updated { color: rgb(253 230 138); background-color: rgba(245, 158, 11, 0.14); border-color: rgba(245, 158, 11, 0.35); }
.hint-created { color: rgb(134 239 172); background-color: rgba(16, 185, 129, 0.14); border-color: rgba(16, 185, 129, 0.35); }