/* v1.217 — IoT Gateway live topology panel (option 1). Scoped under .ig-panel. */
.ig-panel{--ig-teal:#003841;--ig-orange:#F69810;--ig-on:#F7F8F9;--ig-on2:#9FB4B8;--ig-mono:ui-monospace,'Cascadia Mono',Consolas,'Liberation Mono',monospace;
  position:relative;padding:22px;display:flex;flex-direction:column;gap:14px;border-radius:24px;background:var(--ig-teal);color:var(--ig-on);overflow:hidden;
  box-shadow:0 30px 60px -30px rgba(0,57,66,.6);min-width:0}
.ig-panel::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:20px 20px;pointer-events:none}
.ig-top{position:relative;display:flex;justify-content:space-between;align-items:center;gap:10px;font-family:var(--ig-mono);font-size:11px;letter-spacing:.12em;color:var(--ig-on2)}
.ig-status{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:rgba(31,181,122,.12);color:#5DD39E;transition:all .3s}
.ig-status em{font-style:normal}
.ig-status i{width:7px;height:7px;border-radius:50%;background:currentColor;animation:igBlink 1.4s steps(1) infinite}
.ig-status.warn{background:rgba(246,152,16,.14);color:var(--ig-orange)}
.ig-svg{position:relative;width:100%;height:auto;display:block}
.ig-node rect{fill:#0a4a54;stroke:rgba(255,255,255,.14)}
.ig-node text{fill:var(--ig-on);font-family:var(--ig-mono);font-size:11px}
.ig-node .sub{fill:var(--ig-on2);font-size:9.5px}
/* the gateway: white card carrying the Smartrise logo + GATEWAY label */
.ig-gw-box{fill:#fff;stroke:var(--ig-orange);stroke-width:1.5}
.ig-gw-ring{fill:none;stroke:var(--ig-orange);stroke-width:1.2;opacity:.55;transform-box:fill-box;transform-origin:center;animation:igRing 2.6s ease-out infinite}
.ig-gw-rule{stroke:rgba(0,57,66,.14);stroke-width:1}
.ig-gw-dot{fill:#1FB57A;animation:igBlink 1.4s steps(1) infinite}
.ig-gw-label{fill:var(--ig-teal);font-family:var(--ig-mono);font-size:10.5px;font-weight:700;letter-spacing:.24em}
.ig-panel.is-warn .ig-gw-dot{fill:var(--ig-orange)}
.ig-panel.is-down .ig-gw-dot{fill:#D9534F;animation:none}
.ig-wire{fill:none;stroke:rgba(255,255,255,.14);stroke-width:1.2}
.ig-wire.live{stroke:var(--ig-orange);stroke-dasharray:3 7;animation:igDash .9s linear infinite}
.ig-wire.dead{stroke:rgba(217,83,79,.6);stroke-dasharray:2 6}
.ig-pk{fill:var(--ig-orange)}
.ig-lnk text{font-family:var(--ig-mono);font-size:10px;fill:var(--ig-on2)}
.ig-lnk.dead text{fill:#F29B98}
.ig-fail{position:relative;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ig-fail span{font-family:var(--ig-mono);font-size:11px;color:var(--ig-on2);margin-right:4px}
.ig-fail button{height:36px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.04);color:var(--ig-on);font-family:var(--ig-mono);font-size:12px;cursor:pointer;transition:all .25s}
.ig-fail button:hover{border-color:var(--ig-orange)}
.ig-fail button:focus-visible{outline:2px solid var(--ig-orange);outline-offset:3px}
.ig-fail button[aria-pressed="true"]{border-color:#F29B98;color:#F29B98;background:rgba(217,83,79,.12)}
@keyframes igBlink{50%{opacity:.25}}
@keyframes igDash{to{stroke-dashoffset:-20}}
@keyframes igRing{0%{transform:scale(.96);opacity:.6}100%{transform:scale(1.14);opacity:0}}
@media (prefers-reduced-motion: reduce){.ig-wire.live,.ig-gw-ring,.ig-status i,.ig-gw-dot{animation:none}}
@media (max-width:560px){.ig-panel{padding:16px;border-radius:18px}.ig-top{font-size:10px}}
