:root{--color-primary:#900;--color-primary-hover:#b30000;--color-secondary:#b2d8d8;--color-bg-dark:#050505;--color-bg-light:#1a1a1a;--color-text:#f0f0f0;--color-text-muted:#888;--font-display:"Teko", sans-serif;--font-body:"Space Mono", monospace}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--color-bg-dark);color:var(--color-text);min-height:100vh;line-height:1.6;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);text-transform:uppercase;letter-spacing:1px}button{font-family:var(--font-display);cursor:pointer;background:var(--color-primary);color:var(--color-text);text-transform:uppercase;clip-path:polygon(10% 0,100% 0,90% 100%,0 100%);border:none;padding:.5rem 1.5rem;font-size:1.5rem;transition:all .2s ease-in-out}button:hover{background:var(--color-primary-hover);transform:scale(1.05)}button:disabled{background:var(--color-text-muted);cursor:not-allowed;transform:none}.app-container{flex-direction:column;min-height:100vh;display:flex;position:relative;overflow:hidden}.hero-bg{object-fit:cover;object-position:center 10%;opacity:.6;mix-blend-mode:luminosity;filter:grayscale(80%)contrast(120%);z-index:0;width:100%;height:100%;position:absolute;top:0;left:0}@media (width>=768px){.hero-bg{object-position:center 25%}}.scanner-section{z-index:10;pointer-events:none;background:linear-gradient(#05050500 0%,#050505e6 60%,#050505 100%);flex-direction:column;justify-content:flex-end;align-items:center;min-height:100vh;padding:2rem;display:flex;position:relative}.scanner-section>*{pointer-events:auto}.scanner-description{text-align:center;color:#ccc;text-shadow:1px 1px 2px #000;max-width:400px;margin-top:1rem;margin-bottom:2rem;font-size:.8rem}.scanner-wrapper{aspect-ratio:1;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#0000004d;border:2px solid #fff3;border-radius:20px;width:90%;max-width:280px;margin-bottom:1rem;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 10px 40px #000c}@media (width>=768px){.scanner-wrapper{max-width:350px}}.scanner-wrapper.scanning{border-color:var(--color-primary);transform:scale(1.02);box-shadow:0 0 40px #9009}.scanner-wrapper.success{border-color:var(--color-secondary);box-shadow:0 0 40px #b2d8d899}.crosshair{pointer-events:none;z-index:10;position:absolute;inset:0}.crosshair:before,.crosshair:after{content:"";background:var(--color-primary);position:absolute}.crosshair:before{opacity:.5;height:1px;top:50%;left:10%;right:10%}.crosshair:after{opacity:.5;width:1px;top:10%;bottom:10%;left:50%}.scan-line{background:var(--color-primary);height:3px;box-shadow:0 0 15px 2px var(--color-primary);z-index:11;opacity:.9;animation:2.5s cubic-bezier(.4,0,.2,1) infinite scan;position:absolute;top:0;left:0;right:0}@keyframes scan{0%{opacity:0;top:0}10%{opacity:1}90%{opacity:1}to{opacity:0;top:100%}}.reader-element{width:100%;height:100%}.reader-element video{object-fit:cover!important}.btn-primary{font-family:var(--font-display);cursor:pointer;color:#fff;border:2px solid var(--color-primary);text-transform:uppercase;text-shadow:0 0 5px #99000080;letter-spacing:2px;background:#9900001a;border-radius:4px;margin-bottom:2rem;padding:1rem 3rem;font-size:1.8rem;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 0 15px #9006,inset 0 0 10px #9003}.btn-primary:before{content:"";background:linear-gradient(90deg,#0000,#99000080,#0000);width:100%;height:100%;transition:all .5s;position:absolute;top:0;left:-100%}.btn-primary:hover{background:#9003;transform:scale(1.05);box-shadow:0 0 25px #900c,inset 0 0 20px #99000080}.btn-primary:hover:before{left:100%}.scanner-overlay-button{z-index:20;background:#00000080;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.scanner-overlay-button .btn-primary{margin-bottom:0}.logo-container{justify-content:center;width:100%;margin-top:.5rem;display:flex}.bottom-logo{mix-blend-mode:screen;opacity:.9;width:250px;max-width:80%}.loading-container{height:100%;color:var(--color-text);z-index:20;background:#000c;flex-direction:column;justify-content:center;align-items:center;width:100%;display:flex;position:absolute;top:0;left:0}.spinner{border:3px solid #ffffff1a;border-top-color:var(--color-primary);border-radius:50%;width:50px;height:50px;margin-bottom:1rem;animation:1s ease-in-out infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.fullscreen-image-viewer{z-index:1000;background:#000000f2;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0;overflow:auto}.fullscreen-image{object-fit:contain;touch-action:pan-x pan-y pinch-zoom;max-width:100%;max-height:100%}.close-button{color:#fff;border:1px solid var(--color-primary);font-family:var(--font-display);cursor:pointer;z-index:1001;text-shadow:1px 1px 2px #000;background:#900c;border-radius:4px;padding:.5rem 1.5rem;font-size:1.2rem;transition:background .3s;position:fixed;top:20px;right:20px;box-shadow:0 4px 10px #00000080}.close-button:hover{background:var(--color-primary)}