:root{--v2-cyan:#22d9ff;--v2-blue:#117eea;--v2-red:#ff3e52;--v2-navy:#020b18;--v2-panel:rgba(5,22,43,.88)}
html,body{background:#020915}
body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 55% 8%,rgba(25,123,220,.13),transparent 38%),linear-gradient(rgba(25,92,150,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(25,92,150,.035) 1px,transparent 1px);background-size:auto,32px 32px,32px 32px;pointer-events:none}
.app-shell{grid-template:64px 1fr/206px 1fr;background:transparent}
.topbar{grid-area:1/1/2/3;height:64px;padding:0 18px;background:linear-gradient(180deg,rgba(4,14,29,.98),rgba(3,13,27,.9));border-bottom:1px solid rgba(38,207,255,.32);box-shadow:0 0 25px rgba(20,168,255,.08)}
.topbar:after{content:"";position:absolute;left:22%;right:22%;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--v2-cyan),transparent);box-shadow:0 0 10px var(--v2-cyan)}
.brand{width:206px}.brand small{color:#5d92bd}.plant-title strong{font-size:17px}.plant-title span{color:#5c87ac}.top-actions{width:440px}.sidebar{grid-area:2/1/3/2;display:flex;flex-direction:column;align-items:stretch;padding:18px 12px;background:linear-gradient(180deg,rgba(4,16,32,.98),rgba(3,12,25,.96));border-right:1px solid rgba(36,164,226,.24);border-bottom:0;box-shadow:12px 0 35px rgba(0,0,0,.18)}
.sidebar:before{content:"OPERATIONS";font-size:8px;letter-spacing:2px;color:#3f7199;padding:0 12px 12px}.sidebar nav{display:flex;flex-direction:column;gap:6px}.nav-item,.sidebar-foot button{height:48px;width:100%;justify-content:flex-start;padding:0 14px;border-radius:7px}.nav-item em{font-size:12px}.nav-icon{width:23px;text-align:center}.nav-item.active{background:linear-gradient(90deg,rgba(20,150,230,.22),rgba(13,78,139,.08));box-shadow:inset 3px 0 0 var(--v2-cyan),inset 0 0 20px rgba(31,207,255,.05)}
.sidebar-foot{margin:auto 0 0;display:flex;flex-direction:column;gap:12px}.sidebar-foot button{border:1px solid rgba(39,215,255,.2)}.connectivity{padding:11px 13px;border:1px solid rgba(75,224,160,.16);border-radius:7px;background:rgba(75,224,160,.035)}
main{grid-area:2/2/3/3;padding:16px 18px 18px;position:relative}.page.active{gap:11px}.page-heading{height:46px}.page-heading p{margin-bottom:3px}.page-heading h1{font-size:21px}.panel,.kpi{background:linear-gradient(145deg,rgba(8,31,56,.94),rgba(3,17,34,.96));border:1px solid rgba(41,149,211,.34);border-radius:8px;box-shadow:inset 0 0 26px rgba(18,109,176,.045),0 10px 30px rgba(0,0,0,.19);position:relative}.panel:before{content:"";position:absolute;left:10px;right:10px;top:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(54,215,255,.66),transparent);pointer-events:none}.panel:after{content:"";position:absolute;inset:0;border-radius:8px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.22);pointer-events:none}.panel:hover{border-color:rgba(49,196,250,.48)}
.primary{border-radius:6px;background:linear-gradient(135deg,#10bfe9,#146ee7);box-shadow:0 0 18px rgba(21,175,240,.19)}.secondary{border-radius:6px;background:#071b31}.kpi-grid{grid-template-columns:repeat(6,1fr);gap:8px;height:92px}.kpi{padding:11px 12px;cursor:pointer}.kpi strong{font-size:23px}.kpi p{margin-top:4px}.kpi-top span{font-size:8px}.sparkline{width:86px;bottom:4px}.alert-kpi button{margin-top:3px}.kpi.extra-kpi{display:block}.kpi.extra-kpi .kpi-symbol{position:absolute;right:11px;top:35px;font-size:20px;color:var(--kpi-color);filter:drop-shadow(0 0 8px var(--kpi-color))}.kpi.extra-kpi strong{color:var(--kpi-color)}
.overview-grid{height:auto;flex:1;min-height:345px;grid-template-columns:3fr 1fr;gap:9px}.plant-panel,.alerts-panel,.trend-panel,.shift-panel{padding:12px}.plant-panel{display:flex;flex-direction:column}.process-map{height:auto;flex:1;margin-top:7px;border:1px solid rgba(40,160,218,.22);background:#020b17}.process-backdrop{background:linear-gradient(90deg,rgba(2,10,20,.24),rgba(3,15,29,.06)),url('assets/smelter-digital-twin-v2.png') center/cover;opacity:.94}.process-map:after{background-size:28px 28px;opacity:.4}.plant-panel .unit,.flow-line,.process-summary{display:none}.twin-hotspot{position:absolute;z-index:6;border:0;background:transparent;cursor:pointer;text-align:left}.twin-hotspot i{display:block;width:18px;height:18px;border:3px solid var(--hot,#27d7ff);border-radius:50%;background:rgba(2,13,25,.8);box-shadow:0 0 0 6px rgba(39,215,255,.11),0 0 19px var(--hot,#27d7ff);animation:twinPulse 2s infinite}.twin-hotspot.alert i{--hot:#ff4c59}.twin-hotspot.warn i{--hot:#ffb84d}.twin-hotspot span{display:block;margin:7px 0 0 -34px;padding:5px 7px;width:max-content;max-width:130px;background:rgba(2,13,27,.88);border:1px solid rgba(52,169,225,.38);border-radius:4px;font-size:7px;color:#bdeaff}.twin-hotspot b{display:block;font-size:8px;color:white;margin-bottom:2px}.twin-hotspot em{font-style:normal;color:var(--hot,#27d7ff)}@keyframes twinPulse{50%{transform:scale(1.16);box-shadow:0 0 0 10px rgba(39,215,255,0),0 0 24px var(--hot,#27d7ff)}}
.twin-topline{position:absolute;z-index:5;left:11px;right:11px;top:10px;display:flex;gap:7px}.twin-topline span{padding:6px 8px;border:1px solid rgba(49,162,222,.25);border-radius:4px;background:rgba(2,13,27,.72);font-size:7px;color:#7ca3bf}.twin-topline b{color:#e8f7ff;margin-left:4px}.twin-footer{position:absolute;z-index:5;left:10px;right:10px;bottom:9px;display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.twin-footer span{padding:7px 8px;background:rgba(2,13,27,.84);border-left:2px solid var(--c);font-size:7px;color:#7090aa}.twin-footer b{display:block;color:#e7f7ff;font-size:10px;margin-top:3px}.map-controls{position:absolute;right:9px;top:9px;z-index:8;display:flex;gap:5px}.map-controls button{border:1px solid rgba(44,167,225,.32);background:rgba(4,20,37,.86);border-radius:4px;color:#89cbea;width:27px;height:27px;cursor:pointer}.map-controls button.active{background:rgba(28,182,237,.22);color:#fff}
.alerts-panel{min-width:0}.alert-list{gap:4px}.alert-row{height:36px}.alert-filter{display:flex;gap:4px;margin:7px 0}.alert-filter button{flex:1;border:1px solid #173957;background:#06182b;padding:5px 3px;border-radius:4px;font-size:7px;color:#6585a0}.alert-filter button.active{border-color:#2ad7ff;color:#d8f8ff;background:#0c344e}.alert-summary{height:65px;display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:auto}.alert-summary span{padding:7px;background:rgba(6,25,44,.7);border-radius:5px;text-align:center}.alert-summary b{font-size:15px;display:block}.alert-summary small{font-size:6px;color:#66849d}.alert-summary span:nth-child(1) b{color:#ff5263}.alert-summary span:nth-child(2) b{color:#ffb84d}.alert-summary span:nth-child(3) b{color:#4be0a0}
.bottom-grid{flex:0 0 220px;min-height:220px;grid-template-columns:2.2fr 1fr;gap:9px}.trend-panel .chart-wrap{min-height:145px}.shift-score{margin-top:0}.shift-panel .ring{width:88px;height:88px}.shift-panel .ring span{font-size:23px}.shift-breakdown{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:8px}.shift-breakdown span{padding:6px;background:#06192c;border-radius:4px;font-size:6px;color:#6f8aa3}.shift-breakdown b{display:block;font-size:9px;color:#d8efff;margin-top:2px}
.lang-toggle{height:32px;display:flex;border:1px solid rgba(39,215,255,.31);border-radius:6px;overflow:hidden;background:#07192c}.lang-toggle button{border:0;background:transparent;color:#64839d;font-size:9px;font-weight:800;padding:0 9px;cursor:pointer}.lang-toggle button.active{background:linear-gradient(135deg,#0a9fd0,#135fc8);color:white}.fullscreen-btn{border:1px solid #183854;background:#07182a;border-radius:6px;width:32px;height:32px;cursor:pointer;color:#7fb6d9}
.scene-grid{gap:9px}.sequence-panel,.control-panel,.energy-main,.energy-side,.inventory-panel,.recipe-panel,.constraints-panel,.map-panel,.logistics-side{padding:13px}.timeline{border:1px solid rgba(40,153,214,.24)}.production-flow{gap:0;position:relative;background:linear-gradient(rgba(26,104,157,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(26,104,157,.055) 1px,transparent 1px);background-size:20px 20px;margin-top:7px;border-radius:7px}.stage{border-radius:6px;box-shadow:inset 0 0 17px rgba(18,120,183,.05)}.process-toolbar{position:absolute;right:8px;top:8px;display:flex;gap:4px}.process-toolbar button{border:1px solid #234766;background:#071b30;border-radius:4px;width:26px;height:24px;color:#7cb5da;cursor:pointer}.process-subnodes{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);display:flex;gap:7px}.process-subnodes span{padding:5px 9px;border:1px solid rgba(49,170,226,.24);background:#06182a;border-radius:4px;font-size:7px;color:#7190a9}.process-health{position:absolute;left:8px;top:8px;font-size:7px;color:#4be0a0}.control-panel .decision-log{margin-top:auto}.control-panel .recommendation{margin-top:10px}
.metric-row{flex-basis:148px;gap:9px}.metric-card{padding:13px}.metric-card:before{display:none}.energy-layout,.blend-layout,.logistics-layout{gap:9px}.energy-main,.energy-side{padding:14px}.energy-flow{margin-top:8px}.energy-ring-row{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:8px 0}.energy-ring-row span{padding:8px;border:1px solid rgba(40,137,190,.19);background:#06182a;border-radius:5px;font-size:7px;color:#6f8ba3}.energy-ring-row b{display:block;margin-top:3px;font-size:11px;color:#dff6ff}.energy-ring-row i{float:right;color:#4be0a0;font-style:normal}.energy-side .savings{margin:10px 0;padding:10px}.dispatch-list{gap:5px}.dispatch-list li{padding:8px}.inventory-panel .material-list{gap:7px}.material{min-height:68px}.recipe-panel .blend-visual{margin:12px 0}.donut{width:170px;height:170px}.constraints-panel .sliders{margin-top:25px}.radar-mini{margin-top:auto;height:150px;position:relative;background:radial-gradient(circle,rgba(39,215,255,.05),transparent 67%)}.radar-mini svg{width:100%;height:100%}.radar-mini polygon.grid{fill:none;stroke:#1d4a68}.radar-mini polygon.data{fill:rgba(37,213,255,.13);stroke:#2ad8ff;stroke-width:2}.radar-mini text{font-size:8px;fill:#7090a8}.logistics-layout{min-height:0}.site-map{border:1px solid rgba(37,146,204,.22)}.logistics-side{display:flex;flex-direction:column}.truck-photo{height:125px}.truck-info{margin:8px 0}.logistics-metrics{flex-basis:135px}
.data-ticker{position:fixed;left:206px;right:0;bottom:0;height:22px;background:rgba(2,11,22,.96);border-top:1px solid rgba(36,173,230,.18);z-index:40;overflow:hidden;display:flex;align-items:center}.data-ticker div{white-space:nowrap;animation:ticker 32s linear infinite;font-size:7px;color:#587d99}.data-ticker b{color:#30d9ff;margin:0 7px 0 24px}@keyframes ticker{to{transform:translateX(-50%)}}
main{padding-bottom:28px}.drawer{background:linear-gradient(180deg,#06172a,#03101e);border-left-color:#24cffa}.drawer:before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:linear-gradient(transparent,var(--v2-cyan),var(--v2-red),transparent);box-shadow:0 0 14px var(--v2-cyan)}
body.zh .brand small{letter-spacing:1px}.page-heading h1,.panel-head h2,.nav-item em,.primary,.secondary{transition:none}
body.zh .sidebar:before{content:"运营中心"}
@media(max-width:1450px){.app-shell{grid-template-columns:176px 1fr}.brand{width:176px}.data-ticker{left:176px}.sidebar{padding-left:8px;padding-right:8px}.kpi-grid{grid-template-columns:repeat(3,1fr);height:174px}.overview-grid{min-height:280px}.bottom-grid{flex-basis:180px;min-height:180px}.top-actions{width:390px}.plant-title strong{font-size:14px}}
@media(max-height:820px){.app-shell{grid-template-rows:56px 1fr}.topbar{height:56px}.page-heading{height:39px}.kpi-grid{height:78px}.overview-grid{min-height:250px}.bottom-grid{flex-basis:160px;min-height:160px}.metric-row{flex-basis:120px}.scene-grid .timeline{min-height:120px}.data-ticker{height:18px}.sidebar{padding-top:11px}.nav-item{height:42px}}