@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";
:root{--v-black:#0a0a0a;--v-dark:#111;--v-dark-2:#1a1a1a;--v-dark-3:#2a2a2a;--v-dark-4:#333;--v-gray:#a0a0a0;--v-gray-light:#d0d0d0;--v-white:#f5f5f5;--v-cyan:#00d4ff;--v-cyan-muted:#00a8cc;--v-cyan-bg:#00d4ff14;--v-orange:#f5851f;--v-orange-muted:#d4731a;--v-orange-bg:#f5851f14;--v-success:#22c55e;--v-warning:#f59e0b;--v-danger:#ef4444;--v-info:#00d4ff;--v-success-bg:#22c55e14;--v-danger-bg:#ef444414;--font-family:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-xs:.6875rem;--font-sm:.75rem;--font-base:.8125rem;--font-md:.875rem;--font-lg:1rem;--font-xl:1.25rem;--font-2xl:1.5rem;--font-3xl:2rem;--font-4xl:3rem;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--sidebar-width:240px;--header-height:56px;--radius:6px;--radius-lg:10px;--navbar-bg:#0a0a0acc;--navbar-link:#d0d0d0;--border-color:#2e2e2e;--border:1px solid var(--border-color)}html[data-theme=light]{--v-black:#f7f8fa;--v-dark:#fafafa;--v-dark-2:#fff;--v-dark-3:#e7e7e7;--v-dark-4:#d0d0d0;--v-white:#111;--v-gray:#5a5a5a;--v-gray-light:#707070;--border-color:#e7e7e7;--navbar-bg:#ffffffd9;--navbar-link:#444}body,header,footer,section,table,td,th,tr,input,textarea,select,.app-main,.sidebar,.card,div{transition:background-color .3s,border-color .3s,color .3s,box-shadow .3s}.logo-dark-theme{display:block!important}.logo-light-theme,html[data-theme=light] .logo-dark-theme{display:none!important}html[data-theme=light] .logo-light-theme{display:block!important}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font-family);background:var(--v-black);color:var(--v-white);line-height:1.5}a{color:inherit;text-decoration:none}button{font-family:var(--font-family);cursor:pointer;color:inherit;background:0 0;border:none}.app-layout{min-height:100vh;display:flex}.app-main{margin-left:var(--sidebar-width);flex-direction:column;flex:1;display:flex}.app-content{padding:var(--space-6);flex:1}.sidebar{width:var(--sidebar-width);background:var(--v-dark);border-right:var(--border);z-index:100;flex-direction:column;height:100vh;display:flex;position:fixed;top:0;left:0}.sidebar-logo{padding:var(--space-5) var(--space-5);border-bottom:var(--border);align-items:center;gap:var(--space-3);height:var(--header-height);display:flex}.sidebar-logo img{width:auto;height:32px}.sidebar-nav{padding:var(--space-3) var(--space-2);flex:1;overflow-y:auto}.sidebar-section-label{font-size:var(--font-xs);color:var(--v-gray);text-transform:uppercase;letter-spacing:.08em;padding:var(--space-4) var(--space-3) var(--space-2);font-weight:600}.sidebar-item{align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius);font-size:var(--font-base);color:var(--v-gray-light);margin-bottom:1px;font-weight:400;transition:background .15s,color .15s;display:flex}.sidebar-item:hover{background:var(--v-dark-2);color:var(--v-white)}.sidebar-item.active{background:var(--v-cyan-bg);color:var(--v-cyan);font-weight:500}.sidebar-item.active .sidebar-icon{color:var(--v-cyan)}.sidebar-icon{width:18px;height:18px;color:var(--v-gray);flex-shrink:0}.sidebar-badge{background:var(--v-orange-bg);color:var(--v-orange);font-size:var(--font-xs);border-radius:10px;margin-left:auto;padding:1px 6px;font-weight:600}.sidebar-footer{padding:var(--space-4);border-top:var(--border)}.sidebar-user{align-items:center;gap:var(--space-3);padding:var(--space-2);border-radius:var(--radius);display:flex}.sidebar-user:hover{background:var(--v-dark-2)}.sidebar-avatar{background:var(--v-dark-3);width:32px;height:32px;font-size:var(--font-sm);color:var(--v-cyan);border:1px solid var(--v-dark-4);border-radius:50%;justify-content:center;align-items:center;font-weight:600;display:flex}.sidebar-user-name{font-size:var(--font-base);color:var(--v-white);font-weight:500}.sidebar-user-role{font-size:var(--font-xs);color:var(--v-gray)}.header{height:var(--header-height);border-bottom:var(--border);padding:0 var(--space-6);background:var(--v-dark);justify-content:space-between;align-items:center;display:flex}.header-title{font-size:var(--font-lg);color:var(--v-white);font-weight:600}.header-subtitle{font-size:var(--font-sm);color:var(--v-gray);margin-left:var(--space-3);font-weight:400}.header-actions{align-items:center;gap:var(--space-3);display:flex}.stats-grid{gap:var(--space-4);margin-bottom:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));display:grid}.stat-card{background:var(--v-dark);border:var(--border);border-radius:var(--radius-lg);padding:var(--space-5)}.stat-card-label{font-size:var(--font-sm);color:var(--v-gray);text-transform:uppercase;letter-spacing:.04em;margin-bottom:var(--space-2);font-weight:500}.stat-card-value{font-size:var(--font-2xl);color:var(--v-white);letter-spacing:-.02em;font-weight:700}.stat-card-change{font-size:var(--font-xs);margin-top:var(--space-2);align-items:center;gap:4px;font-weight:500;display:flex}.stat-card-change.positive{color:var(--v-success)}.stat-card-change.negative{color:var(--v-danger)}.stat-card-indicator{border-radius:2px;width:3px;height:100%;min-height:60px;position:absolute;top:0;left:0}.stat-card--cyan .stat-card-value{color:var(--v-cyan)}.stat-card--orange .stat-card-value{color:var(--v-orange)}.stat-card--success .stat-card-value{color:var(--v-success)}.panel{background:var(--v-dark);border:var(--border);border-radius:var(--radius-lg);overflow:hidden}.panel-header{padding:var(--space-4) var(--space-5);border-bottom:var(--border);justify-content:space-between;align-items:center;display:flex}.panel-title{font-size:var(--font-md);color:var(--v-white);font-weight:600}.table{border-collapse:collapse;width:100%}.table th{font-size:var(--font-xs);color:var(--v-gray);text-transform:uppercase;letter-spacing:.06em;text-align:left;padding:var(--space-3) var(--space-5);border-bottom:var(--border);font-weight:600}.table td{font-size:var(--font-base);padding:var(--space-3) var(--space-5);color:var(--v-gray-light);border-bottom:1px solid #ffffff0a}.table tr:last-child td{border-bottom:none}.table tr:hover td{background:#ffffff05}.badge{font-size:var(--font-xs);border-radius:4px;align-items:center;gap:4px;padding:2px 8px;font-weight:500;display:inline-flex}.badge--cyan{background:var(--v-cyan-bg);color:var(--v-cyan)}.badge--orange{background:var(--v-orange-bg);color:var(--v-orange)}.badge--success{background:var(--v-success-bg);color:var(--v-success)}.badge--danger{background:var(--v-danger-bg);color:var(--v-danger)}.badge-dot{background:currentColor;border-radius:50%;width:5px;height:5px}.btn{align-items:center;gap:var(--space-2);font-size:var(--font-base);padding:var(--space-2) var(--space-4);border-radius:var(--radius);font-weight:500;transition:background .15s,opacity .15s;display:inline-flex}.btn-primary{background:var(--v-cyan);color:var(--v-black)}.btn-primary:hover{opacity:.9}.btn-secondary{background:var(--v-dark-3);color:var(--v-white);border:var(--border)}.btn-secondary:hover{background:var(--v-dark-4)}.btn-sm{font-size:var(--font-sm);padding:var(--space-1) var(--space-3)}.grid-2{gap:var(--space-4);grid-template-columns:1fr 1fr;display:grid}.grid-3{gap:var(--space-4);grid-template-columns:2fr 1fr;display:grid}.pipeline-bar{height:6px;margin-top:var(--space-3);border-radius:3px;gap:2px;display:flex;overflow:hidden}.pipeline-segment{border-radius:3px;height:100%}.pipeline-legend{gap:var(--space-4);margin-top:var(--space-3);flex-wrap:wrap;display:flex}.pipeline-legend-item{align-items:center;gap:var(--space-2);font-size:var(--font-xs);color:var(--v-gray-light);display:flex}.pipeline-legend-dot{border-radius:2px;width:8px;height:8px}.pipeline-legend-count{color:var(--v-white);font-weight:600}.chart-bars{align-items:flex-end;gap:var(--space-3);height:160px;padding-top:var(--space-4);display:flex}.chart-bar-col{align-items:center;gap:var(--space-2);flex-direction:column;flex:1;justify-content:flex-end;height:100%;display:flex}.chart-bar{background:var(--v-cyan);opacity:.7;border-radius:3px 3px 0 0;width:100%;max-width:40px;transition:opacity .15s}.chart-bar:hover{opacity:1}.chart-bar-label{font-size:var(--font-xs);color:var(--v-gray)}.chart-bar-value{font-size:var(--font-xs);color:var(--v-white);font-weight:600}.modal-overlay{z-index:200;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--v-dark);border:var(--border);border-radius:var(--radius-lg);width:100%;max-width:520px;max-height:90vh;overflow-y:auto}.modal-header{padding:var(--space-5);border-bottom:var(--border);justify-content:space-between;align-items:center;display:flex}.modal-title{font-size:var(--font-lg);color:var(--v-white);font-weight:600}.modal-close{padding:var(--space-1);border-radius:var(--radius);color:var(--v-gray)}.modal-close:hover{background:var(--v-dark-2);color:var(--v-white)}.modal-body{padding:var(--space-5);gap:var(--space-4);flex-direction:column;display:flex}.modal-footer{justify-content:flex-end;gap:var(--space-3);padding:var(--space-4) var(--space-5);border-top:var(--border);display:flex}.form-group{gap:var(--space-1);flex-direction:column;display:flex}.form-label{font-size:var(--font-sm);color:var(--v-gray-light);font-weight:500}.form-input{font-family:var(--font-family);font-size:var(--font-base);color:var(--v-white);background:var(--v-dark-2);border:1px solid var(--v-dark-4);border-radius:var(--radius);padding:var(--space-2) var(--space-3);outline:none;transition:border-color .15s}.form-input:focus{border-color:var(--v-cyan)}.form-input::placeholder{color:var(--v-gray)}.form-textarea{resize:vertical;min-height:80px}.form-row{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}select.form-input{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;padding-right:30px}select.form-input option{background:var(--v-dark);color:var(--v-white)}.btn:disabled{opacity:.4;cursor:not-allowed}.page-placeholder{min-height:400px;color:var(--v-gray);flex-direction:column;justify-content:center;align-items:center;display:flex}.page-placeholder-icon{width:48px;height:48px;margin-bottom:var(--space-4);opacity:.3}.page-placeholder-title{font-size:var(--font-xl);color:var(--v-white);margin-bottom:var(--space-2);font-weight:600}.page-placeholder-text{font-size:var(--font-md);color:var(--v-gray);text-align:center;max-width:400px}.empty-state{padding:var(--space-10);color:var(--v-gray);flex-direction:column;justify-content:center;align-items:center;display:flex}.empty-state-text{font-size:var(--font-md);margin-top:var(--space-3)}@media (max-width:768px){.sidebar{display:none}.app-main{margin-left:0}.stats-grid{grid-template-columns:repeat(2,1fr)}.grid-2,.grid-3,.form-row{grid-template-columns:1fr}.modal{margin:var(--space-4)}}.custom-hotspot{border:2px solid var(--v-cyan);cursor:pointer;background-color:#00d4ff33;border-radius:50%;width:26px;height:26px;transition:all .2s;position:relative;box-shadow:0 0 10px #00d4ff80}.custom-hotspot:hover{background-color:#00d4ff99;transform:scale(1.2);box-shadow:0 0 15px #00d4ff}.custom-hotspot:after{content:attr(data-text);color:var(--v-white);white-space:nowrap;pointer-events:none;opacity:0;border:1px solid var(--v-border);background:#000c;border-radius:4px;padding:4px 8px;font-size:12px;font-weight:500;transition:opacity .2s;position:absolute;top:30px;left:50%;transform:translate(-50%)}.custom-hotspot:hover:after{opacity:1}@media (max-width:1024px){:root{--sidebar-width:200px}}@media (max-width:768px){:root{--sidebar-width:240px}.app-main{margin-left:0}.sidebar{transition:transform .3s;transform:translate(-100%);box-shadow:0 0 20px #00000080}.sidebar.open{transform:translate(0)}.app-content{padding:var(--space-4)}.metrics-grid{gap:var(--space-3);grid-template-columns:1fr 1fr}.table-responsive{-webkit-overflow-scrolling:touch;width:100%;margin-bottom:var(--space-4);background:var(--v-dark);border-radius:var(--radius);border:var(--border);overflow-x:auto}.table-responsive table{border:none;min-width:800px}.header{align-items:flex-start;gap:var(--space-3);padding:var(--space-4);flex-direction:column;height:auto}.header-actions{justify-content:flex-start;width:100%}form[style*=grid]{grid-template-columns:1fr!important}.form-group[style*=grid-column]{grid-column:span 1!important}}@media (max-width:480px){.metrics-grid{grid-template-columns:1fr}}.mobile-header{background:var(--v-dark);border-bottom:var(--border);padding:var(--space-3) var(--space-4);height:var(--header-height);z-index:90;justify-content:space-between;align-items:center;display:none;position:sticky;top:0}.mobile-menu-btn{color:var(--v-white);padding:var(--space-2);font-size:1.5rem}.sidebar-overlay{z-index:95;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;background:#000000b3;transition:opacity .3s;display:none;position:fixed;inset:0}.sidebar-overlay.open{opacity:1;display:block}@media (max-width:768px){.mobile-header{display:flex}}@supports (padding:env(safe-area-inset-top)){.mobile-header{padding-top:calc(var(--space-3) + env(safe-area-inset-top))}.app-content{padding-bottom:calc(var(--space-6) + env(safe-area-inset-bottom))}}@media (max-width:768px){.sidebar-item{min-height:48px;padding:var(--space-3) var(--space-4);font-size:var(--font-md)}.btn,.btn-primary,.btn-secondary,.btn-outline{min-height:48px;padding:var(--space-3) var(--space-5);font-size:var(--font-md)}.btn-sm{min-height:44px;padding:var(--space-2) var(--space-4)}.form-input,.form-select,select,input[type=text],input[type=email],input[type=password],input[type=number],input[type=tel],input[type=url],textarea{min-height:48px;padding:var(--space-3) var(--space-4);font-size:16px!important}.mobile-menu-btn{justify-content:center;align-items:center;min-width:48px;min-height:48px;display:flex}}.bottom-nav{display:none}@media (max-width:768px){.bottom-nav{-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--border-color);z-index:100;padding:var(--space-2) 0;padding-bottom:calc(var(--space-2) + env(safe-area-inset-bottom,0px));background:#111111f2;justify-content:space-around;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0}.bottom-nav-item{padding:var(--space-1) var(--space-2);color:var(--v-gray);-webkit-tap-highlight-color:transparent;flex-direction:column;justify-content:center;align-items:center;gap:2px;min-width:56px;min-height:48px;font-size:.625rem;font-weight:500;text-decoration:none;transition:color .2s;display:flex}.bottom-nav-item.active{color:var(--v-cyan)}.bottom-nav-icon{width:22px;height:22px}.bottom-nav-label{white-space:nowrap}.app-content{padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))}}@keyframes skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg, var(--v-dark-3) 25%, var(--v-dark-4) 50%, var(--v-dark-3) 75%);border-radius:var(--radius);background-size:200% 100%;animation:1.8s ease-in-out infinite skeleton-shimmer}.skeleton-text{border-radius:4px;height:14px;margin-bottom:8px}.skeleton-text.short{width:40%}.skeleton-text.medium{width:65%}.skeleton-text.long{width:90%}.skeleton-card{border-radius:var(--radius-lg);height:100px}.skeleton-avatar{border-radius:50%;width:40px;height:40px}.skeleton-row{gap:var(--space-4);padding:var(--space-4);border-bottom:var(--border);align-items:center;display:flex}.skeleton-table{flex-direction:column;display:flex}.skeleton-metric{border-radius:var(--radius-lg);height:90px}.skeleton-metrics-grid{gap:var(--space-4);margin-bottom:var(--space-6);grid-template-columns:repeat(4,1fr);display:grid}@media (max-width:768px){.skeleton-metrics-grid{grid-template-columns:1fr 1fr}}@media (max-width:480px){.skeleton-metrics-grid{grid-template-columns:1fr}}