:root{--color-bg:#f8fafc;--color-surface:#fff;--color-surface-hover:#f1f3f5;--color-surface-alt:#ebf0f5;--color-text:#1a1a1a;--color-text-secondary:#475569;--color-text-muted:#64748b;--color-text-disabled:#94a3b8;--color-primary:#1e3a5f;--color-primary-hover:#162d4a;--color-primary-light:#e0e7ff;--color-accent:#2563eb;--color-accent-hover:#1d4ed8;--color-success:#16a34a;--color-success-bg:#dcfce7;--color-warning:#d97706;--color-warning-bg:#fef3c7;--color-danger:#dc2626;--color-danger-bg:#fee2e2;--color-info:#2563eb;--color-info-bg:#dbeafe;--color-border:#e2e8f0;--color-border-hover:#cbd5e1;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:12px;--radius-2xl:16px;--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 8px 40px #0000001f;--shadow-xl:0 12px 48px #00000029;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"SF Mono", "Cascadia Code", "Consolas", monospace;--font-size-xs:11px;--font-size-sm:12px;--font-size-base:14px;--font-size-md:16px;--font-size-lg:18px;--font-size-xl:20px;--font-size-2xl:24px;--transition-fast:.15s ease;--transition-base:.2s ease;--transition-slow:.3s ease;--z-dropdown:40;--z-overlay:50;--z-popup:60;--z-modal:100;--z-drawer:200;--z-toast:300}[data-theme=dark]{--color-bg:#0f172a;--color-surface:#1e293b;--color-surface-hover:#334155;--color-surface-alt:#1e293b;--color-text:#f1f5f9;--color-text-secondary:#cbd5e1;--color-text-muted:#94a3b8;--color-text-disabled:#64748b;--color-primary:#3b82f6;--color-primary-hover:#60a5fa;--color-primary-light:#1e3a5f;--color-accent:#3b82f6;--color-accent-hover:#60a5fa;--color-border:#334155;--color-border-hover:#475569;--color-success:#22c55e;--color-success-bg:#052e16;--color-warning:#f59e0b;--color-warning-bg:#451a03;--color-danger:#ef4444;--color-danger-bg:#450a0a;--color-info:#3b82f6;--color-info-bg:#0c1929;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 4px 12px #0006;--shadow-lg:0 8px 40px #00000080;--shadow-xl:0 12px 48px #0009;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=dark] body{background:var(--color-bg);color:var(--color-text)}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0;overflow:hidden}body{font-family:var(--font-sans);font-size:var(--font-size-base);background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;touch-action:manipulation;line-height:1.5}a{color:inherit;text-decoration:none}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.model-list-page{max-width:1200px;margin:0 auto;padding:24px}.page-header{justify-content:space-between;align-items:center;margin-bottom:32px;display:flex}.page-header h1{color:#1a1a1a;margin:0;font-size:24px}.upload-btn{color:#fff;cursor:pointer;background:#3b82f6;border-radius:8px;padding:10px 24px;font-weight:600;transition:background .2s;display:inline-block}.upload-btn:hover{background:#2563eb}.upload-btn.disabled{cursor:not-allowed;background:#9ca3af}.empty-state{text-align:center;color:#6b7280;padding:80px 24px;font-size:16px}.model-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;display:grid}.model-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:20px;transition:box-shadow .2s}.model-card:hover{box-shadow:0 4px 12px #00000014}.model-card-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.model-card-header h3{color:#1a1a1a;text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:16px;overflow:hidden}.status-badge{color:#fff;text-transform:capitalize;border-radius:12px;align-items:center;gap:5px;padding:2px 10px;font-size:12px;font-weight:600;transition:background-color .4s;display:inline-flex}.status-badge.status-pulse{animation:2s ease-in-out infinite badge-pulse}.status-dot{background:#ffffffe6;border-radius:50%;width:6px;height:6px;animation:1.2s ease-in-out infinite dot-blink;display:inline-block}@keyframes badge-pulse{0%,to{opacity:1}50%{opacity:.75}}@keyframes dot-blink{0%,to{opacity:1}50%{opacity:.3}}.translation-progress{align-items:center;gap:10px;margin-top:8px;display:flex}.progress-bar-track{background:#e5e7eb;border-radius:3px;flex:1;height:6px;overflow:hidden}.progress-bar-fill{background:linear-gradient(90deg,#8b5cf6,#6d28d9);border-radius:3px;height:100%;transition:width .6s;position:relative}.progress-bar-fill:after{content:"";background:linear-gradient(90deg,#0000 0%,#ffffff4d 50%,#0000 100%);animation:1.5s infinite shimmer;position:absolute;inset:0}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.progress-label{color:#6d28d9;text-align:right;min-width:32px;font-size:12px;font-weight:600}.status-message{color:#6b7280;align-items:center;gap:6px;margin-top:8px;font-size:13px;display:flex}.ready-message{color:#059669;font-weight:500}.failed-message{color:#dc2626;font-weight:500}.spinner{border:2px solid #d1d5db;border-top-color:#3b82f6;border-radius:50%;width:14px;height:14px;animation:.8s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.model-card-body p{color:#4b5563;margin:4px 0;font-size:14px}.model-card-actions{gap:8px;margin-top:16px;display:flex}.btn{cursor:pointer;border:none;border-radius:6px;padding:8px 16px;font-size:14px;font-weight:500;transition:background .2s}.btn-primary{color:#fff;background:#3b82f6}.btn-primary:hover{background:#2563eb}.btn-secondary{color:#4338ca;background:#e0e7ff}.btn-secondary:hover{background:#c7d2fe}.btn-danger{color:#dc2626;background:#fee2e2}.btn-danger:hover{background:#fecaca}@media (width<=768px){.model-list-page{padding:16px 12px}.page-header{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:20px}.page-header h1{font-size:20px}.upload-btn{text-align:center;width:100%;padding:12px 24px}.model-grid{grid-template-columns:1fr;gap:12px}.model-card{padding:16px}.model-card-header h3{font-size:14px}.model-card-actions{flex-wrap:wrap}.btn{padding:10px 14px;font-size:13px}.empty-state{padding:48px 16px;font-size:14px}}@media (width<=480px){.model-list-page{padding:12px 8px}.page-header h1{font-size:18px}.model-card{border-radius:8px;padding:12px}.model-card-actions{gap:6px}.btn{text-align:center;flex:1}}.viewer-topbar{background:var(--color-surface);border-bottom:1px solid var(--color-border);flex-shrink:0;align-items:center;gap:12px;height:48px;padding:0 16px;display:flex}.topbar-breadcrumb{color:var(--color-text);align-items:center;gap:6px;font-size:14px;font-weight:600;text-decoration:none;display:flex}.topbar-breadcrumb .topbar-app{color:var(--color-accent)}.topbar-breadcrumb .topbar-sep{color:var(--color-text-muted);font-weight:400}.topbar-model-name{color:var(--color-text)}.topbar-actions{align-items:center;gap:8px;margin-left:auto;display:flex}.topbar-action-btn{border:1px solid var(--color-border);color:var(--color-text-secondary);cursor:pointer;background:0 0;border-radius:6px;align-items:center;gap:5px;min-height:34px;padding:6px 12px;font-size:13px;transition:background .15s,color .15s;display:inline-flex}.topbar-action-btn:hover{background:var(--color-surface-hover);color:var(--color-text)}.topbar-action-btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:1px}@media (width<=768px){.viewer-topbar{gap:8px;height:44px;padding:0 10px}.topbar-breadcrumb{font-size:12px}.topbar-action-btn{padding:5px 8px;font-size:12px}}.status-banner{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);height:30px;color:var(--color-text-muted);z-index:5;background:#0f172ab3;border-bottom:1px solid #33415540;flex-shrink:0;justify-content:space-between;align-items:center;padding:0 16px;font-size:11px;display:flex}.sb-left,.sb-center,.sb-right{align-items:center;gap:10px;display:flex}.sb-clock{color:var(--color-text);letter-spacing:.5px;font-family:SF Mono,Consolas,monospace;font-size:12px;font-weight:600}.sb-date{color:var(--color-text-muted)}.sb-divider{background:#33415580;width:1px;height:14px}.sb-weather{color:var(--color-text-secondary);align-items:center;gap:4px;display:inline-flex}.sb-weather-icon{font-size:14px}.sb-weather-detail{color:var(--color-text-muted)}.sb-status-pill{white-space:nowrap;border-radius:10px;align-items:center;gap:4px;padding:2px 8px;font-size:10px;font-weight:600;display:inline-flex}.sb-status-pill.sb-ok{color:#22c55e;background:#22c55e1a}.sb-status-pill.sb-warn{color:#f59e0b;background:#f59e0b1a}.sb-status-pill.sb-critical{color:#ef4444;background:#ef44441a}@media (width<=767px){.status-banner{justify-content:flex-start;gap:8px;height:26px;padding:0 10px;font-size:9px;overflow-x:auto}.sb-weather-detail,.sb-center{display:none}.sb-status-pill{padding:1px 6px;font-size:9px}.sb-clock{font-size:10px}}.category-summary-bar{background:var(--color-surface);border-bottom:1px solid var(--color-border);flex-shrink:0;align-items:center;gap:20px;height:34px;padding:0 16px;font-size:12px;font-weight:600;display:flex;overflow-x:auto}.category-summary-item{white-space:nowrap;cursor:pointer;color:var(--color-text-secondary);border-radius:4px;align-items:center;gap:5px;padding:3px 8px;transition:background .15s;display:inline-flex}.category-summary-item:hover{background:var(--color-surface-hover)}.category-summary-item.active{background:var(--color-primary-light);color:var(--color-primary)}.category-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.category-dot.critical{background:var(--color-danger)}.category-dot.warning{background:var(--color-warning)}.category-dot.info{background:var(--color-info)}.category-dot.success{background:var(--color-success)}@media (width<=768px){.category-summary-bar{gap:12px;padding:0 10px;font-size:11px}}.attention-queue{background:var(--color-surface);border-right:1px solid var(--color-border);flex-direction:column;flex-shrink:0;width:280px;display:flex;overflow:hidden}.queue-header{border-bottom:1px solid var(--color-border);color:var(--color-text);flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 14px;font-size:13px;font-weight:700;display:flex}.queue-filter-btn{color:var(--color-accent);cursor:pointer;background:0 0;border:none;font-size:11px;font-weight:500}.queue-filter-btn:hover{text-decoration:underline}.queue-scroll{flex:1;overflow-y:auto}.queue-footer{border-top:1px solid var(--color-border);color:var(--color-text-muted);flex-shrink:0;padding:8px 14px;font-size:11px}.queue-section-header{text-transform:uppercase;letter-spacing:.5px;cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;padding:8px 14px;font-size:10px;font-weight:700;transition:background .15s;display:flex}.queue-section-header:hover{filter:brightness(1.1)}.queue-section-chevron{font-size:10px;transition:transform .15s}.queue-section-chevron.open{transform:rotate(180deg)}.queue-item{border-bottom:1px solid var(--color-border);cursor:pointer;border-left:3px solid #0000;padding:10px 14px;transition:background .15s}.queue-item:hover{background:var(--color-surface-hover)}.queue-item.selected{background:var(--color-primary-light);border-left-color:var(--color-accent)}.queue-item.severity-critical{border-left-color:var(--color-danger)}.queue-item.severity-warning{border-left-color:var(--color-warning)}.queue-item.severity-info{border-left-color:var(--color-info)}.queue-item-title{justify-content:space-between;align-items:flex-start;gap:8px;display:flex}.queue-item-name{color:var(--color-text);font-size:12px;font-weight:600;line-height:1.3}.queue-item-badge{white-space:nowrap;border-radius:4px;flex-shrink:0;padding:1px 6px;font-size:10px;font-weight:600}.badge-critical{background:var(--color-danger-bg);color:var(--color-danger)}.badge-warning{background:var(--color-warning-bg);color:var(--color-warning)}.badge-info{background:var(--color-info-bg);color:var(--color-info)}.queue-item-sub{color:var(--color-text-muted);margin-top:2px;font-size:11px;line-height:1.3}.queue-item-location{color:var(--color-text-muted);margin-top:3px;font-size:10px}.queue-empty{text-align:center;color:var(--color-text-muted);padding:20px 14px;font-size:12px}.controlroom-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:500;background:#0000008c;justify-content:center;align-items:center;animation:.3s ease-out crFadeIn;display:flex;position:fixed;inset:0}@keyframes crFadeIn{0%{opacity:0}to{opacity:1}}.controlroom-frame{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:#0b1120d1;border:1px solid #47556940;border-radius:16px;flex-direction:column;width:92vw;max-width:1500px;height:88vh;display:flex;overflow:hidden;box-shadow:0 0 120px #00000080,0 0 0 1px #3b82f614,inset 0 1px #ffffff08}.cr-header{background:#0f172a;border-bottom:1px solid #3341554d;flex-shrink:0;align-items:center;gap:16px;padding:14px 20px;display:flex}.cr-header-left{flex-direction:column;gap:2px;display:flex}.cr-title{color:#fff;letter-spacing:.5px;font-size:15px;font-weight:700}.cr-subtitle{color:#64748b;text-transform:uppercase;letter-spacing:1px;font-size:10px}.cr-header-center{text-align:center;margin-left:auto}.cr-clock{color:#f1f5f9;letter-spacing:2px;font-family:SF Mono,Consolas,monospace;font-size:28px;font-weight:300;line-height:1}.cr-date{color:#64748b;text-transform:uppercase;letter-spacing:1px;margin-top:2px;font-size:10px}.cr-header-right{align-items:center;gap:8px;margin-left:auto;display:flex}.cr-nav-btn{color:#cbd5e1;cursor:pointer;background:#1e293bcc;border:1px solid #33415566;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;transition:background .15s,border-color .15s;display:flex}.cr-nav-btn:hover{background:#334155cc;border-color:#47556999}.cr-return-btn{color:#60a5fa;cursor:pointer;white-space:nowrap;background:#3b82f61a;border:1px solid #3b82f64d;border-radius:8px;align-items:center;gap:5px;margin-right:12px;padding:7px 14px;font-size:12px;font-weight:600;transition:background .15s,border-color .15s;display:inline-flex}.cr-return-btn:hover{color:#93c5fd;background:#3b82f633;border-color:#3b82f680}.cr-close-btn{color:#f87171;cursor:pointer;background:#ef444414;border:1px solid #ef444433;border-radius:8px;justify-content:center;align-items:center;width:40px;height:40px;margin-left:8px;transition:background .15s;display:flex}.cr-close-btn:hover{background:#ef444433}.cr-body{flex-direction:column;flex:1;gap:20px;padding:20px 24px;display:flex;overflow-y:auto}.cr-slide-banner{background:#0f172a99;border:1px solid #33415540;border-left:4px solid;border-radius:10px;align-items:center;gap:16px;padding:20px 24px;display:flex}.cr-slide-icon{font-size:36px;line-height:1}.cr-slide-category{color:#f1f5f9;font-size:18px;font-weight:700}.cr-slide-kpi{margin-top:2px;font-size:32px;font-weight:800;line-height:1}.cr-metrics-grid{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.cr-metric-card{background:#0f172a80;border:1px solid #33415533;border-left:3px solid;border-radius:8px;flex-direction:column;gap:6px;padding:14px 16px;transition:background .15s;display:flex}.cr-metric-card:hover{background:#1e293b80}.cr-metric-label{color:#94a3b8;font-size:11px;line-height:1.3}.cr-metric-row{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.cr-metric-value{color:#f1f5f9;font-size:22px;font-weight:700}.cr-metric-target{border-radius:3px;padding:2px 6px;font-size:10px;font-weight:600}.cr-status-good{color:#22c55e;background:#22c55e1a}.cr-status-warn{color:#f59e0b;background:#f59e0b1a}.cr-status-critical{color:#ef4444;background:#ef44441a}.cr-status-info{color:#3b82f6;background:#3b82f61a}.cr-metric-bar-track{background:#33415566;border-radius:2px;height:3px;margin-top:2px;overflow:hidden}.cr-metric-bar-fill{border-radius:2px;height:100%;transition:width .5s}.cr-secondary-strip{background:#0f172a80;border:1px solid #33415533;border-radius:10px;gap:12px;padding:12px 16px;display:flex}.cr-secondary-item{flex-direction:column;flex:1;align-items:center;gap:3px;padding:8px;display:flex}.cr-secondary-dot{border-radius:50%;width:8px;height:8px;margin-bottom:4px}.cr-secondary-val{color:#f1f5f9;font-size:18px;font-weight:700}.cr-secondary-lbl{color:#94a3b8;text-transform:uppercase;text-align:center;letter-spacing:.3px;font-size:9px}.cr-dots{flex-shrink:0;justify-content:center;align-items:center;gap:8px;padding:12px;display:flex}.cr-dot{cursor:pointer;background:0 0;border:1px solid #33415580;border-radius:50%;width:10px;height:10px;transition:all .2s}.cr-dot.active{border-color:#0000;border-radius:5px;width:28px}.cr-dot:hover:not(.active){border-color:#94a3b880}@media (width<=1024px){.cr-metrics-grid{grid-template-columns:repeat(2,1fr)}.cr-slide-kpi{font-size:24px}.cr-clock{font-size:20px}}@media (width<=767px){.cr-metrics-grid{grid-template-columns:1fr}.cr-header{flex-wrap:wrap;gap:8px;padding:10px 14px}.cr-title{font-size:13px}.cr-slide-kpi{font-size:20px}.cr-clock{font-size:16px}.cr-secondary-strip{flex-wrap:wrap;gap:8px}.cr-secondary-item{flex:0 0 calc(50% - 8px)}.controlroom-frame{border-radius:0;width:100vw;height:100vh}}.grid-overlay{z-index:15;pointer-events:none;padding:8px;position:absolute;inset:0}.grid-lines{pointer-events:none;grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(6,1fr);gap:8px;width:100%;height:100%;display:grid}.grid-cell{pointer-events:none;border-radius:10px;justify-content:center;align-items:center;min-height:0;transition:border-color .2s,background .2s,box-shadow .2s;display:flex;position:relative}.grid-view-mode .grid-cell{pointer-events:none;background:0 0;border:none}.grid-view-mode .grid-card-anchor{pointer-events:none}.grid-edit-mode .grid-cell{pointer-events:auto;background:#0f172a14;border:1px dashed #4755691f}.grid-edit-mode .grid-card-anchor{pointer-events:auto}.grid-edit-mode .grid-cell:hover{background:#0f172a26;border-color:#47556940}.grid-cell.grid-cell-drop-target{box-shadow:inset 0 0 20px #3b82f61a;border-color:var(--color-accent)!important;background:#3b82f614!important}.grid-cell.grid-cell-source{background:#ef444408!important;border-color:#ef444433!important}.grid-cell-label{color:#94a3b840;pointer-events:none;font-family:SF Mono,Consolas,monospace;font-size:7px;position:absolute;bottom:3px;right:5px}.grid-card-anchor{cursor:grab;transition:opacity .2s,transform .2s;position:absolute;inset:4px}.grid-card-anchor:active{cursor:grabbing}.grid-card-anchor.grid-card-dragging{opacity:.35;transform:scale(.95)}.grid-drag-grip{width:18px;height:18px;color:var(--color-text-muted);opacity:0;pointer-events:none;border-radius:3px;justify-content:center;align-items:center;font-size:12px;transition:opacity .15s;display:flex;position:absolute;top:5px;right:5px}.grid-card-anchor:hover .grid-drag-grip{opacity:.5}.grid-toolbar{z-index:27;pointer-events:auto;gap:6px;display:flex;position:absolute;bottom:12px;right:16px}.grid-toolbar-btn{color:var(--color-text-secondary);cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#1e293be6;border:1px solid #33415580;border-radius:8px;align-items:center;gap:4px;padding:6px 12px;font-size:11px;font-weight:500;transition:background .15s,color .15s,border-color .15s;display:inline-flex}.grid-toolbar-btn:hover{color:var(--color-text);background:#334155cc;border-color:#47556999}.grid-toolbar-edit{color:var(--color-accent);border-color:#3b82f640}.grid-toolbar-edit:hover{border-color:var(--color-accent);background:#2563eb26}.grid-toolbar-done{color:#22c55e;border-color:#22c55e40}.grid-toolbar-done:hover{background:#22c55e1a;border-color:#22c55e80}.grid-toolbar-close{color:#f87171}.grid-toolbar-close:hover{color:#fca5a5;background:#ef444426;border-color:#ef44444d}.grid-hint{color:var(--color-text-muted);pointer-events:none;z-index:27;background:#0f172ad9;border:1px solid #3341554d;border-radius:16px;padding:5px 16px;font-size:10px;animation:4s ease-in-out forwards gridHintFade;position:absolute;bottom:12px;left:50%;transform:translate(-50%)}@keyframes gridHintFade{0%{opacity:0;transform:translate(-50%)translateY(8px)}15%{opacity:1;transform:translate(-50%)translateY(0)}80%{opacity:1}to{opacity:0}}.grid-controlroom-float{z-index:26;color:var(--color-accent);cursor:pointer;pointer-events:auto;background:#1e293be6;border:1px solid #33415599;border-radius:20px;align-items:center;gap:5px;padding:7px 14px;font-size:11px;font-weight:600;transition:background .15s,border-color .15s;display:inline-flex;position:absolute;bottom:60px;right:16px}.grid-controlroom-float:hover{border-color:var(--color-accent);background:#2563eb26}.kpi-card-compact{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid #47556959;border-left:3px solid var(--kpi-color,#3b82f6);-webkit-user-select:none;user-select:none;background:#0f172ae6;border-radius:8px;flex-direction:column;justify-content:center;gap:1px;height:100%;padding:5px 8px;transition:border-color .2s,box-shadow .2s,transform .2s;display:flex;position:relative;overflow:hidden}.kpi-card-compact:hover{border-color:var(--kpi-color);box-shadow:0 0 16px color-mix(in srgb, var(--kpi-color,#3b82f6) 20%, transparent);transform:translateY(-1px)}.kpi-compact-glow{pointer-events:none;opacity:.6;position:absolute;inset:0}.kpi-compact-header{z-index:1;justify-content:space-between;align-items:baseline;gap:4px;display:flex;position:relative}.kpi-compact-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.6px;white-space:nowrap;text-overflow:ellipsis;font-size:8px;font-weight:700;overflow:hidden}.kpi-compact-trend{flex-shrink:0;font-size:8px;font-weight:700}.kpi-compact-value{white-space:nowrap;z-index:1;letter-spacing:-.3px;flex-shrink:0;font-size:18px;font-weight:800;line-height:1;position:relative}.kpi-compact-sub{color:var(--color-text-muted);z-index:1;font-size:7px;position:relative}.kpi-mini-bars{z-index:1;flex-direction:column;gap:2px;margin-top:2px;display:flex;position:relative}.kpi-mini-bar-item{flex-direction:column;gap:1px;display:flex}.kpi-mini-bar-track{background:#3341554d;border-radius:1px;height:2px;overflow:hidden}.kpi-mini-bar-fill{border-radius:1px;min-width:2px;height:100%;transition:width .6s cubic-bezier(.16,1,.3,1)}.kpi-mini-bar-row{justify-content:space-between;align-items:baseline;display:flex}.kpi-mini-bar-val{color:var(--color-text);font-size:8px;font-weight:700}.kpi-mini-bar-lbl{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.2px;font-size:6px}@media (width<=1200px){.grid-lines{gap:6px}.kpi-compact-value{font-size:15px}.kpi-compact-label{font-size:7px}}@media (width<=1023px){.grid-lines{grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(3,1fr)}.grid-hint{display:none}}@media (width<=767px){.grid-lines{grid-template-rows:repeat(12,1fr);grid-template-columns:repeat(2,1fr);gap:4px}.grid-cell-label{display:none}.grid-toolbar{bottom:56px;right:8px}.kpi-compact-value{font-size:13px}}.viewer-canvas{background:var(--color-bg);flex:1;position:relative;overflow:hidden}.viewer-canvas .forge-container{width:100%;height:100%;position:absolute;inset:0}.saved-views{z-index:30;flex-direction:column;gap:2px;min-width:110px;display:flex;position:absolute;top:12px;left:12px}.saved-view-btn{border:1px solid var(--color-border);color:var(--color-text-secondary);cursor:pointer;text-align:left;white-space:nowrap;text-overflow:ellipsis;background:#1e293be6;border-radius:6px;padding:5px 10px;font-size:10px;transition:background .15s,color .15s;display:block;overflow:hidden}.saved-view-btn:hover{background:var(--color-surface-hover);color:var(--color-text)}.saved-view-btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:1px}.saved-view-save{color:var(--color-accent);text-align:center;font-weight:600}.saved-view-title{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.5px;margin-top:4px;padding:2px 10px;font-size:9px}.viewer-fullscreen-btn{background:var(--color-surface);border:1px solid var(--color-border);width:36px;height:36px;color:var(--color-text-secondary);cursor:pointer;z-index:30;border-radius:8px;justify-content:center;align-items:center;transition:background .15s,color .15s;display:flex;position:absolute;bottom:12px;right:68px}.viewer-fullscreen-btn:hover{background:var(--color-surface-hover);color:var(--color-text)}.tool-mode-indicator{background:var(--color-accent);color:#fff;z-index:30;border-radius:20px;padding:6px 16px;font-size:12px;font-weight:600;animation:.15s ease-out toolModeIn;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}@keyframes toolModeIn{0%{opacity:0;transform:translate(-50%)translateY(8px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@media (prefers-reduced-motion:reduce){.tool-mode-indicator{animation:none}}.detail-panel{background:var(--color-surface);border-left:1px solid var(--color-border);flex-direction:column;flex-shrink:0;width:300px;animation:.2s ease-out detailSlideIn;display:flex;overflow:hidden}@keyframes detailSlideIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@media (prefers-reduced-motion:reduce){.detail-panel{animation:none}}.detail-header{border-bottom:1px solid var(--color-border);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 14px;display:flex}.detail-title{color:var(--color-text);text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:13px;font-weight:700;overflow:hidden}.detail-close{width:32px;height:32px;color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;transition:background .15s;display:flex}.detail-close:hover{background:var(--color-surface-hover);color:var(--color-text)}.detail-close:focus-visible{outline:2px solid var(--color-accent);outline-offset:1px}.detail-body{flex-direction:column;flex:1;gap:12px;padding:14px;display:flex;overflow-y:auto}.detail-status-badge{border-radius:4px;padding:4px 12px;font-size:11px;font-weight:700;display:inline-block}.status-critical{background:var(--color-danger-bg);color:var(--color-danger)}.status-warning{background:var(--color-warning-bg);color:var(--color-warning)}.status-info{background:var(--color-info-bg);color:var(--color-info)}.detail-field{flex-direction:column;gap:3px;display:flex}.detail-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:10px;font-weight:600}.detail-value{color:var(--color-text);font-size:13px;line-height:1.4}.detail-value-large{color:var(--color-danger);font-size:26px;font-weight:800}.detail-threshold{color:var(--color-text-muted);font-size:11px}.detail-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.detail-actions{gap:8px;margin-top:4px;display:flex}.detail-btn{cursor:pointer;text-align:center;border:none;border-radius:6px;flex:1;min-height:36px;padding:8px 12px;font-size:11px;font-weight:600;transition:background .15s}.detail-btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:1px}.detail-btn-primary{background:var(--color-accent);color:#fff}.detail-btn-primary:hover{background:var(--color-accent-hover)}.detail-btn-secondary{background:var(--color-surface-hover);color:var(--color-text);border:1px solid var(--color-border)}.detail-btn-secondary:hover{background:var(--color-border)}.detail-btn-danger{background:var(--color-danger);color:#fff}.detail-btn-danger:hover{background:#dc2626}.detail-cam-feed{aspect-ratio:16/10;background:#000;border-radius:6px;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.detail-cam-feed img{object-fit:cover;width:100%;height:100%}.detail-cam-overlay{color:var(--color-success);background:#000000b3;border-radius:4px;align-items:center;gap:6px;padding:3px 10px;font-size:10px;font-weight:600;display:flex;position:absolute;top:8px;left:8px}.detail-cam-offline{color:var(--color-text-muted);letter-spacing:1px;font-size:12px;font-weight:700}.detail-trend{background:var(--color-bg);border-radius:6px;flex-direction:column;gap:4px;padding:12px;display:flex}.detail-trend-bars{align-items:flex-end;gap:2px;height:40px;display:flex}.detail-trend-bar{background:var(--color-surface-hover);border-radius:1px;flex:1;min-height:4px}.detail-trend-bar.high{background:var(--color-warning)}.detail-trend-bar.critical{background:var(--color-danger)}.mobile-bottom-bar{display:none}@media (width<=767px){.mobile-bottom-bar{background:var(--color-surface);border-top:1px solid var(--color-border);flex-shrink:0;justify-content:space-around;align-items:center;height:48px;padding:0 8px;font-size:11px;font-weight:600;display:flex}.mobile-bottom-item{color:var(--color-text-secondary);cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;gap:4px;padding:8px 10px;display:flex}.mobile-bottom-item:active{background:var(--color-surface-hover)}.mobile-bottom-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.mobile-bottom-dot.critical{background:var(--color-danger)}.mobile-bottom-dot.warning{background:var(--color-warning)}.mobile-bottom-dot.info{background:var(--color-info)}.mobile-bottom-dot.success{background:var(--color-success)}}.viewer-page{background:var(--color-bg);flex-direction:column;height:100vh;display:flex;overflow:hidden}.viewer-body{flex:1;display:flex;position:relative;overflow:hidden}.viewer-error{height:100vh;color:var(--color-text-muted);flex-direction:column;justify-content:center;align-items:center;gap:16px;font-size:16px;display:flex}.viewer-error .btn{background:var(--color-accent);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:10px 20px;font-size:14px;font-weight:600}@media (width<=1023px){.attention-queue{width:260px}.detail-panel{width:280px}}@media (width<=767px){.viewer-body{flex-direction:column}.attention-queue-wrapper{width:100%;z-index:var(--z-modal);display:none;position:fixed;inset:44px 0 0}.attention-queue-wrapper.mobile-open{display:flex}.attention-queue-wrapper .attention-queue{width:100%}.detail-panel{width:100%;z-index:var(--z-modal);position:fixed;inset:44px 0 0}}
