.layout{display:flex;flex-direction:column;min-height:100vh;background-color:var(--bg-main)}.header{height:var(--header-height);background:var(--bg-header);-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 32px;position:sticky;top:0;z-index:1001}.header-left{display:flex;align-items:center;gap:20px}.logo{display:flex;align-items:center;gap:12px;font-weight:800;font-size:22px;color:var(--text-main)}.logo-icon{color:var(--primary);filter:drop-shadow(0 0 8px var(--primary-glow));animation:logo-pulse 4s infinite ease-in-out}@keyframes logo-pulse{0%,to{transform:scale(1);filter:drop-shadow(0 0 6px var(--primary-glow))}50%{transform:scale(1.06);filter:drop-shadow(0 0 14px rgba(59,130,246,.4))}}.header-right{display:flex;align-items:center;gap:24px}.user-info{display:flex;flex-direction:column;align-items:flex-end}.user-name{font-weight:600;font-size:14px;color:var(--text-main)}.user-role{font-size:10px;color:var(--text-dim);background:var(--border);border:none;margin-top:2px}.btn-logout{background:var(--border);color:var(--text-muted);display:flex;align-items:center;padding:10px;border-radius:10px;transition:var(--transition-smooth)}.btn-logout:hover{background:var(--status-offline-glow);color:var(--status-offline)}.main-wrapper{display:flex;flex:1;position:relative;min-height:calc(100vh - var(--header-height))}.sidebar{width:var(--sidebar-width);background:var(--bg-sidebar);border-right:1px solid var(--border);padding:32px 16px;position:sticky;top:var(--header-height);height:calc(100vh - var(--header-height));overflow-y:auto}.nav{display:flex;flex-direction:column;gap:8px}.nav-item{display:flex;align-items:center;gap:14px;padding:14px 20px;color:var(--text-muted);font-weight:600;font-size:15px;border-left:3px solid transparent;transition:var(--transition-smooth)}.nav-item:hover{background:transparent;color:var(--text-main);transform:translate(4px)}.nav-item.active{background:#3b82f60d;color:#fff;border-left:3px solid var(--primary);box-shadow:none}.content{flex:1;background:var(--bg-main);position:relative}.content:before{content:"";position:fixed;top:-10%;right:-5%;width:400px;height:400px;background:var(--primary-glow);filter:blur(120px);border-radius:50%;z-index:0;pointer-events:none}.sidebar-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0a0b1099;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:999}.mobile-toggle{display:none;background:none;border:none;color:var(--text-main);cursor:pointer;padding:8px;transition:var(--transition-smooth);border-radius:8px}.mobile-toggle:hover{background:var(--border)}@media (max-width: 768px){.header{padding:0 16px}.header-right{gap:12px}.sidebar{position:fixed;left:0;z-index:1000;transform:translate(-100%);transition:transform .4s cubic-bezier(.4,0,.2,1);background:var(--bg-sidebar);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.sidebar.open{transform:translate(0)}.mobile-toggle{display:flex;align-items:center;justify-content:center}}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at center,var(--bg-card) 0%,var(--bg-main) 100%);padding:20px}.login-card{width:100%;max-width:400px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:40px;box-shadow:var(--shadow-card)}.login-header{text-align:center;margin-bottom:32px}.login-logo{color:var(--primary);margin-bottom:16px}.login-header h1{font-size:28px;font-weight:800;color:var(--text-main);margin-bottom:8px}.login-header p{color:var(--text-muted);font-size:14px}.login-error{display:flex;align-items:center;gap:8px;background:#ff52521a;color:var(--status-offline);border:1px solid var(--status-offline-glow);padding:12px;border-radius:var(--radius-lg);font-size:14px;margin-bottom:20px}.login-btn{width:100%;height:44px;margin-top:8px}.login-footer{text-align:center;margin-top:32px;color:var(--text-muted);font-size:12px}.dashboard-header{margin-bottom:40px;display:flex;justify-content:space-between;align-items:flex-end}.dashboard-header h1{font-size:36px;color:#fff;margin-bottom:4px}.dashboard-header p{color:var(--text-muted);font-size:16px;font-weight:500}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:32px}.stat-card{background:var(--bg-card);padding:24px;border-radius:var(--radius-xl);border:1px solid var(--border);display:flex;flex-direction:column;position:relative;box-shadow:var(--shadow-card)}.stat-card-header{display:flex;justify-content:space-between;align-items:flex-start}.stat-card-title{font-size:11px;font-weight:700;color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em}.stat-card-icon-wrapper{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center}.stat-card-icon-wrapper svg{width:16px;height:16px}.stat-card-icon-wrapper.online{background:#10b98114;color:var(--status-online)}.stat-card-icon-wrapper.degraded{background:#f59e0b14;color:var(--status-degraded)}.stat-card-icon-wrapper.offline{background:#ef444414;color:var(--status-offline)}.stat-card-icon-wrapper.incidents{background:#ffffff0a;color:#fff}.stat-card-value{font-size:32px;font-weight:800;color:#fff;margin-top:12px;line-height:1}.stat-card-footer{font-size:12px;font-weight:500;margin-top:12px;display:flex;align-items:center}.charts-grid{display:grid;grid-template-columns:1.2fr 1.2fr .8fr;gap:24px;margin-bottom:32px}.chart-card{padding:32px}.chart-card h3{color:#fff;margin-bottom:32px;font-size:20px;display:flex;align-items:center;gap:12px}.chart-card.highlight{background:radial-gradient(circle at top right,var(--primary) -20%,var(--bg-card) 60%);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.big-metric{margin:20px 0}.metric-value{font-size:64px;font-weight:800;background:linear-gradient(to bottom,#fff,var(--primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.metric-unit{font-size:24px;font-weight:700;color:var(--primary);margin-left:8px}.dashboard-bottom-grid{display:grid;grid-template-columns:1.2fr 1.8fr;gap:24px}.card-header{margin-bottom:24px}.btn-text{color:var(--primary);font-weight:700;text-transform:uppercase;font-size:12px;letter-spacing:.1em}table th{background:transparent;color:var(--text-dim);padding:16px 20px}table td{padding:20px;border-bottom:1px solid var(--border)}.app-name{color:#fff;font-weight:700;font-size:15px}@media (max-width: 1024px){.stats-grid{grid-template-columns:repeat(2,1fr)}.charts-grid,.dashboard-bottom-grid{grid-template-columns:1fr}}@media (max-width: 600px){.stats-grid{grid-template-columns:1fr}}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.page-header h1{font-size:24px;font-weight:700}.page-header p{color:var(--text-muted)}.app-name-cell{display:flex;flex-direction:column}.app-name{font-weight:600;color:var(--text-main)}.app-url{font-size:12px;color:var(--text-muted)}.env-tag{text-transform:capitalize;font-size:13px}.actions-cell{display:flex;gap:8px}.btn-icon{background:none;color:var(--text-muted);padding:6px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s}.btn-icon:hover:not(:disabled){background:#ffffff0d;color:var(--primary)}.btn-icon:disabled{opacity:.3;cursor:not-allowed}.text-primary{color:var(--primary)}.details-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.header-left{display:flex;align-items:center;gap:16px}.title-area{display:flex;align-items:center;gap:12px}.header-actions{display:flex;gap:8px}.active-maint{background:var(--status-maintenance)!important;color:#fff!important;border-color:var(--status-maintenance)!important}.details-grid{display:grid;grid-template-columns:1fr 2fr;gap:20px;margin-bottom:32px}.info-section h3,.performance-section h3{font-size:16px;font-weight:600;margin-bottom:20px}.info-list{display:flex;flex-direction:column;gap:16px}.info-item{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:8px;border-bottom:1px solid var(--border)}.info-item .label{font-size:13px;color:var(--text-muted);font-weight:500}.info-item .value{font-size:14px;font-weight:600}.capitalize{text-transform:capitalize}.link{color:var(--primary);word-break:break-all;max-width:200px;text-align:right}.chart-wrapper{padding-top:10px}.tabs-section{margin-top:32px}.tabs-header{display:flex;gap:8px;margin-bottom:-1px}.tab-btn{display:flex;align-items:center;gap:8px;padding:12px 20px;background:none;border:1px solid transparent;border-bottom:none;border-radius:8px 8px 0 0;font-size:14px;font-weight:500;color:var(--text-muted);transition:all .2s}.tab-btn:hover{color:var(--text-main);background:#ffffff08}.tab-btn.active{background:var(--bg-card);border-color:var(--border);color:var(--primary);font-weight:600}.tab-content{border-radius:0 8px 8px!important}.error-cell{max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#ef4444}@media (max-width: 992px){.details-grid{grid-template-columns:1fr}}html{scrollbar-width:thin;scrollbar-color:var(--border-bright) var(--bg-main)}a{text-decoration:none;color:inherit}:root{color-scheme:dark;--header-height: 72px;--sidebar-width: 260px;--bg-main: #090a0f;--bg-card: #11131c;--bg-sidebar: #0d0e14;--bg-header: rgba(13, 14, 20, .85);--primary: #3b82f6;--primary-glow: rgba(59, 130, 246, .15);--primary-hover: #60a5fa;--text-main: #f8fafc;--text-muted: #94a3b8;--text-dim: #64748b;--border: rgba(255, 255, 255, .04);--border-bright: rgba(255, 255, 255, .08);--status-online: #10b981;--status-online-glow: rgba(16, 185, 129, .1);--status-degraded: #f59e0b;--status-degraded-glow: rgba(245, 158, 11, .1);--status-offline: #ef4444;--status-offline-glow: rgba(239, 68, 68, .1);--status-maintenance: #8b5cf6;--status-maintenance-glow: rgba(139, 92, 246, .1);--status-unknown: #4b5563;--shadow-card: 0 12px 40px -12px rgba(0, 0, 0, .5);--radius-xl: 16px;--radius-lg: 10px;--glass: blur(16px);--transition-smooth: all .2s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,sans-serif;background-color:var(--bg-main);color:var(--text-main);-webkit-font-smoothing:antialiased;overflow-x:hidden}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:24px;box-shadow:var(--shadow-card);transition:var(--transition-smooth);position:relative;overflow:hidden}.card:hover{border-color:var(--border-bright);transform:translateY(-4px)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;font-size:14px;border-radius:var(--radius-lg);font-weight:600;letter-spacing:.01em;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:var(--transition-smooth)}.btn-primary{background:var(--primary);color:#fff;box-shadow:0 4px 14px 0 var(--primary-glow)}.btn-primary:hover{background:var(--primary-hover);box-shadow:0 6px 20px 0 var(--primary-glow);transform:scale(1.02)}.badge{font-weight:600;border-radius:8px;padding:6px 12px;-webkit-backdrop-filter:var(--glass);backdrop-filter:var(--glass)}.badge-online{background:var(--status-online-glow);color:var(--status-online);border:1px solid var(--status-online)}.badge-degraded{background:var(--status-degraded-glow);color:var(--status-degraded);border:1px solid var(--status-degraded)}.badge-offline{background:var(--status-offline-glow);color:var(--status-offline);border:1px solid var(--status-offline)}.badge-unknown{background:#ffffff0d;color:var(--status-unknown);border:1px solid var(--border-bright)}h1{font-size:32px;font-weight:800;letter-spacing:-.02em}h2{font-size:24px;font-weight:700}h3{font-size:18px;font-weight:600;color:var(--text-muted)}.recharts-cartesian-grid-horizontal line,.recharts-cartesian-grid-vertical line{stroke:var(--border)}.recharts-tooltip-wrapper .recharts-default-tooltip{background-color:var(--bg-card)!important;border:1px solid var(--border-bright)!important;border-radius:12px!important;box-shadow:var(--shadow-card)!important}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg-main)}::-webkit-scrollbar-thumb{background:var(--border-bright);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--text-dim)}.container{max-width:1200px;margin:0 auto;padding:40px 24px;width:100%;position:relative;z-index:1}.input-group{display:flex;flex-direction:column;gap:8px;margin-bottom:24px;text-align:left}.input-group label{font-size:12px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}input[type=text],input[type=email],input[type=password],input[type=url],input[type=number],select,textarea{width:100%;padding:12px 16px;background:#ffffff08;border:1px solid var(--border);border-radius:var(--radius-lg);color:var(--text-main);font-family:inherit;font-size:14px;transition:var(--transition-smooth)}:is(input[type=text],input[type=email],input[type=password],input[type=url],input[type=number],select,textarea):focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow);background:#ffffff0d}select option{background:var(--bg-card);color:var(--text-main)}.btn-outline{background:transparent;border:1px solid var(--border-bright);color:var(--text-main)}.btn-outline:hover{background:var(--border)}.btn-success{background:var(--status-online);color:#fff;box-shadow:0 4px 14px 0 var(--status-online-glow)}.btn-success:hover{background:#059669;color:#fff;box-shadow:0 6px 20px #10b98159;transform:scale(1.02)}.table-container{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);overflow-x:auto;-webkit-overflow-scrolling:touch;box-shadow:var(--shadow-card);margin-bottom:24px}table{width:100%;border-collapse:separate;border-spacing:0;text-align:left}table th{background:#ffffff05;color:var(--text-muted);padding:16px 24px;font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border-bright)}table td{padding:18px 24px;border-bottom:1px solid var(--border);color:var(--text-main);font-size:14px;vertical-align:middle}table tr:last-child td{border-bottom:none}table tr:hover td{background:#ffffff03}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0a0b10cc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .2s ease-out;overflow-y:auto;padding:24px 16px}.modal{animation:slideUp .3s cubic-bezier(.34,1.56,.64,1);background:var(--bg-card);border:1px solid var(--border-bright);border-radius:var(--radius-xl);padding:32px;box-shadow:var(--shadow-card);width:100%;max-width:540px;max-height:100%;display:flex;flex-direction:column}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.loading-container{display:flex;align-items:center;justify-content:center;min-height:50vh;font-size:16px;color:var(--text-muted);font-weight:500;letter-spacing:.05em;text-transform:uppercase}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px;color:var(--text-dim);text-align:center;gap:16px}.empty-state p{font-size:15px;color:var(--text-muted)}.skeleton{position:relative;overflow:hidden;background:#ffffff08;border-radius:var(--radius-lg)}.skeleton:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background:linear-gradient(90deg,#fff0,#ffffff0d,#fff0);animation:skeleton-shimmer-gpu 1.6s infinite}@keyframes skeleton-shimmer-gpu{to{transform:translate(100%)}}.filters-bar{display:flex;gap:16px;margin-bottom:24px;padding:12px 24px!important}.search-input{flex:1;display:flex;align-items:center;gap:10px;background:#ffffff08;border:1px solid var(--border);padding:0 12px;border-radius:var(--radius-lg);transition:var(--transition-smooth)}.search-input:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow);background:#ffffff0d}.search-input input{background:none;border:none;width:100%;padding:8px 0;font-size:14px;color:var(--text-main);outline:none}.filters-bar select{width:200px;padding:8px 12px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-card);color:var(--text-main);outline:none;transition:var(--transition-smooth)}.filters-bar select:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow);background:#ffffff0d}.table-container table tr:first-child th:first-child{border-top-left-radius:var(--radius-xl)}.table-container table tr:first-child th:last-child{border-top-right-radius:var(--radius-xl)}.table-container table tr:last-child td:first-child{border-bottom-left-radius:var(--radius-xl)}.table-container table tr:last-child td:last-child{border-bottom-right-radius:var(--radius-xl)}.status-dot-container{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:500}.status-dot{position:relative;width:8px;height:8px;border-radius:50%}.status-dot:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;animation:status-pulse 2s infinite ease-in-out}.status-dot.online{background-color:var(--status-online)}.status-dot.online:after{box-shadow:0 0 0 var(--status-online)}.status-dot.degraded{background-color:var(--status-degraded)}.status-dot.degraded:after{box-shadow:0 0 0 var(--status-degraded)}.status-dot.offline{background-color:var(--status-offline)}.status-dot.offline:after{box-shadow:0 0 0 var(--status-offline)}.status-dot.maintenance{background-color:var(--status-maintenance)}.status-dot.maintenance:after{box-shadow:0 0 0 var(--status-maintenance)}@keyframes status-pulse{0%{transform:scale(.95);box-shadow:0 0 #ffffffb3}70%{transform:scale(1);box-shadow:0 0 0 6px #fff0}to{transform:scale(.95);box-shadow:0 0 #fff0}}.status-dot.online:after{animation-name:online-pulse-key}.status-dot.degraded:after{animation-name:degraded-pulse-key}.status-dot.offline:after{animation-name:offline-pulse-key}@keyframes online-pulse-key{0%{transform:scale(1);box-shadow:0 0 #10b98166}70%{transform:scale(1);box-shadow:0 0 0 8px #10b98100}to{transform:scale(1);box-shadow:0 0 #10b98100}}@keyframes degraded-pulse-key{0%{transform:scale(1);box-shadow:0 0 #f59e0b66}70%{transform:scale(1);box-shadow:0 0 0 8px #f59e0b00}to{transform:scale(1);box-shadow:0 0 #f59e0b00}}@keyframes offline-pulse-key{0%{transform:scale(1);box-shadow:0 0 #ef444466}70%{transform:scale(1);box-shadow:0 0 0 8px #ef444400}to{transform:scale(1);box-shadow:0 0 #ef444400}}.btn-text-premium{color:var(--primary);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;display:inline-flex;align-items:center;gap:4px;transition:var(--transition-smooth);cursor:pointer}.btn-text-premium span{transition:var(--transition-smooth)}.btn-text-premium:hover{color:var(--primary-hover)}.btn-text-premium:hover span{transform:translate(4px)}.latency-low{color:var(--status-online);font-weight:600}.latency-med{color:var(--status-degraded);font-weight:600}.latency-high{color:var(--status-offline);font-weight:700;animation:text-glowing-red 2s infinite}@keyframes text-glowing-red{0%{opacity:.8}50%{opacity:1;text-shadow:0 0 8px rgba(239,68,68,.3)}to{opacity:.8}}