@import "https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&family=Outfit:wght@400;500;600;700;800;900&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";.mobile-break{margin-top:4px;display:block}@media (width>=640px){.mobile-break{margin-top:0;margin-left:6px;display:inline-block}}:root{--primary:#2563eb;--primary-dark:#1d4ed8;--primary-light:#eff6ff;--primary-glow:#2563eb2e;--secondary:#10b981;--secondary-dark:#059669;--secondary-light:#ecfdf5;--secondary-glow:#10b98126;--accent:#8b5cf6;--accent-dark:#7c3aed;--accent-light:#f5f3ff;--bg:#f1f5f9;--surface:#fff;--surface2:#f8fafc;--text:#0f172a;--text-2:#1e293b;--text-muted:#64748b;--text-faint:#94a3b8;--border:#e2e8f0;--border-2:#cbd5e1;--success:#10b981;--warning:#f59e0b;--danger:#ef4444;--info:#06b6d4;--font-sans:"Plus Jakarta Sans", system-ui, -apple-system, sans-serif;--font-heading:"Outfit", system-ui, -apple-system, sans-serif;--shadow-xs:0 1px 3px #0f172a0f, 0 1px 2px #0f172a0a;--shadow-sm:0 4px 12px #0f172a0f, 0 2px 4px #0f172a0a;--shadow-md:0 10px 25px #0f172a14, 0 4px 10px #0f172a0d;--shadow-lg:0 20px 45px #0f172a1a, 0 8px 20px #0f172a0f;--shadow-blue:0 8px 24px #2563eb38;--shadow-green:0 8px 24px #10b98133;--r-sm:8px;--r-md:14px;--r-lg:20px;--r-xl:28px;--r-2xl:36px;--r-full:9999px;--ease:all .3s cubic-bezier(.16, 1, .3, 1);--ease-bounce:all .45s cubic-bezier(.175, .885, .32, 1.275);--grad-blue:linear-gradient(135deg, #1e40af 0%, #2563eb 55%, #3b82f6 100%);--grad-green:linear-gradient(135deg, #059669 0%, #10b981 60%, #34d399 100%);--grad-purple:linear-gradient(135deg, #6d28d9 0%, #8b5cf6 60%, #a78bfa 100%);--grad-sunset:linear-gradient(135deg, #dc2626 0%, #ef4444 60%, #f87171 100%);--grad-slate:linear-gradient(135deg, #0f172a 0%, #1e293b 100%);--grad-glass:linear-gradient(135deg, #ffffffeb, #ffffffbf)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{font-family:var(--font-sans);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(at 20% 10%,#0f172a 0%,#020617 60%,#0c1445 100%);justify-content:center;align-items:center;min-height:100vh;display:flex;overflow-x:hidden}body:before{content:"";z-index:0;pointer-events:none;background:radial-gradient(circle,#2563eb26 0%,#0000 70%);width:500px;height:500px;position:fixed;top:-10%;left:5%}body:after{content:"";z-index:0;pointer-events:none;background:radial-gradient(circle,#10b9811a 0%,#0000 70%);width:400px;height:400px;position:fixed;bottom:-5%;right:8%}::-webkit-scrollbar{background:0 0!important;width:0!important;height:0!important;display:none!important}html,body,#root,.viewport,div{-ms-overflow-style:none!important;scrollbar-width:none!important}#root{z-index:10;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative}.web-frame{background:#fafafa;border:1px solid #ffffff0f;border-radius:36px;flex-direction:column;width:100%;max-width:412px;height:96vh;max-height:892px;display:flex;position:relative;overflow:hidden;box-shadow:0 0 0 8px #121212,0 0 0 10px #2a2a2a,0 0 0 11px #3a3a3a,0 30px 80px #000000bf,0 8px 24px #0006}.web-frame:before{content:"";z-index:1001;background:#121212;border-radius:50%;width:12px;height:12px;position:absolute;top:12px;left:50%;transform:translate(-50%);box-shadow:0 0 0 2px #1e1e1e}.web-frame:after{content:"";z-index:1001;background:#2a2a2a;border-radius:0 3px 3px 0;width:4px;height:60px;position:absolute;top:120px;right:-10px;box-shadow:0 80px #2a2a2a}@media (width<=500px),(height<=700px){.web-frame{max-width:100%;height:100vh;max-height:100vh;box-shadow:none;border:none;border-radius:0}.web-frame:before,.web-frame:after{display:none}}.viewport{overscroll-behavior:contain;background:#fafafa;flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden auto}.safe-area-top{padding-top:8px!important}@media (width<=500px),(height<=700px){.safe-area-top{padding-top:4px!important}}.android-status-bar{z-index:1001;pointer-events:none;background:#fff;flex-shrink:0;justify-content:space-between;align-items:center;height:28px;padding:2px 18px 0 16px;display:flex}.android-time{color:#0f172a;letter-spacing:.2px;font-family:Roboto,sans-serif;font-size:12px;font-weight:700}.android-icons{color:#0f172a;align-items:center;gap:5px;display:flex}.android-nav-bar{z-index:100;background:#fff;border-top:1px solid #e2e8f0;flex-shrink:0;justify-content:space-around;align-items:center;height:42px;padding:0 24px;display:flex}.android-nav-btn{color:#64748b;cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:18px;font-weight:300;transition:background .2s;display:flex}.android-nav-btn:active{background:#0000000f}.android-home{border:1.5px solid #64748b;border-radius:50%;width:22px;height:22px;font-size:0}.android-recent{border:1.5px solid #64748b;border-radius:3px;width:18px;height:14px;font-size:0}.android-back{color:#64748b;font-size:22px;font-weight:300}@media (width<=500px),(height<=700px){.android-status-bar,.android-nav-bar{display:none!important}}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.93)}to{opacity:1;transform:scale(1)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}@keyframes pulseRing{0%{box-shadow:0 0 #2563eb59}70%{box-shadow:0 0 0 14px #2563eb00}to{box-shadow:0 0 #2563eb00}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-fade-in{animation:.4s cubic-bezier(.16,1,.3,1) both fadeUp}.animate-scale-in{animation:.35s cubic-bezier(.34,1.56,.64,1) both scaleIn}.animate-spin{animation:.9s linear infinite spin}.animate-float{animation:3s ease-in-out infinite float}.animate-pulse{animation:2.2s ease-out infinite pulseRing}.stagger>:first-child{animation-delay:0s}.stagger>:nth-child(2){animation-delay:60ms}.stagger>:nth-child(3){animation-delay:.12s}.stagger>:nth-child(4){animation-delay:.18s}.stagger>:nth-child(5){animation-delay:.24s}.btn-primary{background:var(--grad-blue);color:#fff;font-family:var(--font-heading);border-radius:var(--r-full);cursor:pointer;box-shadow:var(--shadow-blue);transition:var(--ease);letter-spacing:.2px;border:none;justify-content:center;align-items:center;gap:8px;width:100%;padding:15px 28px;font-size:15px;font-weight:700;display:flex}.btn-primary:hover{filter:brightness(1.07);transform:translateY(-2px);box-shadow:0 12px 32px #2563eb59}.btn-primary:active{transform:scale(.97)}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-secondary{color:var(--text);border:1.5px solid var(--border);font-family:var(--font-heading);border-radius:var(--r-full);cursor:pointer;box-shadow:var(--shadow-sm);transition:var(--ease);background:#fff;justify-content:center;align-items:center;gap:8px;width:100%;padding:15px 28px;font-size:15px;font-weight:700;display:flex}.btn-secondary:hover{border-color:var(--border-2);box-shadow:var(--shadow-md);background:#f8fafc;transform:translateY(-1px)}.btn-green{background:var(--grad-green);color:#fff;font-family:var(--font-heading);border-radius:var(--r-full);cursor:pointer;box-shadow:var(--shadow-green);transition:var(--ease);border:none;justify-content:center;align-items:center;gap:8px;width:100%;padding:15px 28px;font-size:15px;font-weight:700;display:flex}.btn-green:hover{filter:brightness(1.07);transform:translateY(-2px)}.btn-green:active{transform:scale(.97)}.btn-green:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-danger{background:var(--grad-sunset);color:#fff;font-family:var(--font-heading);border-radius:var(--r-full);cursor:pointer;transition:var(--ease);border:none;justify-content:center;align-items:center;gap:8px;width:100%;padding:15px 28px;font-size:15px;font-weight:700;display:flex;box-shadow:0 8px 20px #ef444433}.btn-danger:hover{filter:brightness(1.07);transform:translateY(-2px)}.card{border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);transition:var(--ease);background:#fff;padding:20px}.card:hover{box-shadow:var(--shadow-md)}.glass-card{-webkit-backdrop-filter:blur(20px);border-radius:var(--r-lg);box-shadow:var(--shadow-md);transition:var(--ease);background:#ffffffe0;border:1.5px solid #ffffffa6;padding:20px}.glass-card:hover{box-shadow:var(--shadow-lg);border-color:#ffffffe6}.input-group{text-align:left;flex-direction:column;gap:7px;display:flex}.input-group label{font-family:var(--font-heading);color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px;padding-left:2px;font-size:12px;font-weight:700}.input-control{font-family:var(--font-sans);border-radius:var(--r-md);border:1.5px solid var(--border);transition:var(--ease);width:100%;color:var(--text);-webkit-appearance:none;background:#fff;padding:14px 16px;font-size:15px;font-weight:500}.input-control::placeholder{color:var(--text-faint)}.input-control:focus{border-color:var(--primary);background:#fff;outline:none;box-shadow:0 0 0 4px #2563eb1a}.input-control.error{border-color:var(--danger);box-shadow:0 0 0 4px #ef444414}.input-control.success{border-color:var(--success);box-shadow:0 0 0 4px #10b98114}.alert{border-radius:var(--r-md);align-items:flex-start;gap:10px;padding:14px 16px;font-size:13px;font-weight:500;line-height:1.45;animation:.3s both slideDown;display:flex}.alert-error{color:#b91c1c;background:#fef2f2;border:1px solid #fecaca}.alert-success{color:#065f46;background:#ecfdf5;border:1px solid #a7f3d0}.alert-warning{color:#92400e;background:#fffbeb;border:1px solid #fde68a}.alert-info{color:#1e40af;background:#eff6ff;border:1px solid #bfdbfe}.alert svg{flex-shrink:0;margin-top:1px}.badge{font-family:var(--font-heading);border-radius:var(--r-full);text-transform:uppercase;letter-spacing:.5px;align-items:center;gap:4px;padding:3px 10px;font-size:10px;font-weight:800;display:inline-flex}.badge-blue{background:var(--primary-light);color:var(--primary)}.badge-green{background:var(--secondary-light);color:var(--secondary-dark)}.badge-purple{background:var(--accent-light);color:var(--accent-dark)}.badge-red{color:var(--danger);background:#fef2f2}.badge-yellow{color:#92400e;background:#fffbeb}.keypad{grid-template-columns:repeat(3,1fr);gap:10px;width:100%;display:grid}.keypad-btn{border:1.5px solid var(--border);border-radius:var(--r-md);font-family:var(--font-heading);color:var(--text);cursor:pointer;transition:var(--ease);box-shadow:var(--shadow-xs);background:#fff;justify-content:center;align-items:center;padding:17px 0;font-size:22px;font-weight:700;display:flex}.keypad-btn:hover{background:var(--primary-light);color:var(--primary);border-color:#2563eb4d;transform:scale(1.04)}.keypad-btn:active{transform:scale(.94)}.pin-dot{border:2px solid var(--border-2);width:14px;height:14px;transition:var(--ease);background:0 0;border-radius:99px}.pin-dot.filled{background:var(--primary);border-color:var(--primary);transform:scale(1.1);box-shadow:0 2px 8px #2563eb4d}.qr-container{border-radius:var(--r-xl);box-shadow:var(--shadow-md);border:3px solid var(--primary-light);background:#fff;flex-direction:column;justify-content:center;align-items:center;padding:24px;animation:2.5s ease-out infinite pulseRing;display:flex}.bottom-nav{-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--border);height:72px;padding-bottom:env(safe-area-inset-bottom);z-index:100;background:#fffffff5;justify-content:space-around;align-items:center;display:flex;position:absolute;bottom:0;left:0;right:0}.nav-tab{color:var(--text-faint);cursor:pointer;transition:var(--ease);height:100%;font-size:10px;font-weight:700;font-family:var(--font-heading);letter-spacing:.2px;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;display:flex}.nav-tab.active{color:var(--primary)}.nav-tab svg{transition:var(--ease-bounce)}.nav-tab.active svg{transform:translateY(-2px)scale(1.18)}.page-header{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);z-index:50;background:#fffffff2;justify-content:space-between;align-items:center;padding:14px 20px;display:flex;position:sticky;top:0}.page-header h1{font-family:var(--font-heading);color:var(--text);letter-spacing:-.3px;font-size:17px;font-weight:800}.history-item{border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-xs);transition:var(--ease);background:#fff;justify-content:space-between;align-items:flex-start;padding:16px;display:flex}.history-item:hover{box-shadow:var(--shadow-md);border-color:#2563eb26;transform:translateY(-2px)}.avatar{border-radius:var(--r-full);background:var(--grad-blue);color:#fff;width:46px;height:46px;font-family:var(--font-heading);box-shadow:var(--shadow-sm);flex-shrink:0;justify-content:center;align-items:center;font-size:17px;font-weight:800;display:flex}.avatar-lg{width:76px;height:76px;font-size:28px}.avatar-sm{width:34px;height:34px;font-size:13px}.divider{align-items:center;gap:12px;margin:18px 0;display:flex}.divider:before,.divider:after{content:"";background:var(--border);flex:1;height:1px}.divider span{color:var(--text-faint);text-transform:uppercase;letter-spacing:1px;font-size:11px;font-weight:700;font-family:var(--font-heading)}.section-title{font-family:var(--font-heading);color:var(--text);letter-spacing:-.3px;margin-bottom:12px;font-size:15px;font-weight:800}.skeleton{border-radius:var(--r-md);background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0 50%,#f1f5f9 75%) 0 0/800px 100%;animation:1.4s linear infinite shimmer}.float-label-wrap{position:relative}.float-label-wrap .input-control{padding-top:20px;padding-bottom:8px}.float-label-wrap label{color:var(--text-faint);pointer-events:none;transition:var(--ease);font-size:15px;font-family:var(--font-sans);text-transform:none;letter-spacing:0;font-weight:500;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.float-label-wrap .input-control:focus+label,.float-label-wrap .input-control:not(:placeholder-shown)+label{color:var(--primary);letter-spacing:.4px;text-transform:uppercase;font-size:11px;font-weight:700;top:10px;transform:none}.text-left{text-align:left}.text-center{text-align:center}.flex-center{justify-content:center;align-items:center;display:flex}.flex-between{justify-content:space-between;align-items:center;display:flex}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.w-full{width:100%}.rounded-full{border-radius:var(--r-full)}html{font-size:clamp(14px,3.8vw,16px)}@media screen and (width<=380px){.btn-primary,.btn-green,.btn-danger,.btn-secondary{padding:13px 20px;font-size:14px}.input-control{padding:12px 14px;font-size:14px}.input-group label{font-size:11px}.glass-card{padding:16px}.card{padding:14px}.web-frame{border-radius:28px}.android-status-bar{padding:0 12px}.android-nav-bar{height:38px}.keypad-btn{padding:14px 0;font-size:19px}.avatar{width:40px;height:40px;font-size:15px}.avatar-lg{width:64px;height:64px;font-size:24px}}@media screen and (width>=381px) and (width<=420px){.btn-primary,.btn-green,.btn-danger{padding:14px 24px;font-size:15px}.input-control{padding:13px 15px}}@media screen and (width>=421px) and (width<=480px){.web-frame{max-width:440px}}@media screen and (width<=500px),screen and (height<=700px){body{background:#fafafa;align-items:flex-start}#root{align-items:flex-start}.web-frame{max-width:100%;height:100dvh;max-height:100dvh;box-shadow:none;border:none;border-radius:0}.web-frame:before,.web-frame:after{display:none}.android-status-bar,.android-nav-bar{display:none!important}.viewport{padding-bottom:env(safe-area-inset-bottom,0px)}}@media screen and (width>=700px){.web-frame{max-width:412px;height:90vh;max-height:892px}}@media screen and (height>=900px){.web-frame{max-height:920px}}input,select,textarea{font-size:max(16px,1em)}button,.btn-primary,.btn-green,.btn-secondary,.btn-danger{touch-action:manipulation;min-height:48px}.keypad-btn{touch-action:manipulation;min-height:52px}button:active,.keypad-btn:active{opacity:.82;transition:transform 80ms,opacity 80ms;transform:scale(.97)}button,.nav-tab,.keypad-btn{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}#reader{background:#fff!important;border:none!important;border-radius:24px!important;padding:0!important;position:relative!important;overflow:hidden!important}#reader video{object-fit:cover!important;border-radius:24px!important;width:100%!important;height:100%!important}#reader button{background:var(--primary)!important;background-image:linear-gradient(135deg, var(--primary) 0%, #1d4ed8 100%)!important;color:#fff!important;font-family:var(--font-heading)!important;cursor:pointer!important;border:none!important;border-radius:12px!important;margin:8px auto!important;padding:10px 20px!important;font-size:13px!important;font-weight:700!important;transition:all .2s!important;display:block!important;box-shadow:0 4px 12px #2563eb26!important}#reader button:hover{transform:translateY(-1px)!important;box-shadow:0 6px 16px #2563eb40!important}#reader button:active{transform:translateY(1px)!important}#reader select{border:1.5px solid var(--border)!important;color:var(--text)!important;cursor:pointer!important;background-color:#fff!important;border-radius:12px!important;outline:none!important;max-width:90%!important;margin:10px auto!important;padding:10px 16px!important;font-size:13px!important;display:block!important}#reader__dashboard{border-top:1px solid var(--border)!important;background:#fff!important;padding:16px!important}#reader__dashboard_section_swaplink{color:var(--primary)!important;text-align:center!important;margin-top:10px!important;font-size:12px!important;font-weight:700!important;text-decoration:none!important;display:block!important}#reader__status_span{color:var(--text-muted)!important;text-align:center!important;margin-top:8px!important;font-size:12px!important;display:block!important}.scanner-laser{z-index:10;pointer-events:none;background:linear-gradient(90deg,#2563eb00 0%,#2563eb 50%,#2563eb00 100%);width:100%;height:3px;animation:2.5s linear infinite scan-move;position:absolute;top:0;left:0;box-shadow:0 0 10px #2563ebcc}@keyframes scan-move{0%{top:0%}50%{top:100%}to{top:0%}}