Track visitor activity presence

public/admin.css

@@ -172,7 +172,7 @@ label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; }
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-.visitor-name-wrap .online-dot {
+.visitor-name-wrap .presence-dot {
   flex: 0 0 auto;
 }
 .unread-dot {
@@ -442,13 +442,23 @@ label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; }
   font-weight: 800;
   font-size: 13px;
 }
-.online-dot {
+.presence-dot {
   width: 9px;
   height: 9px;
+  flex: 0 0 auto;
   border-radius: 50%;
+}
+.presence-dot.active {
   background: #2f9e44;
   box-shadow: 0 0 0 4px rgb(47 158 68 / 14%);
 }
+.presence-dot.idle {
+  background: #f59f00;
+  box-shadow: 0 0 0 4px rgb(245 159 0 / 16%);
+}
+.presence-dot.offline {
+  background: #c9d4ce;
+}
 .visitor-compact-meta {
   display: flex;
   align-items: center;