*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-primary: #0f1117;--bg-card: #18181b;--bg-input: #27272a;--border: #27272a;--border-light: #3f3f46;--text-primary: #e4e4e7;--text-muted: #a1a1aa;--text-dim: #71717a;--text-faded: #52525b;--accent: #6366f1;--accent-hover: #4f46e5;--accent-light: #818cf8;--success: #22c55e;--success-bg: #052e16;--success-text: #86efac;--error: #ef4444;--error-hover: #dc2626;--error-bg: #2d1215;--error-text: #fca5a5;--warning-bg: #2d2305;--warning-text: #fcd34d;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: "SF Mono", Menlo, monospace;--radius: 12px;--radius-sm: 8px}body{font-family:var(--font-sans);background:var(--bg-primary);color:var(--text-primary);min-height:100vh;display:flex;flex-direction:column;align-items:center}a{color:var(--accent);text-decoration:none}.container{max-width:900px;width:100%;padding:2rem 1.5rem;display:flex;flex-direction:column;align-items:center;gap:2rem}.header{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem}.header-brand{display:flex;align-items:center;gap:.75rem}.header-logo{width:100px;height:100px;border-radius:10px;object-fit:contain}.header h1{font-size:1.75rem;font-weight:700}.header-actions{display:flex;align-items:center;gap:.75rem;position:relative}.icon-btn{background:none;border:1px solid var(--border-light);color:var(--text-muted);width:36px;height:36px;border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;transition:color .15s,border-color .15s}.icon-btn:hover{color:var(--text-primary);border-color:var(--accent)}.history-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;width:360px;max-height:480px;overflow-y:auto;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);z-index:100;box-shadow:0 8px 24px #0006}.history-dropdown.open{display:block}.history-dropdown-header{padding:.75rem 1rem;border-bottom:1px solid var(--border);font-size:.85rem;display:flex;justify-content:space-between;align-items:center;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}.history-clear-link{font-weight:400;font-size:.75rem;text-transform:none;letter-spacing:normal;color:var(--accent);cursor:pointer}.history-clear-link:hover{color:var(--accent-light)}.history-entry{padding:.75rem 1rem;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:.5rem}.history-entry:last-child{border-bottom:none}.history-entry-info{flex:1;min-width:0}.history-entry-date{font-size:.75rem;color:var(--text-dim)}.history-entry-count{font-size:.85rem;font-family:var(--font-mono)}.history-entry-actions{display:flex;gap:.25rem}.history-entry-actions .icon-btn{width:28px;height:28px;font-size:.8rem}.history-bulk-actions{padding:.75rem 1rem;border-top:1px solid var(--border);display:flex;gap:.5rem;justify-content:flex-end}.history-empty{padding:1.5rem 1rem;text-align:center;color:var(--text-dim);font-size:.85rem}.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.5rem;border-radius:var(--radius-sm);font-size:.95rem;font-weight:500;cursor:pointer;border:none;transition:background .15s,opacity .15s}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-stop{background:var(--error);color:#fff}.btn-stop:hover{background:var(--error-hover)}.btn-secondary{background:var(--bg-input);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{border-color:var(--border-light)}.btn-sm{padding:.35rem .75rem;font-size:.8rem}.plate-barcode{width:100%;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem 1.5rem}.plate-barcode-label{font-size:.8rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em}.plate-barcode-value{font-size:1.5rem;font-weight:700;font-family:var(--font-mono);margin-top:.25rem}.plate-barcode-value.placeholder{color:var(--text-muted)}.scanner-area{position:relative;width:100%;border-radius:var(--radius);overflow:hidden;background:var(--bg-card);aspect-ratio:var(--video-aspect, 4/3)}.scanner-area video{width:100%;height:100%;object-fit:contain}.scanner-area canvas{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.scanner-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;height:100%;color:var(--text-dim);font-size:1rem}.scanner-placeholder .placeholder-icon{font-size:3rem;opacity:.4}.play-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:none;border:none;cursor:pointer;z-index:10;opacity:.8;transition:opacity .15s,transform .15s}.play-overlay:hover{opacity:1;transform:translate(-50%,-50%) scale(1.1)}.controls{width:100%;display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.camera-select{flex:1;min-width:150px;border:1px solid var(--border-light);color:var(--text-primary);padding:.5rem .75rem;border-radius:var(--radius-sm);font-size:.9rem;font-family:var(--font-sans);background:var(--bg-card)}@media(hover:hover){.camera-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--bg-card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23a1a1aa' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right .75rem center;padding-right:2rem}}.progress-counter{font-size:2rem;font-weight:700;font-family:var(--font-mono);text-align:center;width:100%}.decoded-count{color:var(--success)}.total-count{color:var(--text-muted)}.status-bar{width:100%;display:flex;flex-direction:column;gap:.4rem}.status-text{font-size:.85rem;color:var(--text-muted)}.progress-track{width:100%;height:6px;background:var(--bg-input);border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:var(--accent);border-radius:3px;transition:width .3s ease;width:0%}.count-badge{background:var(--bg-input);color:var(--text-muted);font-size:.8rem;padding:.15rem .6rem;border-radius:10px;font-weight:500}.section{width:100%;margin-top:.5rem}.section-title{font-size:1.1rem;font-weight:600;margin-bottom:1rem;display:flex;align-items:baseline;gap:.5rem}.table-actions{margin-left:auto;display:flex;gap:.25rem}table{width:100%;border-collapse:collapse;font-size:.9rem}th{text-align:left;padding:.6rem .75rem;border-bottom:1px solid var(--border);color:var(--text-dim);font-weight:500;font-size:.8rem;text-transform:uppercase;letter-spacing:.04em}td{padding:.6rem .75rem;border-bottom:1px solid #1e1e22}.barcode-cell{font-family:var(--font-mono);font-size:.85rem}.barcode-pending{color:var(--text-dim);font-style:italic}.settings-overlay{display:none;position:fixed;inset:0;background:#00000080;z-index:200}.settings-overlay.open{display:block}.settings-panel{position:fixed;top:0;right:0;width:360px;max-width:100%;height:100%;background:var(--bg-card);border-left:1px solid var(--border);z-index:201;display:flex;flex-direction:column;transform:translate(100%);transition:transform .2s ease}.settings-overlay.open .settings-panel{transform:translate(0)}.settings-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--border)}.settings-header h2{font-size:1.1rem;font-weight:600}.settings-close{background:none;border:none;color:var(--text-muted);font-size:1.25rem;cursor:pointer;padding:.25rem}.settings-body{flex:1;overflow-y:auto;padding:1.25rem;display:flex;flex-direction:column;gap:1.25rem}.field{display:flex;flex-direction:column;gap:.35rem}.field label{font-size:.8rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;font-weight:500}.field input,.field select{padding:.5rem .75rem;border-radius:var(--radius-sm);background:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border);font-size:.9rem;font-family:var(--font-sans)}.field input.mono{font-family:var(--font-mono);font-size:.8rem}.field .field-hint{font-size:.75rem;color:var(--text-dim)}.field .field-error{font-size:.75rem;color:var(--error-text)}.advanced-settings{border-top:1px solid var(--border);padding-top:1rem}.advanced-settings summary{font-size:.8rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;font-weight:500;cursor:pointer;user-select:none}.advanced-settings summary:hover{color:var(--text-muted)}.advanced-settings-body{margin-top:1rem;display:flex;flex-direction:column;gap:1.25rem}.checkbox-label{display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:var(--text-primary);cursor:pointer}.checkbox-label input[type=checkbox]{width:1rem;height:1rem;accent-color:var(--accent)}.alert{width:100%;padding:.75rem 1rem;border-radius:var(--radius-sm);font-size:.9rem;line-height:1.5}.alert-success{background:var(--success-bg);border:1px solid #14532d;color:var(--success-text)}.alert-error{background:var(--error-bg);border:1px solid #7f1d1d;color:var(--error-text)}.alert-warning{background:var(--warning-bg);border:1px solid #78350f;color:var(--warning-text)}.model-loading-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0f1117d9;z-index:15;border-radius:var(--radius);transition:opacity .3s ease}.model-loading-overlay.hidden{opacity:0;pointer-events:none}.model-loading-content{display:flex;flex-direction:column;align-items:center;gap:.75rem;color:var(--text-muted)}.model-loading-content p{font-size:.9rem}.model-progress-track{width:180px}#scanner-section{width:100%;display:flex;flex-direction:column;gap:1rem}.barcode-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.5rem}.barcode-list-item{display:flex;align-items:center;gap:.5rem;padding:.375rem .5rem;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm)}.barcode-list-item.is-rack{border-color:#60a5fa33;background:#60a5fa0a}.barcode-crop{width:36px;height:36px;object-fit:contain;border-radius:4px;background:var(--bg-input);flex-shrink:0}.barcode-list-item .barcode-label{font-family:var(--font-mono);font-size:.8rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.barcode-list-item.is-rack .barcode-label{color:#60a5fa}.barcode-rack-tag{font-size:.6rem;text-transform:uppercase;letter-spacing:.04em;color:#60a5fa99;font-family:var(--font-sans);flex-shrink:0;margin-left:auto}.section-subtitle{font-size:.8rem;font-weight:500;color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;margin-top:1rem;margin-bottom:.5rem}.hidden{display:none!important}footer{margin-top:auto;padding:2rem 1.5rem;color:var(--text-faded);font-size:.8rem;text-align:center}footer a{color:var(--accent);text-decoration:none}footer img{height:20px;vertical-align:middle;filter:brightness(.7)}