@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";
:root{--bg-color:#0b0f19;--panel-bg:#141a28b3;--border-color:#ffffff14;--text-primary:#f0f4f8;--text-secondary:#94a3b8;--accent-blue:#0ea5e9;--accent-green:#10b981;--accent-red:#ef4444;--glass-shadow:0 8px 32px 0 #0000005e;--glass-backdrop:blur(12px)}*{box-sizing:border-box;margin:0;padding:0;font-family:Inter,sans-serif}body{background-color:var(--bg-color);color:var(--text-primary);background-image:radial-gradient(circle at 50% -20%,#1e293b,#0000 50%);flex-direction:column;min-height:100vh;display:flex;overflow-x:hidden}.glass-panel{background:var(--panel-bg);-webkit-backdrop-filter:var(--glass-backdrop);border:1px solid var(--border-color);box-shadow:var(--glass-shadow);border-radius:16px;padding:24px;transition:transform .3s,box-shadow .3s}.glass-panel:hover{transform:translateY(-2px);box-shadow:0 12px 40px #00000073}.dashboard-container{width:100%;max-width:1400px;margin:0 auto;padding:40px 24px}.header{justify-content:space-between;align-items:center;margin-bottom:40px;display:flex}.header h1{background:linear-gradient(90deg,#fff,#94a3b8);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:28px;font-weight:700}.status-badge{color:var(--accent-green);background:#10b9811a;border:1px solid #10b98133;border-radius:20px;align-items:center;padding:6px 12px;font-size:14px;font-weight:500;display:inline-flex}.status-badge.offline{color:var(--accent-red);background:#ef44441a;border:1px solid #ef444433}.btn{background:var(--accent-blue);color:#fff;cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;padding:12px 24px;font-size:16px;font-weight:600;transition:all .2s;display:inline-flex}.btn:hover{background:#0284c7;transform:translateY(-1px)}.btn.stop{background:var(--accent-red)}.btn.stop:hover{background:#dc2626}.grid-layout{grid-template-columns:repeat(2,1fr);gap:24px;margin-bottom:24px;display:grid}.metric-card{flex-direction:column;display:flex}.metric-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;font-size:14px}.metric-value{color:var(--text-primary);font-size:36px;font-weight:700}.metric-unit{color:var(--text-secondary);margin-left:4px;font-size:16px;font-weight:400}.chart-container{width:100%;height:300px;margin-top:16px;position:relative}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0009;justify-content:center;align-items:center;animation:.3s fadeIn;display:flex;position:fixed;inset:0}.modal-content{width:100%;max-width:500px;animation:.3s slideUp}.form-group{margin-bottom:20px}.form-group label{color:var(--text-secondary);margin-bottom:8px;font-size:14px;display:block}.form-input{border:1px solid var(--border-color);color:#fff;background:#0003;border-radius:8px;width:100%;padding:12px 16px;font-size:16px;transition:border-color .2s}.form-input:focus{border-color:var(--accent-blue);outline:none}option{color:#000;background:#fff}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media print{.modal-content,.modal-content *{visibility:visible}.modal-content{width:100%;position:absolute;top:0;left:0;color:#000!important;max-width:none!important;box-shadow:none!important;background:#fff!important;border:none!important}.modal-content h2,.modal-content p,.modal-content label{color:#000!important}.modal-content textarea,.modal-content input{color:#000!important;resize:none!important;box-shadow:none!important;background:0 0!important;border:none!important}.no-print{display:none!important}.print-only{display:block!important}}