.react-grid-layout{transition:height .2s;position:relative}.react-grid-item{transition:left .2s,top .2s,width .2s,height .2s}.react-grid-item img{pointer-events:none;-webkit-user-select:none;user-select:none}.react-grid-item.cssTransforms{transition-property:transform,width,height}.react-grid-item.resizing{z-index:1;will-change:width, height;transition:none}.react-grid-item.react-draggable-dragging{z-index:3;will-change:transform;transition:none}.react-grid-item.dropping{visibility:hidden}.react-grid-item.react-grid-placeholder{opacity:.2;z-index:2;-webkit-user-select:none;user-select:none;background:red;transition-duration:.1s}.react-grid-item.react-grid-placeholder.placeholder-resizing{transition:none}.react-grid-item>.react-resizable-handle{opacity:0;width:20px;height:20px;position:absolute}.react-grid-item:hover>.react-resizable-handle{opacity:1}.react-grid-item>.react-resizable-handle:after{content:"";border-bottom:2px solid #0006;border-right:2px solid #0006;width:5px;height:5px;position:absolute;bottom:3px;right:3px}.react-resizable-hide>.react-resizable-handle{display:none}.react-grid-item>.react-resizable-handle.react-resizable-handle-sw{cursor:sw-resize;bottom:0;left:0;transform:rotate(90deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-se{cursor:se-resize;bottom:0;right:0}.react-grid-item>.react-resizable-handle.react-resizable-handle-nw{cursor:nw-resize;top:0;left:0;transform:rotate(180deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-ne{cursor:ne-resize;top:0;right:0;transform:rotate(270deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-w,.react-grid-item>.react-resizable-handle.react-resizable-handle-e{cursor:ew-resize;margin-top:-10px;top:50%}.react-grid-item>.react-resizable-handle.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-n,.react-grid-item>.react-resizable-handle.react-resizable-handle-s{cursor:ns-resize;margin-left:-10px;left:50%}.react-grid-item>.react-resizable-handle.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}
.react-resizable{position:relative}.react-resizable-handle{box-sizing:border-box;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+);background-position:100% 100%;background-repeat:no-repeat;background-origin:content-box;width:20px;height:20px;padding:0 3px 3px 0;position:absolute}.react-resizable-handle-sw{cursor:sw-resize;bottom:0;left:0;transform:rotate(90deg)}.react-resizable-handle-se{cursor:se-resize;bottom:0;right:0}.react-resizable-handle-nw{cursor:nw-resize;top:0;left:0;transform:rotate(180deg)}.react-resizable-handle-ne{cursor:ne-resize;top:0;right:0;transform:rotate(270deg)}.react-resizable-handle-w,.react-resizable-handle-e{cursor:ew-resize;margin-top:-10px;top:50%}.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-resizable-handle-n,.react-resizable-handle-s{cursor:ns-resize;margin-left:-10px;left:50%}.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}
:root{--clr-bg-page:#f1f5f9;--clr-bg-card:#fff;--clr-bg-input:#fff;--clr-bg-hover:#f8fafc;--clr-text-1:#1e293b;--clr-text-2:#475569;--clr-text-3:#94a3b8;--clr-border:#e2e8f0;--clr-border-2:#cbd5e1;--clr-shadow:0 4px 20px #0f172a0f;--clr-primary:#2563eb;--clr-primary-dark:#1d4ed8;--clr-primary-darker:#1e40af;--clr-primary-light:#bfdbfe;--clr-primary-lighter:#dbeafe;--clr-primary-bg:#eff6ff;--clr-primary-pale:#f0f7ff}html,body{color:#111827;background:#f4f7fb;margin:0;padding:0;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}main{max-width:1700px;margin:0 auto;padding:0}section{background:#fff;border-radius:16px;margin-bottom:1.5rem;padding:1.5rem;box-shadow:0 10px 30px #0f172a14}h1,h2{margin:0 0 1rem}.card-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;display:grid}.card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:1rem}.badge{border-radius:999px;padding:.25rem .6rem;font-size:.8rem;font-weight:600;display:inline-flex}.badge.online{color:#166534;background:#dcfce7}.badge.offline{color:#991b1b;background:#fee2e2}.section-header{justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.button-group,.status-grid{gap:1rem;display:grid}.button-card{color:#fff;background:#2563eb;border-radius:14px;justify-content:center;align-items:center;padding:.9rem 1.2rem;font-weight:700;text-decoration:none;display:inline-flex}.status-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.status-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px;padding:1rem}.status-card span{color:#6b7280;margin-bottom:.5rem;display:block}.status-card strong{font-size:1.4rem}.summary-list{gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.summary-list li{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;justify-content:space-between;gap:1rem;padding:.9rem;display:flex}.chart-card{background:#fff;border:1px solid #e5e7eb;border-radius:16px;min-width:280px;padding:1rem}.chart-card-header{justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem;display:flex}.chart-card-header h3{margin:0 0 .25rem}.chart-subtitle{color:#6b7280;font-size:.9rem}.chart-value{font-size:1.2rem;font-weight:700}.chart-svg{width:100%;height:auto;overflow:visible}.interactive-chart-svg{cursor:crosshair}.interactive-chart-card{position:relative}.chart-footer{justify-content:space-between;align-items:center;gap:1rem;margin-top:1rem;display:flex}.chart-range-label{color:#334155;font-size:.95rem}.chart-reset-button{padding:.6rem .9rem;font-size:.9rem}.chart-grid line{stroke-dasharray:3 3}.data-table{border-collapse:collapse;width:100%}.data-table th,.data-table td{text-align:left;border-bottom:1px solid #e5e7eb;padding:.9rem}.table-wrapper{overflow-x:auto}@media (max-width:768px){.section-header,.button-group,.card-grid,.status-grid{grid-template-columns:1fr}}.control-grid,.range-panel{gap:1rem;display:grid}.card .input-group{gap:.5rem;display:grid}.card .input-group span{color:#475569;font-size:.9rem}.card select,.card input[type=date],.card input[type=time],.card input[type=range]{background:#fff;border:1px solid #cbd5e1;border-radius:.85rem;width:100%;padding:.75rem .85rem;font-size:.95rem}.range-panel{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;padding:1rem}.range-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;display:grid}.range-label{color:#334155;margin-top:.5rem;font-size:.95rem}.control-grid{margin-top:1rem}.chart-actions{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.button-secondary{background:#475569}@media (max-width:860px){.range-row{grid-template-columns:1fr}}.timeline-scroll::-webkit-scrollbar{width:4px}.timeline-scroll::-webkit-scrollbar-track{background:0 0}.timeline-scroll::-webkit-scrollbar-thumb{background:0 0;border-radius:10px}.timeline-scroll:hover::-webkit-scrollbar-thumb{background:#94a3b866}.tracker-input{border:1.5px solid var(--clr-border);background:var(--clr-bg-input);width:90px;color:var(--clr-text-1);border-radius:8px;padding:4px 10px;font-size:.7rem}.tracker-input:focus{border:1.5px solid var(--clr-primary);outline:none}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{appearance:textfield}