@import "https://fonts.googleapis.com/css2?family=Syne:wght@600;800&family=Inter:wght@400;500;600&display=swap";:root{--bg:#0d0d12;--bg-mid:#13131a;--surface:#1a1a24;--surface-2:#21212e;--border:#ffffff12;--border-glow:#6366f159;--accent:#6366f1;--accent-2:#a78bfa;--accent-glow:#6366f12e;--success:#34d399;--success-glow:#34d39940;--text-primary:#f0f0f5;--text-secondary:#f0f0f573;--text-muted:#f0f0f540;--radius-lg:24px;--radius-xl:32px;--radius-full:9999px;--glow-panel:0 0 0 1px var(--border), 0 8px 40px #00000080;--glow-accent:0 0 20px var(--accent-glow), 0 0 60px #6366f114}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text-primary);-webkit-font-smoothing:antialiased;background-image:radial-gradient(80% 50% at 50% -10%,#6366f11f 0%,#0000 60%),radial-gradient(60% 40% at 80% 110%,#a78bfa12 0%,#0000 55%);min-height:100dvh;font-family:Inter,system-ui,sans-serif;font-size:15px;line-height:1.6}#root{flex-direction:column;width:100%;min-height:100dvh;display:flex}.display-heading{text-transform:uppercase;letter-spacing:.06em;background:linear-gradient(135deg, #f0f0f5 30%, var(--accent-2) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-family:Syne,sans-serif;font-size:clamp(1.8rem,5vw,3rem);font-weight:800;line-height:1}.label-caps{letter-spacing:.22em;text-transform:uppercase;color:var(--text-secondary);font-family:Syne,sans-serif;font-size:.65rem;font-weight:600}.panel{background:var(--surface);border-radius:var(--radius-xl);border:1px solid var(--border);box-shadow:var(--glow-panel);padding:1.5rem}.tab-bar{background:var(--bg-mid);border:1px solid var(--border);border-radius:var(--radius-full);gap:6px;padding:5px;display:flex}.tab-btn{border-radius:var(--radius-full);color:var(--text-secondary);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;white-space:nowrap;background:0 0;border:none;flex:1;justify-content:center;align-items:center;gap:7px;padding:.6rem 1.2rem;font-family:Syne,sans-serif;font-size:.75rem;font-weight:600;transition:background .2s,color .2s,box-shadow .2s;display:flex}.tab-btn:hover{color:var(--text-primary)}.tab-btn.active{background:var(--accent);color:#fff;box-shadow:0 0 18px var(--accent-glow), 0 2px 8px #0006}.input-field{background:var(--bg-mid);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;color:var(--text-primary);outline:none;padding:.9rem 1.2rem;font-family:Inter,sans-serif;font-size:.95rem;transition:border-color .2s,box-shadow .2s}.input-field::placeholder{color:var(--text-muted)}.input-field:focus{border-color:var(--border-glow);box-shadow:0 0 0 3px var(--accent-glow)}.btn-primary{background:var(--accent);color:#fff;border-radius:var(--radius-full);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;box-shadow:0 0 18px var(--accent-glow);border:none;justify-content:center;align-items:center;gap:8px;width:100%;padding:.85rem 1.8rem;font-family:Syne,sans-serif;font-size:.75rem;font-weight:600;transition:background .2s,box-shadow .2s,transform .15s;display:flex}.btn-primary:hover{background:var(--accent-2);box-shadow:0 0 28px #a78bfa59}.btn-primary:active{transform:scale(.98)}.shotcode-wrapper{justify-content:center;align-items:center;margin:1.5rem auto;animation:3s ease-in-out infinite ambient-glow;display:flex;position:relative}@keyframes ambient-glow{0%{filter:drop-shadow(0 0 10px #6366f140)}50%{filter:drop-shadow(0 0 28px #a78bfa80)}to{filter:drop-shadow(0 0 10px #6366f140)}}.shotcode-canvas{outline-offset:6px;border-radius:50%;outline:3px solid #6366f126;max-width:100%;height:auto;display:block}.viewfinder{aspect-ratio:1;border-radius:var(--radius-xl);border:1px solid var(--border);width:100%;box-shadow:var(--glow-panel);background:#000;position:relative;overflow:hidden}.viewfinder video{object-fit:cover;opacity:.9;width:100%;height:100%}.reticle{pointer-events:none;z-index:10;position:absolute;inset:0}.reticle:before,.reticle:after,.reticle .corner-br,.reticle .corner-tl{content:"";border-color:var(--accent);border-style:solid;width:32px;height:32px;position:absolute}.reticle:before{border-width:3px 0 0 3px;border-radius:6px 0 0;top:18%;left:18%}.reticle:after{border-width:3px 3px 0 0;border-radius:0 6px 0 0;top:18%;right:18%}.reticle .corner-bl{border-color:var(--accent);border-style:solid;border-width:0 0 3px 3px;border-radius:0 0 0 6px;width:32px;height:32px;position:absolute;bottom:18%;left:18%}.reticle .corner-br{border-color:var(--accent);border-style:solid;border-width:0 3px 3px 0;border-radius:0 0 6px;width:32px;height:32px;position:absolute;bottom:18%;right:18%}.reticle-overlay{pointer-events:none;z-index:9;background:radial-gradient(55% 55%,#0000 0%,#00000073 100%);position:absolute;inset:0}.scan-line{background:linear-gradient(90deg, transparent, var(--accent), transparent);opacity:.7;z-index:11;pointer-events:none;height:2px;animation:2.4s ease-in-out infinite scan;position:absolute;top:18%;left:18%;right:18%}@keyframes scan{0%{opacity:.5;top:18%}50%{opacity:.9;top:82%}to{opacity:.5;top:18%}}.status-pill{border-radius:var(--radius-full);letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--border);background:var(--bg-mid);color:var(--text-secondary);align-items:center;gap:6px;margin-top:.75rem;padding:.4rem .9rem;font-family:Syne,sans-serif;font-size:.68rem;font-weight:600;transition:background .3s,color .3s,border-color .3s;display:inline-flex}.status-pill.success{color:var(--success);box-shadow:0 0 14px var(--success-glow);background:#34d3991a;border-color:#34d3994d}.status-dot{background:currentColor;border-radius:50%;flex-shrink:0;width:6px;height:6px}@keyframes blink{0%,to{opacity:1}50%{opacity:.2}}.status-dot.blink{animation:1.2s ease-in-out infinite blink}.result-box{background:var(--bg-mid);border:1px solid var(--border);border-radius:var(--radius-lg);color:var(--text-primary);word-break:break-word;text-align:left;min-height:72px;margin-top:.75rem;padding:1rem 1.2rem;font-family:Inter,monospace;font-size:.9rem}.divider{background:var(--border);height:1px;margin:1.25rem 0}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg)}::-webkit-scrollbar-thumb{background:var(--surface-2);border-radius:3px}