.connection-check { padding: 56px 0 28px; }
.connection-check .section-head h1 {
  margin: 0 0 14px;
  color: #fff;
  font-size: clamp(28px, 4vw, 40px);
  font-weight: 800;
  letter-spacing: -0.025em;
  text-wrap: balance;
}
.connection-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 18px;
  align-items: start;
  padding: 22px;
  border-radius: 22px;
  border: 1px solid rgba(94, 190, 255, 0.28);
  background:
    radial-gradient(circle at 8% 0%, rgba(56, 189, 248, 0.16), transparent 42%),
    linear-gradient(155deg, rgba(8, 24, 44, 0.98), rgba(5, 14, 26, 0.99));
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.25);
}
.connection-panel > *,
.connection-search,
.connection-results,
.connection-results li { min-width: 0; }
.connection-results,
.connection-results li,
.connection-results span,
.connection-note { overflow-wrap: anywhere; }
.tool-decision {
  margin: 0 0 14px;
  padding: 12px 14px;
  border-radius: 14px;
  line-height: 1.45;
}
.tool-decision-title {
  margin: 0;
  color: #fff;
  font-size: 1.05rem;
  font-weight: 800;
}
.tool-decision-action {
  margin: 6px 0 0;
  color: #d7ecff;
  font-size: 14px;
}
.tool-decision.clear {
  background: rgba(8, 50, 40, 0.45);
  border: 1px solid rgba(122, 238, 195, 0.4);
}
.tool-decision.neutral {
  background: rgba(28, 58, 83, 0.45);
  border: 1px solid rgba(94, 190, 255, 0.38);
}
.tool-decision.caution {
  background: rgba(120, 80, 10, 0.32);
  border: 1px solid rgba(251, 191, 36, 0.45);
}
.tool-decision.stop {
  background: rgba(90, 18, 28, 0.45);
  border: 1px solid rgba(255, 138, 154, 0.5);
}
.tool-decision.stop .tool-decision-action { color: #ffe4ea; }
.connection-kicker {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #7aeec3;
}
.connection-ip-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.connection-ip {
  margin: 0;
  color: #fff;
  font: 700 clamp(1.45rem, 3vw, 2.15rem) / 1.25 ui-monospace, SFMono-Regular, Consolas, monospace;
  overflow-wrap: anywhere;
}
.connection-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.connection-check [hidden] { display: none !important; }
@media (max-width: 720px) {
  body { padding-bottom: 16px; }
  .nav-cta .btn-ghost { display: inline-flex; }
}
.connection-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0 0;
}
.connection-facts div {
  margin: 0;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(0, 0, 0, 0.22);
  border: 1px solid rgba(94, 190, 255, 0.12);
}
.connection-facts dt {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #7aeec3;
}
.connection-facts dd {
  margin: 3px 0 0;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  overflow-wrap: anywhere;
}
.connection-note {
  margin: 12px 0 0;
  color: #9ec8e8;
  font-size: 13px;
  line-height: 1.5;
}
.connection-search label {
  display: block;
  margin-bottom: 8px;
  color: #eef6ff;
  font-weight: 700;
}
.connection-search-row { display: flex; flex-wrap: wrap; gap: 8px; }
.connection-search input {
  flex: 1 1 180px;
  min-width: 0;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(94, 190, 255, 0.28);
  background: rgba(3, 11, 22, 0.72);
  color: #fff;
  font: inherit;
}
.connection-results { margin-top: 14px; }
.connection-results p { margin: 0; color: #d7ecff; }
.connection-results ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.connection-results li {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.22);
  border: 1px solid rgba(122, 238, 195, 0.18);
}
.connection-results strong {
  display: block;
  color: #fff;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  overflow-wrap: anywhere;
}
.connection-results span { color: #9ec8e8; font-size: 13px; }
.leak-block {
  margin-top: 16px;
  padding: 18px 20px;
  border-radius: 18px;
  border: 1px solid rgba(94, 190, 255, 0.22);
  background: rgba(5, 14, 26, 0.72);
}
.leak-block h2 {
  margin: 0 0 8px;
  color: #fff;
  font-size: 1.15rem;
}
.leak-addresses,
.header-list {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.leak-addresses li,
.header-list div {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.22);
  border: 1px solid rgba(122, 238, 195, 0.16);
}
.leak-addresses strong,
.header-list dd {
  display: block;
  margin: 0;
  color: #fff;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  overflow-wrap: anywhere;
}
.leak-addresses span,
.header-list dt {
  color: #9ec8e8;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.connection-page-link { margin: 12px 0 0; }
.connection-calculator { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; margin-top: 16px; }
.connection-calculator label { display: grid; gap: 6px; color: #eef6ff; font-size: 13px; font-weight: 700; flex: 1 1 180px; }
.connection-calculator input, .connection-calculator select {
  width: 100%; min-width: 0; padding: 11px 12px; border-radius: 10px;
  border: 1px solid rgba(94, 190, 255, 0.4); background: #091b2d;
  color: #fff; font: inherit;
}
.connection-calculator :is(input, select, button):focus-visible { outline: 3px solid #7aeec3; outline-offset: 2px; }
[data-calculator-results] { margin-top: 14px; }
[data-report-actions] { margin-top: 12px; }
@media print {
  .nav, .connection-calculator, .connection-actions, [data-webrtc-run], .connection-page-link { display: none !important; }
  body, .connection-panel, .leak-block { background: #fff !important; color: #111 !important; box-shadow: none !important; }
  .connection-check * { color: #111 !important; }
}
.connection-standalone { padding: 28px 0 64px; }
@media (max-width: 800px) {
  .connection-panel,
  .connection-facts { grid-template-columns: 1fr; }
}