:root{--bg-main: #090d16;--bg-card: rgba(18, 24, 38, .85);--bg-glass: rgba(255, 255, 255, .06);--border-glass: rgba(255, 255, 255, .12);--primary: #3b82f6;--primary-hover: #2563eb;--accent-green: #10b981;--accent-amber: #f59e0b;--accent-red: #ef4444;--text-main: #f8fafc;--text-muted: #94a3b8;--radius-sm: 8px;--radius-md: 14px;--radius-lg: 20px;--radius-full: 9999px;--font-family: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html{scroll-behavior:smooth}::selection{background-color:#10b98140;color:#022c22}html.dark ::selection,.dark ::selection{background-color:#10b9814d;color:#a7f3d0}body{width:100%;min-height:100vh;background-color:#06080d;color:var(--text-main);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;overflow-x:hidden}#root{min-height:100vh;display:flex;flex-direction:column}body.scanner-mode,body.scanner-mode #root{height:100dvh;overflow:hidden;-webkit-user-select:none;user-select:none}.app-container{position:relative;width:100%;height:100%;display:flex;flex-direction:column;background-color:var(--bg-main);overflow:hidden}.top-bar{position:absolute;top:0;left:0;right:0;z-index:30;padding:env(safe-area-inset-top,16px) 16px 12px 16px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(180deg,#090d16d9,#090d1600);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.brand-badge{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;letter-spacing:-.3px;color:#fff}.brand-icon{width:24px;height:24px;background:linear-gradient(135deg,#3b82f6,#8b5cf6);border-radius:6px;display:grid;place-items:center;box-shadow:0 0 12px #3b82f666}.camera-wrapper{position:relative;width:100%;flex:1;background:#000;overflow:hidden}.camera-video{width:100%;height:100%;object-fit:contain;display:block}.reticle-container{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;z-index:10;padding:30px}.reticle-frame{position:relative;width:86%;height:72%;max-width:400px;border-radius:16px;box-shadow:0 0 0 4000px #00000073}.corner{position:absolute;width:28px;height:28px;border-color:#60a5fa;border-style:solid}.corner.top-left{top:0;left:0;border-width:4px 0 0 4px;border-top-left-radius:12px}.corner.top-right{top:0;right:0;border-width:4px 4px 0 0;border-top-right-radius:12px}.corner.bottom-left{bottom:0;left:0;border-width:0 0 4px 4px;border-bottom-left-radius:12px}.corner.bottom-right{bottom:0;right:0;border-width:0 4px 4px 0;border-bottom-right-radius:12px}.reticle-laser{position:absolute;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#38bdf8,#60a5fa,transparent);box-shadow:0 0 10px #38bdf8;animation:scanLaser 2.6s ease-in-out infinite alternate}@keyframes scanLaser{0%{top:5%;opacity:.3}50%{opacity:1}to{top:95%;opacity:.3}}.reticle-hint{margin-top:18px;font-size:13px;color:#fffc;background:#0f172ab3;padding:6px 14px;border-radius:20px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);text-align:center}.bottom-controls{position:absolute;bottom:0;left:0;right:0;z-index:30;padding:20px 24px calc(env(safe-area-inset-bottom,20px) + 12px) 24px;display:flex;flex-direction:column;align-items:center;background:linear-gradient(0deg,rgba(9,13,22,.95) 0%,rgba(9,13,22,.7) 60%,transparent 100%);gap:16px}.controls-row{width:100%;display:flex;align-items:center;justify-content:space-around;max-width:380px}.shutter-btn{width:76px;height:76px;border-radius:50%;border:4px solid #ffffff;background:transparent;padding:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .15s ease,border-color .15s ease}.shutter-btn:active{transform:scale(.92)}.shutter-inner{width:100%;height:100%;border-radius:50%;background:#fff;transition:background-color .15s ease,transform .15s ease}.shutter-btn:hover .shutter-inner{background:#f1f5f9}.icon-btn{width:48px;height:48px;border-radius:50%;background:#ffffff26;border:1px solid rgba(255,255,255,.2);color:#fff;display:grid;place-items:center;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .2s,transform .15s}.icon-btn:active{transform:scale(.9);background:#ffffff40}.preview-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:40;background:#090d16;display:flex;flex-direction:column}.preview-image-box{flex:1;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#000}.preview-image{max-width:100%;max-height:100%;object-fit:contain}.preview-actions{padding:20px 24px calc(env(safe-area-inset-bottom,20px) + 12px) 24px;display:flex;gap:14px;background:var(--bg-card);border-top:1px solid var(--border-glass)}.btn{flex:1;height:52px;border-radius:var(--radius-md);font-size:16px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;border:none;transition:all .2s}.btn-secondary{background:#ffffff1a;color:#fff;border:1px solid var(--border-glass)}.btn-secondary:active{background:#ffffff29}.btn-primary{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;box-shadow:0 4px 14px #2563eb66}.btn-primary:active{transform:scale(.98);opacity:.92}.status-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--radius-full);font-size:12px;font-weight:600;background:#0f172ad9;border:1px solid var(--border-glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.status-dot{width:8px;height:8px;border-radius:50%}.status-dot.online{background-color:var(--accent-green);box-shadow:0 0 8px var(--accent-green)}.status-dot.waiting{background-color:var(--accent-amber);box-shadow:0 0 8px var(--accent-amber)}.status-dot.offline{background-color:var(--accent-red)}.processing-modal{position:absolute;top:0;right:0;bottom:0;left:0;z-index:50;background:#090d16e0;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px;text-align:center}.spinner{width:54px;height:54px;border:4px solid rgba(255,255,255,.1);border-top-color:#38bdf8;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:20px}@keyframes spin{to{transform:rotate(360deg)}}.success-icon-wrap{width:64px;height:64px;background:#10b98126;border:2px solid var(--accent-green);border-radius:50%;display:grid;place-items:center;color:var(--accent-green);margin-bottom:20px;animation:popIn .3s cubic-bezier(.175,.885,.32,1.275)}@keyframes popIn{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}.error-icon-wrap{width:64px;height:64px;background:#ef444426;border:2px solid var(--accent-red);border-radius:50%;display:grid;place-items:center;color:var(--accent-red);margin-bottom:20px}.bg-grid-pattern{background-size:40px 40px;background-image:linear-gradient(to right,rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.03) 1px,transparent 1px)}.glass-card{background:linear-gradient(180deg,#ffffff0d,#ffffff04);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px #ffffff1a}.glass-card-hover{transition:all .25s cubic-bezier(.16,1,.3,1)}.glass-card-hover:hover{border-color:#34d39959;transform:translateY(-2px);box-shadow:inset 0 1px #ffffff26,0 16px 40px -15px #10b98126}.field-active-glow{border-color:#10b981!important;box-shadow:0 0 0 3px #10b98140,0 0 20px #10b98133!important;background-color:#10b98114!important}@keyframes cursorBlink{0%,to{opacity:1}50%{opacity:0}}.typing-cursor:after{content:"|";color:#34d399;margin-left:2px;animation:cursorBlink .8s infinite}html.light{color-scheme:light}html.light body{background-color:#f8fafc;color:#0f172a}html.light .landing-page{background-color:#f8fafc!important;color:#0f172a!important}html.light .bg-obsidian{background-color:#f8fafc!important}html.light .bg-obsidian\/80{background-color:#ffffffe0!important}html.light .bg-obsidian\/90{background-color:#fffffff2!important}html.light .bg-surface{background-color:#fff!important}html.light .bg-surface\/30{background-color:#f1f5f980!important}html.light .bg-surface\/40{background-color:#f1f5f9a6!important}html.light .bg-surface\/50{background-color:#f1f5f9cc!important}html.light .bg-surface\/95{background-color:#fffffffa!important}html.light .glass-card{background:#fff!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(15,23,42,.08)!important;box-shadow:0 4px 20px -2px #0f172a0d,0 1px 3px #00000008!important}html.light .glass-card-hover:hover{border-color:#10b98173!important;transform:translateY(-2px);box-shadow:0 16px 36px -8px #10b98124,0 4px 12px #0f172a0a!important}html.light .landing-page h1,html.light .landing-page h2,html.light .landing-page h3,html.light .landing-page h4{color:#0f172a}html.light .landing-page p{color:#475569}html.light .header-cta,html.light .header-cta span,html.light .header-cta svg{color:#fff!important}html.light .btn-primary,html.light .btn-primary span,html.light .btn-primary svg{color:#fff!important}.phone-paper-receipt{background-color:#fff!important;color:#0f172a!important;border:1px solid rgba(15,23,42,.12)!important;box-shadow:0 10px 25px -5px #00000040!important}.phone-paper-receipt *{color:#0f172a}.phone-paper-receipt .receipt-title{color:#0f172a!important;font-weight:800!important}.phone-paper-receipt .receipt-sub{color:#64748b!important}.phone-paper-receipt .receipt-row{color:#334155!important}.phone-paper-receipt .receipt-highlight{background-color:#ecfdf5!important;border-color:#10b981!important}.phone-paper-receipt .receipt-highlight .highlight-label{color:#047857!important;font-weight:700!important}.phone-paper-receipt .receipt-highlight .highlight-val{color:#0f172a!important;font-weight:800!important}.phone-paper-receipt .receipt-total{background-color:#d1fae5!important;border-color:#059669!important}.phone-paper-receipt .receipt-total .receipt-total-label,.phone-paper-receipt .receipt-total .receipt-total-val{color:#064e3b!important;font-weight:900!important}.phone-paper-receipt .receipt-barcode{color:#94a3b8!important}html.light .landing-page .text-emerald-300{color:#047857!important}html.light .landing-page .text-emerald-400{color:#059669!important}html.light .landing-page .text-teal-300{color:#0f766e!important}html.light .landing-page .text-teal-400{color:#0d9488!important}html.light .landing-page .bg-emerald-500\/10,html.light .landing-page .bg-emerald-500\/15,html.light .landing-page .bg-emerald-500\/20{background-color:#ecfdf5!important;border-color:#a7f3d0!important}html.light .landing-page .bg-teal-500\/20{background-color:#f0fdfa!important;border-color:#99f6e4!important}html.light .landing-page .bg-rose-500\/10,html.light .landing-page .bg-rose-500\/15{background-color:#fff1f2!important;border-color:#fecdd3!important}html.light .landing-page .text-rose-300,html.light .landing-page .text-rose-400{color:#be123c!important}html.light .landing-page .border-white\/10,html.light .landing-page .border-white\/\[0\.08\],html.light .landing-page .border-white\/5,html.light .landing-page .border-white\/15,html.light .landing-page .border-white\/20{border-color:#0f172a14!important}html.light .landing-page .bg-white\/5,html.light .landing-page .bg-white\/\[0\.03\],html.light .landing-page .bg-white\/\[0\.04\],html.light .landing-page .bg-white\/\[0\.06\]{background-color:#0f172a09!important}html.light .landing-page .hover\:bg-white\/5:hover,html.light .landing-page .hover\:bg-white\/10:hover,html.light .landing-page .hover\:bg-white\/15:hover{background-color:#0f172a0f!important}html.light .ambient-glow{opacity:.18!important;filter:blur(150px)!important}html.light .hero-headline-gradient{background:linear-gradient(135deg,#059669,#0d9488,#4338ca)!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important}html.light .card-old-way{background:linear-gradient(180deg,#fef2f2e6,#fff)!important;border-color:#f43f5e40!important}html.light .card-new-way{background:linear-gradient(180deg,#ecfdf5cc,#fff)!important;border-color:#10b98159!important;box-shadow:0 10px 30px -10px #10b98126!important}html.light .mockup-browser-window{background-color:#fff!important;border-color:#0f172a1f!important;box-shadow:0 20px 45px -15px #0f172a1a!important}html.light .mockup-browser-chrome{background-color:#f8fafc!important;border-color:#0f172a14!important}html.light .mockup-browser-url{background-color:#fff!important;border-color:#0f172a1f!important;color:#334155!important}html.light .mockup-browser-url span{color:#334155!important}html.light .live-preview-box{background-color:#fff!important;border-color:#0f172a1a!important}html.light .live-preview-box .bg-obsidian{background-color:#f8fafc!important;border-color:#0f172a14!important}html.light .live-preview-box .text-white{color:#0f172a!important}html.light .live-preview-box .text-slate-200{color:#334155!important}html.light .sheet-table-header{background-color:#f8fafc!important;border-color:#0f172a14!important;color:#475569!important}html.light .sheet-table-body tr{border-color:#0f172a0f!important}html.light .sheet-table-body tr:hover{background-color:#0f172a05!important}html.light .card-lifetime-pro{background:linear-gradient(180deg,#ecfdf5b3,#fff 60%,#fff)!important;border-color:#10b981!important;box-shadow:0 20px 40px -10px #10b9812e!important}html.light .final-cta-card{background:linear-gradient(135deg,#065f46,#047857 45%,#0f172a)!important;border-color:#10b98166!important;box-shadow:0 25px 60px -15px #065f4659!important}html.light .final-cta-card h2{color:#fff!important}html.light .final-cta-card p{color:#d1fae5!important}html.light .final-cta-card .final-cta-btn{background-color:#fff!important;color:#064e3b!important;box-shadow:0 10px 25px -5px #00000040!important}html.light .final-cta-card .final-cta-btn span,html.light .final-cta-card .final-cta-btn svg{color:#064e3b!important}html.light .final-cta-card .final-cta-btn:hover{background-color:#ecfdf5!important;color:#047857!important}html.light .final-cta-card .final-cta-btn:hover span,html.light .final-cta-card .final-cta-btn:hover svg{color:#047857!important}html.light .bg-grid-pattern{background-image:linear-gradient(to right,rgba(15,23,42,.035) 1px,transparent 1px),linear-gradient(to bottom,rgba(15,23,42,.035) 1px,transparent 1px)!important}