:root{--color-bg-deep:#030b19;--color-bg-navy:#07182d;--color-panel:#081f37db;--color-cyan:#20d9ff;--color-cyan-soft:#6cecff;--color-text:#e7f7ff;--color-text-muted:#88aabd;--color-warning-yellow:#f4d03f;--color-warning-orange:#ff8a24;--color-warning-red:#ff3b4f;--border-cyan:1px solid #20d9ff6b;--shadow-cyan:0 0 18px #20d9ff29}*{box-sizing:border-box}html,body,#app{width:100%;min-width:320px;height:100%;margin:0;overflow:hidden}body{color:var(--color-text);background:radial-gradient(circle at 50% 20%, var(--color-bg-navy), var(--color-bg-deep) 72%);font-family:Inter,Microsoft YaHei,system-ui,sans-serif}button,input{font:inherit}.app-shell{min-height:100%}.route-placeholder{min-height:100vh;color:var(--color-cyan);letter-spacing:.16em;place-items:center;display:grid}.initialization-fallback{min-height:100vh;color:var(--color-text);place-content:center;justify-items:center;gap:16px;display:grid}.initialization-fallback button{color:var(--color-cyan);border:var(--border-cyan);background:var(--color-panel);cursor:pointer;padding:8px 20px}.dashboard:before{content:"";pointer-events:none;opacity:.18;background-image:linear-gradient(#1cb6e514 1px,#0000 1px),linear-gradient(90deg,#1cb6e514 1px,#0000 1px);background-size:42px 42px;animation:18s linear infinite grid-drift;position:absolute;inset:0}.dashboard:after{content:"";pointer-events:none;background:linear-gradient(#0000,#37cfff06,#0000) 0 0/100% 9px;animation:9s linear infinite scanline;position:absolute;inset:0}.dashboard{position:relative}.dashboard .body,.dashboard .top{z-index:1;position:relative}.dashboard .panel,.dashboard .metrics article,.dashboard .trend{clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}.dashboard .panel{box-shadow:inset 0 0 30px #1389c412,0 0 20px #00081459}.dashboard .panel h2:before{content:"";vertical-align:-1px;background:#19d7ff;width:3px;height:13px;margin-right:9px;display:inline-block;box-shadow:0 0 9px #19d7ff}.dashboard .top h1:before,.dashboard .top h1:after{content:"◆";color:#1cbfe9;vertical-align:4px;margin:0 18px;font-size:12px}.dashboard .top time{white-space:nowrap}.dashboard .metrics b,.dashboard .ring strong{font-variant-numeric:tabular-nums;text-shadow:0 0 14px #46dcff59}.dashboard .scene{box-shadow:inset 0 0 55px #0c7bb21a}.dashboard[data-demo-step=tour-zone-1] .scene,.dashboard[data-demo-step=tour-zone-2] .scene{border-color:#2dc9ef;box-shadow:0 0 26px #19d7ff38,inset 0 0 55px #0c7bb226}.dashboard[data-demo-step=trigger-warning] .warnings,.dashboard[data-demo-step=focus-device] .warnings{animation:1.2s ease-in-out infinite alert-panel}.dashboard[data-demo-step=trigger-warning] .top{box-shadow:inset 0 -3px #ff4654}.dashboard .warnings button:hover{background:#1769912e}@keyframes grid-drift{to{background-position:42px 42px}}@keyframes scanline{to{background-position:0 1080px}}@keyframes alert-panel{50%{border-color:#ff4654;box-shadow:0 0 24px #ff46544d}}.dashboard-reference{transform-origin:0 0;color:#d8f4ff;background:radial-gradient(circle at 50% 34%,#0a3658,#03172e 52%,#010a18);width:1920px;height:1080px;font-size:13px;position:relative;overflow:hidden}.dashboard-reference button{color:inherit;cursor:pointer}.dashboard-head{z-index:2;background:linear-gradient(#061d35 0%,#031326 100%);border-bottom:1px solid #155980;grid-template-columns:1fr 2.2fr 1fr;align-items:center;height:66px;padding:0 25px;display:grid;position:relative}.dashboard-head:after{content:"";background:#15bdff;height:2px;position:absolute;bottom:-1px;left:29%;right:29%;box-shadow:0 0 16px #13bfff}.dashboard-head h1{text-align:center;color:#fff;letter-spacing:.11em;text-shadow:0 0 15px #4ab8ff;margin:0;font-size:28px;position:relative}.dashboard-head h1:before,.dashboard-head h1:after{content:"";border-bottom:1px solid #108ee0;width:55px;height:50px;position:absolute;top:-17px}.dashboard-head h1:before{left:-18px;transform:skew(35deg)}.dashboard-head h1:after{right:-18px;transform:skew(-35deg)}.head-status,.head-actions{color:#77a6c0;align-items:center;gap:22px;display:flex}.head-status small{color:#42cdf3}.head-actions{justify-content:flex-end}.head-actions button{background:#062942;border:1px solid #185f87;padding:7px 11px}.business-nav{z-index:2;background:#031327;border-bottom:1px solid #124c6e;grid-template-columns:repeat(9,1fr);height:58px;display:grid;position:relative}.business-nav button{color:#a8c7d8;background:0 0;border:0;border-right:1px solid #0a3450;font-size:14px;position:relative}.business-nav button i{color:#47d4fa;margin-right:9px;font-style:normal}.business-nav button.active{color:#fff;background:linear-gradient(#0a4f7c,#073254);box-shadow:inset 0 -3px #1bc8ff,0 0 25px #0aa8f644}.business-nav button.active:after{content:"";filter:blur(5px);background:#27d8ff;height:4px;position:absolute;bottom:0;left:20%;right:20%}.dashboard-grid{z-index:2;grid-template-columns:385px 1fr 385px;gap:12px;height:700px;padding:10px 14px 8px;display:grid;position:relative}.column{gap:10px;min-height:0;display:grid}.left-column{grid-template-rows:210px 185px 160px 1fr}.right-column{grid-template-rows:240px 240px 1fr}.center-column{grid-template-rows:1fr 132px;gap:10px;min-width:0;display:grid}.dash-panel,.scene-frame{clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,8px 100%,0 calc(100% - 8px));background:linear-gradient(145deg,#051f39f5,#020f1ff0);border:1px solid #12628e;min-height:0;position:relative;box-shadow:inset 0 0 24px #1699da14,0 0 12px #00000059}.dash-panel:after,.scene-frame:after{content:"";pointer-events:none;border:1px solid #26b5ee14;position:absolute;inset:3px}.dash-panel h2{z-index:1;color:#caefff;letter-spacing:.05em;background:linear-gradient(90deg,#083654,#0000);border-bottom:1px solid #104462;height:39px;margin:0;padding:10px 14px 9px 32px;font-size:15px;position:relative}.dash-panel h2:before{content:"◢";color:#20c9f4;position:absolute;left:10px}.dash-panel h2 small{float:right;color:#5e9ab8;font-size:11px;font-weight:400}.summary-cards{grid-template-columns:repeat(3,1fr);gap:7px;padding:9px;display:grid}.summary-cards article{background:linear-gradient(#0a3153,#061d35);border:1px solid #0d3b5c;border-radius:4px;padding:10px 8px}.summary-cards span{color:#83abc0;font-size:11px;display:block}.summary-cards strong{color:#eefbff;font-variant-numeric:tabular-nums;font-size:26px}.summary-cards small{color:#62a2c1;margin-left:4px}.summary-cards .alarm-number{color:#ff5260}.donut{text-align:center;font-variant-numeric:tabular-nums;border-radius:50%;place-content:center;display:grid}.donut b{color:#ecfaff;font-size:18px;display:block}.donut span{color:#7aa5bb;font-size:10px}.warning-stats .donut,.online-panel .donut,.device-status .donut{width:105px;height:105px;position:absolute;top:55px;left:22px}.warning-donut{background:radial-gradient(circle,#061b31 53%,transparent 55%),conic-gradient(#ff3647 0 7%,#ff9d16 7% 17%,#ffd32b 17% 39%,#17aef0 39%)}.warning-stats ul{margin:15px 15px 0 150px;padding:0;list-style:none}.warning-stats li{color:#a2c0d0;align-items:center;margin:10px 0;display:flex}.warning-stats li i,.device-status li i{width:8px;height:8px;margin-right:8px}.warning-stats li b{margin-left:auto}.red{background:#ff4355;color:#ff4355!important}.orange{background:#ff9c20;color:#ff9c20!important}.yellow{background:#ffd02c;color:#ffd02c!important}.blue{background:#27aef0;color:#27aef0!important}.green{background:#2bd680;color:#2bd680!important}.online-donut{background:radial-gradient(circle,#061b31 56%,transparent 58%),conic-gradient(#16d1c5 0 96%,#17436a 96%)}.online-donut b{color:#1fe6ba}.online-panel p{color:#97b7c8;grid-template-columns:1fr auto;gap:12px;margin:24px 14px 0 155px;display:grid}.online-panel p i{width:8px;height:8px;margin-right:6px;display:inline-block}.type-panel{padding-bottom:8px}.type-row{color:#91afc0;grid-template-columns:72px 1fr 40px;align-items:center;gap:8px;margin:8px 15px;font-size:11px;display:grid}.type-row>i{background:#0b2944;height:8px}.type-row>i b{background:linear-gradient(90deg,#126bb5,#21d5e8);height:100%;display:block;box-shadow:0 0 8px #20cbed}.type-row em{text-align:right;color:#c8e3ef;font-style:normal}.scene-frame{border-color:#1477a6}.scene-frame>*{width:100%;height:100%}.function-panel>div{z-index:2;grid-template-columns:repeat(8,1fr);gap:12px;padding:12px 20px;display:grid;position:relative}.function-panel button{background:0 0;border:0;justify-items:center;gap:6px;font-size:11px;display:grid;position:relative}.function-panel button i{color:#8fefff;background:linear-gradient(#124b70,#092842);border:1px solid #1a5c83;border-radius:7px;place-items:center;width:52px;height:46px;font-size:23px;font-style:normal;display:grid;box-shadow:inset 0 0 15px #21b8ee22}.function-panel button.danger i{color:#ff5967;border-color:#8d3544}.function-panel button em{background:#ff253d;border-radius:50%;width:17px;height:17px;font-style:normal;position:absolute;top:-4px;right:17px}.live-warning button{z-index:2;text-align:left;background:linear-gradient(90deg,#082a45,#0000);border:0;border-bottom:1px solid #103b58;grid-template-columns:25px 1fr 62px;align-items:center;gap:9px;width:100%;height:39px;padding:4px 10px;display:grid;position:relative}.live-warning button>i{border:1px solid;border-radius:50%;place-items:center;width:23px;height:23px;font-style:normal;display:grid;background:0 0!important}.live-warning button span b{color:#d9f0f8;white-space:nowrap;text-overflow:ellipsis;font-size:11px;display:block;overflow:hidden}.live-warning button span small{color:#617f91;white-space:nowrap;text-overflow:ellipsis;font-size:9px;display:block;overflow:hidden}.live-warning button time{color:#cbe5f0;font-size:10px}.trend-panel .trend{clip-path:none;background:0 0;border:0;height:calc(100% - 39px)}.trend-panel .trend header{display:none}.device-donut{background:radial-gradient(circle,#061b31 56%,transparent 58%),conic-gradient(#22d47d 0 91%,#ff4355 91% 96%,#ffc62b 96%)}.device-status ul{margin:25px 12px 0 158px;padding:0;list-style:none}.device-status li{color:#9ab8c8;grid-template-columns:10px 1fr 28px 50px;align-items:center;margin:9px 0;display:grid}.device-status li em{color:#3fd98c;font-style:normal}.bottom-grid{z-index:2;grid-template-columns:1.02fr 1.1fr 1.35fr;gap:12px;height:234px;padding:0 14px 12px;display:grid;position:relative}.risk-map{background:radial-gradient(at 60% 55%,#ec3b1f 0 12%,#f38f19 13% 27%,#d9c839 28% 37%,#2a7561 38% 55%,#113750 56%);width:58%;height:160px;position:absolute;top:53px;left:14px;overflow:hidden;box-shadow:inset 0 0 30px #031525}.risk-map:after{content:"";background:repeating-linear-gradient(25deg,#0000 0 11px,#b7f1df15 12px 13px);position:absolute;inset:0}.risk-map span,.risk-map b{z-index:2;position:absolute;top:11px;left:12px}.risk-map b{color:#ffcf34;top:31px}.risk-map i{background:#ff3c42;border-radius:50%;width:7px;height:7px;position:absolute;box-shadow:0 0 9px #ff2e37}.risk-map i:first-of-type{top:45%;left:57%}.risk-map i:nth-of-type(2){top:66%;left:38%}.risk-map i:nth-of-type(3){top:71%;left:70%}.radar-mini{text-align:center;clip-path:polygon(50% 0,100% 38%,81% 100%,19% 100%,0 38%);background:repeating-radial-gradient(circle,#0000 0 13px,#1a789933 14px 15px),conic-gradient(#1de4de22,#1598c455,#0000 65%);place-content:end center;width:34%;height:120px;padding-bottom:7px;display:grid;position:absolute;top:73px;right:17px}.radar-mini span{color:#ffad27}.decision-panel>div{z-index:2;grid-template-columns:1.4fr 1fr;gap:10px;height:190px;padding:12px 14px;display:grid;position:relative}.decision-panel ol{color:#a9c2ce;margin:0;padding-left:24px;line-height:25px}.decision-panel figure{clip-path:polygon(20% 10%,100% 0,100% 100%,0 100%,0 30%);background:linear-gradient(#0000,#051223),url(/images/open-pit-aerial.png) 50%/cover;margin:0;position:relative}.decision-panel figure span{color:#94eaff;position:absolute;bottom:7px;right:8px}.alarm-records table{z-index:2;border-collapse:collapse;width:calc(100% - 20px);margin:9px 10px;font-size:10px;position:relative}.alarm-records th{color:#8bb4c8;background:#082944;padding:6px}.alarm-records td{color:#b8d1dc;border-bottom:1px solid #10324b;padding:6px}.alarm-records td.red,.alarm-records td.orange,.alarm-records td.yellow{background:0 0}.alarm-records td b{color:#1edb88;background:#0b473e;border-radius:3px;padding:3px 6px}@media (width<=1919px),(height<=1079px){.dashboard-reference{transform:scale(min(calc(100vw / 1920),calc(100vh / 1080)))}}.summary-cards>button{color:inherit;cursor:pointer;text-align:left;background:linear-gradient(#0a3153,#061d35);border:1px solid #0d3b5c;border-radius:4px;padding:10px 8px}.summary-cards>button:hover{filter:brightness(1.08);border-color:#20bce9}.panel-link{float:right;background:0 0;border:0;padding:0;font-size:11px;font-weight:400;color:#5e9ab8!important}.panel-link:hover{color:#66dcff!important}.alarm-records tbody tr{cursor:pointer}.alarm-records tbody tr:hover{background:#0c77ae24}.platform-shell{color:#dcefff;background:#020b18 radial-gradient(circle at 50% 0,#0074b838,#0000 46%);min-height:100vh;overflow:auto}.platform-header{background:#020e1eeb;border-bottom:1px solid #23b2ff57;justify-content:space-between;align-items:center;height:68px;padding:0 28px;display:flex;box-shadow:0 8px 30px #00000038}.platform-brand{color:#edf9ff;cursor:pointer;text-align:left;background:0 0;border:0;align-items:center;gap:12px;display:flex}.platform-brand>i{color:#7ce8ff;background:#0088d824;border:1px solid #1fc7ff;place-items:center;width:38px;height:38px;display:grid;transform:rotate(45deg)}.platform-brand>i:first-letter{transform:rotate(-45deg)}.platform-brand span{gap:3px;display:grid}.platform-brand b{letter-spacing:.08em;font-size:20px}.platform-brand small{color:#52819e;letter-spacing:.22em;font-size:9px}.platform-header-info{color:#7aa7c2;align-items:center;gap:20px;font-size:13px;display:flex}.platform-header-info time{color:#73dcff;font:600 17px ui-monospace}.platform-header-info b{color:#e0f4ff;font-weight:500}.platform-nav{background:#010e1fd1;border-bottom:1px solid #137fc361;height:52px;padding:0 22px;display:flex}.platform-nav button{color:#7399b4;cursor:pointer;background:0 0;border:0;min-width:112px;height:100%;padding:0 16px;position:relative}.platform-nav button i{color:#36bfee;margin-right:8px;font-style:normal}.platform-nav button:hover,.platform-nav button.active{color:#f1fbff;background:linear-gradient(#0089d70a,#0097ea33)}.platform-nav button.active:after{content:"";background:#24d7ff;height:2px;position:absolute;bottom:0;left:14px;right:14px;box-shadow:0 0 12px #12c6ff}.platform-content{width:min(1560px,100vw - 40px);min-height:calc(100vh - 120px);margin:0 auto;padding:22px 0 36px}.page-heading{justify-content:space-between;align-items:end;min-height:58px;margin-bottom:16px;display:flex}.page-heading small{color:#3d7698;letter-spacing:.22em;font-size:10px}.page-heading h1{letter-spacing:.12em;margin:5px 0 0;font-size:23px}.platform-panel{background:linear-gradient(145deg,#041c36e6,#020f20f5);border:1px solid #1494da59;box-shadow:inset 0 0 26px #006eae12,0 12px 32px #00000029}.platform-panel-title{border-bottom:1px solid #1892d140;justify-content:space-between;align-items:center;min-height:48px;padding:0 18px;display:flex}.platform-panel-title h2{letter-spacing:.08em;margin:0;font-size:15px}.platform-panel-title h2:before{color:#19d5ff;content:"◆";margin-right:9px}.toolbar{flex-wrap:wrap;gap:10px;padding:14px 16px;display:flex}.toolbar input,.toolbar select,.form-grid input,.form-grid select,.form-grid textarea{color:#d9f4ff;background:#021122e0;border:1px solid #2d91c67a;outline:none;height:36px;padding:0 12px}.toolbar input:focus,.toolbar select:focus,.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{border-color:#22c7f5;box-shadow:0 0 0 2px #18bef01a}.primary-button,.ghost-button,.danger-button,.action-button{cursor:pointer;border:1px solid #168fc8;min-height:34px;padding:0 15px}.primary-button{color:#fff;background:linear-gradient(135deg,#0875bd,#08a9cf)}.ghost-button,.action-button{color:#8bdfff;background:#054a732e}.danger-button,.primary-button.danger{color:#ffdad4;background:#a92d2759;border-color:#be4f48}.primary-button:hover,.ghost-button:hover,.danger-button:hover,.action-button:hover{filter:brightness(1.18)}.data-table-wrap{width:100%;overflow-x:auto}.platform-table{border-collapse:collapse;width:100%;font-size:13px}.platform-table th{color:#6f9db8;text-align:left;background:#0052851f;height:42px;padding:0 14px;font-weight:500}.platform-table td{color:#cce3ef;border-top:1px solid #156e9f33;height:50px;padding:7px 14px}.platform-table tbody tr{cursor:pointer;transition:all .15s}.platform-table tbody tr:hover{background:#0988ca21}.empty-cell{color:#52768b!important;text-align:center!important;height:160px!important}.table-pagination{color:#7196ab;justify-content:flex-end;align-items:center;gap:12px;padding:14px;display:flex}.table-pagination button{color:#7ddfff;cursor:pointer;background:#061c31;border:1px solid #225f83;width:30px;height:28px}.table-pagination button:disabled{opacity:.35;cursor:default}.status-pill,.level-pill{border:1px solid;justify-content:center;align-items:center;min-width:54px;height:24px;padding:0 9px;font-size:12px;display:inline-flex}.status-pill.online,.level-pill.normal{color:#35e6ad;background:#10976924;border-color:#35e6ad73}.status-pill.offline{color:#849bad;background:#55626e24;border-color:#435665}.status-pill.alarm,.level-pill.red{color:#ff6a65;background:#c02a2426;border-color:#ff534d7a}.level-pill.orange{color:#ff9e48;background:#ca671724;border-color:#b86625}.level-pill.yellow,.status-pill.pending{color:#ffd75c;background:#ae8b171f;border-color:#987b1e}.level-pill.attention{color:#7edaff;background:#1e77a121;border-color:#287fa8}.drawer-overlay,.dialog-overlay{z-index:90;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#00050dad;position:fixed;inset:0}.detail-drawer{background:linear-gradient(160deg,#061d37,#020b17 65%);border-left:1px solid #167bb1;flex-direction:column;max-width:94vw;height:100%;display:flex;position:absolute;top:0;right:0;box-shadow:-20px 0 50px #00000073}.detail-drawer>header{border-bottom:1px solid #28a6e247;justify-content:space-between;align-items:center;min-height:76px;padding:0 22px;display:flex}.detail-drawer header small{color:#32789d;letter-spacing:.2em;font-size:9px}.detail-drawer h2{margin:4px 0 0;font-size:19px}.detail-drawer header button{color:#78cef0;cursor:pointer;background:#005a8f21;border:1px solid #256a91;width:35px;height:35px;font-size:24px}.drawer-body{flex:1;padding:20px 22px;overflow:auto}.detail-drawer>footer{border-top:1px solid #28a6e233;justify-content:flex-end;gap:10px;padding:16px 22px;display:flex}.dialog-overlay{z-index:100;place-items:center;display:grid}.confirm-dialog{text-align:center;background:linear-gradient(145deg,#092744,#041222);border:1px solid #206e98;width:min(420px,100vw - 32px);padding:28px;box-shadow:0 24px 80px #0000008c}.dialog-icon{color:#fc5;border:1px solid #b4822e;border-radius:50%;place-items:center;width:52px;height:52px;margin:0 auto 14px;font-size:24px;display:grid}.dialog-icon.danger{color:#ff746f;border-color:#af4842}.confirm-dialog h2{margin:0;font-size:19px}.confirm-dialog p{color:#8caabc;margin:12px 0 24px;line-height:1.7}.confirm-dialog footer{justify-content:center;gap:12px;display:flex}.toast-host{z-index:130;gap:10px;display:grid;position:fixed;top:84px;right:22px}.toast-message{color:#ddf5ff;cursor:pointer;text-align:left;background:#04233af5;border:1px solid #1689bb;align-items:center;gap:10px;min-width:240px;padding:12px 16px;display:flex;box-shadow:0 8px 30px #00000059}.toast-message i{color:#2af0b5;border:1px solid;border-radius:50%;place-items:center;width:22px;height:22px;font-style:normal;display:grid}.toast-message.warning i{color:#ffc251}.toast-message.error i{color:#ff6e69}.drawer-enter-active,.drawer-leave-active,.dialog-enter-active,.dialog-leave-active{transition:opacity .2s}.drawer-enter-active .detail-drawer,.drawer-leave-active .detail-drawer{transition:transform .24s}.drawer-enter-from,.drawer-leave-to,.dialog-enter-from,.dialog-leave-to{opacity:0}.drawer-enter-from .detail-drawer,.drawer-leave-to .detail-drawer{transform:translate(100%)}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.form-grid label{color:#80a7be;gap:7px;font-size:12px;display:grid}.form-grid .full{grid-column:1/-1}.form-error{color:#ff7770;font-size:11px}@media (width<=1100px){.platform-nav{overflow-x:auto}.platform-nav button{min-width:100px}.platform-header-info span{display:none}.platform-content{width:calc(100vw - 24px)}.platform-brand b{font-size:16px}}@media (width<=700px){.platform-header{padding:0 14px}.platform-brand small,.platform-header-info b{display:none}.platform-brand b{font-size:13px}.platform-header-info{gap:8px}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}}