/* 城市电力系统仿真样式（发电-输电-变电-用电 全环节） */
*{margin:0;padding:0;box-sizing:border-box}
body,html{width:100%;height:100%;overflow:hidden;background:#0b1220;font-family:'Segoe UI',Arial,'Microsoft YaHei',sans-serif;color:#e6edf3}
#map{width:100%;height:100%;background:#0b1220}
/* 轻量地图引擎 */
.dvmap-container{position:relative;width:100%;height:100%;overflow:hidden;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none}
.dvmap-container.dragging{cursor:grabbing}
.dvmap-canvas{position:absolute;left:0;top:0;display:block}
.dvmap-ctl{position:absolute;left:16px;bottom:26px;z-index:900;display:flex;flex-direction:column;gap:4px}
.dvmap-ctl .btn{width:32px;height:32px;line-height:30px;text-align:center;background:rgba(16,26,41,.95);border:1px solid #2b3b52;border-radius:6px;color:#9fb3c8;font-size:18px;cursor:pointer}
.dvmap-ctl .btn:hover{color:#7fd1ff;border-color:#3d5474}
#panel{position:absolute;top:16px;left:16px;width:284px;max-height:calc(100vh - 60px);overflow-y:auto;background:rgba(13,20,32,.93);backdrop-filter:blur(6px);border:1px solid #233;border-radius:10px;padding:14px 16px;z-index:1000;box-shadow:0 4px 20px rgba(0,0,0,.5)}
#panel h1{font-size:15px;color:#7fd1ff;letter-spacing:1px;margin-bottom:2px;font-weight:600}
#panel .sub{font-size:10px;color:#5f7488;letter-spacing:.5px;margin-bottom:6px}
#panel .btn{display:block;width:100%;margin-top:8px;padding:8px;border:none;border-radius:6px;font-size:12.5px;cursor:pointer;background:#1d4ed8;color:#fff;transition:.15s}
#panel .btn:hover{background:#2f63ea}
#panel .btn.stop{background:#7a2333}
#panel .btn.stop:hover{background:#94293c}
#panel .btn.warn{background:#7a5a14}
#panel .btn.warn:hover{background:#96701a}
#stats{margin-top:10px;font-size:12px;line-height:1.85;color:#9fb3c8}
#stats b{color:#ffd76e;font-weight:600}
#tips{margin-top:10px;font-size:11px;color:#5f7488;line-height:1.7;border-top:1px solid #233;padding-top:8px}
#legend{position:absolute;right:16px;bottom:26px;background:rgba(13,20,32,.92);border:1px solid #233;border-radius:10px;padding:10px 14px;z-index:1000;font-size:11px;line-height:1.9;box-shadow:0 4px 20px rgba(0,0,0,.5)}
#legend .lg-title{color:#5f7488;font-size:10px;letter-spacing:1px;margin-top:4px}
.lg{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:-1px}
.lgl{display:inline-block;width:18px;height:3px;border-radius:2px;margin-right:6px;vertical-align:3px}
#panel .sect{margin-top:10px;border-top:1px solid #233;padding-top:8px}
#panel .sect .t{font-size:11px;color:#5f7488;margin-bottom:6px;letter-spacing:1px}
#panel .sect .t b{color:#7fd1ff}
#faultList{font-size:11px;color:#9fb3c8;max-height:110px;overflow-y:auto;line-height:1.9}
#faultList .fi{display:flex;gap:8px;border-bottom:1px dashed #1d2a3a;padding:2px 0}
#faultList .fi .fit{flex:1}
#faultList .fi.warn{color:#ffb84d}
#faultList .fi.bad{color:#ff6e6e}
#faultList .fi span:first-child{color:#5f7488}
.loadbar{height:6px;background:#16202e;border-radius:3px;margin:3px 0 8px;overflow:hidden}
.loadbar i{display:block;height:100%;width:0%;border-radius:3px;background:#41d98d;transition:width .5s,background .5s}
#topo{position:absolute;right:16px;top:16px;width:256px;max-height:calc(100vh - 60px);display:flex;flex-direction:column;background:rgba(13,20,32,.92);border:1px solid #233;border-radius:10px;padding:12px 14px;z-index:1000;box-shadow:0 4px 20px rgba(0,0,0,.5)}
#topo h3{font-size:13px;color:#7fd1ff;margin-bottom:6px;font-weight:600}
#topoTree{font-size:11px;color:#9fb3c8;line-height:2;overflow-y:auto;padding-right:4px}
#topoTree .tg{color:#5f7488;font-size:10px;letter-spacing:1px;margin-top:6px;border-bottom:1px dashed #1d2a3a}
#topoTree .n2{cursor:pointer;padding-left:10px}
#topoTree .n2:hover{color:#7fd1ff}
#topoTree .down{color:#ff6e6e}
#topoTree .st{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;vertical-align:0}
.zrow{display:flex;align-items:center;gap:8px;font-size:11px;color:#9fb3c8}
.zrow .zname{width:92px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zrow .loadbar{flex:1;margin:0}
.zrow .zval{width:62px;text-align:right}
.grow{margin-bottom:2px}
.grow-h{display:flex;justify-content:space-between;font-size:11px;color:#9fb3c8}
.grow-h .gval{color:#9fb3c8}
.gdot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px}
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-thumb{background:#2b3b52;border-radius:3px}