body,#root{min-height:100vh;margin:0;padding:0;background:#f4f8fb;display:flex;align-items:center;justify-content:center}.qr-container{width:100%;max-width:400px;margin:auto;padding:2rem 1rem 1.5rem;background:#fff;border-radius:18px;box-shadow:0 4px 24px #0000001a;text-align:center;color:#222;display:flex;flex-direction:column;align-items:center}h2{margin-bottom:1rem;color:#0078d4;font-weight:700;letter-spacing:1px}.video-wrapper{width:100%;aspect-ratio:1/1;background:#222;border-radius:10px;overflow:hidden;margin-bottom:1.2rem;display:flex;align-items:center;justify-content:center}.qr-video{width:100%;height:100%;object-fit:cover}.qr-controls{margin-bottom:1rem;display:flex;gap:.5em;justify-content:center}.qr-btn{padding:.6em 1.2em;border:none;border-radius:6px;background:#0078d4;color:#fff;font-size:1em;cursor:pointer;transition:background .2s;font-weight:500;box-shadow:0 2px 8px #0078d414}.qr-btn.stop{background:#d40000}.qr-btn:active{background:#005fa3}.qr-message{margin:.5em 0;color:#555;min-height:1.5em;font-size:1em}.qr-result{margin-top:1em;width:100%}.qr-result-box{background:#f5f5f5;border-radius:6px;padding:.7em;word-break:break-all;margin-top:.5em;font-size:1.1em;color:#0078d4;font-weight:600}@media (max-width: 600px){.qr-container{max-width:98vw;padding:1rem .2rem}}