.scanner-container{aspect-ratio:1;background:#000;border-radius:12px;width:100%;max-width:400px;margin:0 auto;position:relative;overflow:hidden}.scanner-container video{object-fit:cover;width:100%;height:100%;display:block}.scanner-box{width:200px;height:200px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 9999px #00000073}.scanner-box .corner{border-style:solid;border-color:#4fc3f7;width:24px;height:24px;position:absolute}.scanner-box .corner-tl{border-width:3px 0 0 3px;top:0;left:0}.scanner-box .corner-tr{border-width:3px 3px 0 0;top:0;right:0}.scanner-box .corner-bl{border-width:0 0 3px 3px;bottom:0;left:0}.scanner-box .corner-br{border-width:0 3px 3px 0;bottom:0;right:0}.scanner-line{background:#4fc3f7;height:2px;animation:2s ease-in-out infinite scan;position:absolute;left:4px;right:4px;box-shadow:0 0 8px #4fc3f7}@keyframes scan{0%{top:4px}50%{top:calc(100% - 4px)}to{top:4px}}*{box-sizing:border-box;margin:0;padding:0}body{margin:0}#root{min-height:100vh}