.interactive-article.article-xiaomi-mesh {
  color-scheme:inherit;
  --page:var(--main-bg); --surface:var(--card-bg, var(--main-bg)); --dev:var(--card-bg, var(--main-bg)); --zone:var(--bs-tertiary-bg);
  --ink:var(--heading-color); --ink2:var(--text-color); --muted:var(--text-muted-color);
  --line:var(--main-border-color); --hair:var(--main-border-color);
  --c-fiber:#4a3aa7; --c-wan:#2a78d6; --c-lan:#1baf7a; --c-new:#eb6834;
  --c-air:#e87ba4; --c-idle:#898781; --c-bad:#d03b3b; --c-ok:#0ca30c; --c-warn:#eda100;
  --wall:#c9c7bd;
}

html[data-bs-theme="dark"] .interactive-article.article-xiaomi-mesh {
    --c-fiber:#9085e9; --c-wan:#3987e5; --c-lan:#199e70; --c-new:#d95926;
    --c-air:#d55181; --c-idle:#898781; --c-bad:#e66767; --c-ok:#0ca30c; --c-warn:#c98500;
    --wall:#45443e;
}

.interactive-article.article-xiaomi-mesh, .interactive-article.article-xiaomi-mesh * {
  box-sizing:border-box
}

.interactive-article.article-xiaomi-mesh {
  margin:0; background:transparent; color:var(--ink);
  font-family:inherit;
  line-height:1.65; -webkit-font-smoothing:antialiased;
}

.interactive-article.article-xiaomi-mesh .wrap {
  max-width:1120px;margin:0 auto;padding:44px 22px 90px
}

.interactive-article.article-xiaomi-mesh header.top {
  margin-bottom:34px
}

.interactive-article.article-xiaomi-mesh .kicker {
  font-size:12.5px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;font-weight:600
}

.interactive-article.article-xiaomi-mesh h1 {
  font-size:31px;line-height:1.28;margin:12px 0 10px;letter-spacing:-.01em;font-weight:700
}

.interactive-article.article-xiaomi-mesh .lede {
  font-size:16px;color:var(--ink2);max-width:78ch;margin:0
}

.interactive-article.article-xiaomi-mesh h2 {
  font-size:22px;margin:0 0 6px;letter-spacing:-.005em;font-weight:700
}

.interactive-article.article-xiaomi-mesh h3 {
  font-size:16px;margin:26px 0 8px;font-weight:700
}

.interactive-article.article-xiaomi-mesh p {
  margin:10px 0
}

.interactive-article.article-xiaomi-mesh section {
  margin-top:52px
}

.interactive-article.article-xiaomi-mesh .sec-head {
  border-top:2px solid var(--ink);padding-top:14px;margin-bottom:18px
}

.interactive-article.article-xiaomi-mesh .sec-num {
  font-size:12.5px;font-weight:700;color:var(--muted);letter-spacing:.1em;margin-bottom:4px
}

.interactive-article.article-xiaomi-mesh .sub {
  color:var(--ink2);font-size:14.5px;margin:0;max-width:80ch
}

.interactive-article.article-xiaomi-mesh .card {
  background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:20px 22px
}

.interactive-article.article-xiaomi-mesh .grid2 {
  display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))
}

.interactive-article.article-xiaomi-mesh .grid3 {
  display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))
}

.interactive-article.article-xiaomi-mesh .fig {
  background:var(--surface);border:1px solid var(--hair);border-radius:18px;padding:14px 14px 6px;margin:18px 0
}

.interactive-article.article-xiaomi-mesh .scroll {
  overflow-x:auto;-webkit-overflow-scrolling:touch
}

.interactive-article.article-xiaomi-mesh .scroll svg {
  display:block;width:100%;height:auto;font-family:inherit
}

.interactive-article.article-xiaomi-mesh .fig svg {
  min-width:720px
}

.interactive-article.article-xiaomi-mesh figcaption {
  font-size:13px;color:var(--ink2);padding:10px 6px 10px;border-top:1px solid var(--line);margin-top:8px
}

.interactive-article.article-xiaomi-mesh figcaption b {
  color:var(--ink)
}

.interactive-article.article-xiaomi-mesh .legend {
  display:flex;flex-wrap:wrap;gap:8px 18px;padding:12px 14px;background:var(--surface);
  border:1px solid var(--hair);border-radius:12px;font-size:12.5px;color:var(--ink2);margin:14px 0
}

.interactive-article.article-xiaomi-mesh .legend i {
  display:inline-block;width:22px;height:0;border-top-width:3px;border-radius:2px;vertical-align:middle;margin-right:7px
}

.interactive-article.article-xiaomi-mesh .lg {
  display:flex;align-items:center
}

.interactive-article.article-xiaomi-mesh table {
  border-collapse:collapse;width:100%;font-size:13.6px;margin:12px 0
}

.interactive-article.article-xiaomi-mesh th, .interactive-article.article-xiaomi-mesh td {
  text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top
}

.interactive-article.article-xiaomi-mesh th {
  font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700;border-bottom:1.5px solid var(--hair)
}

.interactive-article.article-xiaomi-mesh td:first-child {
  font-weight:600;white-space:nowrap
}

.interactive-article.article-xiaomi-mesh .tag {
  display:inline-block;font-size:11.5px;font-weight:700;padding:2px 9px;border-radius:999px;border:1px solid;line-height:1.7
}

.interactive-article.article-xiaomi-mesh .t-ok {
  color:var(--c-ok);border-color:var(--c-ok)
}

.interactive-article.article-xiaomi-mesh .t-bad {
  color:var(--c-bad);border-color:var(--c-bad)
}

.interactive-article.article-xiaomi-mesh .t-warn {
  color:var(--c-warn);border-color:var(--c-warn)
}

.interactive-article.article-xiaomi-mesh .t-wan {
  color:var(--c-wan);border-color:var(--c-wan)
}

.interactive-article.article-xiaomi-mesh .t-lan {
  color:var(--c-lan);border-color:var(--c-lan)
}

.interactive-article.article-xiaomi-mesh .t-new {
  color:var(--c-new);border-color:var(--c-new)
}

.interactive-article.article-xiaomi-mesh ul, .interactive-article.article-xiaomi-mesh ol {
  margin:10px 0;padding-left:22px
}

.interactive-article.article-xiaomi-mesh li {
  margin:5px 0
}

.interactive-article.article-xiaomi-mesh li::marker {
  color:var(--muted)
}

.interactive-article.article-xiaomi-mesh .callout {
  border-left:3px solid var(--c-wan);background:var(--surface);border-radius:0 12px 12px 0;
  padding:14px 18px;margin:16px 0;font-size:14.5px
}

.interactive-article.article-xiaomi-mesh .callout.bad {
  border-left-color:var(--c-bad)
}

.interactive-article.article-xiaomi-mesh .callout.ok {
  border-left-color:var(--c-ok)
}

.interactive-article.article-xiaomi-mesh .callout.warn {
  border-left-color:var(--c-warn)
}

.interactive-article.article-xiaomi-mesh .callout .h {
  font-weight:700;margin-bottom:4px;display:block
}

.interactive-article.article-xiaomi-mesh code {
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;background:var(--zone);
  border:1px solid var(--line);border-radius:5px;padding:1px 5px
}

.interactive-article.article-xiaomi-mesh .chain {
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:10px 0 4px;font-size:13px
}

.interactive-article.article-xiaomi-mesh .node {
  border:1.5px solid var(--line);border-radius:10px;padding:6px 11px;background:var(--dev);font-weight:600;white-space:nowrap
}

.interactive-article.article-xiaomi-mesh .node small {
  display:block;font-weight:500;color:var(--muted);font-size:11px
}

.interactive-article.article-xiaomi-mesh .node.nat {
  border-color:var(--c-bad)
}

.interactive-article.article-xiaomi-mesh .node.pass {
  border-color:var(--c-lan)
}

.interactive-article.article-xiaomi-mesh .arr {
  color:var(--muted);font-weight:700
}

.interactive-article.article-xiaomi-mesh .port-dl {
  display:grid;grid-template-columns:auto 1fr;gap:6px 12px;font-size:13.3px;margin:14px 0 2px;align-items:start
}

.interactive-article.article-xiaomi-mesh .port-dl dt {
  font-weight:700;white-space:nowrap;display:flex;align-items:center;gap:7px
}

.interactive-article.article-xiaomi-mesh .port-dl dd {
  margin:0;color:var(--ink2)
}

.interactive-article.article-xiaomi-mesh .sw {
  width:11px;height:11px;border-radius:3px;flex:none
}

.interactive-article.article-xiaomi-mesh .checklist {
  list-style:none;padding-left:0
}

.interactive-article.article-xiaomi-mesh .checklist li {
  padding-left:26px;position:relative;margin:8px 0;font-size:14.3px
}

.interactive-article.article-xiaomi-mesh .checklist li::before {
  content:"";position:absolute;left:0;top:5px;width:15px;height:15px;border-radius:4px;
  border:2px solid var(--muted)
}

.interactive-article.article-xiaomi-mesh .hero {
  display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin:22px 0 6px
}

.interactive-article.article-xiaomi-mesh .stat {
  background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:16px 18px
}

.interactive-article.article-xiaomi-mesh .stat .v {
  font-size:27px;font-weight:700;letter-spacing:-.02em;line-height:1.2
}

.interactive-article.article-xiaomi-mesh .stat .k {
  font-size:12.5px;color:var(--muted);font-weight:600;margin-bottom:6px
}

.interactive-article.article-xiaomi-mesh .stat .d {
  font-size:13px;color:var(--ink2);margin-top:5px
}

.interactive-article.article-xiaomi-mesh .d-title {
  font-size:14px;font-weight:700;fill:var(--ink)
}

.interactive-article.article-xiaomi-mesh .d-sub {
  font-size:11.5px;fill:var(--muted)
}

.interactive-article.article-xiaomi-mesh .z-title {
  font-size:14.5px;font-weight:700;fill:var(--ink2)
}

.interactive-article.article-xiaomi-mesh .z-sub {
  font-size:11.5px;fill:var(--muted)
}

.interactive-article.article-xiaomi-mesh .p-lbl {
  font-size:10.5px;font-weight:700
}

.interactive-article.article-xiaomi-mesh .lbl {
  font-size:11.5px;font-weight:700
}

.interactive-article.article-xiaomi-mesh .pill {
  fill:var(--surface);stroke-width:1;stroke-opacity:.4
}

.interactive-article.article-xiaomi-mesh .note {
  font-size:12px;fill:var(--ink2)
}

.interactive-article.article-xiaomi-mesh .note-b {
  font-size:12px;font-weight:700
}

.interactive-article.article-xiaomi-mesh .dev-bg {
  fill:var(--dev);stroke:var(--line);stroke-width:1.5
}

.interactive-article.article-xiaomi-mesh .zone-bg {
  fill:var(--zone);stroke:var(--line);stroke-width:1.5;stroke-dasharray:7 6
}

.interactive-article.article-xiaomi-mesh .link {
  fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round
}

.interactive-article.article-xiaomi-mesh .article-footer {
  margin-top:70px;padding-top:20px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted)
}

@media (max-width:640px) {
.interactive-article.article-xiaomi-mesh h1 {
  font-size:25px
}

.interactive-article.article-xiaomi-mesh .wrap {
  padding:30px 15px 60px
}

.interactive-article.article-xiaomi-mesh td:first-child {
  white-space:normal
}

.interactive-article.article-xiaomi-mesh table {
  font-size:13px
}

.interactive-article.article-xiaomi-mesh th, .interactive-article.article-xiaomi-mesh td {
  padding:8px
}
}

/* Jekyll/Chirpy integration */
.interactive-article.article-xiaomi-mesh {
  isolation: isolate;
  max-width: 100%;
  min-height: 0;
  margin: 1.5rem 0 0;
  overflow-wrap: anywhere;
}
.interactive-article.article-xiaomi-mesh img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-inline: auto;
}
.interactive-article.article-xiaomi-mesh .scroll {
  max-width: 100%;
}
.interactive-article.article-xiaomi-mesh section:first-child {
  padding-top: 1rem;
}
@media (max-width: 576px) {
  .interactive-article.article-xiaomi-mesh { margin-inline: -0.25rem; }
}