@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap";:root{--bg-primary: #08070d;--bg-secondary: #12101e;--card-bg: rgba(20, 18, 33, .65);--card-border: rgba(255, 255, 255, .06);--color-text-primary: #f1f0f7;--color-text-secondary: #9a95b0;--accent-purple: #7c3aed;--accent-blue: #2563eb;--accent-cyan: #06b6d4;--accent-emerald: #10b981;--accent-amber: #d97706;--accent-rose: #e11d48;--grad-primary: linear-gradient(135deg, #7c3aed 0%, #2563eb 100%);--grad-cyan-blue: linear-gradient(135deg, #06b6d4 0%, #3b82f6 100%);--grad-rose-orange: linear-gradient(135deg, #f43f5e 0%, #f97316 100%);--grad-emerald: linear-gradient(135deg, #10b981 0%, #059669 100%);--grad-dark-glass: linear-gradient(180deg, rgba(25, 22, 43, .4) 0%, rgba(13, 11, 22, .7) 100%);font-family:Outfit,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;background-color:var(--bg-primary);color:var(--color-text-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;background:radial-gradient(circle at 50% 0%,#1e133e 0%,var(--bg-primary) 70%);overflow-x:hidden}#root{min-height:100vh;display:flex;flex-direction:column}.app-container{max-width:1400px;width:100%;margin:0 auto;padding:2rem 1.5rem;flex:1;display:flex;flex-direction:column;gap:1.5rem}.app-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:1.5rem;border-bottom:1px solid var(--card-border)}.brand-section{display:flex;align-items:center;gap:.75rem}.brand-logo-glow{width:2.5rem;height:2.5rem;border-radius:.75rem;background:var(--grad-primary);display:flex;align-items:center;justify-content:center;box-shadow:0 0 15px #7c3aed80;color:#fff}.brand-title{font-size:1.5rem;font-weight:700;letter-spacing:-.025em;background:linear-gradient(120deg,#fff 30%,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.brand-subtitle{font-size:.85rem;color:var(--color-text-secondary)}.glass-card{background:var(--card-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--card-border);border-radius:1rem;padding:1.5rem;box-shadow:0 8px 32px #0000005e;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.glass-card:hover{border-color:#7c3aed33}.dashboard-grid{display:grid;grid-template-columns:1fr;gap:1.5rem}@media (min-width: 900px){.dashboard-grid{grid-template-columns:380px 1fr}}.upload-zone{border:2px dashed rgba(255,255,255,.1);border-radius:.75rem;padding:2.5rem 1.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;cursor:pointer;background:#ffffff05;transition:all .2s ease;position:relative;overflow:hidden}.upload-zone:hover,.upload-zone.dragging{border-color:var(--accent-purple);background:#7c3aed0d}.upload-icon{color:var(--color-text-secondary);transition:transform .2s ease,color .2s ease}.upload-zone:hover .upload-icon{transform:translateY(-4px);color:#a78bfa}.upload-text{text-align:center;font-size:.95rem;color:var(--color-text-secondary)}.upload-text span{color:var(--color-text-primary);font-weight:500;text-decoration:underline}.file-preview-container{width:100%;border-radius:.5rem;overflow:hidden;position:relative;aspect-ratio:4/3;background:#000;border:1px solid var(--card-border)}.file-preview{width:100%;height:100%;object-fit:contain}.btn-predict{width:100%;padding:.75rem;border:none;border-radius:.5rem;background:var(--grad-primary);color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:.5rem;box-shadow:0 4px 12px #7c3aed4d}.btn-predict:hover:not(:disabled){opacity:.9;transform:translateY(-1px);box-shadow:0 6px 16px #7c3aed66}.btn-predict:disabled{background:#3b3a4a;color:var(--color-text-secondary);cursor:not-allowed;box-shadow:none}.control-group{margin-top:1rem;display:flex;flex-direction:column;gap:.5rem}.control-label{display:flex;justify-content:space-between;font-size:.85rem;color:var(--color-text-secondary);font-weight:500}.range-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:6px;border-radius:3px;background:#ffffff1a;outline:none;transition:background .15s ease-in-out}.range-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent-purple);cursor:pointer;border:2px solid #fff;box-shadow:0 0 10px #7c3aed80;transition:transform .1s ease}.range-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.status-indicator{display:flex;align-items:center;gap:.5rem;font-size:.85rem;font-weight:600;padding:.4rem .8rem;border-radius:2rem}.status-indicator.ready{background:#10b9811a;color:var(--accent-emerald);border:1px solid rgba(16,185,129,.2)}.status-indicator.warning{background:#d977061a;color:#fbbf24;border:1px solid rgba(217,119,6,.2)}.results-container{display:flex;flex-direction:column;gap:1.5rem}.comparison-view{display:grid;grid-template-columns:1fr;gap:1rem}@media (min-width: 1100px){.comparison-view{grid-template-columns:1fr 1fr}}.image-panel{display:flex;flex-direction:column;gap:.5rem}.image-panel-title{font-size:.9rem;font-weight:600;color:var(--color-text-secondary);display:flex;align-items:center;gap:.5rem}.image-wrapper{aspect-ratio:4/3;width:100%;border-radius:.5rem;overflow:hidden;background:#000;border:1px solid var(--card-border);display:flex;align-items:center;justify-content:center;position:relative}.image-wrapper img{width:100%;height:100%;object-fit:contain}.scanner-overlay{position:absolute;top:0;left:0;right:0;height:4px;background:var(--accent-purple);box-shadow:0 0 15px var(--accent-purple);animation:scan 2s linear infinite;opacity:.75}@keyframes scan{0%{top:0%}50%{top:100%}to{top:0%}}.detection-table-wrapper{overflow-x:auto;border-radius:.5rem;border:1px solid var(--card-border)}.detection-table{width:100%;border-collapse:collapse;text-align:left;font-size:.9rem}.detection-table th{background:#ffffff08;padding:.75rem 1rem;color:var(--color-text-secondary);font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--card-border)}.detection-table td{padding:.75rem 1rem;border-bottom:1px solid rgba(255,255,255,.03)}.detection-table tr:last-child td{border-bottom:none}.detection-table tr:hover td{background:#ffffff03}.badge{display:inline-flex;align-items:center;padding:.25rem .5rem;border-radius:.25rem;font-size:.75rem;font-weight:600}.badge-violet{background:#7c3aed26;color:#a78bfa}.badge-confidence{font-family:monospace}.badge-high{background:#10b98126;color:#34d399}.badge-medium{background:#f59e0b26;color:#fbbf24}.badge-low{background:#ef444426;color:#f87171}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;color:var(--color-text-secondary);gap:1rem;text-align:center}.alert-box{background:#d9770614;border:1px solid rgba(217,119,6,.2);border-radius:.5rem;padding:1rem;display:flex;gap:.75rem;font-size:.9rem;line-height:1.4;color:#f59e0b}.alert-box.info{background:#3b82f614;border:1px solid rgba(59,130,246,.2);color:#60a5fa}.alert-title{font-weight:600;margin-bottom:.25rem;color:var(--color-text-primary)}.code-snippet{font-family:monospace;background:#0006;padding:.15rem .35rem;border-radius:.25rem;color:#a78bfa}.queue-container{display:flex;flex-direction:column;gap:.5rem;max-height:180px;overflow-y:auto;padding-right:.25rem;border:1px solid var(--card-border);border-radius:.5rem;padding:.5rem;background:#0003}.queue-item{display:flex;justify-content:space-between;align-items:center;padding:.4rem .6rem;background:#ffffff05;border-radius:.35rem;border:1px solid rgba(255,255,255,.03);font-size:.85rem}.queue-item-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px;color:var(--color-text-primary);font-weight:500}.badge-status{padding:.15rem .4rem;border-radius:.25rem;font-size:.7rem;font-weight:600}.badge-status.pending{background:#ffffff14;color:var(--color-text-secondary)}.badge-status.processing{background:#2563eb26;color:#60a5fa;animation:pulse-glow 1.5s infinite}.badge-status.done{background:#10b98126;color:#34d399}.badge-status.error{background:#e11d4826;color:#fb7185}@keyframes pulse-glow{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}.history-container{display:flex;flex-direction:column;gap:.75rem;margin-top:.25rem}.history-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--card-border);padding-bottom:.5rem}.history-list{display:flex;flex-direction:column;gap:.5rem;max-height:380px;overflow-y:auto;padding-right:.25rem}.history-item{display:flex;align-items:center;gap:.75rem;padding:.5rem;border-radius:.5rem;background:#ffffff03;border:1px solid var(--card-border);cursor:pointer;transition:all .2s ease;position:relative}.history-item:hover,.history-item.active{background:#7c3aed0f;border-color:#7c3aed40}.history-item.active{box-shadow:inset 0 0 8px #7c3aed26}.history-thumbnail{width:48px;height:48px;border-radius:.25rem;overflow:hidden;background:#000;border:1px solid rgba(255,255,255,.05);flex-shrink:0}.history-thumbnail img{width:100%;height:100%;object-fit:cover}.history-info{display:flex;flex-direction:column;flex:1;min-width:0}.history-filename{font-size:.85rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--color-text-primary)}.history-meta{display:flex;justify-content:space-between;align-items:center;margin-top:.15rem;font-size:.75rem;color:var(--color-text-secondary)}.btn-delete-item{background:transparent;border:none;color:var(--color-text-secondary);cursor:pointer;opacity:0;transition:opacity .2s ease,color .2s ease;padding:.2rem;border-radius:.25rem;display:flex;align-items:center;justify-content:center}.history-item:hover .btn-delete-item{opacity:1}.btn-delete-item:hover{color:var(--accent-rose);background:#e11d4814}.btn-clean-history{background:#e11d4814;border:1px solid rgba(225,29,72,.15);color:#fb7185;padding:.3rem .6rem;border-radius:.35rem;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:.3rem}.btn-clean-history:hover{background:#e11d4826;color:#fff;border-color:#e11d484d}.history-empty{padding:2rem 1rem;text-align:center;font-size:.8rem;color:var(--color-text-secondary);border:1px dashed var(--card-border);border-radius:.5rem}body.light-theme{--bg-primary: #f4f3f6;--bg-secondary: #eae8ed;--card-bg: rgba(255, 255, 255, .75);--card-border: rgba(0, 0, 0, .08);--color-text-primary: #191624;--color-text-secondary: #6e6a82;background:radial-gradient(circle at 50% 0%,#e2ddf8,#f4f3f6 70%);color-scheme:light}body.light-theme .brand-title{background:linear-gradient(120deg,#191624 30%,#6d28d9);-webkit-background-clip:text;-webkit-text-fill-color:transparent}body.light-theme .code-snippet{background:#0000000f;color:#5b21b6}body.light-theme .queue-container{background:#00000008}body.light-theme .queue-item{background:#fff9;border-color:#0000000d}body.light-theme .queue-item-name{color:#191624}body.light-theme .history-item{background:#fff6}body.light-theme .history-item:hover,body.light-theme .history-item.active{background:#7c3aed0d}body.light-theme .detection-table th{background:#00000005;color:#6e6a82}body.light-theme .detection-table td{border-bottom:1px solid rgba(0,0,0,.03)}.theme-toggle-btn{background:#ffffff0f;border:1px solid var(--card-border);border-radius:.5rem;width:2.25rem;height:2.25rem;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--color-text-primary);transition:all .2s ease}.theme-toggle-btn:hover{background:#ffffff1f;transform:scale(1.05)}body.light-theme .theme-toggle-btn{background:#0000000a}body.light-theme .theme-toggle-btn:hover{background:#00000014}.landing-container{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;max-width:900px;margin:3rem auto;gap:2rem;text-align:center;padding:0 1rem}.landing-title{font-size:2.5rem;font-weight:800;letter-spacing:-.025em;background:linear-gradient(120deg,#fff 30%,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.5rem}body.light-theme .landing-title{background:linear-gradient(120deg,#191624 30%,#6d28d9);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.landing-cards{display:grid;grid-template-columns:1fr;gap:2rem;width:100%;margin-top:1rem}@media (min-width: 640px){.landing-cards{grid-template-columns:1fr 1fr}}.landing-cards.single-card{display:flex;justify-content:center}.landing-cards.single-card .option-card{max-width:420px;width:100%}.option-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3.5rem 2.5rem;border-radius:1.5rem;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.option-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#7c3aed14,#2563eb14);opacity:0;transition:opacity .3s ease}.option-card:hover{transform:translateY(-8px);border-color:#7c3aed59;box-shadow:0 12px 40px #7c3aed26}.option-card:hover:before{opacity:1}.option-icon-wrapper{width:5.5rem;height:5.5rem;border-radius:1.5rem;background:var(--grad-primary);display:flex;align-items:center;justify-content:center;color:#fff;margin-bottom:1.5rem;box-shadow:0 8px 24px #7c3aed4d;position:relative;z-index:1;transition:transform .3s ease}.option-card:hover .option-icon-wrapper{transform:scale(1.1) rotate(5deg)}.option-name{font-size:1.35rem;font-weight:700;color:var(--color-text-primary);margin-bottom:.5rem;position:relative;z-index:1}.option-description{font-size:.9rem;color:var(--color-text-secondary);line-height:1.4;position:relative;z-index:1}.btn-back{display:inline-flex;align-items:center;gap:.5rem;background:#ffffff08;border:1px solid var(--card-border);color:var(--color-text-secondary);padding:.6rem 1.2rem;border-radius:.5rem;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;width:fit-content}.btn-back:hover{background:#ffffff14;color:var(--color-text-primary);border-color:var(--color-text-secondary)}body.light-theme .btn-back:hover{background:#0000000d}.pill-list{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.75rem}.detection-pill{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:2rem;font-size:.9rem;font-weight:600;border:1px solid rgba(255,255,255,.08);background:#ffffff05}body.light-theme .detection-pill{border-color:#00000014;background:#00000003}.detection-pill.pill-violet{background:#7c3aed1f;color:#c084fc;border-color:#7c3aed33}body.light-theme .detection-pill.pill-violet{background:#7c3aed0f;color:#6d28d9;border-color:#7c3aed26}.camera-container{display:flex;flex-direction:column;gap:1.5rem}.camera-grid{display:grid;grid-template-columns:1fr;gap:1.5rem}@media (min-width: 1024px){.camera-grid{grid-template-columns:1.6fr 1fr}}.camera-preview-wrapper{width:100%;aspect-ratio:4/3;background:#000;border-radius:1rem;overflow:hidden;position:relative;border:1px solid var(--card-border);box-shadow:0 8px 32px #0000004d}.camera-video{width:100%;height:100%;object-fit:contain}.camera-overlay-img{width:100%;height:100%;object-fit:contain;position:absolute;top:0;left:0;z-index:2}.camera-hud{position:absolute;top:0;right:0;bottom:0;left:0;border:2px solid rgba(124,58,237,.15);pointer-events:none;z-index:3;display:flex;flex-direction:column;justify-content:space-between;padding:1.25rem}.camera-hud:before{content:"";position:absolute;top:1.5rem;right:1.5rem;bottom:1.5rem;left:1.5rem;border:1px dashed rgba(255,255,255,.1)}.camera-hud-status{background:#000000a6;color:#fff;font-size:.8rem;font-weight:500;padding:.35rem .75rem;border-radius:.25rem;display:flex;align-items:center;gap:.5rem;width:fit-content;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.camera-hud-badge{width:8px;height:8px;background:#ef4444;border-radius:50%;animation:pulse-hud 1.2s infinite}@keyframes pulse-hud{0%{transform:scale(1);opacity:1}50%{transform:scale(1.3);opacity:.4}to{transform:scale(1);opacity:1}}.btn-camera-control{background:var(--accent-rose);color:#fff;border:none;border-radius:.5rem;padding:.75rem 1.5rem;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:.5rem;box-shadow:0 4px 12px #e11d484d}.btn-camera-control:hover{opacity:.9;transform:translateY(-1px);box-shadow:0 6px 16px #e11d4866}.header-badge{display:flex;align-items:center;gap:.4rem;color:var(--color-text-secondary);font-size:.85rem}@media (max-width: 640px){.header-badge span,.brand-subtitle{display:none}.app-container{padding:1rem .75rem;gap:1rem}.app-header{padding-bottom:1rem}.landing-container{margin:1.5rem auto}.option-card{padding:2.5rem 1.5rem}}