.mod7-root{--bg-color:#0f172a;--card-bg:#1e293b;--card-border:#334155;--text-main:#f8fafc;--text-muted:#94a3b8;--critical-color:red;--warning-color:orange;--normal-color:#22c55e;--updating-color:#3b82f6;--pulse-animation:mod7-pulse 2s infinite;--alert-z-index:1000;--live-indicator:#22c55e;--update-interval:5s;--toast-duration:5s;--font-title:"Fira Code",monospace;--font-body:"Fira Sans",sans-serif}.mod7-root,.mod7-root *{box-sizing:border-box}.mod7-root{margin:0;padding:0;background-color:var(--bg-color);background-image:linear-gradient(rgba(51,65,85,.15) 1px,transparent 0),linear-gradient(90deg,rgba(51,65,85,.15) 1px,transparent 0);background-size:30px 30px;color:var(--text-main);font-family:var(--font-body);-webkit-font-smoothing:antialiased}.mod7-root header{display:flex;justify-content:space-between;align-items:center;padding:16px 32px;background:rgba(30,41,59,.95);border-bottom:1px solid var(--card-border);position:sticky;top:0;z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);flex-wrap:wrap;gap:16px}.mod7-root .sys-title{font-family:var(--font-title);font-size:17.6px;font-weight:600;color:var(--text-main)}.mod7-root .module-title{font-family:var(--font-body);font-size:15.2px;color:var(--text-muted);flex:1;min-width:250px}.mod7-root .conn-status{display:flex;align-items:center;gap:24px;font-size:13.6px}.mod7-root .status-indicator{display:flex;align-items:center;gap:8px;font-family:var(--font-title)}.mod7-root .status-dot{width:10px;height:10px;border-radius:50%;display:inline-block}.mod7-root .status-dot.live{background:var(--live-indicator);-webkit-animation:var(--pulse-animation);animation:var(--pulse-animation)}.mod7-root .spin-icon{display:inline-block;-webkit-animation:mod7-spin 4s linear infinite;animation:mod7-spin 4s linear infinite}.mod7-root main{padding:32px;display:grid;gap:24px;max-width:1440px;margin:0 auto}.mod7-root .grid-top{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px}.mod7-root .grid-charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(450px,1fr));gap:24px}.mod7-root .card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:8px;padding:24px;box-shadow:0 4px 12px rgba(0,0,0,.2);display:flex;flex-direction:column}.mod7-root .card h3{font-family:var(--font-title);font-size:16px;color:var(--text-main);margin-top:0;margin-bottom:16px;border-bottom:1px solid var(--card-border);padding-bottom:12px;font-weight:600}.mod7-root .status-row{display:flex;justify-content:space-between;margin-bottom:9.6px;font-size:14.4px;align-items:center}.mod7-root .status-label{color:var(--text-muted)}.mod7-root .status-value{font-family:var(--font-title);font-weight:500}.mod7-root .warning{color:var(--warning-color)}.mod7-root .normal{color:var(--normal-color)}.mod7-root .critical{color:var(--critical-color)}.mod7-root .updating{color:var(--updating-color)}.mod7-root .math-box{background:#0f172a;padding:16px;border-radius:4px;border:1px solid var(--card-border);font-family:var(--font-title);font-size:13.6px;color:#cbd5e1;line-height:1.8;overflow-x:auto}.mod7-root .math-line b{color:var(--updating-color)}.mod7-root form label{display:flex;flex-direction:column;font-size:13.6px;color:var(--text-muted);margin-bottom:12.8px}.mod7-root form input{margin-top:6.4px;padding:8px;background:#0f172a;border:1px solid var(--card-border);color:var(--text-main);border-radius:4px;font-family:var(--font-title);outline:none;transition:border-color .2s}.mod7-root form input:focus{border-color:var(--updating-color)}.mod7-root .btn-primary{margin-top:8px;padding:9.6px 16px;background:var(--updating-color);color:#fff;border:none;border-radius:4px;cursor:pointer;font-family:var(--font-title);font-weight:600;transition:background .2s;width:100%}.mod7-root .btn-primary:hover{background:#2563eb}.mod7-root .btn-secondary{margin-top:8px;padding:9.6px 16px;background:#475569;color:#fff;border:none;border-radius:4px;cursor:pointer;font-family:var(--font-title);font-weight:600;transition:background .2s;width:100%}.mod7-root .btn-secondary:hover{background:#334155}.mod7-root .chart-card{min-height:320px}.mod7-root .chart-container{flex:1;position:relative;width:100%;height:240px;margin-top:8px}.mod7-root .chart-container canvas{position:absolute;top:0;left:0;width:100%;height:100%}.mod7-root table{width:100%;border-collapse:collapse;font-size:14.4px}.mod7-root td,.mod7-root th{padding:12.8px 8px;text-align:left;border-bottom:1px solid var(--card-border)}.mod7-root th{color:var(--text-muted);font-weight:500;font-size:13.6px}.mod7-root td,.mod7-root th{font-family:var(--font-title)}.mod7-root td{color:var(--text-main)}.mod7-root .critical-banner{position:fixed;top:90px;left:50%;width:90%;max-width:800px;background:rgba(255,0,0,.95);color:#fff;padding:12px 24px;font-family:var(--font-title);font-weight:600;display:flex;align-items:center;gap:16px;border-radius:6px;z-index:var(--alert-z-index);box-shadow:0 4px 12px rgba(255,0,0,.4);transform:translate(-50%,-200%);opacity:0;pointer-events:none;transition:transform .4s cubic-bezier(.175,.885,.32,1.275),opacity .3s ease}.mod7-root .critical-banner.active{transform:translate(-50%);opacity:1;pointer-events:auto;-webkit-animation:mod7-pulse-critical 2s infinite;animation:mod7-pulse-critical 2s infinite}.mod7-root .pulse-icon{width:12px;height:12px;background:#fff;border-radius:50%;-webkit-animation:mod7-blink 1s infinite;animation:mod7-blink 1s infinite}.mod7-root #toast-container{position:fixed;bottom:20px;right:20px;z-index:var(--alert-z-index);display:flex;flex-direction:column;gap:8px}.mod7-root .toast{background:#1e293b;border-left:4px solid var(--updating-color);color:#fff;padding:16px 24px;border-radius:4px;box-shadow:0 4px 12px rgba(0,0,0,.4);font-family:var(--font-body);font-size:14.4px;opacity:1;transition:opacity .5s;min-width:250px}.mod7-root .toast.success{border-left-color:var(--normal-color)}.mod7-root .toast.error{border-left-color:var(--critical-color)}.mod7-root .toast.info{border-left-color:var(--updating-color)}@-webkit-keyframes mod7-pulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.7)}70%{box-shadow:0 0 0 6px rgba(34,197,94,0)}to{box-shadow:0 0 0 0 rgba(34,197,94,0)}}@keyframes mod7-pulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.7)}70%{box-shadow:0 0 0 6px rgba(34,197,94,0)}to{box-shadow:0 0 0 0 rgba(34,197,94,0)}}@-webkit-keyframes mod7-pulse-critical{0%{box-shadow:0 0 0 0 rgba(255,0,0,.8)}70%{box-shadow:0 0 0 10px rgba(255,0,0,0)}to{box-shadow:0 0 0 0 rgba(255,0,0,0)}}@keyframes mod7-pulse-critical{0%{box-shadow:0 0 0 0 rgba(255,0,0,.8)}70%{box-shadow:0 0 0 10px rgba(255,0,0,0)}to{box-shadow:0 0 0 0 rgba(255,0,0,0)}}@-webkit-keyframes mod7-blink{0%,to{opacity:1}50%{opacity:.3}}@keyframes mod7-blink{0%,to{opacity:1}50%{opacity:.3}}@-webkit-keyframes mod7-spin{to{transform:rotate(1turn)}}@keyframes mod7-spin{to{transform:rotate(1turn)}}@media (max-width:768px){.mod7-root header{flex-direction:column;align-items:flex-start}.mod7-root .conn-status{width:100%;justify-content:space-between}.mod7-root .grid-charts,.mod7-root .grid-top{grid-template-columns:1fr}.mod7-root main{padding:16px}.mod7-root .critical-banner{top:140px;width:95%}}.mod7-root{min-height:calc(100vh - 50px)}