:root{--bg: #0f172a;--card: #1e293b;--fg: #e2e8f0;--muted: #94a3b8;--accent: #38bdf8;--ok: #22c55e;--bad: #ef4444;--border: #334155;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg)}.app{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem}.card{width:100%;max-width:440px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:1.75rem;box-shadow:0 10px 40px #00000059}.card.presenter{max-width:480px}h1{margin:0 0 .25rem;font-size:1.5rem}.muted{color:var(--muted)}.small{font-size:.8rem}.center{text-align:center}.stack{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}label{display:flex;flex-direction:column;gap:.35rem;font-size:.9rem}input{padding:.65rem .75rem;border-radius:8px;border:1px solid var(--border);background:#0b1220;color:var(--fg);font-size:1rem}button{padding:.7rem 1rem;border-radius:8px;border:none;background:var(--accent);color:#05263a;font-weight:600;font-size:1rem;cursor:pointer}button:disabled{opacity:.6;cursor:default}button.ghost{background:transparent;color:var(--muted);border:1px solid var(--border);font-weight:500}.row{display:flex;align-items:center;gap:.75rem}.between{justify-content:space-between}.error{color:var(--bad)}code{background:#0b1220;padding:.1rem .35rem;border-radius:5px;font-size:.8rem}.qr-frame{position:relative;display:flex;justify-content:center;align-items:center;background:#fff;border-radius:12px;padding:1.25rem;margin:1.25rem 0;min-height:320px}.qr-placeholder{color:#475569}.tick{position:absolute;bottom:8px;right:12px;width:10px;height:10px;border-radius:50%;background:var(--accent)}.tick-0{opacity:.35}.tick-1{opacity:1}.video-frame{position:relative;margin:1.25rem 0;border-radius:12px;overflow:hidden;background:#000;aspect-ratio:3 / 4}.video-frame video{width:100%;height:100%;object-fit:cover}.scan-overlay{position:absolute;top:12%;right:12%;bottom:12%;left:12%;border:3px solid rgba(56,189,248,.85);border-radius:12px;pointer-events:none}.progress{display:flex;align-items:center;gap:.5rem;justify-content:center;margin-bottom:.5rem}.dot{width:14px;height:14px;border-radius:50%;border:2px solid var(--accent);transition:background .2s}.dot.on{background:var(--accent)}.progress-label{margin-left:.5rem;color:var(--muted);font-size:.85rem}.result{text-align:center;padding:1.5rem 0;display:flex;flex-direction:column;gap:1rem;align-items:center}.result .big{font-size:1.25rem;font-weight:600}.result.ok .big{color:var(--ok)}
