:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;padding:0;display:flex;place-items:center;min-width:320px;min-height:100vh;overflow-x:hidden}@media(max-width:768px){body{min-width:100%}}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}@media(max-width:480px){button{min-height:44px;min-width:44px}}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{--app-max-width: 800px;--scanner-max-width: 600px;--spacing-base: clamp(8px, 2.5vw, 20px);--spacing-small: clamp(5px, 1.5vw, 10px);--spacing-large: clamp(15px, 4vw, 30px);--font-size-h1: clamp(1.3rem, 5vw, 2rem);--font-size-base: clamp(13px, 3vw, 16px);--font-size-small: clamp(12px, 2.5vw, 14px);--border-radius-large: clamp(8px, 2vw, 16px);--border-radius-medium: clamp(6px, 1.5vw, 12px);--border-radius-small: clamp(4px, 1vw, 8px);--border-width: clamp(2px, .5vw, 3px);--button-padding-y: clamp(8px, 2vw, 14px);--button-padding-x: clamp(20px, 5vw, 32px)}.app-container{max-width:var(--app-max-width);margin:0 auto;padding:var(--spacing-base);text-align:center;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}h1{color:#000;margin-bottom:var(--spacing-large);font-size:var(--font-size-h1);padding-inline:var(--spacing-small)}.scanner-container{margin:var(--spacing-base) auto;max-width:var(--scanner-max-width);width:min(100%,var(--scanner-max-width));padding-inline:var(--spacing-small);position:relative;display:flex;flex-direction:column}.scanner-overlay{position:absolute;inset:0;padding-inline:var(--spacing-small);pointer-events:none;display:flex;align-items:center;justify-content:center}.scan-frame{width:clamp(85%,90vw,92%);height:clamp(60%,12vh + 50%,70%);border:var(--border-width) solid #646cff;border-radius:var(--border-radius-large);box-shadow:0 0 0 9999px #00000080;position:relative}.scan-frame:before,.scan-frame:after{content:"";position:absolute;width:clamp(20px,5vw,30px);height:clamp(20px,5vw,30px);border:clamp(3px,.8vw,4px) solid #646cff}.scan-frame:before{top:-4px;left:-4px;border-right:none;border-bottom:none}.scan-frame:after{top:-4px;right:-4px;border-left:none;border-bottom:none}.status-message{position:absolute;bottom:clamp(65px,15vw,80px);left:50%;transform:translate(-50%);background:#646cfff2;color:#fff;padding:clamp(8px,2vw,12px) clamp(16px,4vw,24px);border-radius:var(--border-radius-small);font-weight:600;font-size:var(--font-size-small);z-index:10;white-space:nowrap;box-shadow:0 4px 12px #0000004d;max-width:min(90%,500px)}.status-message p{margin:0;overflow:hidden;text-overflow:ellipsis}.manual-capture-btn{position:absolute;bottom:clamp(10px,2vw,15px);left:50%;transform:translate(-50%);background:#646cff;color:#fff;border:none;border-radius:50px;padding:var(--button-padding-y) var(--button-padding-x);font-size:var(--font-size-base);font-weight:600;cursor:pointer;z-index:10;box-shadow:0 4px 12px #646cff66;transition:all .3s ease;display:inline-flex;align-items:center;gap:clamp(6px,1.5vw,8px);white-space:nowrap}.manual-capture-btn:hover{background:#535bf2;transform:translate(-50%) scale(1.05);box-shadow:0 6px 16px #646cff80}.manual-capture-btn:active{transform:translate(-50%) scale(.98)}.manual-capture-btn:disabled{opacity:.6;cursor:not-allowed;transform:translate(-50%)}.qr-video{width:100%;max-width:var(--scanner-max-width);height:auto;border:var(--border-width) solid #646cff;border-radius:var(--border-radius-medium);display:block;margin:0 auto;background:#000;object-fit:cover}#qr-reader{border:2px solid #646cff;border-radius:var(--border-radius-small);overflow:visible;width:100%;min-height:400px}#qr-reader video{width:100%!important;height:auto!important;display:block!important;border-radius:6px;max-width:100%}#qr-reader canvas{width:100%!important;height:auto!important;display:block!important}#qr-reader__scan_region{position:relative!important}#qr-reader__camera_selection{margin:10px 0}#qr-reader__dashboard{padding:10px}#qr-reader__dashboard_section{text-align:center}.scanner-info{margin-top:15px;color:#666;font-size:14px}.error-message{background-color:#fee;border:1px solid #fcc;border-radius:var(--border-radius-small);padding:clamp(12px,3vw,20px);margin:var(--spacing-base) auto;max-width:min(90%,500px);color:#c33;font-size:var(--font-size-small)}.error-message button{margin-top:15px;padding:clamp(8px,2vw,10px) clamp(16px,4vw,20px);background-color:#646cff;color:#fff;border:none;border-radius:5px;cursor:pointer;font-size:var(--font-size-base);transition:background-color .3s}.error-message button:hover{background-color:#535bf2}.error-message button:active{transform:scale(.98)}.scanned-data{background-color:#f9f9f9;border:2px solid #646cff;border-radius:var(--border-radius-medium);padding:clamp(15px,4vw,30px);margin:var(--spacing-base) auto;max-width:min(95%,var(--scanner-max-width));text-align:left;display:flex;flex-direction:column;gap:clamp(10px,2vw,12px)}.scanned-data h2{color:#000;margin-bottom:clamp(15px,3vw,25px);text-align:center;font-size:clamp(1.1rem,4vw,1.5rem)}.scan-progress{display:flex;justify-content:center;margin-bottom:clamp(12px,2.5vw,20px)}.badge{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff;padding:clamp(6px,1.5vw,8px) clamp(16px,4vw,20px);border-radius:20px;font-size:clamp(12px,2.5vw,14px);font-weight:600;box-shadow:0 2px 8px #4caf504d;display:inline-flex;align-items:center;gap:6px}.badge:before{content:"✓✓";font-size:1.1em}.info-row{background-color:#fff;border:1px solid #ddd;border-radius:6px;padding:clamp(8px,2vw,12px) clamp(10px,2.5vw,15px);display:grid;grid-template-columns:minmax(min-content,150px) 1fr;gap:clamp(5px,2vw,10px);align-items:start}@container (max-width: 500px){.info-row{grid-template-columns:1fr}}@supports not (container-type: inline-size){@media(max-width:768px){.info-row{grid-template-columns:1fr}}}.info-row strong{color:#646cff;font-weight:600;font-size:var(--font-size-small)}.info-row span{color:#000;word-break:break-word;font-size:var(--font-size-small)}.address-row{grid-template-columns:minmax(min-content,150px) 1fr}@container (max-width: 500px){.address-row{grid-template-columns:1fr}}@supports not (container-type: inline-size){@media(max-width:768px){.address-row{grid-template-columns:1fr}}}.address-content{color:#000;line-height:1.6}.raw-data-details{margin:20px 0}.raw-data-details summary{cursor:pointer;padding:10px;background:#646cff;color:#fff;border-radius:6px;margin-bottom:10px;font-weight:700}.raw-data-details summary:hover{background:#535bf2}.raw-data-details pre{background-color:#f5f5f5;border:1px solid #ddd;padding:15px;border-radius:6px;overflow-x:auto;font-size:12px;white-space:pre-wrap;word-wrap:break-word;max-height:300px;overflow-y:auto;color:#333}.scan-again-btn{display:block;margin:clamp(15px,4vw,25px) auto 0;padding:clamp(10px,2.5vw,12px) clamp(20px,5vw,30px);background-color:#646cff;color:#fff;border:none;border-radius:var(--border-radius-small);cursor:pointer;font-size:var(--font-size-base);font-weight:600;transition:all .3s;width:min(100%,auto);align-self:center}.scan-again-btn:hover{background-color:#535bf2}.scan-again-btn:active{transform:scale(.98)}@media(max-width:480px){.scan-again-btn{width:100%}}.scanned-data button:hover{background-color:#535bf2}.data-field{background-color:#fff;border:1px solid #ddd;border-radius:6px;padding:clamp(8px,2vw,12px) clamp(10px,2.5vw,15px);display:flex;flex-direction:column;gap:8px}.data-field strong{color:#333;display:inline-block;min-width:clamp(100px,25vw,140px)}.data-field pre{background-color:#f5f5f5;padding:10px;border-radius:4px;overflow-x:auto;margin-top:8px;font-size:clamp(11px,2.5vw,12px);white-space:pre-wrap;word-wrap:break-word}.warning{background-color:#fff3cd;border:1px solid #ffc107;border-radius:6px;padding:clamp(8px,2vw,10px);margin:15px 0;color:#856404;font-size:var(--font-size-small)}.rescan-button{display:block;margin:clamp(15px,4vw,25px) auto 0;padding:clamp(10px,2.5vw,12px) clamp(20px,5vw,30px);background-color:#646cff;color:#fff;border:none;border-radius:var(--border-radius-small);cursor:pointer;font-size:var(--font-size-base);font-weight:600;transition:background-color .3s}.rescan-button:hover{background-color:#535bf2}.rescan-button:active{transform:scale(.98)}.preview-container{max-width:var(--scanner-max-width);width:min(95%,var(--scanner-max-width));margin:0 auto;padding:var(--spacing-base);display:flex;flex-direction:column;gap:var(--spacing-base);align-items:center}.preview-container h2{color:#000;font-size:clamp(1.2rem,4.5vw,1.8rem);margin:0;text-align:center}.preview-instruction{color:#666;font-size:var(--font-size-base);margin:0;text-align:center;padding:0 var(--spacing-small)}.preview-image-wrapper{width:100%;border:var(--border-width) solid #646cff;border-radius:var(--border-radius-medium);overflow:hidden;background:#000;box-shadow:0 4px 20px #0003}.preview-image{width:100%;height:auto;display:block;object-fit:contain;max-height:70vh}.preview-actions{display:flex;gap:clamp(10px,3vw,15px);width:100%;justify-content:center;flex-wrap:wrap}.recapture-btn,.confirm-btn{flex:1;min-width:clamp(120px,35vw,160px);padding:var(--button-padding-y) var(--button-padding-x);border:none;border-radius:50px;font-size:var(--font-size-base);font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #00000026;display:inline-flex;align-items:center;justify-content:center;gap:clamp(6px,1.5vw,8px)}.recapture-btn{background:#ff6b6b;color:#fff}.recapture-btn:hover{background:#ee5a52;transform:scale(1.05);box-shadow:0 6px 16px #ff6b6b66}.recapture-btn:active{transform:scale(.98)}.confirm-btn{background:#4caf50;color:#fff}.confirm-btn:hover{background:#45a049;transform:scale(1.05);box-shadow:0 6px 16px #4caf5066}.confirm-btn:active{transform:scale(.98)}@media(max-width:480px){.preview-actions{flex-direction:column}.recapture-btn,.confirm-btn{width:100%;min-width:100%}}.start-camera-prompt{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-base);padding:clamp(40px,10vw,80px) var(--spacing-base);text-align:center}.start-camera-prompt p{color:#666;font-size:var(--font-size-base);margin:0}.start-camera-btn{background:#646cff;color:#fff;border:none;border-radius:50px;padding:clamp(14px,3vw,18px) clamp(32px,7vw,48px);font-size:clamp(1rem,3.5vw,1.2rem);font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #646cff66;display:inline-flex;align-items:center;gap:clamp(8px,2vw,12px)}.start-camera-btn:hover{background:#535bf2;transform:scale(1.05);box-shadow:0 6px 16px #646cff80}.start-camera-btn:active{transform:scale(.98)}
