:root{color:#eef6ff;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#07111f;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:#07111f;min-width:320px;min-height:100vh;margin:0}button{font:inherit}h1,h2,h3,p,dl,dd{margin:0}.app-shell{background:radial-gradient(circle at 50% 0,#1c72c23d,#0000 34%),linear-gradient(#071528fa,#050c18),#07111f;min-height:100vh;padding:14px 20px;overflow:hidden}.topbar{justify-content:space-between;align-items:center;gap:16px;min-height:78px;margin-bottom:10px;display:flex}.brand-block{min-width:0}.eyebrow{color:#79c8ff;margin-bottom:6px;font-size:13px}h1{color:#f6fbff;letter-spacing:0;font-size:clamp(24px,2.5vw,34px);font-weight:800}.subtitle{color:#b9cce0;margin-top:6px;font-size:15px}.top-actions{align-items:center;gap:12px;display:flex}.breadcrumb-bar{align-items:center;gap:8px;min-height:38px;margin:-2px 0 10px;display:flex;overflow-x:auto}.breadcrumb-bar button,.search-chip{color:#cfe7fb;white-space:nowrap;background:#081a309e;border:1px solid #4a9ce042;border-radius:8px;align-items:center;gap:8px;min-height:32px;padding:0 12px;display:inline-flex}.breadcrumb-bar button{cursor:pointer}.breadcrumb-bar button:after{color:#5f91bd;content:"/"}.breadcrumb-bar button:last-of-type:after{content:""}.search-chip{color:#88aeca;margin-left:auto}.gateway-chip,.icon-button,.module-nav button,.secondary-button{color:#eaf6ff;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0d1f36c7;border:1px solid #4a9ce057;border-radius:8px;justify-content:center;align-items:center;display:inline-flex}.gateway-chip{color:#b7daf6;white-space:nowrap;gap:8px;min-height:40px;padding:0 14px}.gateway-chip strong{color:#45e0ff}.toolbar{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.icon-button{cursor:pointer;gap:8px;min-height:40px;padding:0 14px}.icon-button:hover,.secondary-button:hover,.module-nav button:hover{background:#14395ddb;border-color:#62beffb8}.icon-button.warning{color:#ffd28a}.dashboard{grid-template-columns:minmax(270px,340px) minmax(480px,1fr) minmax(270px,340px);gap:14px;height:calc(100vh - 286px);min-height:420px;display:grid;overflow:hidden}.side-column{overscroll-behavior:contain;flex-direction:column;gap:12px;min-width:0;min-height:0;padding-right:4px;display:flex;overflow:hidden auto}.side-column::-webkit-scrollbar{width:6px}.side-column::-webkit-scrollbar-track{background:#091b3066;border-radius:999px}.side-column::-webkit-scrollbar-thumb{background:#439ce48a;border-radius:999px}.panel,.scene-panel{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:linear-gradient(#0c233dd1,#061222db),#08182ccc;border:1px solid #4693d847;border-radius:8px;box-shadow:0 18px 46px #00000052}.panel{padding:12px 16px}.panel-title{color:#dff3ff;align-items:center;gap:8px;min-height:28px;margin-bottom:10px;display:flex}.panel-title h2{font-size:16px;font-weight:800}.status-card{color:#99f6cb;background:#0f3c2b8a;border:1px solid #3ad59247;border-radius:8px;align-items:center;gap:12px;min-height:50px;padding:8px 12px;display:flex}.status-card.danger{color:#ffb8b8;background:#52151c99;border-color:#ff5b5b80}.status-card span,.oee-row span,.overview-list dt,.production-values span,.progress-meta span,.gateway-grid span,.metric-stack span{color:#98bad4;margin-bottom:4px;font-size:12px;display:block}.status-card strong{color:currentColor;font-size:19px}.overview-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0;display:grid}.overview-list div,.production-values div,.gateway-grid div,.metric-stack div{justify-content:space-between;align-items:center;gap:12px;min-height:30px;display:flex}.overview-list dd,.gateway-grid strong,.metric-stack strong{color:#f2fbff;font-size:19px;font-weight:800}.oee-row{grid-template-columns:88px 1fr;align-items:center;gap:14px;min-height:74px;display:grid}.oee-ring{background:radial-gradient(circle at center, #07111f 52%, transparent 53%), conic-gradient(#21a5ff var(--percent), #194269c2 0);border-radius:50%;place-items:center;width:72px;height:72px;display:grid;box-shadow:0 0 24px #1d9cff3d}.oee-ring strong{font-size:18px}.oee-row strong,.production-values strong,.progress-meta strong{color:#f4fbff;font-size:20px}.oee-row small{color:#7fb0cf;margin-top:8px;display:block}.production-values{grid-template-columns:1fr 1fr;gap:12px;display:grid}.progress-track{background:#1a3b5bd1;border-radius:999px;height:11px;margin:14px 0 8px;overflow:hidden}.progress-track span{border-radius:inherit;background:linear-gradient(90deg,#12d5b0,#39b8ff);height:100%;display:block}.progress-meta{justify-content:space-between;align-items:center;display:flex}.alarm-list{gap:6px;display:grid}.alarm-row{color:#d8e8f5;grid-template-columns:50px 1fr;align-items:center;gap:10px;font-size:14px;display:grid}.alarm-row time{color:#9ab4ca}.alarm-row .error{color:#ff8e66;font-weight:800}.alarm-row .warn{color:#ffd27e}.alarm-row .info{color:#76dbff}.alarm-row small{color:#86a8c1;margin-top:3px;font-size:12px;font-weight:500;display:block}.secondary-button{cursor:pointer;width:100%;min-height:30px;margin-top:8px}.energy-chart{width:100%;height:72px;display:block}.energy-grid{fill:none;stroke:#6493b938;stroke-width:1px}.energy-line{fill:none;stroke:#19a8ff;stroke-linecap:round;stroke-linejoin:round;stroke-width:3px;filter:drop-shadow(0 0 6px #19a8ff9e)}.scene-stage{min-height:100%;position:relative;overflow:hidden}.twin-stage{min-height:100%;padding:72px 28px 28px;position:relative;overflow:hidden}.spatial-stage{padding:0}.spatial-twin-scene{z-index:1;width:100%;height:100%;position:absolute;inset:0;overflow:hidden}.spatial-twin-scene canvas{display:block}.spatial-tooltip{z-index:5;color:#dff5ff;pointer-events:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#051220db;border:1px solid #5fcdff73;border-radius:8px;gap:4px;width:min(260px,34vw);padding:10px 12px;display:grid;position:absolute;box-shadow:0 14px 34px #00000057}.spatial-tooltip strong{color:#f6fbff;font-size:14px}.spatial-tooltip span{color:#9ec4dd;font-size:12px;line-height:1.45}.view-mode-switch{z-index:4;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#07182bc2;border:1px solid #5da4da47;border-radius:8px;grid-template-columns:repeat(3,minmax(58px,1fr));gap:6px;padding:6px;display:inline-grid;position:absolute;top:18px;right:18px}.view-mode-switch button{color:#a9c5dc;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:7px;min-height:30px}.view-mode-switch button.active,.view-mode-switch button:hover{color:#f5fbff;background:#134c74b8;border-color:#54cdff99}.twin-stage:before{pointer-events:none;content:"";background-color:#0000;background-image:linear-gradient(90deg,#2070b81c 1px,#0000 1px),linear-gradient(0deg,#2070b81a 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:44px 44px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#0000,#000 18% 78%,#0000);mask-image:linear-gradient(#0000,#000 18% 78%,#0000)}.factory-stage,.floor-stage,.device-stage{background:radial-gradient(circle at 56% 36%,#2da0d22e,#0000 32%),linear-gradient(140deg,#0b273eeb,#050f1df5)}.factory-building{z-index:2;perspective:900px;align-content:center;gap:18px;width:min(760px,92%);height:100%;margin:0 auto;display:grid;position:relative}.floor-slab{color:#ecf8ff;text-align:left;min-height:106px;transform:rotateX(50deg) rotateZ(-7deg) translateX(calc(var(--level) * 22px));cursor:pointer;background:linear-gradient(90deg,#1e5f82e0,#0d2942eb),#0a2036db;border:1px solid #67b6ff57;border-radius:8px;grid-template-columns:90px 1fr auto;align-items:center;gap:18px;padding:18px 22px;display:grid;box-shadow:0 28px 42px #00000047,inset 0 1px #ffffff1f}.floor-slab:hover{transform:rotateX(50deg) rotateZ(-7deg) translateX(calc(var(--level) * 22px)) translateY(-8px);border-color:#82d2ffd1}.floor-slab.selected,.workshop-zone.selected,.line-pill.selected{border-color:#48dcffeb;box-shadow:0 0 0 1px #48dcff3d,0 24px 58px #00000057}.floor-slab span{color:#70ddff;font-size:34px;font-weight:900}.floor-slab strong,.floor-slab small{display:block}.floor-slab strong{font-size:20px}.floor-slab small{color:#a9c5dc}.workshop-grid{z-index:2;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;height:100%;display:grid;position:relative}.workshop-zone{background:linear-gradient(135deg,#184560d1,#081c2ee6),#071728e0;border:1px solid #5eaceb5c;border-radius:8px;flex-direction:column;min-height:220px;padding:18px;display:flex}.workshop-zone header{justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.workshop-zone header span{color:#7ccfff;font-size:13px}.workshop-zone header strong{color:#f4fbff;font-size:24px}.zone-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:18px 0;display:grid}.zone-kpis span{color:#bfd9ec;background:#0615268f;border:1px solid #6ca6d22e;border-radius:8px;min-height:40px;padding:10px;font-size:13px}.line-list{gap:10px;margin-top:auto;display:grid}.line-pill{color:#eff9ff;cursor:pointer;background:#0e263cd1;border:1px solid #5ba5e447;border-radius:8px;grid-template-columns:1fr auto;align-items:center;gap:12px;min-height:54px;padding:0 14px;display:grid}.line-pill:hover{border-color:#70ccffd1}.line-pill strong{color:#57e0ff}.process-ribbon{z-index:5;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;display:grid;position:absolute;bottom:18px;left:18px;right:18px}.process-step{color:#e9f7ff;cursor:pointer;background:#081c32db;border:1px solid #5ca9e457;border-radius:8px;grid-template-columns:24px 1fr;align-items:center;gap:8px;min-height:44px;padding:0 10px;display:grid}.process-step span{color:#031321;background:#42d7ff;border-radius:999px;place-items:center;width:24px;height:24px;font-size:12px;font-weight:900;display:grid}.process-step strong{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:13px;overflow:hidden}.device-model{z-index:2;place-items:center;height:100%;display:grid;position:relative}.device-shell{aspect-ratio:1.5;background:linear-gradient(90deg,#c6d6e033 0 10%,#0000 10% 90%,#c6d6e033 90%),linear-gradient(145deg,#243643f5,#0d1a28f5);border:2px solid #80c7ff5c;border-radius:8px;width:min(620px,86%);position:relative;box-shadow:0 32px 70px #00000061}.device-shell:before{content:"";border:1px dashed #75d8ff66;border-radius:8px;position:absolute;inset:12% 16%}.device-light{background:#51e89b;border-radius:999px;width:16px;height:16px;position:absolute;top:16px;right:18px;box-shadow:0 0 18px #51e89bbf}.device-model.status-warning .device-light{background:#ffbf47;box-shadow:0 0 20px #ffbf47c7}.device-window{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid;position:absolute;inset:22% 20%}.device-window span{color:#dff5ff;background:#0a2136d1;border:1px solid #58b3ff4d;border-radius:8px;place-items:center;min-height:72px;font-weight:800;display:grid}.device-conveyor{background:#0c1c29eb;border-radius:999px;gap:16px;width:min(680px,92%);height:42px;margin-top:-18px;padding:9px 18px;display:flex}.device-conveyor span{border-radius:inherit;opacity:.74;background:linear-gradient(90deg,#2ee6a2,#38bdf8);flex:1}.status-warning{border-color:#ffbe47a3!important}.status-stopped,.status-offline{border-color:#ff6363ad!important}.status-maintenance{border-color:#ffdc6f94!important}.drill-row{text-align:left;cursor:pointer;background:0 0;border:0;width:100%}.scene-stage:before{z-index:1;pointer-events:none;content:"";background:linear-gradient(#050c1885,#0000 18% 72%,#050c1875),radial-gradient(circle at 50% 46%,#0000 0%,#050c181f 58%,#050c18a8 100%);position:absolute;inset:0}.scene-heading{z-index:3;flex-direction:column;gap:4px;display:flex;position:absolute;top:16px;left:20px}.scene-heading span{color:#b7dcff;font-size:13px}.scene-heading strong{color:#f7fbff;font-size:22px}.production-scene{width:100%;height:100%;min-height:0;overflow:hidden}.scene-float{z-index:4;color:#dff2ff;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#081c35d1;border:1px solid #459be766;border-radius:8px;width:min(240px,28vw);padding:12px 14px;position:absolute;box-shadow:0 16px 38px #0000004d}.scene-float h3{margin-bottom:8px;font-size:18px}.scene-float p{color:#c4d8e9;margin-top:5px;font-size:14px}.scene-float strong{color:#2ee6a2}.scene-float.danger{border-color:#ff6559ad}.scene-float.danger strong{color:#ff8e7a}.workpiece-card{width:min(286px,34vw);inset:auto 18px 18px auto}.station-panel{flex-direction:column;gap:10px;display:flex}.station-row{color:#edf7ff;text-align:left;cursor:pointer;background:#12273ebd;border:1px solid #4c84b342;border-radius:8px;grid-template-columns:12px 1fr;align-items:center;gap:10px;width:100%;min-height:62px;padding:10px 12px;display:grid}.station-row:hover,.station-row.selected{background:#1b3a5adb;border-color:#68bcffb8}.station-row strong,.station-row small{display:block}.station-row small{color:#99b3c9;margin-top:4px}.state-dot{background:#8794a2;border-radius:999px;width:10px;height:10px}.state-dot.run{background:#47e59a;box-shadow:0 0 10px #47e59aad}.state-dot.wait{background:#f1bd4b;box-shadow:0 0 10px #f1bd4b94}.state-dot.fault{background:#ff6262;box-shadow:0 0 10px #ff62629e}.gateway-grid,.metric-stack,.insight-list{gap:8px;display:grid}.gateway-grid div,.metric-stack div{border-bottom:1px solid #6299c424;flex-direction:column;align-items:flex-start;min-height:48px;padding-bottom:8px}.gateway-grid div:last-child,.metric-stack div:last-child{border-bottom:0}.gateway-grid strong{font-size:16px}.insight-list button{color:#edf7ff;text-align:left;cursor:pointer;background:#12273ebd;border:1px solid #4c84b342;border-radius:8px;grid-template-columns:1fr auto;align-items:center;gap:4px 12px;min-height:58px;padding:10px 12px;display:grid}.insight-list button:hover{background:#1b3a5adb;border-color:#68bcffb8}.insight-list span,.maintenance-box strong,.maintenance-box span{min-width:0}.insight-list strong{color:#57e0ff;font-size:18px}.insight-list small{color:#9eb9ce;grid-column:1/-1}.maintenance-box{color:#eaf6ff;background:#37271057;border:1px solid #ffbe4747;border-radius:8px;gap:10px;padding:12px;display:grid}.maintenance-box strong{color:#ffd27e}.maintenance-box span{color:#b9cce0;line-height:1.5}.trend-chips{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;display:grid}.trend-chips i{color:#96e7ff;text-align:center;background:#061627b8;border-radius:8px;padding:6px 4px;font-style:normal}.module-nav{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;width:min(980px,100vw - 40px);margin:8px auto 0;display:grid}.module-nav button{color:#cfe7fb;cursor:pointer;flex-direction:column;gap:5px;min-height:62px;padding:8px 10px}.module-nav button.active{color:#fff;background:linear-gradient(#1560d2f0,#0c3c96f0);border-color:#4996ffe6;box-shadow:0 14px 36px #1963dc52}.module-nav span{font-weight:700}@media (width<=1280px){.dashboard{grid-template-columns:minmax(250px,310px) minmax(420px,1fr)}.side-column:last-of-type{grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr));display:grid}}@media (width<=980px){.app-shell{overflow:auto}.topbar,.top-actions{flex-direction:column;align-items:flex-start}.dashboard,.side-column:last-of-type{grid-template-columns:1fr}.production-scene{min-height:560px}.scene-float{width:min(260px,42vw)}.module-nav{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=640px){.app-shell{padding:12px}.toolbar,.gateway-chip{width:100%}.icon-button{flex:94px}.production-values,.module-nav{grid-template-columns:1fr 1fr}.scene-float{width:auto;margin:10px;position:static}.workpiece-card{width:auto}}