:root{--cyan:#55e7df;--blue:#2f89ff;--orange:#ff8127;--line:rgba(87,177,200,.22)}*{box-sizing:border-box}html,body{margin:0;background:#030810;color:#edf8ff;font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}.dc{min-height:100svh;position:relative;padding-bottom:45px;background:radial-gradient(circle at 53% 44%,rgba(0,114,135,.13),transparent 31%),linear-gradient(135deg,#030810,#071322 58%,#040a12);overflow:hidden}#stars,.grid{position:absolute;inset:0;pointer-events:none}.grid{opacity:.16;background-image:linear-gradient(rgba(68,157,177,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(68,157,177,.12) 1px,transparent 1px);background-size:76px 76px;mask-image:radial-gradient(circle,black,transparent 80%)}header{height:72px;padding:0 3.2vw;display:flex;align-items:center;border-bottom:1px solid var(--line);background:rgba(3,10,17,.77);backdrop-filter:blur(18px);position:relative;z-index:5}.brand{display:flex;align-items:center;gap:9px;width:240px}.gear{width:36px;height:36px;border:6px dotted #1762a8;border-radius:50%;position:relative}.gear:after{content:"";position:absolute;width:20px;height:4px;background:var(--orange);left:10px;top:10px;border-radius:5px;box-shadow:9px 0 0 -1px var(--orange)}.brand b,.brand small{display:block;letter-spacing:1.4px}.brand b{font-size:16px;color:#2774bc}.brand small{font-size:11px;color:#7d8792;font-weight:700}nav{display:flex;height:100%;gap:5px}nav button{height:100%;padding:0 19px;border:0;border-bottom:2px solid transparent;background:transparent;color:#7e91a2;font:bold 10px monospace;letter-spacing:1.2px;cursor:pointer}nav button:hover,nav button.active{color:#eaf9ff;background:rgba(39,128,159,.09);border-color:var(--cyan)}.status{margin-left:auto;color:#65e9bd;font:bold 9px monospace;letter-spacing:1.2px}.status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#34e59b;box-shadow:0 0 12px #34e59b;margin-right:8px}.status span{color:#617687;margin-left:15px}.titlebar{max-width:1500px;margin:auto;padding:27px 24px 20px;display:flex;justify-content:space-between;align-items:flex-end;position:relative;z-index:2}.titlebar p,.panel-head span{margin:0 0 6px;color:var(--orange);font:bold 8px monospace;letter-spacing:2.6px}.titlebar h1{margin:0;font-size:clamp(25px,2.5vw,39px);letter-spacing:-1px}.titlebar h1 span{color:var(--cyan)}.weather{display:flex;gap:14px;align-items:baseline;border:1px solid var(--line);border-radius:15px;padding:11px 16px;background:rgba(8,24,39,.72)}.weather span{font:8px monospace;color:#75899a}.weather b{font-size:20px;color:#5de1e0}.weather small{color:#8fa4b4}.view{display:none}.active-view{display:grid}#summary{max-width:1500px;margin:auto;padding:0 24px;position:relative;z-index:2;grid-template-columns:1fr 1fr 1.35fr .85fr;grid-template-rows:165px 440px;gap:12px}.metric-grid{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.metric,.panel{border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,rgba(11,31,49,.88),rgba(5,17,29,.91));box-shadow:0 18px 50px rgba(0,0,0,.2);backdrop-filter:blur(12px)}.metric{padding:15px 17px;position:relative;overflow:hidden}.metric:before{content:"";position:absolute;left:0;top:24px;width:2px;height:42px;background:var(--cyan);box-shadow:0 0 12px var(--cyan)}.metric-top{display:flex;justify-content:space-between;font:bold 9px monospace;letter-spacing:1.4px;color:#8298a9}.metric-top i{font-style:normal;font-size:7px;color:#41dfac}.metric-value{font:bold 29px/1.1 Arial;margin-top:6px}.metric-value small{font-size:11px;color:#698297;margin-left:5px}.spark{position:absolute;width:49%;height:58px;right:15px;top:45px}.metric-foot{position:absolute;bottom:12px;left:17px;right:17px;border-top:1px solid rgba(105,164,184,.16);padding-top:7px;display:flex;justify-content:space-between;font:7px monospace;color:#607889}.metric-foot b{color:#5ae4da}.hall-map{grid-column:1/4;padding:20px}.panel-head{display:flex;justify-content:space-between;align-items:flex-start}.panel-head h2{margin:0;font-size:15px;letter-spacing:1px}.legend{font:7px monospace;color:#688094;letter-spacing:1px}.legend i{display:inline-block;width:6px;height:6px;background:var(--cyan);border-radius:50%;box-shadow:0 0 7px var(--cyan);margin:0 6px 0 13px}.legend .warm{background:var(--orange);box-shadow:0 0 7px var(--orange)}.hall-wrap{height:355px;margin-top:16px;border:1px solid rgba(78,150,177,.2);position:relative;border-radius:12px;background:linear-gradient(90deg,rgba(34,132,163,.04) 1px,transparent 1px),linear-gradient(rgba(34,132,163,.04) 1px,transparent 1px);background-size:30px 30px;display:flex;align-items:center;justify-content:center;overflow:hidden}.rack-field{width:64%;display:grid;grid-template-columns:repeat(10,1fr);gap:11px 8px;z-index:2}.rack{height:68px;border:1px solid #27627b;background:linear-gradient(90deg,#10283a,#16354a);border-radius:3px;position:relative;padding:4px;display:flex;align-items:flex-end;overflow:hidden;transition:.25s}.rack:hover{transform:translateY(-5px);border-color:var(--cyan);box-shadow:0 0 18px rgba(85,231,223,.2)}.rack i{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(#1f7483,#49e2d5);opacity:.7}.rack span{font:6px monospace;color:#c4f7f3;z-index:1}.rack.hot{border-color:var(--orange)}.rack.hot i{background:linear-gradient(#713d22,var(--orange))}.hall-label{position:absolute;top:50%;transform:translateY(-50%);width:14%;text-align:center}.hall-label.left{left:1%}.hall-label.right{right:1%}.hall-label b,.hall-label span{display:block}.hall-label b{font-size:11px}.hall-label span{font:7px monospace;color:#4ccfcb;margin-top:6px}.cold{position:absolute;left:18%;right:18%;height:15px;background:linear-gradient(90deg,transparent,rgba(35,118,212,.3),transparent);text-align:center;font:6px/15px monospace;color:#5fa9ee;letter-spacing:2px}.cold.top{top:13px}.cold.bottom{bottom:13px}.side-stack{display:grid;gap:12px}.score,.alerts{padding:18px}.gauge{width:138px;height:138px;margin:8px auto;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--cyan) 345deg,rgba(91,123,140,.16) 0);position:relative}.gauge:before{content:"";position:absolute;inset:12px;background:#071522;border-radius:50%}.gauge div{z-index:1;text-align:center}.gauge strong,.gauge span{display:block}.gauge strong{font-size:28px;color:#5de6df}.gauge span{font:7px monospace;letter-spacing:2px;margin-top:4px}.score p{font-size:9px;line-height:1.5;text-align:center;color:#6e8496}.alerts .panel-head>b{color:var(--orange);padding:5px 9px;border:1px solid rgba(255,129,39,.3);border-radius:12px}.alerts>div:not(.panel-head){display:flex;align-items:center;gap:9px;padding:11px 0;border-top:1px solid rgba(90,153,174,.12)}.alerts i{width:7px;height:7px;border-radius:50%;background:#34e59b;box-shadow:0 0 8px #34e59b}.alerts i.amber{background:var(--orange);box-shadow:0 0 8px var(--orange)}.alerts b,.alerts small{display:block;font-size:8px}.alerts small{color:#607588;margin-top:3px}#floor,#architecture{max-width:1500px;margin:auto;padding:0 24px;position:relative;z-index:2}.detail{min-height:605px;padding:22px;width:100%}.floor-hall{height:245px;margin:25px 2%;display:grid;grid-template-columns:130px repeat(8,1fr);grid-template-rows:repeat(4,1fr);gap:8px 12px;border:1px solid rgba(67,148,173,.18);border-radius:14px;padding:20px;background:rgba(3,14,24,.45)}.floor-name{grid-row:1/-1;display:flex;justify-content:center;flex-direction:column;border-right:1px solid var(--line)}.floor-name span{font:9px monospace;color:var(--cyan);margin-top:7px}.floor-rack{background:#102b3d;border:1px solid #295e76;border-radius:4px;position:relative;display:flex;align-items:center;justify-content:center}.floor-rack i{position:absolute;inset:0;background:linear-gradient(90deg,rgba(47,137,255,.22),rgba(85,231,223,.16))}.floor-rack span{z-index:1;font:7px monospace}.floor-rack.warn{border-color:var(--orange);box-shadow:0 0 14px rgba(255,129,39,.25)}.arch-tree{max-width:920px;height:510px;margin:auto;position:relative;display:flex;flex-direction:column;justify-content:space-around}.arch-row{display:flex;justify-content:center;gap:140px;position:relative;z-index:2}.arch-row.bottom{justify-content:space-between;gap:30px}.node{width:150px;height:98px;background:linear-gradient(145deg,#122f49,#0a1b2c);border:1px solid #2c6f8d;border-radius:15px;display:grid;grid-template-columns:46px 1fr;align-items:center;padding:12px}.node i{grid-row:1/3;width:38px;height:52px;border:1px solid #3484a2;background:#153d5b;display:grid;place-items:center;font:bold 9px monospace;color:var(--orange);font-style:normal}.node b{font-size:10px}.node small{font:7px monospace;color:#34e59b}.node.master{border-color:var(--orange)}.connector{position:absolute;left:50%;transform:translateX(-50%);width:390px;border:1px solid rgba(107,177,196,.5);border-top:0}.connector.c1{top:116px;height:88px}.connector.c2{bottom:118px;height:94px;border-bottom:0}footer{position:relative;z-index:2;max-width:1450px;margin:18px auto 0;display:flex;justify-content:center;align-items:center;gap:14px;font:7px monospace;color:#4b6577;letter-spacing:1.4px}footer i{width:40px;height:1px;background:#2d6675}
@media(max-width:1050px){nav button{padding:0 11px}.brand{width:auto;margin-right:25px}#summary{grid-template-columns:repeat(2,1fr);grid-template-rows:auto}.metric-grid{grid-template-columns:repeat(2,1fr)}.hall-map{grid-column:1/-1}.side-stack{grid-column:1/-1;grid-template-columns:1fr 1fr}.hall-wrap{height:390px}.rack-field{width:72%}}
@media(max-width:680px){header{height:auto;min-height:70px;flex-wrap:wrap;padding:10px 16px}nav{order:3;width:100%;height:42px;margin-top:8px}nav button{flex:1;padding:0 4px;font-size:8px}.status{font-size:0}.status i{margin:0}.titlebar{padding:20px 16px 15px}.weather{display:none}#summary,#floor,#architecture{padding:0 12px}.metric-grid{grid-template-columns:1fr 1fr}.metric{height:145px}.metric-value{font-size:24px}.hall-map{padding:14px}.hall-wrap{height:460px}.rack-field{width:62%;grid-template-columns:repeat(5,1fr);gap:6px}.rack{height:46px}.hall-label{width:18%}.hall-label span{display:none}.side-stack{grid-template-columns:1fr}.floor-hall{height:420px;grid-template-columns:repeat(4,1fr);grid-template-rows:50px repeat(8,1fr);padding:12px;gap:6px}.floor-name{grid-column:1/-1;grid-row:auto;border:0}.arch-row{gap:20px}.arch-row.bottom{display:grid;grid-template-columns:1fr 1fr}.node{width:125px}.connector{width:60%}footer{font-size:6px;text-align:center;padding:0 12px}}

.brand{width:240px}
.brand img{display:block;width:clamp(132px,12vw,190px);height:auto;object-fit:contain}
@media(max-width:1050px){.brand{width:auto;margin-right:25px}.brand img{width:140px}}
@media(max-width:680px){.brand img{width:128px}}

.dc-toolbar{
  height:92px;
  padding:0;
  border-bottom:1px solid rgba(217,255,245,.14);
  background:linear-gradient(to bottom,rgba(4,8,7,.68),rgba(4,8,7,.18),transparent);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  opacity:0;
  transform:translate3d(-115%,0,0);
  filter:blur(12px);
  transition:opacity .78s ease,transform .95s cubic-bezier(.16,.9,.18,1),filter .78s ease;
}
.dc-toolbar__rail{
  width:100%;
  height:100%;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:30px;
  padding:0 4.5vw;
}
.dc-toolbar .brand{
  justify-self:start;
  width:auto;
  margin:0;
}
.dc-toolbar .brand img{
  width:clamp(116px,12vw,174px);
}
.dc-toolbar nav{
  justify-self:center;
  height:auto;
  display:flex;
  align-items:center;
  gap:38px;
}
.dc-toolbar nav button{
  height:auto;
  min-height:auto;
  padding:0;
  border:0;
  background:transparent;
  color:rgba(238,247,244,.72);
  font:bold 11px/1 Arial,Helvetica,sans-serif;
  letter-spacing:.18em;
  text-transform:uppercase;
  transition:color .2s ease;
}
.dc-toolbar nav button:hover,
.dc-toolbar nav button.active{
  color:#72f8d3;
  background:transparent;
  border-color:transparent;
}
.dc-toolbar__actions{
  justify-self:end;
  display:inline-flex;
  align-items:center;
  gap:14px;
}
.language-toggle{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  gap:2px;
  min-height:42px;
  padding:3px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(255,255,255,.05);
  flex:0 0 auto;
}
.language-toggle__button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:38px;
  min-height:34px;
  padding:0 10px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:rgba(247,249,255,.72);
  font:700 12px/1 Arial,Helvetica,sans-serif;
  letter-spacing:0;
  cursor:pointer;
  transition:background .2s ease,color .2s ease,box-shadow .2s ease;
}
.language-toggle__button:hover,
.language-toggle__button:focus-visible,
.language-toggle__button.is-active{
  background:linear-gradient(135deg,var(--blue),#3267ff);
  color:#fff;
  box-shadow:0 0 14px rgba(8,124,255,.24);
  outline:none;
}
.dc-toolbar .status{
  margin:0;
  color:#65e9bd;
  font:bold 9px/1 monospace;
  letter-spacing:1.2px;
  white-space:nowrap;
}
.dc-back{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 18px;
  border:1px solid rgba(217,255,245,.14);
  border-radius:100px;
  color:#eef7f4;
  font:bold 11px/1 Arial,Helvetica,sans-serif;
  letter-spacing:.18em;
  text-transform:uppercase;
  white-space:nowrap;
  transition:color .2s ease,border-color .2s ease;
}
.dc-back:hover,
.dc-back:focus-visible{
  color:#72f8d3;
  border-color:rgba(114,248,211,.38);
  outline:none;
}
.titlebar{
  opacity:0;
  transform:translate3d(-46px,0,0);
  filter:blur(8px);
  transition:opacity .7s ease,transform .86s cubic-bezier(.16,.9,.18,1),filter .7s ease;
}
.metric-grid,
.hall-map,
.well-table,
.field-map,
.side-stack,
#floor .detail,
#architecture .detail,
footer{
  opacity:0;
  transform:translate3d(0,28px,0) scale(.985);
  filter:blur(10px);
  transition:opacity .78s ease,transform .9s cubic-bezier(.16,.9,.18,1),filter .78s ease;
}
.dc.is-header-ready .dc-toolbar{
  opacity:1;
  transform:translate3d(0,0,0);
  filter:blur(0);
}
.dc.is-title-ready .titlebar{
  opacity:1;
  transform:translate3d(0,0,0);
  filter:blur(0);
}
.dc.is-content-ready .metric-grid,
.dc.is-content-ready .hall-map,
.dc.is-content-ready .well-table,
.dc.is-content-ready .field-map,
.dc.is-content-ready .side-stack,
.dc.is-content-ready #floor .detail,
.dc.is-content-ready #architecture .detail,
.dc.is-content-ready footer{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  filter:blur(0);
}
.dc.is-content-ready .hall-map{transition-delay:.08s}
.dc.is-content-ready .well-table{transition-delay:.08s}
.dc.is-content-ready .field-map{transition-delay:.16s}
.dc.is-content-ready .side-stack{transition-delay:.16s}
.dc.is-content-ready footer{transition-delay:.24s}
.metric-value,
.spark polyline,
.spark polygon{
  transition:all .55s ease;
}
.gauge{
  transition:background .55s ease;
}
.gauge strong{
  transition:color .35s ease;
}
.weather b,
.weather small{
  transition:color .35s ease;
}
.dc-toolbar .status .status-label{
  color:#65e9bd;
  margin-left:0;
}
.dc-toolbar .status #clock{
  color:#617687;
  margin-left:15px;
}
#floor .detail{
  overflow:hidden;
}
#floor-content{
  display:grid;
  gap:22px;
  margin-top:22px;
}
#floor .floor-hall{
  width:100%;
  height:auto;
  min-height:224px;
  margin:0;
  grid-template-columns:150px repeat(8,minmax(78px,1fr));
  grid-template-rows:repeat(4,minmax(48px,1fr));
  gap:10px 12px;
  padding:22px;
  background:
    radial-gradient(circle at 32% 50%,rgba(85,231,223,.08),transparent 42%),
    linear-gradient(90deg,rgba(85,231,223,.035) 1px,transparent 1px),
    linear-gradient(rgba(85,231,223,.035) 1px,transparent 1px),
    rgba(3,14,24,.48);
  background-size:auto,46px 46px,46px 46px;
}
#floor .floor-name{
  padding-right:18px;
}
#floor .floor-name b{
  font-size:clamp(15px,1.05vw,20px);
  letter-spacing:.04em;
}
#floor .floor-name span{
  font-size:10px;
  letter-spacing:.08em;
}
#floor .floor-rack{
  min-height:54px;
  border-color:rgba(85,231,223,.32);
  background:
    linear-gradient(135deg,rgba(47,137,255,.22),rgba(85,231,223,.08)),
    #102b3d;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
  overflow:hidden;
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,background .45s ease;
}
#floor .floor-rack i{
  inset:auto 0 0;
  height:calc(var(--load) * 1%);
  background:linear-gradient(0deg,rgba(85,231,223,.55),rgba(47,137,255,.18));
  opacity:.72;
  transition:height .7s ease,background .45s ease;
}
#floor .floor-rack span{
  font:bold clamp(15px,.9vw,18px)/1 Arial,Helvetica,sans-serif;
  color:#edf8ff;
  letter-spacing:0;
  text-shadow:0 1px 8px rgba(0,0,0,.72),0 0 10px rgba(85,231,223,.25);
}
#floor .floor-rack:hover{
  transform:translateY(-4px) scale(1.02);
  border-color:#55e7df;
  box-shadow:0 0 22px rgba(85,231,223,.16);
}
#floor .floor-rack.warn{
  border-color:var(--orange);
  box-shadow:0 0 16px rgba(255,129,39,.2),inset 0 0 0 1px rgba(255,129,39,.08);
}
#floor .floor-rack.warn i{
  background:linear-gradient(0deg,rgba(255,129,39,.62),rgba(255,129,39,.14));
}
.architecture{
  overflow:hidden;
}
.architecture .panel-head{
  position:relative;
  z-index:3;
}
.arch-tree{
  width:min(100%,1040px);
  height:clamp(430px,48vh,560px);
  margin:8px auto 0;
  padding:34px 18px 24px;
  display:grid;
  grid-template-rows:1fr 1fr 1fr;
  align-items:center;
  gap:22px;
  isolation:isolate;
}
.arch-tree::before{
  content:"";
  position:absolute;
  inset:6px 2%;
  z-index:0;
  border-radius:24px;
  background:
    radial-gradient(circle at 50% 45%,rgba(85,231,223,.12),transparent 24%),
    linear-gradient(90deg,rgba(85,231,223,.035) 1px,transparent 1px),
    linear-gradient(rgba(85,231,223,.035) 1px,transparent 1px);
  background-size:auto,54px 54px,54px 54px;
  opacity:.75;
}
.arch-links{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:visible;
}
.arch-link{
  fill:none;
  stroke:url(#arch-line);
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:url(#arch-glow);
  stroke-dasharray:10 10;
  animation:arch-flow 2.8s linear infinite;
}
.arch-link:nth-of-type(2n){
  animation-duration:3.4s;
}
.arch-packet{
  fill:#55e7df;
  filter:drop-shadow(0 0 8px rgba(85,231,223,.95));
  opacity:.85;
}
.connector{
  display:none;
}
.arch-row{
  width:100%;
  z-index:2;
}
.arch-row.top{
  justify-content:center;
  gap:140px;
}
.arch-row.middle{
  justify-content:center;
}
.arch-row.bottom{
  justify-content:space-between;
  gap:34px;
}
.node{
  position:relative;
  z-index:2;
  width:158px;
  min-height:98px;
  overflow:hidden;
  background:
    linear-gradient(145deg,rgba(18,55,82,.98),rgba(8,24,40,.96)),
    radial-gradient(circle at 20% 0,rgba(85,231,223,.18),transparent 46%);
  box-shadow:0 16px 38px rgba(0,0,0,.26),inset 0 0 0 1px rgba(85,231,223,.04);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.node::after{
  content:"";
  position:absolute;
  inset:-40% auto -40% -55%;
  width:42%;
  background:linear-gradient(90deg,transparent,rgba(85,231,223,.16),transparent);
  transform:skewX(-18deg);
  animation:arch-scan 5.5s ease-in-out infinite;
}
.node:hover{
  transform:translateY(-6px) scale(1.04);
  border-color:#55e7df;
  box-shadow:0 18px 48px rgba(0,0,0,.32),0 0 26px rgba(85,231,223,.18);
}
.node i{
  border-color:rgba(85,231,223,.65);
  background:linear-gradient(145deg,rgba(18,67,94,.95),rgba(13,42,62,.95));
  box-shadow:inset 0 0 18px rgba(85,231,223,.08);
}
.node small{
  color:#65e9bd;
  text-shadow:0 0 8px rgba(52,229,155,.22);
}
.node.master{
  border-color:var(--orange);
  box-shadow:0 16px 38px rgba(0,0,0,.3),0 0 24px rgba(255,129,39,.1);
}
.node.master i{
  border-color:rgba(255,129,39,.68);
  color:#ff9a42;
}
@keyframes arch-flow{
  to{stroke-dashoffset:-40}
}
@keyframes arch-scan{
  0%,58%{left:-55%;opacity:0}
  70%{opacity:1}
  100%{left:120%;opacity:0}
}
@media(max-width:1050px){
  .dc-toolbar{height:76px}
  .dc-toolbar__rail{grid-template-columns:auto 1fr auto;gap:18px;padding:0 22px;overflow-x:auto;scrollbar-width:none}
  .dc-toolbar nav{justify-content:center;gap:20px}
  .dc-toolbar nav button{font-size:10px}
  .dc-toolbar .brand img{width:124px}
  .dc-toolbar .status span{display:none}
  .language-toggle{min-height:38px}
  .language-toggle__button{min-width:34px;min-height:30px;font-size:11px}
  .arch-tree{
    height:520px;
    padding-inline:10px;
  }
  #floor .floor-hall{
    grid-template-columns:120px repeat(4,minmax(82px,1fr));
    grid-template-rows:repeat(8,minmax(48px,1fr));
  }
  .arch-row.top{gap:70px}
  .arch-row.bottom{gap:18px}
  .node{width:142px}
}
@media(max-width:680px){
  .dc-toolbar{height:auto;min-height:72px;padding:0}
  .dc-toolbar__rail{display:flex;gap:14px;padding:12px 18px;flex-wrap:wrap}
  .dc-toolbar .brand img{width:118px}
  .dc-toolbar nav{order:3;width:100%;height:auto;gap:16px;justify-content:flex-start;overflow-x:auto}
  .dc-toolbar nav button{flex:0 0 auto;font-size:9px}
  .dc-toolbar__actions{margin-left:auto;gap:8px}
  .dc-back{min-height:38px;padding:0 13px;font-size:10px}
  .language-toggle{min-height:38px;padding:3px}
  .language-toggle__button{min-width:34px;min-height:30px;padding:0 8px;font-size:11px}
  .architecture.detail{
    min-height:0;
    padding:18px 14px 22px;
  }
  #floor .detail{
    min-height:0;
    padding:18px 12px 22px;
  }
  #floor-content{
    gap:16px;
    margin-top:18px;
  }
  #floor .floor-hall{
    min-height:0;
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto;
    gap:8px;
    padding:14px;
  }
  #floor .floor-name{
    grid-column:1/-1;
    grid-row:auto;
    min-height:58px;
    align-items:flex-start;
    padding:0 0 10px;
    border-right:0;
    border-bottom:1px solid rgba(85,231,223,.18);
  }
  #floor .floor-rack{
    min-height:52px;
  }
  #floor .floor-rack span{
    font-size:15px;
  }
  .arch-tree{
    height:auto;
    min-height:720px;
    padding:26px 0 16px;
    display:flex;
    flex-direction:column;
    gap:26px;
  }
  .arch-links{
    display:none;
  }
  .arch-row,
  .arch-row.top,
  .arch-row.middle,
  .arch-row.bottom{
    display:grid;
    grid-template-columns:1fr;
    justify-items:center;
    gap:18px;
  }
  .node{
    width:min(100%,210px);
    min-height:88px;
  }
  .node::before{
    content:"";
    position:absolute;
    left:50%;
    bottom:-19px;
    width:1px;
    height:18px;
    background:linear-gradient(#55e7df,transparent);
    box-shadow:0 0 9px rgba(85,231,223,.55);
  }
  .arch-row.bottom .node:last-child::before{
    display:none;
  }
}
@media(prefers-reduced-motion:reduce){
  .dc-toolbar,
  .titlebar,
  .metric-grid,
  .hall-map,
  .well-table,
  .field-map,
  .side-stack,
  #floor .detail,
  #architecture .detail,
  footer{
    opacity:1;
    transform:none;
    filter:none;
    transition:none;
  }
  .arch-link,
  .node::after{
    animation:none;
  }
}

.og #summary{
  display:block;
  min-height:1040px;
}
.og #summary.view:not(.active-view){
  display:none;
}
#summary .metric-grid{
  position:absolute;
  top:0;
  right:24px;
  width:344px;
  height:auto;
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
.og #summary .metric{
  height:96px;
  padding:16px 18px;
  background:
    linear-gradient(90deg,rgba(85,231,223,.035) 1px,transparent 1px),
    linear-gradient(rgba(85,231,223,.03) 1px,transparent 1px),
    linear-gradient(145deg,rgba(11,31,49,.92),rgba(5,17,29,.94));
  background-size:34px 34px,34px 34px,auto;
}
.og #summary .metric:before{
  top:26px;
  height:46px;
}
.og #summary .metric-top{
  position:relative;
  z-index:2;
}
.og #summary .metric-value{
  position:relative;
  z-index:2;
  margin-top:8px;
  font-size:30px;
  line-height:1;
  text-shadow:0 0 18px rgba(85,231,223,.16);
}
.og #summary .metric-value small{
  font-size:11px;
}
.og #summary .spark{
  top:32px;
  right:14px;
  width:56%;
  height:48px;
  opacity:.95;
  filter:drop-shadow(0 0 8px rgba(85,231,223,.2));
}
.og #summary .metric-foot{
  bottom:9px;
  padding-top:5px;
  z-index:2;
  background:linear-gradient(90deg,rgba(5,17,29,.7),transparent);
}
#field{
  max-width:1500px;
  margin:auto;
  padding:0 24px;
  position:relative;
  z-index:2;
}
#field .detail{
  opacity:0;
  transform:translate3d(0,28px,0) scale(.985);
  filter:blur(10px);
  transition:opacity .78s ease,transform .9s cubic-bezier(.16,.9,.18,1),filter .78s ease;
}
.dc.is-content-ready #field .detail{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  filter:blur(0);
}
.well-table{
  width:calc(100% - 368px);
  margin-top:0;
  padding:20px;
}
.table-wrap{
  margin-top:16px;
  overflow:auto;
  border:1px solid rgba(78,150,177,.2);
  border-radius:12px;
  background:rgba(4,14,24,.48);
}
.well-table table{
  width:100%;
  border-collapse:collapse;
  min-width:680px;
}
.well-table th,
.well-table td{
  padding:12px 14px;
  border-bottom:1px solid rgba(87,177,200,.11);
  text-align:left;
  font-size:12px;
}
.well-table th{
  color:#8aa0b2;
  font:bold 9px/1 monospace;
  letter-spacing:1.2px;
  text-transform:uppercase;
  background:rgba(255,255,255,.025);
}
.well-table td{
  color:#edf8ff;
}
.well-table tbody tr{
  cursor:pointer;
  transition:background .2s ease,box-shadow .2s ease;
}
.well-table tbody tr:hover,
.well-table tbody tr:focus-visible{
  background:rgba(85,231,223,.055);
  outline:none;
}
.well-table tbody tr.selected{
  background:linear-gradient(90deg,rgba(255,214,74,.16),rgba(255,214,74,.035));
  box-shadow:inset 3px 0 0 #ffd64a;
}
.well-table tbody tr.selected td:first-child{
  color:#ffd64a;
}
.well-table td span{
  color:#65e9bd;
  font:bold 9px/1 monospace;
}
.field-map{
  width:calc(100% - 368px);
  margin-top:12px;
  padding:20px;
}
.og .side-stack{
  position:absolute;
  top:432px;
  right:24px;
  width:344px;
  grid-template-columns:1fr;
  gap:12px;
  align-content:start;
}
.og .score,
.og .alerts{
  min-height:0;
}
.map-surface{
  position:relative;
  height:480px;
  margin-top:16px;
  overflow:hidden;
  border:1px solid rgba(78,150,177,.2);
  border-radius:12px;
  background:#d7e5df;
}
.maplibre-map{
  position:absolute;
  inset:0;
  z-index:1;
  width:100%;
  height:100%;
  background:#d7e5df;
}
.map-surface::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(85,231,223,.032) 1px,transparent 1px),
    linear-gradient(rgba(85,231,223,.032) 1px,transparent 1px),
    radial-gradient(circle at 50% 50%,transparent 62%,rgba(3,8,16,.12));
  background-size:42px 42px,42px 42px,auto;
  mix-blend-mode:normal;
}
.map-surface .maplibregl-canvas{
  outline:none;
}
.map-surface .maplibregl-ctrl-attrib{
  background:rgba(3,14,24,.76);
  color:#8aa0b2;
  font:9px/1.4 Arial,Helvetica,sans-serif;
}
.map-surface .maplibregl-ctrl-attrib a{
  color:#55e7df;
}
.map-surface .maplibregl-ctrl-group{
  border:1px solid rgba(85,231,223,.26);
  border-radius:10px;
  overflow:hidden;
  background:rgba(5,17,29,.92);
  box-shadow:0 0 18px rgba(0,0,0,.26);
}
.map-surface .maplibregl-ctrl button{
  width:30px;
  height:30px;
  background:rgba(5,17,29,.92);
  color:#55e7df;
}
.map-surface .maplibregl-ctrl button:hover{
  background:rgba(12,42,59,.96);
}
.map-surface .maplibregl-ctrl button span{
  filter:invert(78%) sepia(74%) saturate(364%) hue-rotate(123deg) brightness(105%);
}
.well-pin{
  --pin-color:#55e7df;
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border:1px solid rgba(213,255,251,.78);
  border-radius:50%;
  color:#eaffff;
  font:bold 14px/1 Arial,Helvetica,sans-serif;
  background:
    radial-gradient(circle at 50% 45%,rgba(255,255,255,.22) 0 12%,rgba(85,231,223,.78) 13% 31%,rgba(6,22,32,.96) 32% 100%);
  box-shadow:
    0 10px 22px rgba(0,0,0,.46),
    0 0 0 5px rgba(85,231,223,.12),
    0 0 22px rgba(85,231,223,.38),
    inset 0 0 0 5px rgba(5,17,29,.88);
  cursor:pointer;
  isolation:isolate;
}
.well-pin span{
  position:relative;
  z-index:2;
  display:grid;
  place-items:center;
  min-width:22px;
  height:22px;
  padding:0 4px;
  border-radius:50%;
  background:rgba(3,10,17,.82);
  border:1px solid rgba(213,255,251,.28);
  text-shadow:0 0 10px rgba(85,231,223,.68);
}
.well-pin i{
  position:absolute;
  left:50%;
  bottom:-12px;
  width:2px;
  height:14px;
  background:linear-gradient(var(--pin-color),transparent);
  transform:translateX(-50%);
  box-shadow:0 0 10px var(--pin-color);
}
.well-pin::before,
.well-pin::after{
  content:"";
  position:absolute;
  inset:-7px;
  border:1px solid rgba(85,231,223,.34);
  border-radius:50%;
  opacity:.86;
}
.well-pin::after{
  inset:-14px;
  opacity:.18;
  animation:pin-pulse 2.4s ease-out infinite;
}
.well-pin.attention{
  --pin-color:#ff8127;
  background:
    radial-gradient(circle at 50% 45%,rgba(255,255,255,.24) 0 12%,rgba(255,129,39,.86) 13% 31%,rgba(24,15,9,.96) 32% 100%);
  box-shadow:
    0 10px 22px rgba(0,0,0,.46),
    0 0 0 5px rgba(255,129,39,.14),
    0 0 24px rgba(255,129,39,.5),
    inset 0 0 0 5px rgba(5,17,29,.88);
}
.well-pin.attention::before,
.well-pin.attention::after{
  border-color:rgba(255,129,39,.45);
}
@keyframes pin-pulse{
  0%{transform:scale(.72);opacity:.38}
  70%,100%{transform:scale(1.22);opacity:0}
}
.well-popup .maplibregl-popup-content{
  background:#071522;
  color:#edf8ff;
  border:1px solid rgba(85,231,223,.25);
  border-radius:10px;
  padding:10px 12px;
  box-shadow:0 16px 36px rgba(0,0,0,.34);
  font:12px/1.45 Arial,Helvetica,sans-serif;
}
.well-popup .maplibregl-popup-tip{
  border-top-color:#071522;
}
#field-content{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin-top:22px;
}
.well-card{
  min-height:360px;
  border:1px solid rgba(85,231,223,.2);
  border-radius:14px;
  padding:16px;
  background:linear-gradient(145deg,rgba(10,31,44,.72),rgba(4,16,27,.76));
  transition:border-color .22s ease,box-shadow .22s ease,transform .22s ease;
}
.well-card:hover,
.well-card:focus-within{
  border-color:rgba(255,129,39,.72);
  box-shadow:0 0 0 1px rgba(255,129,39,.18),0 18px 42px rgba(255,129,39,.09);
}
.well-card__head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  color:#8298a9;
  font:bold 9px/1 monospace;
  letter-spacing:1px;
}
.well-card__head span{
  color:#edf8ff;
  font:bold 13px/1 Arial,Helvetica,sans-serif;
  letter-spacing:0;
}
.pump-icon{
  position:relative;
  height:240px;
  margin:20px auto 18px;
  border:1px solid rgba(85,231,223,.2);
  border-radius:12px;
  background:linear-gradient(rgba(85,231,223,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(85,231,223,.035) 1px,transparent 1px),rgba(3,14,24,.58);
  background-size:22px 22px;
  overflow:hidden;
}
.pump-icon i{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:calc(var(--load) * 1%);
  background:linear-gradient(0deg,rgba(85,231,223,.2),rgba(47,137,255,.06));
}
.wellhead{
  position:absolute;
  left:50%;
  z-index:2;
  transform:translateX(-50%);
  color:#63e083;
}
.wellhead::before,
.wellhead::after{
  content:"";
  position:absolute;
}
.wellhead-top{
  top:12px;
  width:12px;
  height:20px;
  border-radius:6px 6px 2px 2px;
  background:currentColor;
  box-shadow:0 0 18px rgba(99,224,131,.18);
}
.wellhead-center{
  top:60px;
  width:34px;
  height:34px;
  border:5px solid currentColor;
  border-radius:50%;
}
.wellhead-center::before,
.wellhead-mid::before,
.wellhead-low::before{
  left:50%;
  top:50%;
  width:8px;
  height:8px;
  border-radius:50%;
  background:currentColor;
  transform:translate(-50%,-50%);
  box-shadow:0 0 12px rgba(99,224,131,.28);
}
.wellhead-center::after,
.wellhead-mid::after,
.wellhead-low::after{
  left:50%;
  top:50%;
  width:26px;
  height:26px;
  border-radius:50%;
  background:
    linear-gradient(30deg,transparent 43%,currentColor 44% 56%,transparent 57%),
    linear-gradient(150deg,transparent 43%,currentColor 44% 56%,transparent 57%),
    linear-gradient(270deg,transparent 43%,currentColor 44% 56%,transparent 57%);
  transform:translate(-50%,-50%);
  opacity:.95;
}
.wellhead-left,
.wellhead-right{
  top:74px;
  width:52px;
  height:8px;
  background:currentColor;
}
.wellhead-left{
  transform:translateX(-94px);
}
.wellhead-right{
  transform:translateX(42px);
}
.wellhead-left::before,
.wellhead-right::before{
  top:-13px;
  width:34px;
  height:34px;
  border:5px solid currentColor;
  border-radius:50%;
}
.wellhead-left::before{
  right:32px;
}
.wellhead-right::before{
  left:32px;
}
.wellhead-left::after,
.wellhead-right::after{
  top:-2px;
  width:17px;
  height:12px;
  border-radius:7px;
  background:currentColor;
}
.wellhead-left::after{
  right:85px;
}
.wellhead-right::after{
  left:85px;
}
.wellhead-mid{
  top:108px;
  width:40px;
  height:40px;
  border:5px solid currentColor;
  border-radius:50%;
}
.wellhead-mid::after{
  width:30px;
  height:30px;
}
.wellhead-low{
  top:82px;
  width:18px;
  height:92px;
  border-radius:5px;
  background:currentColor;
}
.wellhead-low::before{
  top:78px;
  z-index:4;
}
.wellhead-low::after{
  top:78px;
  z-index:3;
  width:28px;
  height:28px;
  background:
    linear-gradient(30deg,transparent 43%,#041018 44% 56%,transparent 57%),
    linear-gradient(150deg,transparent 43%,#041018 44% 56%,transparent 57%),
    linear-gradient(270deg,transparent 43%,#041018 44% 56%,transparent 57%);
}
.wellhead-valve-left,
.wellhead-valve-right{
  top:134px;
  width:62px;
  height:8px;
  background:currentColor;
}
.wellhead-valve-left{
  transform:translateX(-92px);
}
.wellhead-valve-right{
  transform:translateX(30px);
}
.wellhead-valve-left::before,
.wellhead-valve-right::before{
  top:-18px;
  width:26px;
  height:30px;
  border:5px solid currentColor;
  border-radius:9px 9px 5px 5px;
}
.wellhead-valve-left::before{
  right:38px;
}
.wellhead-valve-right::before{
  left:38px;
}
.wellhead-valve-left::after,
.wellhead-valve-right::after{
  top:-30px;
  width:42px;
  height:5px;
  border-radius:5px;
  background:currentColor;
}
.wellhead-valve-left::after{
  right:29px;
}
.wellhead-valve-right::after{
  left:29px;
}
.pump-icon::after{
  content:"";
  position:absolute;
  left:11%;
  right:11%;
  bottom:16px;
  height:5px;
  border-radius:4px;
  background:#63e083;
  box-shadow:0 0 16px rgba(99,224,131,.22);
}
.pump-icon .wellhead{
  color:#63e083;
  filter:drop-shadow(0 0 10px rgba(99,224,131,.18));
  transition:color .22s ease,filter .22s ease;
}
.pump-icon .wellhead-top{
  top:12px;
  width:54px;
  height:54px;
  border:7px solid currentColor;
  border-radius:50%;
  background:transparent;
}
.pump-icon .wellhead-top::before{
  left:50%;
  top:-11px;
  width:18px;
  height:26px;
  border:7px solid currentColor;
  border-bottom:0;
  background:#061421;
  transform:translateX(-50%);
}
.pump-icon .wellhead-top::after{
  left:50%;
  top:50%;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#061421;
  border:7px solid currentColor;
  transform:translate(-50%,-50%);
}
.pump-icon .wellhead-left,
.pump-icon .wellhead-right{
  top:72px;
  height:14px;
  background:currentColor;
}
.pump-icon .wellhead-left{
  width:84px;
  transform:translateX(-112px);
}
.pump-icon .wellhead-right{
  width:86px;
  transform:translateX(27px);
}
.pump-icon .wellhead-left::before,
.pump-icon .wellhead-left::after{
  top:-10px;
  width:24px;
  height:34px;
  border-radius:14px;
  background:#061421;
  border:7px solid currentColor;
}
.pump-icon .wellhead-left::before{left:0}
.pump-icon .wellhead-left::after{left:38px}
.pump-icon .wellhead-right::before{
  left:60px;
  top:-26px;
  width:62px;
  height:62px;
  border:7px solid currentColor;
  border-radius:50%;
  background:
    linear-gradient(0deg,transparent 44%,currentColor 45% 55%,transparent 56%),
    linear-gradient(60deg,transparent 44%,currentColor 45% 55%,transparent 56%),
    linear-gradient(120deg,transparent 44%,currentColor 45% 55%,transparent 56%);
}
.pump-icon .wellhead-right::after{
  left:111px;
  top:-8px;
  width:23px;
  height:30px;
  border-radius:0;
  background:currentColor;
}
.pump-icon .wellhead-center{
  top:64px;
  width:44px;
  height:44px;
  border:0;
  border-radius:0;
  background:#061421;
  box-shadow:inset 0 0 0 7px currentColor;
}
.pump-icon .wellhead-center::before,
.pump-icon .wellhead-center::after{
  display:none;
}
.pump-icon .wellhead-mid{
  top:108px;
  width:50px;
  height:50px;
  border:7px solid currentColor;
  border-radius:50%;
  background:#061421;
}
.pump-icon .wellhead-mid::before{
  width:20px;
  height:20px;
  border:7px solid currentColor;
  background:#061421;
}
.pump-icon .wellhead-mid::after{
  display:none;
}
.pump-icon .wellhead-low{
  top:105px;
  width:38px;
  height:112px;
  border-radius:0;
  background:
    linear-gradient(currentColor,currentColor) center top / 100% 100% no-repeat;
}
.pump-icon .wellhead-low::before{
  left:50%;
  top:72px;
  width:46px;
  height:46px;
  border:7px solid currentColor;
  border-radius:0;
  background:#061421;
  transform:translate(-50%,-50%);
  box-shadow:none;
}
.pump-icon .wellhead-low::after{
  left:50%;
  top:34px;
  width:20px;
  height:20px;
  border:7px solid currentColor;
  border-radius:50%;
  background:#061421;
  transform:translate(-50%,-50%);
}
.pump-icon .wellhead-valve-left,
.pump-icon .wellhead-valve-right{
  top:177px;
  width:74px;
  height:14px;
  background:currentColor;
}
.pump-icon .wellhead-valve-left{
  transform:translateX(-108px);
}
.pump-icon .wellhead-valve-right{
  transform:translateX(35px);
}
.pump-icon .wellhead-valve-left::before,
.pump-icon .wellhead-valve-right::before{
  top:-17px;
  width:38px;
  height:38px;
  border-radius:50%;
  background:#061421;
  border:7px solid currentColor;
}
.pump-icon .wellhead-valve-left::before{left:0}
.pump-icon .wellhead-valve-right::before{left:18px}
.pump-icon .wellhead-valve-left::after,
.pump-icon .wellhead-valve-right::after{
  top:-31px;
  height:44px;
  width:10px;
  border-radius:0;
  background:currentColor;
}
.pump-icon .wellhead-valve-left::after{left:23px}
.pump-icon .wellhead-valve-right::after{left:74px}
.pump-icon{
  height:130px;
}
.pump-icon::after{
  bottom:8px;
}
.pump-icon .wellhead{
  transform:translateX(-50%) scale(.5);
  transform-origin:center top;
}
.pump-icon .wellhead-top{
  top:6px;
}
.pump-icon .wellhead-left,
.pump-icon .wellhead-right{
  top:36px;
  transform-origin:left top;
}
.pump-icon .wellhead-left{
  transform:translateX(-56px) scale(.5);
}
.pump-icon .wellhead-right{
  transform:translateX(14px) scale(.5);
}
.pump-icon .wellhead-center{
  top:32px;
}
.pump-icon .wellhead-mid{
  top:54px;
}
.pump-icon .wellhead-low{
  top:52px;
}
.pump-icon .wellhead-valve-left,
.pump-icon .wellhead-valve-right{
  top:88px;
  transform-origin:left top;
}
.pump-icon .wellhead-valve-left{
  transform:translateX(-54px) scale(.5);
}
.pump-icon .wellhead-valve-right{
  transform:translateX(18px) scale(.5);
}
.well-card:hover .pump-icon,
.well-card:focus-within .pump-icon{
  border-color:rgba(255,129,39,.22);
  box-shadow:inset 0 0 0 1px rgba(255,129,39,.05);
}
.well-card:hover .pump-icon .wellhead,
.well-card:focus-within .pump-icon .wellhead{
  color:#63e083;
  filter:drop-shadow(0 0 12px rgba(99,224,131,.28));
}
.well-card:hover .pump-icon::after,
.well-card:focus-within .pump-icon::after{
  background:#63e083;
  box-shadow:0 0 18px rgba(99,224,131,.3);
}
.well-card dl{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:0;
}
.well-card dl div{
  border-top:1px solid rgba(87,177,200,.14);
  padding-top:10px;
}
.well-card dt{
  color:#6d8495;
  font:bold 8px/1 monospace;
  letter-spacing:1px;
  text-transform:uppercase;
}
.well-card dd{
  margin:6px 0 0;
  color:#edf8ff;
  font:bold 19px/1 Arial,Helvetica,sans-serif;
}
@media(max-width:700px){
  .og #summary{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto;min-height:0}
  #summary .metric-grid{position:static;width:auto;height:auto}
  .well-table,.field-map{grid-column:1/-1;grid-row:auto;width:auto;margin-top:0}
  .og .side-stack{position:static;width:auto;grid-column:1/-1;grid-row:auto}
  #field-content{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  #field{padding:0 12px}
  #field .detail{min-height:0;padding:18px 12px 22px}
  .well-table,.field-map{padding:14px}
  .map-surface{height:380px}
  #field-content{grid-template-columns:1fr}
  .well-card{min-height:330px}
}

.iot .pump-icon{
  height:150px;
  display:grid;
  place-items:center;
}
.iot .pump-icon i{
  height:calc(var(--load) * 1%);
  opacity:.52;
}
.iot .pump-icon .wellhead{
  display:none;
}
.iot .pump-icon::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:86px;
  height:86px;
  border:3px solid #63e083;
  border-radius:18px;
  background:
    radial-gradient(circle at 50% 50%,#63e083 0 8px,transparent 9px),
    linear-gradient(90deg,transparent 45%,rgba(99,224,131,.85) 46% 54%,transparent 55%),
    linear-gradient(0deg,transparent 45%,rgba(99,224,131,.85) 46% 54%,transparent 55%),
    rgba(4,16,27,.82);
  transform:translate(-50%,-50%);
  box-shadow:0 0 24px rgba(99,224,131,.2),inset 0 0 0 10px rgba(99,224,131,.06);
}
.iot .pump-icon::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:170px;
  height:104px;
  border:0;
  border-radius:0;
  background:
    radial-gradient(circle at 12% 50%,#63e083 0 6px,transparent 7px),
    radial-gradient(circle at 88% 50%,#63e083 0 6px,transparent 7px),
    radial-gradient(circle at 50% 10%,#63e083 0 5px,transparent 6px),
    radial-gradient(circle at 50% 90%,#63e083 0 5px,transparent 6px),
    linear-gradient(90deg,transparent 10%,#63e083 11% 36%,transparent 37% 63%,#63e083 64% 89%,transparent 90%),
    linear-gradient(0deg,transparent 10%,#63e083 11% 34%,transparent 35% 65%,#63e083 66% 89%,transparent 90%);
  transform:translate(-50%,-50%);
  box-shadow:none;
  opacity:.95;
}
.iot .well-card:hover .pump-icon::after,
.iot .well-card:focus-within .pump-icon::after,
.iot .well-card:hover .pump-icon::before,
.iot .well-card:focus-within .pump-icon::before{
  filter:drop-shadow(0 0 12px rgba(99,224,131,.34));
}
.iot #summary{
  display:grid;
  grid-template-columns:minmax(420px,.9fr) minmax(520px,1.1fr);
  grid-template-rows:auto;
  gap:14px;
  min-height:650px;
  align-items:stretch;
}
.iot .well-table{
  grid-column:1;
  width:100%;
  margin-top:0;
  padding:16px;
}
.iot .field-map{
  grid-column:2;
  width:100%;
  margin-top:0;
  padding:16px;
}
.iot .table-wrap{
  margin-top:12px;
  max-height:552px;
  overflow:auto;
}
.iot .well-table table{
  min-width:0;
}
.iot .well-table th,
.iot .well-table td{
  padding:7px 10px;
  font-size:11px;
  line-height:1.15;
}
.iot .well-table th{
  font-size:8px;
  letter-spacing:.8px;
}
.iot .map-surface{
  height:552px;
  margin-top:12px;
}
@media(max-width:1050px){
  .iot #summary{
    display:grid;
    grid-template-columns:1fr;
    min-height:0;
  }
  .iot .well-table,
  .iot .field-map{
    grid-column:1;
  }
  .iot .table-wrap{
    max-height:420px;
  }
}