diff --git a/meshview/templates/reliability.html b/meshview/templates/reliability.html
index a6cc176..ac39b4d 100644
--- a/meshview/templates/reliability.html
+++ b/meshview/templates/reliability.html
@@ -144,6 +144,73 @@
color: rgba(255, 255, 255, 0.62);
}
+.reach-heard-link {
+ padding: 0;
+ border: 0;
+ background: transparent;
+ color: #8ab4f8;
+ text-decoration: underline;
+ cursor: pointer;
+}
+
+.port-tag {
+ display: inline-block;
+ padding: 1px 6px;
+ border-radius: 6px;
+ font-size: 0.75rem;
+ font-weight: 500;
+ color: #fff;
+}
+
+.reliability-modal {
+ display: none;
+ position: fixed;
+ inset: 0;
+ z-index: 5000;
+ align-items: center;
+ justify-content: center;
+ padding: 16px;
+ background: rgba(0, 0, 0, 0.72);
+}
+
+.reliability-modal.open {
+ display: flex;
+}
+
+.reliability-modal-panel {
+ width: min(760px, 100%);
+ max-height: min(720px, 92vh);
+ overflow: auto;
+ border: 1px solid rgba(255, 255, 255, 0.18);
+ border-radius: 8px;
+ background: #111827;
+ padding: 12px;
+ box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5);
+}
+
+.reliability-modal-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ margin-bottom: 10px;
+}
+
+.reliability-modal-title {
+ font-size: 1rem;
+ font-weight: 600;
+}
+
+.reliability-status-heard {
+ color: #4ade80 !important;
+ font-weight: 700;
+}
+
+.reliability-status-missed {
+ color: #f87171 !important;
+ font-weight: 700;
+}
+
@media (max-width: 600px) {
.reach-gateway-panels {
grid-template-columns: 1fr;
@@ -174,6 +241,15 @@
autocomplete="off"
>
+
+