:root{--c-cyan:#19dbe8;--c-cyan-l:#6bf8ff;--c-gold:#f7c64b;--c-text:#d3eef7;--c-sub:#79a7bb;--c-border:#1c7e9e8c;font-family:Microsoft YaHei,PingFang SC,Helvetica Neue,Arial,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;padding:0;overflow:hidden}body{color:var(--c-text);-webkit-font-smoothing:antialiased;background:#020c14}ul,li,h1,h3,p{margin:0;padding:0;list-style:none}.screen-wrap{background:#020b12;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;overflow:hidden}.screen{transform-origin:50%;background:radial-gradient(72% 55% at 50% -5%,#085e7c66,#0000 72%),radial-gradient(60% 50% at 50% 105%,#053a524d,#0000 72%),#03101a;flex-direction:column;flex:none;width:1920px;height:1080px;padding:0 22px;display:flex;position:relative;overflow:hidden}.screen:before{content:"";pointer-events:none;background-image:linear-gradient(#1868841a 1px,#0000 1px),linear-gradient(90deg,#1868841a 1px,#0000 1px);background-size:48px 48px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(#000 15%,#0000 88%);mask-image:radial-gradient(#000 15%,#0000 88%)}.screen:after{content:"";pointer-events:none;border:1px solid #1c7e9e33;position:absolute;inset:0;box-shadow:inset 0 0 100px #0000008c}.screen-header{z-index:3;flex:none;height:100px;position:relative}.screen-header:before{content:"";background:linear-gradient(90deg,#0000,#19dbe8e6,#0000);height:2px;position:absolute;top:0;left:6%;right:6%;box-shadow:0 0 14px #19dbe8cc}.hd-left{position:absolute;top:28px;left:18px}.hd-slogan{letter-spacing:4px;color:#c9edf8;text-shadow:0 0 12px #19dbe873;font-size:18px}.hd-center{text-align:center;width:980px;position:absolute;top:8px;left:50%;transform:translate(-50%)}.hd-center h1{letter-spacing:3px;white-space:nowrap;color:#f0fdff;text-shadow:0 0 20px #46e1fabf,0 2px 6px #000000b3;font-size:30px;font-weight:700}.hd-sub{letter-spacing:9px;color:#62b2c9;margin-top:8px;font-size:13px}.hd-right{align-items:center;gap:22px;display:flex;position:absolute;top:18px;right:14px}.hd-stat{flex-direction:column;align-items:flex-end;gap:3px;display:flex}.hd-stat label{color:var(--c-sub);letter-spacing:1px;font-size:11px}.hd-stat b{color:var(--c-cyan-l);letter-spacing:1px;font-variant-numeric:tabular-nums;font-size:21px;font-weight:600}.hd-fullscreen{color:#9fe6f2;letter-spacing:1px;background:#062c3e99;border:1px solid #19dbe880;align-items:center;gap:7px;padding:6px 12px;font-size:12px;text-decoration:none;display:flex}.hd-fullscreen:hover{color:#fff;border-color:var(--c-cyan);box-shadow:0 0 12px #19dbe859}.screen-body{z-index:2;flex:1;grid-template-columns:420px minmax(0,1fr) 400px;gap:14px;min-height:0;padding:4px 0 18px;display:grid;position:relative}.col{flex-direction:column;gap:14px;min-height:0;display:flex}.col-left>.p-kpi{flex:1.45}.col-left>.p-trend{flex:1}.col-left>.p-promoter,.col-right>.p-ledger{flex:1.15}.col-right>.p-goods,.col-right>.p-shop{flex:1}.col-center{gap:12px}.panel{border:1px solid var(--c-border);background:linear-gradient(#082535cc,#031420b8);flex-direction:column;min-height:0;display:flex;position:relative;box-shadow:inset 0 0 26px #0078a01a,0 0 12px #00000040}.corner{border:0 solid var(--c-cyan);pointer-events:none;z-index:2;width:11px;height:11px;position:absolute}.corner.tl{border-top-width:2px;border-left-width:2px;top:-1px;left:-1px}.corner.tr{border-top-width:2px;border-right-width:2px;top:-1px;right:-1px}.corner.bl{border-bottom-width:2px;border-left-width:2px;bottom:-1px;left:-1px}.corner.br{border-bottom-width:2px;border-right-width:2px;bottom:-1px;right:-1px}.panel-head{background:linear-gradient(90deg,#006e914d,#0000);border-bottom:1px solid #1c7e9e59;flex:none;align-items:center;gap:8px;height:34px;padding:0 12px;display:flex}.head-bar{background:var(--c-cyan);width:3px;height:14px;box-shadow:0 0 8px var(--c-cyan)}.panel-title{letter-spacing:1px;color:#dff7ff;white-space:nowrap;font-size:14px;font-weight:600}.panel-extra{color:var(--c-sub);white-space:nowrap;margin-left:auto;font-size:10px}.head-arrow{border-top:6px solid #6bf8ffbf;border-left:5px solid #0000;border-right:5px solid #0000;width:0;height:0;margin-left:auto}.panel-extra+.head-arrow{margin-left:8px}.panel-body{flex:1;min-height:0;padding:8px 10px;position:relative;overflow:hidden}.echart{width:100%;height:100%}.panel-body>.echart,.panel-body>.map-layer,.panel-body>.kpi-grid,.panel-body>.ledger-wrap,.panel-body>.rank-list{width:auto;height:auto;position:absolute;inset:8px 10px}.kpi-grid{grid-template-rows:repeat(3,1fr);grid-template-columns:1fr 1fr;gap:10px;display:grid}.kpi-card{background:linear-gradient(135deg,#0a3a4ee0,#051e2d99);border:1px solid #1e8caa73;align-items:center;gap:10px;padding:6px 10px;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 0 16px #0096be1f}.kpi-card:after{content:"";background:var(--c-cyan);width:2px;height:100%;box-shadow:0 0 8px var(--c-cyan);position:absolute;top:0;left:0}.kpi-icon{width:36px;height:36px;color:var(--c-cyan-l);background:radial-gradient(circle at 35% 30%,#3cc8e159,#06283ae6);border:1px solid #50dcf08c;border-radius:50%;flex:none;justify-content:center;align-items:center;display:flex;box-shadow:0 0 12px #19dbe84d}.kpi-icon svg{width:20px;height:20px}.kpi-label{color:#8fbecd;white-space:nowrap;font-size:11px}.kpi-value{color:#f2fdff;letter-spacing:.5px;white-space:nowrap;text-shadow:0 0 12px #19dbe859;margin-top:3px;font-size:19px;font-weight:700}.kpi-value span{color:#8fbecd;margin-left:3px;font-size:11px;font-weight:400}.rank-list{flex-direction:column;justify-content:space-around;gap:2px;display:flex}.rank-empty{text-align:center;color:var(--c-sub);letter-spacing:1px;font-size:12px}.rank-list li{grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:3px 7px;display:grid}.rank-no{color:#04141f;background:#19dbe8bf;border-radius:2px;justify-content:center;align-items:center;width:16px;height:16px;font-size:10px;font-weight:700;display:flex}.rank-no.top{background:var(--c-gold);box-shadow:0 0 8px #f7c64b80}.rank-name{color:#a9d3e2;text-overflow:ellipsis;white-space:nowrap;font-size:11px;overflow:hidden}.rank-value{color:#eafcff;white-space:nowrap;font-size:11px;font-weight:600}.rank-track{background:#ffffff0f;border-radius:2px;grid-column:2/4;height:3px;overflow:hidden}.rank-track i{border-radius:2px;height:100%;display:block}.rank-track i.gold{background:linear-gradient(90deg,#f7c64b38,#f7c64b);box-shadow:0 0 6px #f7c64b80}.rank-track i.cyan{background:linear-gradient(90deg,#19dbe82e,#19dbe8);box-shadow:0 0 6px #19dbe880}.map-area{flex:1;min-height:0;position:relative}.map-layer{position:absolute;inset:0;overflow:hidden}.map-glow{pointer-events:none;background:radial-gradient(#0c608247,#0000 70%);border-radius:50%;width:660px;height:440px;position:absolute;top:46%;left:50%;transform:translate(-50%,-50%)}.map-orbit{pointer-events:none;border:1px solid #19dbe838;border-radius:50%;position:absolute;top:62%;left:62%;transform:translate(-50%,-50%)rotate(-24deg)scaleY(.62)}.orbit-1{width:360px;height:360px}.orbit-2{border-color:#19dbe829;width:520px;height:520px}.orbit-3{border-color:#19dbe81a;width:700px;height:700px}.live-box{z-index:5;background:#041c2ae0;border:1px solid #19dbe873;width:520px;position:absolute;bottom:4px;left:0;box-shadow:0 0 20px #00000073}.live-head{color:#dffaff;letter-spacing:1px;background:linear-gradient(90deg,#147896a6,#06283a59);align-items:center;gap:7px;height:26px;padding:0 10px;font-size:12px;font-weight:600;display:flex}.live-head i{background:var(--c-cyan);width:3px;height:12px;box-shadow:0 0 8px var(--c-cyan)}.live-box ul{flex-direction:column;gap:6px;padding:7px 10px;display:flex}.live-box li{color:#a9d3e2;white-space:nowrap;align-items:center;gap:7px;font-size:10.5px;display:flex}.live-idx{color:#04141f;background:var(--c-cyan);border-radius:50%;flex:none;justify-content:center;align-items:center;width:16px;height:16px;font-size:10px;font-weight:700;display:flex}.live-idx.gold{background:var(--c-gold)}.live-city{color:#dffaff;text-overflow:ellipsis;width:104px;overflow:hidden}.live-no{color:#6fa6bc;text-overflow:ellipsis;flex:1;min-width:0;font-size:10px;overflow:hidden}.live-amt{color:var(--c-gold);font-weight:600}.live-tag{color:#8ee9f5;border:1px solid #19dbe880;padding:1px 6px;font-size:10px}.center-bottom{flex:none;grid-template-columns:1.15fr .9fr;gap:12px;height:248px;display:grid}.center-bottom>.panel{min-height:0}.ledger-wrap{flex-direction:column;display:flex}.ledger-total{border-bottom:1px dashed #1c7e9e73;flex:none;padding-bottom:8px}.lt-label{color:#9bd0df;letter-spacing:1px;font-size:12px}.lt-value{color:var(--c-gold);text-shadow:0 0 16px #f7c64b66;margin-top:2px;font-size:30px;font-weight:700}.lt-value span{margin-left:4px;font-size:14px;font-weight:400}.ledger-list{flex-direction:column;flex:1;justify-content:space-around;min-height:0;padding-top:6px;display:flex}.lg-row{align-items:center;gap:7px;font-size:12px;display:flex}.lg-idx{width:12px;color:var(--c-cyan);font-size:11px}.lg-name{color:#a9d3e2}.lg-val{color:#eafcff;margin-left:auto;font-weight:600}.lg-track{background:#ffffff0f;border-radius:3px;height:5px;margin-top:5px;overflow:hidden}.lg-track i{border-radius:3px;height:100%;display:block}.lg-track i.gold{background:linear-gradient(90deg,#f7c64b38,#f7c64b);box-shadow:0 0 8px #f7c64b80}.lg-track i.cyan{background:linear-gradient(90deg,#19dbe82e,#19dbe8);box-shadow:0 0 8px #19dbe880}
