*{margin:0;padding:0;box-sizing:border-box}.dashboard-container{display:flex;min-height:100vh;max-height:100vh;background:#0f172a;color:#f1f5f9;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Inter,sans-serif;overflow:hidden}.sidebar{width:260px;background:#1e293b;border-right:1px solid rgba(203,213,225,.1);display:flex;flex-direction:column;padding:1.5rem 1rem;flex-shrink:0}@media(max-width:768px){.sidebar{position:fixed;left:0;top:0;bottom:0;z-index:1000;transform:translate(-100%);transition:transform .3s ease;box-shadow:4px 0 12px #0000004d}.sidebar.open{transform:translate(0)}}.sidebar-overlay{display:none}@media(max-width:768px){.sidebar-overlay{display:block;position:fixed;inset:0;background:#0009;z-index:999}}.sidebar-header{margin-bottom:2rem}.sidebar-header .logo{display:flex;align-items:center;gap:.75rem}.sidebar-header .logo .logo-icon{width:36px;height:36px;background:linear-gradient(135deg,#38bdf8,#0ea5e9);border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.875rem;color:#fff}.sidebar-header .logo .logo-text{font-size:1.125rem;font-weight:700;color:#f1f5f9}.sidebar-nav{flex:1;display:flex;flex-direction:column;gap:.375rem}.sidebar-nav .nav-link{display:flex;align-items:center;gap:.75rem;padding:.625rem .75rem;border-radius:8px;color:#cbd5e1;text-decoration:none;cursor:pointer;transition:all .2s ease;font-weight:500;font-size:.875rem}.sidebar-nav .nav-link .nav-icon{width:18px;height:18px;flex-shrink:0}.sidebar-nav .nav-link.active{background:#38bdf826;color:#38bdf8}.sidebar-nav .nav-link:hover:not(.active){background:#ffffff0d;color:#f1f5f9}.sidebar-footer{margin-top:auto}.sidebar-footer .btn-logout{width:100%;padding:.625rem .75rem;background:#ef44441a;color:#ef4444;border:1px solid rgba(239,68,68,.2);border-radius:8px;font-weight:600;font-size:.875rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:.5rem}.sidebar-footer .btn-logout .logout-icon{width:16px;height:16px}.sidebar-footer .btn-logout:hover{background:#ef444433;border-color:#ef444466}.main-content{flex:1;display:flex;flex-direction:column;overflow-y:hidden;overflow-x:hidden;min-height:100vh;max-height:100vh}.header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;background:#1e293b;border-bottom:1px solid rgba(203,213,225,.1);flex-shrink:0}@media(max-width:768px){.header{padding:1rem}}.header .header-left{display:flex;align-items:center;gap:.75rem}.header .header-left .mobile-menu-btn{display:none;background:none;border:none;color:#f1f5f9;cursor:pointer;padding:.25rem}.header .header-left .mobile-menu-btn svg{width:24px;height:24px}@media(max-width:768px){.header .header-left .mobile-menu-btn{display:block}}.header .header-left .header-title{font-size:1.25rem;font-weight:700;color:#f1f5f9}@media(max-width:768px){.header .header-left .header-title{font-size:1rem}}.header .header-right .status-badge{display:flex;align-items:center;gap:.5rem;background:#ffffff0d;padding:.5rem 1rem;border-radius:50px;font-size:.75rem;font-weight:600;border:1px solid rgba(203,213,225,.1)}.header .header-right .status-badge .status-dot{width:6px;height:6px;border-radius:50%;background:#cbd5e1}.header .header-right .status-badge.online .status-dot{background:#10b981;box-shadow:0 0 8px #10b98180;animation:pulse-green 2s ease-in-out infinite}@media(max-width:768px){.header .header-right .status-badge{padding:.375rem .75rem;font-size:.7rem}}.content-wrapper{padding:1.5rem;flex:1}@media(max-width:768px){.content-wrapper{padding:1rem}}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin-bottom:1.5rem}@media(max-width:768px){.metrics-grid{grid-template-columns:1fr}}.metric-card{background:#1e293b;border:1px solid rgba(203,213,225,.1);border-radius:12px;padding:1rem;transition:transform .2s ease,box-shadow .2s ease}.metric-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0003}.metric-card .metric-icon{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;margin-bottom:.75rem}.metric-card .metric-icon svg{width:20px;height:20px}.metric-card .metric-icon.cpu{background:#38bdf826;color:#38bdf8}.metric-card .metric-icon.memory{background:#a855f726;color:#a855f7}.metric-card .metric-icon.disk{background:#f59e0b26;color:#f59e0b}.metric-card .metric-icon.uptime{background:#10b98126;color:#10b981}.metric-card .metric-info{display:flex;flex-direction:column;gap:.25rem;margin-bottom:.75rem}.metric-card .metric-info .metric-label{font-size:.75rem;color:#cbd5e1;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.metric-card .metric-info .metric-value{font-size:1.5rem;font-weight:700;color:#f1f5f9;line-height:1}.metric-card .metric-info .metric-value.uptime-value{color:#10b981}.metric-card .metric-chart{height:50px;margin-top:.5rem}.metric-card .metric-progress .progress-bar{width:100%;height:4px;background:#ffffff1a;border-radius:2px;overflow:hidden;margin-bottom:.5rem}.metric-card .metric-progress .progress-bar .progress-fill{height:100%;border-radius:2px;transition:width .5s ease}.metric-card .metric-progress .progress-bar .progress-fill.memory{background:linear-gradient(90deg,#a855f7,#9333ea)}.metric-card .metric-progress .progress-bar .progress-fill.warning{background:linear-gradient(90deg,#f59e0b,#ef4444)}.metric-card .metric-progress .progress-text{font-size:.7rem;color:#cbd5e1;font-weight:500}.content-grid{display:grid;grid-template-columns:380px 1fr;gap:1rem;margin-bottom:1.5rem}@media(max-width:1024px){.content-grid{grid-template-columns:1fr}}.card{background:#1e293b;border:1px solid rgba(203,213,225,.1);border-radius:12px;overflow-y:hidden;max-height:calc(100vh - 315px)}.card .card-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;border-bottom:1px solid rgba(203,213,225,.1)}.card .card-header .card-title{font-size:.875rem;font-weight:700;color:#f1f5f9;text-transform:uppercase;letter-spacing:.5px}.card .card-content{padding:1rem;overflow-y:auto;max-height:calc(100vh - 365px)}.badge{padding:.25rem .625rem;border-radius:50px;font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.badge.badge-success{background:#10b98126;color:#10b981;border:1px solid rgba(16,185,129,.3)}.badge.badge-live{background:#ef444426;color:#ef4444;border:1px solid rgba(239,68,68,.3);animation:pulse-red 1.5s ease-in-out infinite}.badge.badge-danger{background:#ef444426;color:#ef4444;border:1px solid rgba(239,68,68,.3)}.process-list{display:flex;flex-direction:column;gap:.625rem}.process-list .process-item{display:flex;align-items:center;gap:.75rem;background:#ffffff05;padding:.75rem;border-radius:8px;border:1px solid rgba(255,255,255,.05);transition:all .2s ease}.process-list .process-item:hover{background:#ffffff0a;border-color:#ffffff1a}.process-list .process-item .process-status{width:3px;height:28px;border-radius:2px;background:#ef4444;flex-shrink:0}.process-list .process-item .process-status.online{background:#10b981}.process-list .process-item .process-details{flex:1;min-width:0}.process-list .process-item .process-details .process-name{font-weight:600;font-size:.8rem;color:#f1f5f9;margin-bottom:.125rem}.process-list .process-item .process-details .process-meta{font-size:.7rem;color:#cbd5e1;font-family:JetBrains Mono,Courier New,monospace}.process-list .process-item .process-metrics{display:flex;flex-direction:column;align-items:flex-end;gap:.125rem;font-size:.7rem;font-weight:600;color:#cbd5e1}.process-list .process-item .process-metrics .metric-item{white-space:nowrap}.process-list .process-item .process-restarts .restart-badge{background:#ef444433;color:#ef4444;padding:.125rem .375rem;border-radius:4px;font-size:.65rem;font-weight:700}.table-wrapper{overflow-x:auto}.traffic-table{width:100%;border-collapse:collapse}.traffic-table thead tr{border-bottom:1px solid rgba(203,213,225,.1)}.traffic-table thead tr th{text-align:left;padding:.625rem .75rem;font-size:.7rem;font-weight:600;color:#cbd5e1;text-transform:uppercase;letter-spacing:.5px}.traffic-table tbody tr{border-bottom:1px solid rgba(203,213,225,.5);transition:background .2s ease}.traffic-table tbody tr:hover{background:#ffffff05}.traffic-table tbody tr td{padding:.625rem .75rem;font-size:.8rem;color:#f1f5f9}.traffic-table .method-badge{display:inline-block;padding:.125rem .5rem;border-radius:4px;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.3px}.traffic-table .method-badge[data-method=GET]{background:#10b98133;color:#10b981}.traffic-table .method-badge[data-method=POST]{background:#38bdf833;color:#38bdf8}.traffic-table .method-badge[data-method=PUT]{background:#f59e0b33;color:#f59e0b}.traffic-table .method-badge[data-method=DELETE]{background:#ef444433;color:#ef4444}.traffic-table .endpoint-cell{font-family:JetBrains Mono,Courier New,monospace;color:#38bdf8;font-size:.75rem;max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.traffic-table .status-badge{display:inline-block;padding:.125rem .375rem;border-radius:4px;font-size:.7rem;font-weight:700;background:#10b98133;color:#10b981}.traffic-table .status-badge.error{background:#ef444433;color:#ef4444}.traffic-table .latency-cell{font-weight:700;text-align:right;font-family:JetBrains Mono,Courier New,monospace;color:#f1f5f9}.traffic-table .empty-state{text-align:center;padding:2rem;color:#cbd5e1;font-style:italic}.error-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.75rem}@media(max-width:768px){.error-grid{grid-template-columns:1fr}}.error-grid .error-item{background:#ef444414;border:1px solid rgba(239,68,68,.2);border-radius:8px;padding:.75rem;transition:all .2s ease}.error-grid .error-item:hover{background:#ef44441f;border-color:#ef44444d}.error-grid .error-item .error-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.error-grid .error-item .error-header .error-project{font-size:.7rem;font-weight:700;color:#ef4444;text-transform:uppercase;letter-spacing:.5px}.error-grid .error-item .error-header .error-time{font-size:.7rem;color:#cbd5e1;font-family:JetBrains Mono,Courier New,monospace}.error-grid .error-item .error-message{font-size:.8rem;line-height:1.4;color:#fca5a5;margin-bottom:.5rem}.error-grid .error-item .error-type{font-size:.65rem;color:#cbd5e1;text-transform:uppercase;letter-spacing:.5px;font-weight:600}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:50vh;gap:1rem}.loading-state .spinner{width:40px;height:40px;border:3px solid rgba(56,189,248,.2);border-top-color:#38bdf8;border-radius:50%;animation:spin 1s linear infinite}.loading-state p{color:#cbd5e1;font-size:.875rem}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse-green{0%,to{opacity:.8}50%{opacity:1}}@keyframes pulse-red{0%,to{opacity:.8}50%{opacity:1}}@media only screen and (max-device-width:768px){.main-content{overflow-y:auto!important}}
