:root{--bg-main: #0b0f19;--bg-card: #111827;--bg-sidebar: #070a12;--text-main: #f3f4f6;--text-muted: #9ca3af;--accent-blue: #38bdf8;--accent-purple: #c084fc;--accent-green: #34d399;--border-color: rgba(255, 255, 255, .05)}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,system-ui,-apple-system,sans-serif}body{background-color:var(--bg-main);color:var(--text-main);display:flex;height:100vh;overflow:hidden}#root{display:flex;width:100%;height:100vh}.sidebar{width:260px;background-color:var(--bg-sidebar);border-right:1px solid var(--border-color);padding:30px 20px;transition:width .2s ease,padding .2s ease;flex-shrink:0;display:flex;flex-direction:column;height:100vh;overflow-y:auto}.sidebar.collapsed{width:76px;padding:30px 14px}.sidebar-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:40px;gap:10px}.sidebar .brand{font-size:20px;font-weight:800;color:#fff;display:flex;align-items:center;gap:10px;overflow:hidden;white-space:nowrap}.sidebar .brand span:first-child{color:var(--accent-blue)}.sidebar.collapsed .brand-text{display:none}.menu-toggle{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:20px;line-height:1;padding:4px;transition:color .2s ease}.menu-toggle:hover{color:#fff}.sidebar ul{list-style:none}.sidebar ul li{padding:14px 16px;margin-bottom:6px;border-radius:10px;color:var(--text-muted);cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease}.sidebar ul li:not(.menu-group).active,.sidebar ul li:not(.menu-group):hover{background-color:#38bdf814;color:#fff}.sidebar ul li.menu-group{padding:0;cursor:default}.menu-group-label{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-radius:10px;cursor:pointer;transition:all .2s ease}.menu-group-label:hover{background-color:#38bdf814;color:#fff}.menu-chevron{font-size:10px;transition:transform .2s ease}.menu-chevron.open{transform:rotate(90deg)}.submenu{list-style:none}.sidebar ul li.menu-empty{color:#4b5563;font-style:italic;font-size:13px;cursor:default}.sidebar ul li.menu-empty:hover{background:none;color:#4b5563}.user-menu{position:relative;margin-top:auto;padding-top:16px;border-top:1px solid var(--border-color)}.user-card{display:flex;align-items:center;gap:12px}.sidebar.collapsed .user-card{justify-content:center}.user-card-btn{width:100%;background:none;border:1px solid transparent;border-radius:10px;padding:8px;cursor:pointer;text-align:left;transition:all .2s ease}.user-card-btn:hover,.user-card-btn.open{background-color:#ffffff0a;border-color:var(--border-color)}.user-card-caret{color:var(--text-muted);font-size:12px;flex-shrink:0;transition:transform .2s ease}.user-card-btn.open .user-card-caret{transform:rotate(180deg)}.user-menu-dropdown{position:absolute;bottom:calc(100% - 8px);left:0;right:0;margin-bottom:8px;background-color:var(--bg-card, #1e293b);border:1px solid var(--border-color);border-radius:10px;padding:6px;box-shadow:0 8px 24px #00000059;z-index:20}.user-menu-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;background:none;border:none;border-radius:8px;color:var(--text-main);font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.user-menu-item:hover{background-color:#ffffff0f}.user-menu-item.logout{color:var(--accent-red, #f87171)}.user-menu-item.logout:hover{background-color:#f871711f}.user-menu-item-icon{font-size:16px;line-height:1}.user-avatar{width:38px;height:38px;border-radius:50%;object-fit:cover;flex-shrink:0}.user-avatar-fallback{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--accent-blue),var(--accent-purple));color:#fff;font-size:14px;font-weight:700;letter-spacing:.5px}.user-info{display:flex;flex-direction:column;min-width:0;flex:1}.user-name{color:var(--text-main);font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-email{color:var(--text-muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-logout-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:18px;line-height:1;padding:6px;border-radius:8px;flex-shrink:0;transition:all .2s ease}.user-logout-btn:hover{color:var(--accent-red, #f87171);background-color:#f871711a}.user-login-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:12px;background-color:#38bdf814;border:1px solid var(--border-color);border-radius:10px;color:var(--text-main);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease}.user-login-btn:hover{background-color:#38bdf829;color:#fff}.user-login-icon{font-size:16px;color:var(--accent-blue)}.main-content{flex:1;padding:40px;overflow-y:auto}.filter-bar{background:var(--bg-card);padding:20px 30px;border-radius:16px;border:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;flex-wrap:wrap;gap:20px}.helper-text{font-size:11px;color:var(--text-muted);margin-top:-15px;margin-bottom:15px;display:block}.filters-group{display:flex;gap:20px;flex-wrap:wrap}.selector-wrapper label{font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;display:block;margin-bottom:6px}.vm-selector{padding:10px 18px;font-size:15px;border:1px solid var(--border-color);border-radius:10px;outline:none;cursor:pointer;color:#fff;font-weight:600;background-color:#1f2937}.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:25px;margin-bottom:30px}.card{background:var(--bg-card);padding:24px;border-radius:16px;border:1px solid var(--border-color);position:relative;overflow:hidden}.card:after{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--accent-blue)}.card.purple:after{background:var(--accent-purple)}.card.green:after{background:var(--accent-green)}.card h3{font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px}.card .value{font-size:32px;font-weight:700;color:#fff}.charts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:30px}.chart-container{background:var(--bg-card);padding:26px;border-radius:16px;border:1px solid var(--border-color)}.chart-container h3{font-size:14px;font-weight:600;color:#fff;margin-bottom:20px;letter-spacing:.3px}.wide-chart{grid-column:span 2}@media (max-width: 1150px){.wide-chart{grid-column:span 1}}.fleet-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 18px;font-size:13px;color:var(--text-muted)}.fleet-status-item strong{color:#fff;font-weight:800}.fleet-status-item.crit{color:#f87171;font-weight:600}.fleet-status-item.ok{color:var(--accent-green);font-weight:600}.fleet-status-sep{color:var(--border-color)}.heatmap-grid{display:grid;gap:4px}.hm-cell{border-radius:10px;padding:9px 10px;min-height:74px;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;gap:6px;overflow:hidden;border:none;text-align:left;color:inherit;font:inherit;transition:transform .15s ease,box-shadow .15s ease}.hm-cell:hover{transform:translateY(-2px);box-shadow:0 6px 18px #0006;outline:2px solid rgba(255,255,255,.55)}.hm-top{display:flex;flex-direction:column;gap:1px;min-width:0}.hm-host{font-size:11px;font-weight:700;color:#fffffff5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hm-metric{font-size:9.5px;font-weight:600;letter-spacing:.6px;color:#ffffffc7;text-transform:uppercase}.hm-val{font-size:22px;font-weight:800;color:#fff;line-height:1}.hm-green{background:#10b981}.hm-blue{background:#008ed0}.hm-amber{background:#f59e0b}.hm-red{background:#ef4444}.hm-na{background:#374151}.refresh-btn{padding:10px 18px;font-size:14px;font-weight:600;color:#fff;cursor:pointer;background-color:#38bdf81f;border:1px solid rgba(56,189,248,.3);border-radius:10px;display:inline-flex;align-items:center;gap:8px;transition:all .2s ease;white-space:nowrap}.refresh-btn:hover{background-color:#38bdf838}.refresh-btn:disabled{opacity:.5;cursor:not-allowed}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:25px;margin-bottom:30px}.summary-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:16px;padding:24px;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden}.summary-card:after{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--accent-blue);transition:background .3s ease}.summary-card.purple:after{background:var(--accent-purple)}.summary-card.amber:after{background:#f59e0b}.summary-card:hover{border-color:#38bdf859;transform:translateY(-3px);box-shadow:0 8px 28px #0000004d}.summary-card.critical{border-color:#f8717180;box-shadow:0 0 24px #f871711f}.summary-card.critical:after{background:#f87171}.summary-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:120px;text-align:center;color:var(--text-muted);font-size:14px}.summary-empty-title{font-weight:600;color:var(--text-main)}.summary-empty-detail{font-size:12px;color:var(--text-muted);word-break:break-word}.summary-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.summary-title{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:#fff}.summary-title .ic{font-size:18px}.summary-go{font-size:12px;color:var(--text-muted);transition:color .2s ease}.summary-card:hover .summary-go{color:var(--accent-blue)}.summary-main{display:flex;align-items:baseline;gap:10px;margin-bottom:16px}.summary-main .big{font-size:38px;font-weight:800;color:#fff;line-height:1}.summary-main .big.danger{color:#f87171}.summary-main .big.ok{color:var(--accent-green)}.summary-main .unit{font-size:13px;color:var(--text-muted)}.summary-stats{display:flex;gap:22px;flex-wrap:wrap}.summary-stat .num{font-size:18px;font-weight:700;color:var(--text-main)}.summary-stat .num.red{color:#f87171}.summary-stat .num.amber{color:#f59e0b}.summary-stat .num.green{color:var(--accent-green)}.summary-stat .lbl{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.4px;margin-top:3px}.summary-foot{margin-top:16px;padding-top:14px;border-top:1px solid var(--border-color);font-size:12px;color:var(--text-muted);display:flex;align-items:center;gap:8px}.mini-pill{padding:3px 9px;border-radius:20px;font-size:11px;font-weight:700}.mini-ok{background:#34d3991f;color:var(--accent-green)}.mini-warn{background:#f59e0b1f;color:#f59e0b}.mini-crit{background:#f8717124;color:#f87171}.billing-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#34d3991a;border:1px solid rgba(52,211,153,.3);color:var(--accent-green);padding:12px 18px;border-radius:12px;font-size:13px;font-weight:500;margin-bottom:20px}.billing-banner-close{background:none;border:none;color:var(--accent-green);cursor:pointer;font-size:13px;opacity:.7;transition:opacity .2s ease}.billing-banner-close:hover{opacity:1}.billing-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:20px}.billing-search{display:flex;align-items:center;gap:12px;flex:1;min-width:280px}.billing-search input{flex:1;max-width:360px;padding:11px 16px;font-size:14px;color:#fff;background:var(--bg-card);border:1px solid var(--border-color);border-radius:10px;outline:none}.billing-search input::placeholder{color:var(--text-muted)}.billing-search input:focus{border-color:#38bdf866}.billing-source{font-size:12px;color:var(--text-muted);display:flex;align-items:center;gap:8px;white-space:nowrap}.billing-source-pill{padding:5px 12px;border-radius:8px;background:#38bdf81a;color:var(--accent-blue);font-weight:700;font-size:11px;letter-spacing:.4px}.date-range{display:flex;align-items:center;gap:8px}.date-input{padding:9px 12px;font-size:14px;color:#fff;background-color:#1f2937;border:1px solid var(--border-color);border-radius:10px;outline:none;cursor:pointer;font-weight:600;color-scheme:dark}.date-input:focus{border-color:#38bdf866}.date-range-sep{color:var(--text-muted);font-size:14px}.period-badge{padding:9px 16px;border-radius:10px;background:#1f2937;border:1px solid var(--border-color);color:#fff;font-size:13px;font-weight:600;letter-spacing:.5px;white-space:nowrap}.card .value.sm{font-size:24px}.card .value.danger{color:#f87171}.card-sub{margin-top:8px;font-size:12px;color:var(--text-muted)}.card-sub.up{color:var(--accent-green);font-weight:600}.cost-bar-list{display:flex;flex-direction:column;gap:18px}.cost-bar-row{display:grid;grid-template-columns:180px 1fr 80px;align-items:center;gap:16px}.cost-bar-name{font-size:13px;font-weight:600;color:var(--text-main);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cost-bar-track{height:8px;border-radius:6px;background:#ffffff0f;overflow:hidden}.cost-bar-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,#6366f1,var(--accent-blue));transition:width .4s ease}.cost-bar-value{font-size:14px;font-weight:700;color:#fff;text-align:right;white-space:nowrap}.cost-proj-group{border-bottom:1px solid var(--border-color);padding-bottom:12px}.cost-proj-group:last-child{border-bottom:none;padding-bottom:0}.cost-proj-row{width:100%;border:none;background:none;cursor:pointer;font:inherit;color:inherit;text-align:left;padding:6px 0;border-radius:8px;transition:background .15s ease}.cost-proj-row:hover{background:#38bdf80d}.cost-proj-chevron{display:inline-block;margin-right:8px;color:var(--text-muted);font-size:11px;transition:transform .2s ease}.cost-proj-row.open .cost-proj-chevron{transform:rotate(90deg)}.cost-sub-list{display:flex;flex-direction:column;gap:12px;margin:12px 0 4px 22px;padding-left:14px;border-left:2px solid var(--border-color)}.cost-sub-row .cost-bar-name{font-size:12px;font-weight:500;color:var(--text-muted)}.cost-sub-row .cost-bar-value{font-size:13px;font-weight:600;color:var(--text-main)}.cost-bar-fill.alt{background:linear-gradient(90deg,#a855f7,#c084fc)}@media (max-width: 700px){.cost-bar-row{grid-template-columns:120px 1fr 70px;gap:10px}}.placeholder{background:var(--bg-card);border:1px dashed var(--border-color);border-radius:16px;padding:60px 30px;text-align:center;color:var(--text-muted)}.placeholder h2{color:#fff;margin-bottom:8px}.card.red:after{background:#f87171}.card.amber:after{background:#f59e0b}.error-stream-wrapper{max-height:480px;overflow-y:scroll;border-radius:12px;scrollbar-width:auto;scrollbar-color:var(--accent-blue) rgba(255,255,255,.08)}.error-stream-wrapper::-webkit-scrollbar{width:14px}.error-stream-wrapper::-webkit-scrollbar-track{background:#ffffff0f;border-radius:8px}.error-stream-wrapper::-webkit-scrollbar-thumb{background:#38bdf8b3;border-radius:8px;border:3px solid var(--bg-card)}.error-stream-wrapper::-webkit-scrollbar-thumb:hover{background:var(--accent-blue)}table.error-stream{width:100%;border-collapse:collapse;font-size:13px}table.error-stream thead th{position:sticky;top:0;background:var(--bg-card);text-align:left;padding:12px 16px;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);border-bottom:1px solid var(--border-color);z-index:1}table.error-stream tbody td{padding:14px 16px;border-bottom:1px solid var(--border-color);vertical-align:top}table.error-stream tbody tr{transition:background .15s ease}table.error-stream tbody tr:hover{background:#38bdf80a}.proj-chip{display:inline-block;padding:3px 9px;border-radius:7px;background:#c084fc1a;color:var(--accent-purple);font-size:12px;font-weight:600}.sa-name{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--text-main);font-size:13px}.sa-email{font-family:SFMono-Regular,Consolas,monospace;font-size:11px;color:var(--text-muted);margin-top:3px}.role-chips{display:flex;flex-wrap:wrap;gap:6px;max-width:360px}.role-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:7px;font-family:SFMono-Regular,Consolas,monospace;font-size:11px;font-weight:600;border:1px solid transparent}.role-chip .role-dot{width:6px;height:6px;border-radius:50%;background:currentColor}.role-used{background:#34d3991a;color:var(--accent-green);border-color:#34d39940}.role-unused{background:#f871711a;color:#f87171;border-color:#f871714d;text-decoration:line-through}.role-replace{background:#38bdf81a;color:var(--accent-blue);border-color:#38bdf84d}.rec-none{color:var(--text-muted);font-size:12px;font-style:italic}.rec-list{display:flex;flex-direction:column;gap:6px;max-width:320px}.rec-item{display:flex;flex-direction:column;gap:3px}.rec-subtype{align-self:flex-start;padding:2px 8px;border-radius:6px;background:#f59e0b1f;color:#f59e0b;font-size:10px;font-weight:700;letter-spacing:.3px;text-transform:uppercase}.rec-desc{font-size:12px;color:var(--text-muted);line-height:1.4}.usage-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.3px;white-space:nowrap}.usage-active{background:#34d3991f;color:var(--accent-green)}.usage-partial{background:#f59e0b1f;color:#f59e0b}.usage-stale{background:#f8717124;color:#f87171}.usage-info{background:#38bdf81f;color:var(--accent-blue)}.tab-bar{display:flex;gap:8px;margin-bottom:30px;border-bottom:1px solid var(--border-color)}.tab-bar .tab{background:none;border:none;border-bottom:2px solid transparent;color:var(--text-muted);cursor:pointer;font-size:14px;font-weight:600;padding:12px 18px;margin-bottom:-1px;transition:color .2s ease,border-color .2s ease}.tab-bar .tab:hover{color:#fff}.tab-bar .tab.active{color:var(--accent-blue);border-bottom-color:var(--accent-blue)}.last-used{font-size:13px;color:var(--text-main)}.last-used .ago{font-size:11px;color:var(--text-muted);display:block;margin-top:2px}.last-used.warn{color:#f59e0b}.last-used.danger{color:#f87171}.stream-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:12px}.live-badge{display:inline-flex;align-items:center;gap:7px;padding:4px 11px;border-radius:20px;background:#f871711f;color:#f87171;font-size:11px;font-weight:700;letter-spacing:.5px}.live-dot{width:8px;height:8px;border-radius:50%;background:#f87171;animation:live-pulse 1.4s ease-in-out infinite}@keyframes live-pulse{0%,to{opacity:1;box-shadow:0 0 #f8717180}50%{opacity:.5;box-shadow:0 0 0 5px #f8717100}}.audit-actor{font-family:SFMono-Regular,Consolas,monospace;font-size:12px;font-weight:600;color:var(--accent-green)}.audit-method{font-family:SFMono-Regular,Consolas,monospace;font-size:12px;color:var(--accent-blue)}.audit-resource{font-size:13px;font-weight:600;color:var(--text-main)}.threshold-panel{background:var(--bg-card);border:1px solid var(--border-color);border-radius:16px;padding:26px 30px;margin-bottom:30px;display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;transition:all .3s ease;position:relative;overflow:hidden}.threshold-panel:before{content:"";position:absolute;left:0;top:0;width:5px;height:100%;background:var(--accent-green);transition:background .3s ease}.threshold-panel.critical{border-color:#f8717180;background:linear-gradient(90deg,rgba(248,113,113,.06),var(--bg-card) 60%);animation:crit-pulse 1.6s infinite}.threshold-panel.critical:before{background:#f87171}@keyframes crit-pulse{0%,to{box-shadow:0 0 25px #f871711f}50%{box-shadow:0 0 40px #f871714d}}.threshold-counter{display:flex;align-items:center;gap:22px}.threshold-gauge{font-size:56px;font-weight:800;line-height:1;color:var(--accent-green);transition:color .3s ease}.threshold-panel.critical .threshold-gauge{color:#f87171}.threshold-meta h3{font-size:13px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}.threshold-meta .sub{font-size:13px;color:var(--text-muted)}.threshold-meta .limit-txt{color:#fff;font-weight:600}.threshold-status{display:inline-flex;align-items:center;gap:10px;padding:12px 22px;border-radius:30px;font-weight:800;font-size:15px;letter-spacing:.5px}.ts-ok{background:#34d3991f;color:var(--accent-green)}.ts-crit{background:#f8717126;color:#f87171}.ts-dot{width:12px;height:12px;border-radius:50%;background:currentColor}.threshold-panel.critical .ts-dot{animation:live-pulse 1.2s infinite}.sql-text{font-family:SFMono-Regular,Consolas,monospace;font-size:12px;color:var(--text-main);max-width:440px;word-break:break-word;line-height:1.5}.db-engine{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:7px;font-size:11px;font-weight:700;white-space:nowrap}.eng-postgres{background:#3884de26;color:#6ab0ff}.eng-mysql{background:#f59e0b24;color:#f59e0b}.svc-chip{display:inline-block;padding:3px 9px;border-radius:7px;background:#38bdf81a;color:var(--accent-blue);font-size:12px;font-weight:600;font-family:SFMono-Regular,Consolas,monospace;white-space:nowrap}.dur-val{font-family:SFMono-Regular,Consolas,monospace;font-weight:700}.dur-slow{color:#f87171}.dur-mid{color:#f59e0b}.dur-ok{color:var(--accent-green)}.freq-val{font-family:SFMono-Regular,Consolas,monospace;color:var(--text-main);font-weight:600}.freq-bar{display:block;height:5px;border-radius:4px;background:#38bdf880;margin-top:5px}.log-line{font-family:SFMono-Regular,Consolas,monospace;font-size:12.5px;color:var(--text-main);max-width:460px;word-break:break-word}.trace-id{font-family:SFMono-Regular,Consolas,monospace;font-size:11px;color:var(--accent-blue);background:#38bdf814;padding:3px 8px;border-radius:6px;white-space:nowrap}