@import url("/image-converter/styles.css?v=1");
/* QR code scanner */
.qs-drop { text-align: center; padding: 34px 20px; border: 2px dashed var(--border); border-radius: 14px; background: var(--panel-2); }
.qs-drop.over { border-color: #95d600; background: rgba(149,214,0,.06); }
.qs-drop .row { justify-content: center; gap: 12px; flex-wrap: wrap; }
.qs-drop .btn { font-size: 16px; padding: 14px 24px; }
.qs-drop p { margin: 12px 0 0; color: var(--muted); font-size: 13px; }
#status { min-height: 1.4em; margin: 14px 0 0; }
#camBox { margin-top: 16px; }
#video { display: block; width: 100%; max-width: 520px; margin: 0 auto; border-radius: 12px; background: #000; }
.qs-head { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.qs-card { border-top: 1px solid var(--border); padding: 16px 0; }
.qs-card:first-child { border-top: 0; padding-top: 4px; }
.qs-card .qs-head b { color: #95d600; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; }
.qs-host { font-size: 24px; font-weight: 700; margin: 8px 0 4px; overflow-wrap: anywhere; }
.qs-raw { display: block; margin: 8px 0 0; padding: 10px 12px; background: var(--panel-2); border: 1px solid var(--border); border-radius: 8px; font: 13px/1.5 ui-monospace, "Cascadia Mono", Menlo, Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--text); }
.qs-warn { margin: 10px 0 0; padding: 10px 12px 10px 28px; border: 1px solid #4a3b1f; border-radius: 8px; background: rgba(255,180,84,.08); color: var(--warn); font-size: 13px; }
.qs-act { margin-top: 12px; gap: 10px; }
.qs-act .btn { text-decoration: none; display: inline-block; }
.qs-rows { display: grid; grid-template-columns: auto 1fr; gap: 8px 16px; margin: 10px 0 0; font-size: 14px; }
.qs-rows dt { color: var(--muted); }
.qs-rows dd { margin: 0; display: flex; gap: 10px; align-items: center; justify-content: space-between; overflow-wrap: anywhere; min-width: 0; }
.qs-rows dd span { min-width: 0; overflow-wrap: anywhere; }
.qs-top { display: flex; justify-content: space-between; align-items: center; }