@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&display=swap";:root{--color-primary: oklch(.45 .15 240);--color-slate: oklch(.25 .01 240);--color-bg: oklch(.98 .005 240);--color-accent: oklch(.7 .14 200);--color-surface: oklch(1 0 0);--color-muted: oklch(.95 .008 240);--color-muted-foreground: oklch(.42 .02 240);--color-border: oklch(.88 .012 240);--color-danger: oklch(.58 .22 25);font-family:Space Grotesk,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5;font-weight:400;color:var(--color-slate);background:var(--color-bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#app{margin:0;min-height:100%}body{min-width:320px;background:var(--color-bg)}.page-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1rem}.scanner-container{width:100%;max-width:56rem}.hero{text-align:center;margin-bottom:1.5rem}.hero-icon{width:4rem;height:4rem;border-radius:999px;background:color-mix(in oklch,var(--color-primary) 14%,white);color:var(--color-primary);display:inline-flex;align-items:center;justify-content:center;margin-bottom:.8rem;font-size:1.6rem}.hero h1{margin:0;font-size:2rem;line-height:1.1;letter-spacing:-.03em}.hero p{margin:.5rem 0 0;color:var(--color-muted-foreground)}.card-panel{background:var(--color-surface);border:2px solid var(--color-border);border-radius:1rem;overflow:hidden;box-shadow:0 22px 40px color-mix(in oklch,var(--color-primary) 15%,transparent)}.panel-header{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;background:linear-gradient(140deg,color-mix(in oklch,var(--color-primary) 8%,white),color-mix(in oklch,var(--color-accent) 8%,white));padding:1.2rem 1.2rem 1rem}.panel-header h2{margin:0;font-size:1.25rem}.panel-header p{margin:.35rem 0 0;color:var(--color-muted-foreground);font-size:.95rem}.status-badge{border:1px solid transparent;border-radius:999px;padding:.3rem .7rem;font-size:.76rem;font-weight:600;letter-spacing:.01em;display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap}.status-badge.accent{background:color-mix(in oklch,var(--color-accent) 22%,white);border-color:color-mix(in oklch,var(--color-accent) 45%,white)}.status-badge.primary{background:color-mix(in oklch,var(--color-primary) 18%,white);border-color:color-mix(in oklch,var(--color-primary) 42%,white)}.pulse-dot{width:.5rem;height:.5rem;border-radius:999px;background:var(--color-accent);animation:pulse 1.4s ease-in-out infinite}.panel-body{padding:1.2rem}.camera-frame{position:relative;aspect-ratio:16 / 9;border-radius:.75rem;overflow:hidden;background:var(--color-muted)}.camera-video{width:100%;height:100%;object-fit:cover;display:block}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.card-guide{width:76%;max-width:22rem;aspect-ratio:1.586 / 1;border-radius:.9rem;border:3px dashed var(--color-accent);position:relative;animation:pulse-subtle 2s ease-in-out infinite}.corner{width:1.45rem;height:1.45rem;border-color:var(--color-accent);border-style:solid;position:absolute}.top-left{top:-.6rem;left:-.6rem;border-width:4px 0 0 4px;border-top-left-radius:.6rem}.top-right{top:-.6rem;right:-.6rem;border-width:4px 4px 0 0;border-top-right-radius:.6rem}.bottom-left{bottom:-.6rem;left:-.6rem;border-width:0 0 4px 4px;border-bottom-left-radius:.6rem}.bottom-right{bottom:-.6rem;right:-.6rem;border-width:0 4px 4px 0;border-bottom-right-radius:.6rem}.guide-label{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:color-mix(in oklch,var(--color-surface) 82%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border-radius:.5rem;padding:.45rem .7rem;font-size:.9rem;font-weight:500}.state-block{min-height:22rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:.8rem;animation:fade-in .22s ease-out}.state-block h3{margin:0;font-size:1.55rem}.state-block p{margin:0;color:var(--color-muted-foreground)}.icon-ring{width:5rem;height:5rem;border-radius:999px;display:flex;align-items:center;justify-content:center;font-size:2.2rem;font-weight:700}.icon-ring.spinner{border:4px solid color-mix(in oklch,var(--color-primary) 16%,white);border-top-color:var(--color-primary);animation:spin .85s linear infinite}.icon-ring.success{background:color-mix(in oklch,var(--color-accent) 17%,white);color:var(--color-accent)}.icon-ring.error{background:color-mix(in oklch,var(--color-danger) 16%,white);color:var(--color-danger)}.result-grid{margin:.6rem 0 0;width:100%;max-width:30rem;border-radius:.7rem;background:color-mix(in oklch,var(--color-muted) 78%,white);padding:.4rem .8rem}.result-grid div{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem .2rem;border-bottom:1px solid color-mix(in oklch,var(--color-border) 60%,white)}.result-grid div:last-child{border-bottom:none}.result-grid dt{color:var(--color-muted-foreground);font-size:.9rem;font-weight:500}.result-grid dd{margin:0;font-weight:700}.additional-info-form{margin-top:.6rem;width:100%;max-width:30rem;border-radius:.7rem;background:color-mix(in oklch,var(--color-muted) 78%,white);padding:.95rem .9rem;display:flex;flex-direction:column;gap:.7rem}.additional-info-form h4{margin:0;text-align:left}.form-field{display:flex;flex-direction:column;gap:.35rem;text-align:left}.form-field span{font-size:.9rem;color:var(--color-muted-foreground)}.form-field input{border-radius:.55rem;border:1px solid color-mix(in oklch,var(--color-border) 70%,white);background:var(--color-surface);color:var(--color-foreground);padding:.55rem .6rem;font:inherit}.form-field input:focus{outline:2px solid color-mix(in oklch,var(--color-primary) 28%,white);border-color:var(--color-primary)}.submit-message{margin:0;border-radius:.5rem;padding:.5rem .6rem;font-size:.9rem;text-align:left}.submit-message.success{border:1px solid color-mix(in oklch,var(--color-accent) 40%,white);background:color-mix(in oklch,var(--color-accent) 14%,white)}.submit-message.error{border:1px solid color-mix(in oklch,var(--color-danger) 42%,white);background:color-mix(in oklch,var(--color-danger) 12%,white)}.accent-text{color:var(--color-accent)}.status-pill{border-radius:999px;padding:.25rem .65rem;font-size:.8rem}.status-pill.valid{background:color-mix(in oklch,var(--color-accent) 18%,white);color:color-mix(in oklch,var(--color-slate) 92%,black)}.status-pill.invalid{background:color-mix(in oklch,var(--color-danger) 16%,white);color:var(--color-danger)}.error-alert{width:100%;max-width:30rem;border-radius:.7rem;border:1px solid color-mix(in oklch,var(--color-danger) 42%,white);background:color-mix(in oklch,var(--color-danger) 12%,white);color:color-mix(in oklch,var(--color-slate) 94%,black);padding:.8rem .95rem;font-size:.92rem}.action-btn{margin-top:.2rem;border:none;border-radius:.7rem;background:var(--color-primary);color:#fff;font-weight:600;font-family:inherit;font-size:.98rem;width:100%;max-width:30rem;padding:.78rem .95rem;cursor:pointer;transition:transform .12s ease,filter .2s ease}.action-btn:hover{filter:brightness(1.04);transform:translateY(-1px)}.action-btn:active{transform:translateY(0)}.action-btn:disabled{cursor:not-allowed;filter:grayscale(.05) brightness(.95);transform:none}.action-btn.secondary{background:color-mix(in oklch,var(--color-primary) 10%,white);color:var(--color-primary);border:1px solid color-mix(in oklch,var(--color-primary) 30%,white)}.footer-help{text-align:center;color:var(--color-muted-foreground);font-size:.9rem;margin:1rem 0 0}@media(max-width:640px){.page-shell{align-items:stretch;padding:0}.scanner-container{max-width:none}.hero{padding:1rem 1rem 0}.hero h1{font-size:1.7rem}.card-panel{border-radius:0;min-height:calc(100vh - 7.5rem);border-left:none;border-right:none}.panel-body{padding:1rem}.state-block{min-height:19rem}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse-subtle{0%,to{opacity:.92;transform:scale(1)}50%{opacity:1;transform:scale(1.01)}}@keyframes pulse{0%,to{opacity:.55;transform:scale(.9)}50%{opacity:1;transform:scale(1)}}@keyframes fade-in{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}