.home-defs{
  position:absolute;
  width:0;
  height:0;
  overflow:hidden;
}

.hero-copy strong{
  color:var(--text);
  font-weight:700;
}

.home-route-annotation{
  position:absolute;
  right:4px;
  top:116px;
  width:120px;
  height:78px;
  color:var(--on-ink);
  pointer-events:none;
}

.home-route-annotation path{
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.home-route-annotation .home-star{
  fill:currentColor;
  stroke:none;
}

.feature-panels{
  min-width:0;
}

.feature-detail h3{
  margin-top:18px;
  margin-bottom:12px;
}

.feature-detail > p{
  color:var(--muted);
  font-size:16px;
  line-height:1.85;
}

.feature-detail[hidden]{
  display:none;
}

.home-visual-list{
  display:grid;
  gap:8px;
  max-width:330px;
  margin-top:22px;
}

.home-visual-list span{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:38px;
  padding:8px 11px;
  border:1px solid var(--ink-line);
  border-radius:var(--radius-sm);
  background:var(--ink-3);
  color:var(--on-ink);
  font:600 12px/1.3 var(--font-mono);
}

.home-visual-list i{
  width:8px;
  height:8px;
  flex:0 0 auto;
  border-radius:50%;
  background:var(--success);
  box-shadow:0 0 0 3px var(--success-soft);
}

.home-lock-visual{
  display:flex;
  align-items:center;
  gap:18px;
  margin-top:24px;
  color:var(--on-ink);
  font:750 15px/1.3 var(--font-display);
}

.home-lock-visual svg{
  width:62px;
  height:62px;
  flex:0 0 auto;
  padding:12px;
  border:1px solid var(--ink-line);
  border-radius:var(--radius-md);
  background:var(--ink-3);
  color:var(--cyan);
}

.home-device-chips{
  max-width:350px;
  margin-top:24px;
}

.home-soft-section{
  background:var(--panel-soft);
}

.home-route-note{
  display:grid;
  grid-template-columns:minmax(120px,.24fr) minmax(0,1fr);
  gap:24px;
  margin-bottom:24px;
  padding:20px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--panel);
  box-shadow:var(--shadow-card);
}

.home-route-note strong{
  font:800 18px/1.4 var(--font-display);
}

.home-route-note p{
  margin:0;
  color:var(--muted);
}

.home-section-link{
  display:flex;
  justify-content:flex-end;
  margin-top:24px;
  margin-bottom:0;
}

.home-plan-audience{
  color:var(--muted);
  font-size:14px;
}

.home-pack-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:28px;
  margin-top:22px;
  padding:24px;
}

.home-pack-panel h3{
  margin-bottom:8px;
  font-size:24px;
}

.home-pack-panel p:last-child{
  margin-bottom:0;
  color:var(--muted);
}

.home-why-grid{
  display:grid;
  grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);
  gap:48px;
}

.home-why-grid .section-head{
  align-self:start;
  position:sticky;
  top:calc(var(--header-h) + 28px);
  margin-bottom:0;
}

.home-why-content{
  display:grid;
  border-top:1px solid var(--border);
}

.home-why-content article{
  display:grid;
  grid-template-columns:minmax(150px,.35fr) minmax(0,1fr);
  gap:24px;
  padding-top:24px;
  padding-bottom:24px;
  border-bottom:1px solid var(--border);
}

.home-why-content h3{
  margin-bottom:0;
  font-size:20px;
}

.home-why-content p{
  margin-bottom:0;
  color:var(--muted);
  font-size:16px;
  line-height:1.8;
}

.home-narrow{
  max-width:920px;
}

.home-section-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
  margin-bottom:34px;
}

.home-section-heading .section-head{
  margin-bottom:0;
}

.home-section-heading > .btn{
  flex:0 0 auto;
}

#server-status:empty{
  display:none;
}

.server-status{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  max-width:100%;
  overflow:hidden;
  margin-bottom:24px;
}

.srv-row{
  display:grid;
  grid-template-columns:auto auto minmax(0,1fr) auto auto;
  align-items:center;
  gap:10px;
  min-width:0;
  min-height:54px;
  padding:10px 13px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--panel);
  box-shadow:var(--shadow-card);
  font-family:var(--font-mono);
  font-size:12px;
}

.srv-dot{
  width:8px;
  height:8px;
  flex:0 0 auto;
  border-radius:50%;
  background:var(--success);
  box-shadow:0 0 0 3px var(--success-soft);
}

.srv-flag{
  width:22px;
  height:16px;
  flex:0 0 auto;
  overflow:hidden;
  border-radius:3px;
}

.srv-name{
  min-width:0;
  overflow:hidden;
  color:var(--text);
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.srv-type{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  max-width:100%;
  overflow:hidden;
  padding:4px 7px;
  border-radius:var(--radius-sm);
  background:var(--accent-soft);
  color:var(--accent-dark);
  text-overflow:ellipsis;
  white-space:nowrap;
}

.srv-ms,
.srv-bw{
  color:var(--muted);
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}

@media (max-width:1100px){
  .hero-chip-rows{
    max-width:100%;
  }

  .hero-chipbar{
    max-width:100%;
    overflow-x:auto;
  }

  .hero-chip{
    flex:0 0 auto;
  }

  .home-why-grid{
    gap:32px;
  }
}

@media (max-width:900px){
  .home-route-annotation{
    display:none;
  }

  .server-status{
    grid-template-columns:1fr;
  }

  .home-why-grid{
    grid-template-columns:1fr;
  }

  .home-why-grid .section-head{
    position:static;
  }

  .home-why-content article{
    grid-template-columns:1fr;
    gap:8px;
  }
}

@media (max-width:640px){
  .hero-chipbar{
    overflow:visible;
  }

  .home-route-note{
    grid-template-columns:1fr;
    gap:8px;
  }

  .home-pack-panel{
    grid-template-columns:1fr;
  }

  .home-section-heading{
    align-items:flex-start;
    flex-direction:column;
  }

  .srv-row{
    grid-template-columns:auto auto minmax(0,1fr) auto;
  }

  .srv-type{
    grid-column:3 / 5;
    justify-self:start;
  }

  .srv-ms,
  .srv-bw{
    font-size:11px;
  }
}

@media (max-width:380px){
  .srv-row{
    grid-template-columns:auto auto minmax(0,1fr);
  }

  .srv-type{
    grid-column:2 / 4;
  }

  .srv-ms,
  .srv-bw{
    grid-column:auto;
  }
}