@import "https://fonts.googleapis.com/css2?family=Rajdhani:wght@500;600;700&display=swap";:root{color:#d9f6ff;font-synthesis:none;background:#030a17;font-family:Microsoft YaHei,Arial,sans-serif}*{box-sizing:border-box}body{margin:0;overflow:hidden}.dashboard{background:radial-gradient(circle at 50% 40%,#0b3154 0,#061729 42%,#020817 100%);min-width:1180px;height:100vh;min-height:720px;position:relative;overflow:hidden}.grid-overlay{pointer-events:none;z-index:4;background-image:linear-gradient(#00a9ff08 1px,#0000 1px),linear-gradient(90deg,#00a9ff08 1px,#0000 1px);background-size:42px 42px;position:absolute;inset:0}.topbar{z-index:20;background:linear-gradient(#021026fa,#03142dcc);border-bottom:1px solid #16adf3;justify-content:space-between;align-items:center;height:88px;padding:0 28px;display:flex;position:absolute;inset:0 0 auto;box-shadow:0 4px 25px #009eff40}.topbar:after{content:"";clip-path:polygon(0 0,100% 0,96% 100%,4% 100%);background:#0189dd;height:7px;position:absolute;bottom:-7px;left:28%;right:28%}.brand{align-items:center;gap:13px;min-width:340px;display:flex}.brand-mark{color:#24d9ff;text-shadow:0 0 16px #00c8ff;font-size:36px}.brand small,.detail-modal small{color:#43a9dc;letter-spacing:4px;font-size:10px}.brand h1{letter-spacing:5px;text-shadow:0 0 12px #2db9ff;margin:2px 0;font-size:24px}.top-center{text-align:center;position:absolute;top:10px;left:50%;transform:translate(-50%)}.digits{gap:6px;display:flex}.digits b{background:linear-gradient(#0b5ca6,#062458 50%,#0a4a8c);border:1px solid #288cd0;place-items:center;width:29px;height:38px;font-family:Rajdhani,sans-serif;font-size:27px;display:grid;box-shadow:inset 0 0 8px #1e8fe8,0 0 7px #0056a9}.top-center>span{color:#a6dcff;font-size:12px}.weather{color:#79ddff;font-size:13px}.weather em{color:#94aebe;margin-left:20px;font-style:normal}.live-dot{background:#30efb4;border-radius:50%;width:8px;height:8px;margin-right:6px;display:inline-block;box-shadow:0 0 8px #30efb4}.stage{position:absolute;inset:88px 0 54px}.depot-scene{position:absolute;inset:0}.depot-scene canvas{display:block}.scene-shade{pointer-events:none;background:linear-gradient(90deg,#020816b8 0,#0000 28% 72%,#020816b8 100%),linear-gradient(#0000 75%,#02081673);position:absolute;inset:0}.scene-hint{color:#66bee9;clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);background:#011632d1;border:1px solid #097fc8;padding:7px 18px;font-size:11px;position:absolute;bottom:15px;left:50%;transform:translate(-50%)}.scene-hint i{border-left:1px solid #2b6d91;height:10px;margin:0 13px;display:inline-block}.left-column,.right-column{z-index:5;flex-direction:column;gap:12px;width:350px;display:flex;position:absolute;top:14px;bottom:10px}.left-column{left:18px}.right-column{right:18px}.panel{background:linear-gradient(135deg,#031735e0,#020d23c7);border:1px solid #2096dc57;box-shadow:inset 0 0 30px #004c9829}.panel-title{letter-spacing:1px;background:linear-gradient(90deg,#0b8fd073,#06386633,#0000);border-bottom:1px solid #1687c2;align-items:center;height:31px;font-size:14px;display:flex}.panel-title i,.warehouse-card header i{background:#16e5b5;width:9px;height:9px;margin:0 10px;transform:rotate(45deg);box-shadow:0 0 8px #16e5b5}.panel-title b{background:linear-gradient(90deg,#138ed1,#0000);flex:1;height:1px;margin-left:15px}.panel-body{padding:12px}.stats-grid{grid-template-columns:1fr 1fr;gap:15px 10px;display:grid}.stats-grid>div{grid-template-rows:22px 26px;grid-template-columns:45px 1fr;align-items:center;display:grid}.icon{color:#20e4ff;background:#075493;border:1px solid #15b8f0;border-radius:50%;grid-row:1/3;place-items:center;width:38px;height:38px;font-style:normal;display:grid;box-shadow:0 0 10px #0077c5}.stats-grid span{color:#91aec1;font-size:12px}.stats-grid strong{color:#fff;font:700 20px Rajdhani}.stats-grid small{color:#9dc2d5;margin-left:4px;font:11px sans-serif}.left-column .panel:nth-child(2){flex:1;min-height:190px}.stock-ring{float:left;background:conic-gradient(#20c9f4 0 74%,#0a3158 74%);border-radius:50%;place-items:center;width:155px;height:155px;margin:6px 0;display:grid;box-shadow:0 0 20px #0fb7f540}.stock-ring:before{content:"";background:#07172c;border:8px solid #0a3763;border-radius:50%;width:115px;height:115px;position:absolute}.stock-ring div{z-index:1;text-align:center;position:relative}.stock-ring strong{font:700 31px Rajdhani;display:block}.stock-ring span{color:#719ab1;font-size:11px}.legend{margin-left:170px;padding-top:40px}.legend p{color:#8caabc;margin:16px 0;font-size:11px}.legend i,.capacity-data i{background:#15c3ee;border-radius:2px;width:7px;height:7px;margin-right:7px;display:inline-block}.legend p:nth-child(2) i,.capacity-data p:nth-child(2) i{background:#15528d}.legend b{color:#fff;margin:4px 0 0 14px;font:18px Rajdhani;display:block}.person-rings{text-align:center;justify-content:space-around;display:flex}.person-rings>div{background:radial-gradient(circle,#07182c 54%,transparent 56%),conic-gradient(var(--c) calc(var(--p)*1%),#0b385e 0);border-radius:50%;align-content:center;place-items:center;width:89px;height:89px;display:grid;position:relative}.person-rings b{font:22px Rajdhani}.person-rings span{color:#b2cbd8;width:110px;font-size:11px;position:absolute;top:96px;left:-10px}.person-rings small{color:#7895a8;font-size:11px;position:absolute;top:117px}.left-column .panel:nth-child(3){height:176px}.right-column .panel:first-child{height:180px}.right-column .panel:nth-child(2){height:210px}.right-column .panel:nth-child(3){flex:1;min-height:220px}table{border-collapse:collapse;text-align:center;width:100%;font-size:10px}th{color:#71bce7;border-bottom:1px solid #15547a;padding:7px 2px;font-weight:400}td{color:#bed8e8;border-bottom:1px solid #26648c40;padding:8px 2px}.tag{border-radius:2px;padding:2px 5px}.tag.in{color:#29e2ae;background:#18dea429}.tag.out{color:#ffb54a;background:#ffaf4526}.capacity{align-items:center;height:158px;display:flex}.gauge{background:radial-gradient(circle,#06152d 40%,#0b4380 42%,#06152d 50%,transparent 51%),conic-gradient(#15c9f2 0 74%,#0b315b 74%);border-radius:50%;place-items:center;width:145px;height:145px;display:grid;box-shadow:0 0 20px #062e60}.gauge div{text-align:center}.gauge strong{font:700 27px Rajdhani;display:block}.gauge span{color:#62a8ce;font-size:10px}.capacity-data{flex:1;padding-left:16px}.capacity-data p{color:#8aaac0;margin:12px 0;font-size:11px}.capacity-data b{color:#fff;margin-left:10px;font:22px Rajdhani}.capacity-data small{margin-left:3px}.capacity-data .safe{color:#35d6af;background:#16cb971a;padding:7px}.monitor{gap:9px;height:145px;display:flex}.monitor nav{flex-direction:column;gap:5px;width:89px;display:flex;overflow:auto}.monitor button{color:#9bd8fb;cursor:pointer;background:#07315e;border:1px solid #087ec0;border-radius:3px;padding:6px 2px;font-size:10px}.monitor button.active{color:#fff;background:#0878bb;box-shadow:0 0 8px #078add}.video{background:#07182d;border:1px solid #198bd0;flex:1;position:relative;overflow:hidden}.video img,.video video{object-fit:cover;width:100%;height:100%}.rec{color:#ff5665;background:#0000008c;padding:3px 6px;font-size:9px;position:absolute;top:7px;right:8px}.camera-meta{color:#789aad;justify-content:space-between;padding-top:9px;font-size:10px;display:flex}.camera-meta b{color:#31dbac}.hover-tip{z-index:10;pointer-events:none;color:#d9f7ff;background:#062a52;border:1px solid #19bff5;padding:6px 9px;font-size:11px;position:absolute;transform:translate(14px,-50%);box-shadow:0 0 12px #047db1}.warehouse-card{z-index:12;background:#030f28f0;border:1px solid #1bb9ff;width:310px;padding-bottom:12px;position:absolute;top:38%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 28px #0093ff73}.warehouse-card header{background:linear-gradient(90deg,#087eca,#062252);align-items:center;height:37px;font-size:15px;display:flex}.warehouse-card header button{color:#fff;cursor:pointer;background:0 0;border:0;margin-left:auto;margin-right:8px;font-size:22px}.warehouse-main{padding:9px 14px 2px}.warehouse-main p{color:#91a9bd;margin:7px 0;font-size:12px}.warehouse-main b{color:#e9f6ff;float:right}.warehouse-card h4{border-left:3px solid #24d9c0;margin:8px 14px 5px;padding-left:7px;font-size:12px}.metric{justify-content:space-around;display:flex}.metric p{color:#839db0;text-align:center;font-size:10px}.metric b{color:#31a8ee;margin-top:4px;font:700 17px Rajdhani;display:block}.danger{color:#ff4059!important}.green{color:#16d6ab!important}.detail-btn{color:#fff;cursor:pointer;background:linear-gradient(90deg,#0768b1,#09a2d4);border:1px solid #29d8ff;margin:7px auto 0;padding:7px 20px;display:block}.detail-modal{z-index:8;pointer-events:none;background:#020f242e;border:1px solid #12b5f259;position:absolute;inset:20px 390px}.detail-modal>header{pointer-events:auto;background:linear-gradient(90deg,#042245f0,#03132bb3);border-bottom:1px solid #0f8fd1;justify-content:space-between;height:63px;padding:10px 16px;display:flex}.detail-modal h2{margin:3px 0;font-size:20px}.detail-modal header button{color:#b9eaff;cursor:pointer;background:#063a66;border:1px solid #0c8fc8;height:30px}.detail-note{background:#031b37d9;border-left:2px solid #13cce5;padding:11px;font-size:11px;position:absolute;top:80px;left:16px}.detail-note b{margin-bottom:7px;font-size:14px;display:block}.detail-note span{color:#64caa8}.detail-note p{color:#7294a8;margin:6px 0 0}.detail-side{pointer-events:auto;background:#031631e6;border:1px solid #09659a;width:180px;padding:14px;position:absolute;top:80px;right:15px}.detail-side h3{margin:0 0 7px;font-size:13px}.big-temp{text-align:center;color:#2be1c1;font:700 48px Rajdhani}.big-temp small{font-size:18px}.detail-side>p{text-align:center;color:#829caf;font-size:10px}.detail-side hr{border:0;border-top:1px solid #155277}.mini-metrics{grid-template-columns:1fr 1fr;gap:12px 7px;display:grid}.mini-metrics span{color:#83a0b2;font-size:9px}.mini-metrics b{color:#42b9f5;margin-top:4px;font:18px Rajdhani;display:block}.status-box{color:#31dbad;text-align:center;background:#14ce9a1f;margin-top:14px;padding:9px;font-size:11px}footer{z-index:20;color:#547d98;background:linear-gradient(#05204a,#03152e);border-top:1px solid #0d78b9;justify-content:space-between;align-items:center;height:54px;padding:0 22px;font-size:10px;display:flex;position:absolute;bottom:0;left:0;right:0}footer nav{gap:15px;display:flex;position:absolute;left:50%;transform:translate(-50%)}footer button{color:#9bcfed;clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,8px 100%,0 50%);background:linear-gradient(#064b82,#04244f);border:1px solid #087bc1;width:130px;padding:9px}footer button.active{color:#fff;background:linear-gradient(#087bb9,#06437c);box-shadow:0 0 15px #0789db}@media (height<=820px){.topbar{height:72px}.stage{top:72px}.left-column,.right-column{gap:7px;top:8px}.panel-title{height:27px}.panel-body{padding:8px}.right-column .panel:first-child{height:152px}.right-column .panel:nth-child(2){height:170px}.left-column .panel:nth-child(3){height:145px}.stock-ring{width:120px;height:120px}.stock-ring:before{width:90px;height:90px}.legend{margin-left:135px;padding-top:22px}.person-rings>div{width:70px;height:70px}.person-rings span{top:76px}.person-rings small{top:95px}}.monitor nav{scrollbar-width:none;-ms-overflow-style:none;overflow:hidden auto}.monitor nav::-webkit-scrollbar{width:0;height:0;display:none}.monitor nav button{flex:none}.detail-modal{background:radial-gradient(circle at 50% 55%,#0062a81f,#01091b3d);border-color:#19b5ff8c;box-shadow:inset 0 0 55px #0073d71f}.detail-note span{margin-top:5px;display:block}.sensor-grid{pointer-events:none;z-index:5;perspective:520px;transform-style:preserve-3d;background:repeating-linear-gradient(90deg,#0000 0 11.7%,#27d6ff26 11.9% 12.05%,#0000 12.2% 12.5%),radial-gradient(#0d97e021,#0000 68%);border-radius:46%;position:absolute;inset:27% 22% 18%;transform:rotateX(-3deg)rotateY(8deg)}.sensor-grid:before,.sensor-grid:after{content:"";border:1px solid #18c0ff33;border-radius:48%;position:absolute;inset:-4% -10%;transform:translateZ(-48px)scale(.88);box-shadow:inset 0 0 25px #0095ff1f}.sensor-grid:after{border-color:#52deff21;transform:translateZ(42px)scale(1.05)}.sensor-grid button{left:calc(5% + var(--column) * 11.25%);top:calc(5% + var(--row) * 13%);cursor:crosshair;width:9px;height:9px;opacity:calc(.68 + (var(--depth) + 1) * .15);transform:translate3d(calc(var(--depth) * 18px), calc(var(--depth) * -5px), calc(var(--depth) * 58px)) scale(calc(1 + var(--depth) * .16));transform-style:preserve-3d;background:#45f36d;border:0;border-radius:50%;padding:0;transition:transform .15s,box-shadow .15s,opacity .15s;position:absolute;box-shadow:0 0 5px #32ff64,0 0 10px #2eff66a6}.sensor-grid button:after{content:"";background:linear-gradient(#1cd8ff66,#0000);width:1px;height:28px;margin:7px auto 0;display:block}.sensor-grid button:hover{z-index:10;opacity:1;transform:translate3d(calc(var(--depth) * 18px), calc(var(--depth) * -5px), calc(var(--depth) * 58px + 45px)) scale(2.1);box-shadow:0 0 6px #fff,0 0 14px}.sensor-grid button.depth-0{filter:brightness(.7)saturate(.75)}.sensor-grid button.depth-1{filter:brightness(.92)}.sensor-grid button.depth-2{filter:brightness(1.22)}.sensor-grid button.预警{color:#ffc52e;background:#ffc52e;box-shadow:0 0 7px #ffc52e}.sensor-grid button.异常{color:#ff4352;background:#ff4352;box-shadow:0 0 8px #ff4352}.sensor-tooltip{z-index:30;pointer-events:none;background:linear-gradient(145deg,#032143f7,#020d22f7);border:1px solid #22bff7;width:186px;padding:9px 11px 11px;position:absolute;transform:translate(16px,-50%);box-shadow:0 0 20px #00b1ff80,inset 0 0 16px #0069be33}.sensor-tooltip:before{content:"";background:#07315c;border-bottom:1px solid #22bff7;border-left:1px solid #22bff7;width:11px;height:11px;position:absolute;top:calc(50% - 6px);left:-7px;transform:rotate(45deg)}.sensor-tooltip header{color:#bdeeff;border-bottom:1px solid #1e91cd6b;justify-content:space-between;align-items:center;padding-bottom:7px;font:600 12px Rajdhani,sans-serif;display:flex}.sensor-tooltip header b{color:#48ef8b;background:#2ee17c1f;border-radius:8px;padding:2px 7px;font-size:10px}.sensor-tooltip.预警{border-color:#ffc52e}.sensor-tooltip.异常{border-color:#ff4352}.sensor-tooltip.预警 header b{color:#ffd45d;background:#ffc52e26}.sensor-tooltip.异常 header b{color:#ff6571;background:#ff435226}.sensor-tooltip>div{grid-template-columns:1fr 1fr;gap:9px;padding-top:9px;display:grid}.sensor-tooltip p{color:#769bb1;margin:0;font-size:10px}.sensor-tooltip strong{color:#e5f9ff;margin-top:3px;font:700 23px Rajdhani,sans-serif;display:block}.sensor-tooltip small{color:#67b9d9;margin-left:2px;font-size:9px}.sensor-tooltip .sensor-coordinate{color:#5da8c9;letter-spacing:.3px;border-top:1px solid #279cd352;margin:9px 0 0;padding-top:7px;font:9px Rajdhani,sans-serif}
