.qr-scanner{*{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}*,.mode-btn{transition-duration:.2s}.mode-btn{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.mode-btn:hover{transform:scale(1.05)}#drop-zone{transition-duration:.3s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}#drop-zone.drag-over{background-color:#eff6ff;border-color:#3b82f6;transform:scale(1.02)}.dark #drop-zone.drag-over{background-color:rgba(30,58,138,.2)}#video-preview{-o-object-fit:cover;object-fit:cover}.scan-frame{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}#scanning-indicator{animation:slideInDown .3s ease-out}@keyframes slideInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}#image-preview{animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}#scan-results{animation:slideIn .4s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}#history-list>div{transition-duration:.2s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}#history-list>div:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);transform:scale(1.02)}#history-list{scrollbar-color:#9ca3af transparent;scrollbar-width:thin}#history-list::-webkit-scrollbar{width:6px}#history-list::-webkit-scrollbar-track{background-color:transparent}#history-list::-webkit-scrollbar-thumb{background-color:#9ca3af;border-radius:9999px}.dark #history-list::-webkit-scrollbar-thumb{background-color:#4b5563}#history-list::-webkit-scrollbar-thumb:hover,.dark #history-list::-webkit-scrollbar-thumb:hover{background-color:#6b7280}button:disabled{cursor:not-allowed;opacity:.5}button:not(:disabled):active{transform:scale(.95)}#camera-permission-info{animation:fadeIn .5s ease-in-out}.badge-url{background-color:#dbeafe;color:#1d4ed8}.dark .badge-url{background-color:#1e3a8a;color:#93c5fd}.badge-email{background-color:#dcfce7;color:#15803d}.dark .badge-email{background-color:#14532d;color:#86efac}.badge-phone{background-color:#f3e8ff;color:#7e22ce}.dark .badge-phone{background-color:#581c87;color:#d8b4fe}.badge-wifi{background-color:#fef9c3;color:#a16207}.dark .badge-wifi{background-color:#713f12;color:#fde047}.badge-vcard{background-color:#fce7f3;color:#be185d}.dark .badge-vcard{background-color:#831843;color:#f9a8d4}.badge-text{background-color:#f3f4f6;color:#374151}.dark .badge-text{background-color:#374151;color:#d1d5db}#decoded-content{max-height:300px;overflow-y:auto;word-break:break-all}}@media (max-width:1024px){.qr-scanner .scan-frame{height:12rem;width:12rem}}@media (max-width:640px){.qr-scanner .scan-frame{height:10rem;width:10rem}.qr-scanner .mode-btn{font-size:.875rem;line-height:1.25rem;padding:.5rem 1rem}.qr-scanner .mode-btn svg{height:1rem;width:1rem}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}@keyframes successPulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.success-animation{animation:successPulse .5s ease-out}.error-message{animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translateX(0)}25%{transform:translateX(-10px)}75%{transform:translateX(10px)}}}@media print{.qr-scanner{box-shadow:none}.qr-scanner #camera-mode,.qr-scanner #history-list,.qr-scanner #upload-mode,.qr-scanner .mode-btn{display:none}.qr-scanner #scan-results{display:block}}@media (prefers-contrast:high){.qr-scanner{border:2px solid #111827}.dark .qr-scanner{border-color:#fff}.qr-scanner button{border-width:2px}.qr-scanner .scan-frame{border-width:8px}}@media (prefers-reduced-motion:reduce){.qr-scanner *{animation:none!important;transition:none}.qr-scanner .scan-frame{opacity:1}}.qr-scanner button:focus-visible,.qr-scanner input:focus-visible,.qr-scanner select:focus-visible{outline:none;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 2px var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 4px #3b82f6;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.dark .qr-scanner button:focus-visible,.dark .qr-scanner input:focus-visible,.dark .qr-scanner select:focus-visible{--tw-ring-offset-color:#1f2937}#video-preview{transform:scaleX(-1)}#additional-info{animation:expandIn .3s ease-out}@keyframes expandIn{0%{max-height:0;opacity:0}to{max-height:500px;opacity:1}}