@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700&family=Rajdhani:wght@400;500;600;700&display=swap";:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.card{padding:2em}#app{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Rajdhani,sans-serif;background:linear-gradient(135deg,#0a1628,#1a2a4a,#0d1f3c);min-height:100vh;color:#e0e6ed;overflow-x:hidden}.dashboard{min-height:100vh;padding:20px}.header{display:flex;justify-content:space-between;align-items:center;padding:15px 25px;background:#0f1e3c99;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(0,212,255,.2);border-radius:15px;margin-bottom:20px}.logo{display:flex;align-items:center;gap:12px;font-family:Orbitron,sans-serif;font-size:18px;font-weight:700;color:#00d4ff;text-shadow:0 0 10px rgba(0,212,255,.5)}.logo-icon{width:35px;height:35px;background:linear-gradient(135deg,#00d4ff,#0080ff);border-radius:8px;box-shadow:0 0 15px #00d4ff80}.header-status{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600}.status-dot{width:10px;height:10px;border-radius:50%;background:#666;box-shadow:0 0 10px currentColor}.status-dot.running{background:#0f8;box-shadow:0 0 10px #0f8}.status-dot.stopped{background:#f46;box-shadow:0 0 10px #f46}.status-dot.idle{background:#fa0;box-shadow:0 0 10px #fa0}.main-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}.card{background:#0f1e3c80;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border:1px solid rgba(0,212,255,.15);border-radius:15px;padding:20px;box-shadow:0 8px 32px #0000004d,inset 0 1px #ffffff0d}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.card-title{font-family:Orbitron,sans-serif;font-size:12px;font-weight:600;color:#00d4ff;letter-spacing:2px}.card-subtitle{font-size:11px;color:#667}.badge{padding:3px 10px;background:#0f83;border:1px solid #00ff88;border-radius:20px;font-size:10px;font-weight:700;color:#0f8;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.video-container{width:100%;height:220px;background:#000a1ecc;border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center;border:1px solid rgba(0,212,255,.1)}.video-container img{width:100%;height:100%;object-fit:contain}.video-placeholder{display:flex;flex-direction:column;align-items:center;gap:10px;color:#445}.placeholder-icon{width:50px;height:50px;border:2px dashed #334;border-radius:10px}.source-tabs{display:flex;gap:10px;margin-bottom:15px}.tab-btn{flex:1;padding:10px;background:#00143280;border:1px solid rgba(0,212,255,.2);border-radius:8px;color:#88a;font-family:Rajdhani,sans-serif;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:8px}.tab-btn.active{background:#00d4ff26;border-color:#00d4ff;color:#00d4ff}.tab-btn:hover{border-color:#00d4ff}.tab-icon{width:16px;height:16px;background:currentColor;-webkit-mask-size:contain;mask-size:contain}.file-upload{display:flex;flex-direction:column;gap:10px}.upload-btn{padding:12px;background:#00143280;border:1px dashed rgba(0,212,255,.3);border-radius:8px;color:#88a;font-size:13px;cursor:pointer;transition:all .3s;text-align:center}.upload-btn:hover{border-color:#00d4ff;color:#00d4ff}.action-btn{padding:10px 20px;background:linear-gradient(135deg,#00d4ff,#0080ff);border:none;border-radius:8px;color:#fff;font-family:Rajdhani,sans-serif;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s}.action-btn:hover{transform:translateY(-2px);box-shadow:0 5px 20px #00d4ff66}.action-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.upload-message{padding:10px;border-radius:8px;font-size:12px;text-align:center}.upload-message.success{background:#00ff881a;border:1px solid rgba(0,255,136,.3);color:#0f8}.upload-message.error{background:#ff44661a;border:1px solid rgba(255,68,102,.3);color:#f46}.trend-container{width:100%;height:150px}.trend-container canvas{width:100%;height:100%}.cylinder-card{display:flex;flex-direction:column;align-items:center}.cylinder-container{display:flex;flex-direction:column;align-items:center;gap:20px}.cylinder-wrapper{display:flex;align-items:center;gap:10px}.level-markers{display:flex;flex-direction:column;justify-content:space-between;height:300px;font-size:11px;color:#556}.level-display{display:flex;align-items:baseline;gap:5px}.level-value{font-family:Orbitron,sans-serif;font-size:48px;font-weight:700;color:#00d4ff;text-shadow:0 0 20px rgba(0,212,255,.5)}.level-unit{font-size:18px;color:#667}.alert-card{display:flex;align-items:center;gap:15px;padding:15px 20px;transition:all .3s;position:relative;overflow:hidden}.alert-card.normal{border-color:#00ff884d}.alert-card.warning{border-color:#ffaa0080;background:#ffaa001a}.alert-card.danger{border-color:#f46c;background:#f463;animation:dangerPulse .5s infinite,dangerShake .3s infinite;box-shadow:0 0 20px #ff446680,0 0 40px #ff44664d,inset 0 0 20px #ff44661a}@keyframes dangerPulse{0%,to{background:#f463;border-color:#f46c}50%{background:#f466;border-color:#f46}}@keyframes dangerShake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}.alert-icon-wrapper{position:relative}.alert-icon{width:40px;height:40px;border-radius:50%;background:#0f83;border:2px solid #00ff88}.alert-card.warning .alert-icon{background:#fa03;border-color:#fa0;animation:warningPulseIcon 1s infinite}.alert-card.danger .alert-icon{background:#f466;border-color:#f46;animation:dangerPulseIcon .3s infinite;box-shadow:0 0 15px #f46c}@keyframes warningPulseIcon{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes dangerPulseIcon{0%,to{transform:scale(1);box-shadow:0 0 15px #f46c}50%{transform:scale(1.2);box-shadow:0 0 25px #f46}}.alert-content{display:flex;flex-direction:column;gap:3px;flex:1}.alert-title{font-weight:700;font-size:14px;color:#0f8}.alert-card.warning .alert-title{color:#fa0}.alert-card.danger .alert-title{color:#f46;font-size:16px;text-transform:uppercase;letter-spacing:2px;animation:textFlash .5s infinite}@keyframes textFlash{0%,to{opacity:1}50%{opacity:.7}}.alert-message{font-size:12px;color:#778}.alert-card.danger .alert-message{color:#faa}.critical-overlay{position:absolute;top:0;right:0;padding:4px 12px;background:linear-gradient(90deg,transparent,rgba(255,0,0,.8),rgba(255,0,0,.8));animation:criticalSlide .5s infinite alternate}.critical-text{font-family:Orbitron,sans-serif;font-size:10px;font-weight:700;color:#fff;letter-spacing:2px;animation:criticalBlink .3s infinite}@keyframes criticalSlide{0%{opacity:.8}to{opacity:1}}@keyframes criticalBlink{0%,to{opacity:1}50%{opacity:.5}}.fullscreen-alert-flash{position:fixed;inset:0;pointer-events:none;z-index:999;animation:fullscreenFlash 1s infinite}@keyframes fullscreenFlash{0%,to{background:transparent;box-shadow:inset 0 0 100px #f000}50%{background:#ff00000d;box-shadow:inset 0 0 100px #ff00004d}}.controls-content{display:flex;flex-direction:column;gap:15px}.input-group{display:flex;flex-direction:column;gap:6px}.input-group label{font-size:11px;font-weight:600;color:#667;text-transform:uppercase;letter-spacing:1px}.input-group input{padding:10px 12px;background:#00143280;border:1px solid rgba(0,212,255,.2);border-radius:8px;color:#fff;font-family:Rajdhani,sans-serif;font-size:14px;transition:all .3s}.input-group input:focus{outline:none;border-color:#00d4ff;box-shadow:0 0 10px #00d4ff33}.input-group input:disabled{opacity:.5}.threshold-inputs{display:flex;gap:10px}.threshold-inputs input{flex:1}.control-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ctrl-btn{padding:12px;border:none;border-radius:10px;font-family:Orbitron,sans-serif;font-size:11px;font-weight:600;letter-spacing:1px;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:8px}.ctrl-btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important}.start-btn{background:linear-gradient(135deg,#0f8,#0c6);color:#000}.start-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 20px #0f86}.stop-btn{background:linear-gradient(135deg,#f46,#c35);color:#fff}.stop-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 20px #f466}.zero-btn{background:linear-gradient(135deg,#fa0,#f80);color:#000}.zero-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 20px #fa06}.download-btn{background:linear-gradient(135deg,#00d4ff,#0080ff);color:#fff}.download-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 20px #00d4ff66}.btn-icon{width:14px;height:14px;background:currentColor}.camera-error{display:flex;align-items:center;gap:10px;padding:12px 15px;background:#ff446626;border:1px solid rgba(255,68,102,.4);border-radius:8px;color:#ff6b7a;font-size:13px;font-weight:600;animation:errorFadeIn .3s ease-out}.camera-error .error-icon{width:20px;height:20px;background:#f46;border-radius:50%;flex-shrink:0;position:relative}.camera-error .error-icon:before,.camera-error .error-icon:after{content:"";position:absolute;background:#fff;top:50%;left:50%}.camera-error .error-icon:before{width:2px;height:8px;transform:translate(-50%,-70%)}.camera-error .error-icon:after{width:2px;height:2px;border-radius:50%;transform:translate(-50%,100%)}@keyframes errorFadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.stats-grid{display:flex;flex-direction:column;gap:15px}.stat-item{display:flex;align-items:center;gap:12px;padding:12px;background:#0014324d;border-radius:10px}.stat-icon{width:35px;height:35px;background:#00d4ff1a;border:1px solid rgba(0,212,255,.3);border-radius:8px}.stat-info{flex:1;display:flex;flex-direction:column}.stat-value{font-family:Orbitron,sans-serif;font-size:18px;font-weight:600;color:#00d4ff}.stat-value.status-text{font-size:14px}.stat-value.status-text.running{color:#0f8}.stat-value.status-text.stopped{color:#f46}.stat-value.status-text.idle{color:#fa0}.stat-label{font-size:10px;color:#556;text-transform:uppercase;letter-spacing:1px}.stat-bar{width:60px;height:6px;background:#00143280;border-radius:3px;overflow:hidden}.stat-fill{height:100%;background:linear-gradient(90deg,#00d4ff,#0f8);border-radius:3px;transition:width .3s}.stat-fill.processing{background:linear-gradient(90deg,#fa0,#f80)}.session-card{display:flex;align-items:center;gap:15px;background:#00ff881a;border-color:#00ff884d;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.session-icon{width:40px;height:40px;background:#0f83;border:2px solid #00ff88;border-radius:50%}.session-content{display:flex;flex-direction:column;gap:3px}.session-title{font-weight:700;color:#0f8}.session-message{font-size:12px;color:#778}@media(max-width:1200px){.main-grid{grid-template-columns:1fr 1fr}.right-column{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;gap:20px}}@media(max-width:768px){.main-grid{grid-template-columns:1fr}.right-column{grid-column:span 1;grid-template-columns:1fr}}.roi-section{margin-top:15px;padding-top:15px;border-top:1px solid rgba(0,212,255,.1)}.roi-select-btn{width:100%;padding:12px;background:linear-gradient(135deg,#93f,#60c);border:none;border-radius:8px;color:#fff;font-family:Rajdhani,sans-serif;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:8px}.roi-select-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 20px #93f6}.roi-select-btn:disabled{opacity:.5;cursor:not-allowed}.roi-icon{width:16px;height:16px;border:2px solid currentColor;border-radius:2px}.roi-status{margin-top:8px;padding:8px 12px;background:#00ff881a;border:1px solid rgba(0,255,136,.3);border-radius:6px;font-size:11px;color:#0f8;text-align:center}.roi-status.roi-warning{background:#ffaa001a;border-color:#ffaa004d;color:#fa0}.roi-modal-overlay{position:fixed;inset:0;background:#000000e6;display:flex;align-items:flex-start;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:20px;overflow-y:auto}.roi-modal{background:#0f1e3cfa;border:1px solid rgba(0,212,255,.3);border-radius:12px;max-width:550px;width:100%;margin:auto;box-shadow:0 20px 60px #00000080;display:flex;flex-direction:column}.roi-modal-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#00d4ff1a;border-bottom:1px solid rgba(0,212,255,.2);flex-shrink:0}.roi-modal-title{font-family:Orbitron,sans-serif;font-size:12px;font-weight:600;color:#00d4ff;letter-spacing:1px}.roi-close-btn{width:28px;height:28px;background:#f463;border:1px solid rgba(255,68,102,.4);border-radius:50%;color:#f46;font-size:18px;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;line-height:1}.roi-close-btn:hover{background:#f466}.roi-modal-body{padding:15px;flex:1;overflow-y:auto}.roi-instructions{margin-bottom:12px;padding:10px;background:#00143280;border:1px solid rgba(0,212,255,.2);border-radius:6px;font-size:12px;color:#aab;line-height:1.6}.roi-canvas-container{display:flex;justify-content:center;background:#0000004d;border-radius:6px;padding:8px;max-height:350px;overflow:auto}.roi-canvas{cursor:crosshair;border:2px solid rgba(0,212,255,.3);border-radius:4px;max-width:100%;max-height:320px;object-fit:contain}.roi-loading{display:flex;align-items:center;justify-content:center;height:150px;color:#667;font-size:13px}.roi-modal-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;background:#0014324d;border-top:1px solid rgba(0,212,255,.1);flex-shrink:0}.roi-btn{padding:8px 16px;border:none;border-radius:6px;font-family:Rajdhani,sans-serif;font-size:12px;font-weight:600;cursor:pointer;transition:all .3s}.roi-btn-secondary{background:#6464784d;border:1px solid rgba(100,100,120,.5);color:#aab}.roi-btn-secondary:hover{background:#64647880}.roi-btn-primary{background:linear-gradient(135deg,#00d4ff,#0080ff);color:#fff}.roi-btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 15px #00d4ff66}.roi-btn-primary:disabled{opacity:.5;cursor:not-allowed}