*{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;background:#f1f5f9;color:#0f172a;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;margin:0}code{font-family:monospace}#root{min-height:100vh}:root{--primary:#ff5952;--primary-dark:#e04840;--accent:#ff8c3a;--bg:#fef7f7;--card:#fff;--text:#1a1a1a;--muted:#7a7a7a;--border:#ffe0df;--success:#10b981;--danger:#ef4444}.app-shell{display:flex;flex-direction:column;min-height:100vh}.app-header{align-items:center;background:#fff;display:flex;justify-content:center;padding:14px 20px;position:sticky;top:0;z-index:10}.header-logo{height:34px;width:auto}.branch-card-wrap{margin:0 auto;max-width:960px;padding:0 16px}.branch-card,.branch-card-wrap{box-sizing:border-box;width:100%}.branch-card{background:#ff5952;background:var(--primary);color:#fff;padding:14px 20px 16px}.branch-main{align-items:center;display:flex;gap:12px}.branch-logo{background:#fff;border-radius:8px;box-sizing:border-box;flex-shrink:0;height:44px;object-fit:contain;padding:4px;width:44px}.branch-text{flex:1 1;min-width:0}.branch-shop{font-size:clamp(.95rem,4vw,1.3rem);font-weight:800;letter-spacing:-.02em;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.branch-row{align-items:center;display:flex;gap:12px;justify-content:space-between;margin-top:6px}.branch-name{font-size:.88rem;font-weight:500;min-width:0;opacity:.92;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.live-status{align-items:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff2e;border-radius:999px;display:inline-flex;flex-shrink:0;font-size:.75rem;font-weight:700;gap:6px;letter-spacing:normal;padding:4px 10px;white-space:nowrap}.live-dot{animation:pulse 2s infinite;background:#22c55e;border-radius:50%;box-shadow:0 0 8px #22c55e;height:7px;width:7px}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.main{display:flex;flex:1 1;flex-direction:column;gap:16px;margin:0 auto;max-width:960px;padding:20px 16px 32px;width:100%}.auth-gate{background:#fff;background:var(--card);border:1px solid #ffe0df;border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 30px #0000000f;margin-top:40px;padding:32px 24px;text-align:center}.auth-gate .icon{font-size:48px;margin-bottom:12px}.auth-gate h2{font-size:1.25rem;margin:0 0 8px}.auth-gate p{color:#7a7a7a;color:var(--muted);font-size:.92rem;line-height:1.5}.auth-gate code{background:#f1f5f9;border-radius:6px;font-size:.85em;padding:2px 6px}.card{background:#fff;background:var(--card);border:1px solid #ffe0df;border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 30px #0000000f;overflow:hidden}.card-head{align-items:center;background:#f8fafc;border-bottom:1px solid #ffe0df;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:14px 16px}.card-head h3{font-size:.95rem;font-weight:700;margin:0}.scanner-card-head{justify-content:space-between}.scan-status{border-radius:999px;font-size:.75rem;font-weight:700;padding:4px 10px}.scan-status.idle{background:#e0f2fe;color:#0284c7}.scan-status.scanning{background:#dcfce7;color:#15803d}.scan-status.paused{background:#fef3c7;color:#92400e}.scanner-wrap{align-items:center;background:#0f172a;display:flex;height:320px;justify-content:center;overflow:hidden;position:relative}#reader{height:100%;max-width:500px;width:100%}#reader video{border-radius:12px!important;height:100%!important;object-fit:cover;width:100%!important}.scanner-overlay{align-items:center;display:flex;inset:0;justify-content:center;pointer-events:none;position:absolute}.scan-frame{border:2px solid #ffffffe6;border-radius:12px;box-shadow:0 0 0 9999px #00000059;height:190px;position:relative;width:300px}.scan-frame:after,.scan-frame:before{border-color:#ff5952;border-color:var(--primary);border-style:solid;content:"";height:24px;position:absolute;width:24px}.scan-frame:before{border-radius:12px 0 0 0;border-width:4px 0 0 4px;left:-2px;top:-2px}.scan-frame:after{border-radius:0 0 12px 0;border-width:0 4px 4px 0;bottom:-2px;right:-2px}.scan-line{animation:scan 2s ease-in-out infinite;background:linear-gradient(90deg,#0000,#22d3ee,#0000);height:2px;left:8px;position:absolute;right:8px;top:50%}@keyframes scan{0%{opacity:0;transform:translateY(-60px)}50%{opacity:1}to{opacity:0;transform:translateY(60px)}}.scanner-actions{align-items:center;background:#f8fafc;border-top:1px solid #ffe0df;border-top:1px solid var(--border);display:flex;flex-wrap:wrap;gap:8px;padding:12px 16px}.btn{align-items:center;appearance:none;border:none;border-radius:999px;cursor:pointer;display:inline-flex;font-size:.85rem;font-weight:700;gap:6px;padding:8px 14px;transition:all .15s}.btn svg{flex-shrink:0;height:15px;width:15px}.icon svg{height:40px;width:40px}.btn-primary{background:#ff5952;background:var(--primary);color:#fff}.btn-primary:hover{background:#e04840;background:var(--primary-dark);transform:translateY(-1px)}.btn-ghost{background:#fff;border:1px solid #ffe0df;border:1px solid var(--border);color:#1a1a1a;color:var(--text)}.btn-ghost:hover{background:#f1f5f9}.btn-cancel{align-items:end;appearance:none;background:#fff;border:1px solid #ffe0df;border:1px solid var(--border);border-radius:999px;color:#1a1a1a;color:var(--text);cursor:pointer;display:inline-flex;font-size:.85rem;font-weight:700;gap:6px;padding:8px 14px;transition:all .15s}.btn-cancel:hover{background:#f1f5f9}.input-barcode{border:1px solid #ffe0df;border:1px solid var(--border);border-radius:999px;flex:1 1;font-size:.9rem;min-width:160px;outline:none;padding:9px 14px}.input-barcode:focus{border-color:#ff5952;border-color:var(--primary);box-shadow:0 0 0 3px #0ea5e926}.search-by{display:flex;font-size:.85rem;gap:16px;padding:8px 16px 0}.search-by label{align-items:center;cursor:pointer;display:flex;gap:6px}.scanner-search-panel{background:#f8fafc;border-top:1px solid #ffe0df;border-top:1px solid var(--border)}.scanner-search-panel .scanner-actions{background:#0000;border-top:none;padding-top:8px}.product-card{animation:slideIn .35s ease-out;display:flex;flex-direction:column;padding:16px}@keyframes slideIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.product-image-wrap{align-items:center;background:#f1f5f9;border:1px solid #ffe0df;border:1px solid var(--border);border-radius:12px;display:flex;height:180px;justify-content:center;margin-bottom:14px;overflow:hidden;width:100%}.product-image{max-height:100%;max-width:100%;object-fit:contain}.no-image{align-items:center;background:#f1f5f9;color:#94a3b8;display:flex;justify-content:center}.no-image svg{height:40%;max-height:48px;max-width:48px;min-height:16px;min-width:16px;width:40%}.product-image.no-image{height:100%;width:100%}.product-info h2{font-size:1.15rem;font-weight:800;line-height:1.25;margin:0 0 4px}.product-meta{color:#7a7a7a;color:var(--muted);display:flex;flex-wrap:wrap;font-size:.82rem;gap:8px;margin-bottom:8px}.badge{background:#f1f5f9;border-radius:999px;font-size:.75rem;font-weight:600;padding:3px 8px}.price{color:#059669;font-size:2rem;font-weight:900;letter-spacing:-.03em;line-height:1;margin:8px 0}.price small{color:#7a7a7a;color:var(--muted);font-size:.9rem;font-weight:600}.product-desc{color:#334155;font-size:.9rem;line-height:1.5;margin:8px 0 0}.options-table-wrap{background:#f8fafc;border:1px solid #ffe0df;border:1px solid var(--border);border-radius:10px;margin-top:12px;overflow:hidden}.bundle-title{color:#7a7a7a;color:var(--muted);font-size:.75rem;font-weight:700;letter-spacing:.05em;padding:10px 12px 0;text-transform:uppercase}.options-table{border-collapse:collapse;font-size:.85rem;width:100%}.options-table td,.options-table th{padding:8px 12px;text-align:left}.options-table th{color:#7a7a7a;color:var(--muted);font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase}.options-table tbody tr:not(:last-child) td,.options-table th{border-bottom:1px solid #ffe0df;border-bottom:1px solid var(--border)}.options-table td:last-child,.options-table th:last-child{text-align:right}.options-table td:first-child{color:#1a1a1a;color:var(--text);font-weight:700}.bundle-table td:first-child,.bundle-table th:first-child{width:60px}.bundle-table td:last-child,.bundle-table th:last-child{text-align:left}.options-table-barcode{color:#7a7a7a;color:var(--muted);font-size:.7rem;margin-top:2px}.options-table-barcode code{font-size:.7rem}.searching{align-items:center;color:#7a7a7a;color:var(--muted);display:flex;font-weight:600;gap:10px;justify-content:center;padding:20px}.spinner{animation:spinner-rotate .8s linear infinite;border:3px solid #ffe0df;border-top-color:#ff5952;border:3px solid var(--border);border-radius:50%;border-top-color:var(--primary);height:18px;width:18px}@keyframes spinner-rotate{to{transform:rotate(1turn)}}.not-found{color:#ef4444;color:var(--danger);padding:24px;text-align:center}.not-found p{color:#7a7a7a;color:var(--muted);font-size:.9rem;margin:8px 0 0}.recent-list{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px}.chip{background:#fff;border:1px solid #ffe0df;border:1px solid var(--border);border-radius:999px;cursor:pointer;font-size:.82rem;padding:6px 12px;white-space:nowrap}.chip:hover{border-color:#ff5952;border-color:var(--primary)}.hint{color:#7a7a7a;color:var(--muted);font-size:.82rem;padding:4px;text-align:center}.compare-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));padding:12px}.compare-card{background:#f8fafc;border:1px solid #ffe0df;border:1px solid var(--border);border-radius:12px;display:flex;flex-direction:column;overflow:hidden;position:relative}.compare-img{aspect-ratio:1;background:#fff;object-fit:cover;width:100%}.compare-info{display:flex;flex:1 1;flex-direction:column;gap:2px;padding:8px 10px}.compare-name{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;font-size:.88rem;font-weight:700;line-height:1.2;overflow:hidden;overflow-wrap:anywhere}.compare-meta{color:#7a7a7a;color:var(--muted);font-size:.7rem;overflow-wrap:anywhere}.compare-price{color:#059669;font-size:1.05rem;font-weight:900;white-space:nowrap}.compare-barcode{color:#7a7a7a;color:var(--muted);font-size:.7rem}.compare-remove{font-size:.75rem;justify-content:center;margin:6px 8px 8px;padding:6px 10px}.cheapest-badge{background:#059669;border-radius:999px;color:#fff;font-size:.65rem;font-weight:800;left:6px;letter-spacing:.04em;padding:3px 7px;position:absolute;top:6px}.compare-list{padding:0}.compare-list-head{background:#f8fafc;color:#7a7a7a;color:var(--muted);font-size:.7rem;font-weight:700;letter-spacing:.05em;padding:8px 12px;text-transform:uppercase}.compare-list-head,.compare-list-row{grid-gap:8px;border-bottom:1px solid #ffe0df;border-bottom:1px solid var(--border);display:grid;gap:8px;grid-template-columns:1fr 90px 40px}.compare-list-row{align-items:center;padding:16px 12px}.compare-list-row .btn-ghost{height:32px;justify-content:center;justify-self:end;margin-right:-6px;padding:6px;width:32px}.compare-list-prod{align-items:center;display:flex;gap:10px;min-width:0}.compare-list-prod>div{min-width:0}.compare-list-img{border:1px solid #ffe0df;border:1px solid var(--border);border-radius:8px;flex-shrink:0;height:40px;object-fit:cover;width:40px}.compare-list-remove{margin-right:-10px}.compare-card,.compare-list-row{cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease}.compare-card:hover{border-color:#0ea5e9;box-shadow:0 4px 12px #0ea5e92e}.compare-list-row:hover{background:#f0f9ff}.compare-card:focus-visible,.compare-list-row:focus-visible{outline:2px solid #0ea5e9;outline-offset:2px}@media (max-width:640px){.app-header{padding:10px 12px}.header-logo{height:28px}.branch-card-wrap{padding:0 10px}.branch-card{padding:12px 14px 14px}.branch-name{font-size:.82rem}.live-status{padding:3px 8px}.main{gap:10px;padding:10px 10px 20px}.card{border-radius:12px}.card-head{padding:10px 12px}.card-head h3{font-size:.85rem}.scanner-wrap{height:240px}#reader{max-width:100%}.scan-frame{height:160px;width:250px}.scanner-actions{gap:6px;padding:10px 12px}.btn,.btn-cancel{font-size:.8rem;padding:7px 12px}.input-barcode{font-size:.85rem;min-width:0}.product-card{padding:12px}.product-image-wrap{height:140px;margin-bottom:10px}.product-info h2{font-size:1rem}.price{font-size:1.55rem}.auth-gate{margin-top:20px;padding:20px 14px}}@media (max-width:400px){.branch-row{align-items:flex-start;flex-direction:column;gap:4px}.scanner-actions{align-items:stretch;flex-direction:column}.scanner-actions .btn,.scanner-actions .input-barcode{justify-content:center;width:100%}.extra-grid{grid-template-columns:1fr 1fr}}@media (min-width:641px) and (max-width:800px){.branch-card{padding:14px 18px 16px}}.app-footer{align-items:center;background:#fff;border-top:1px solid #ffe0df;border-top:1px solid var(--border);color:#1a1a1a;color:var(--text);display:flex;font-size:.78rem;justify-content:center;margin-left:auto;margin-right:auto;margin-top:auto;max-width:960px;padding:12px 20px;width:100%}.footer-brand{color:#7a7a7a;color:var(--muted);font-weight:600}.dialog-overlay{align-items:center;background:#0f172a80;display:flex;inset:0;justify-content:center;padding:16px;position:fixed;z-index:1000}.dialog{display:flex;flex-direction:column;max-height:85vh;max-width:520px;overflow-y:auto;padding:1vh;width:100%}.dialog>.btn-cancel{align-self:flex-end;margin-top:auto}.picker-list{list-style:none;margin:0 0 12px;padding:0}.picker-item{align-items:center;background:none;border:1px solid #e2e8f0;border-radius:10px;color:inherit;cursor:pointer;display:flex;font:inherit;gap:12px;padding:10px;text-align:left;width:100%}.picker-item:hover{border-color:#0ea5e9}.picker-image{flex-shrink:0;height:64px;object-fit:contain;width:64px}.picker-info{flex:1 1;min-width:0}.picker-desc{color:#64748b;font-size:.9rem}.picker-meta{display:flex;font-size:.9rem;gap:12px}.picker-price{font-size:.9rem;margin-left:auto}