diff --git a/webclient-vue/src/components/device/DeviceTable.vue b/webclient-vue/src/components/device/DeviceTable.vue
index 8fd13c6..3f159b2 100644
--- a/webclient-vue/src/components/device/DeviceTable.vue
+++ b/webclient-vue/src/components/device/DeviceTable.vue
@@ -14,6 +14,9 @@
           <div class="device-info">
             <div class="device-name-row">
               <strong>{{ row.name || row.alias || `Device #${row.id}` }}</strong>
+              <GnBadge v-if="row.status" :variant="systemStatusVariant(row.status)" size="sm">
+                {{ row.status }}
+              </GnBadge>
               <span
                 class="status-dot"
                 :class="{
@@ -21,6 +24,7 @@
                   'text-danger': row.connection_status !== 'active',
                 }"
                 aria-hidden="true"
+                :title="`Connection: ${row.connection_status || 'unknown'}`"
               />
             </div>
             <small class="text-muted">{{ row.alias }} — {{ row.device_ip || '—' }}</small>
@@ -56,7 +60,7 @@
 <script setup>
 import { computed } from "vue";
 import { useDevicesStore } from "../../stores/devices";
-import { GnTable, GnButton, useToast } from "gnexus-ui-kit/vue";
+import { GnTable, GnButton, GnBadge, useToast } from "gnexus-ui-kit/vue";
 import DeviceChannelsState from "../../features/devices/components/DeviceChannelsState.vue";
 
 const props = defineProps({
@@ -89,6 +93,16 @@
   return TYPE_ICONS[type] || TYPE_ICONS.relay;
 }
 
+function systemStatusVariant(status) {
+  const map = {
+    active: "success",
+    removed: "danger",
+    freezed: "warning",
+    setup: "primary",
+  };
+  return map[status] || "secondary";
+}
+
 function stateFor(device) {
   return (
     devicesStore.stateByDeviceId[String(device.id)] || {
diff --git a/webclient-vue/src/features/devices/pages/DeviceDetailPage.vue b/webclient-vue/src/features/devices/pages/DeviceDetailPage.vue
index ec3b8fc..6dda2dc 100644
--- a/webclient-vue/src/features/devices/pages/DeviceDetailPage.vue
+++ b/webclient-vue/src/features/devices/pages/DeviceDetailPage.vue
@@ -25,6 +25,12 @@
 
       <div class="script-info-panel">
         <div class="info-row">
+          <span class="info-label text-muted">System status:</span>
+          <span class="info-value">
+            <GnBadge :variant="systemStatusVariant(device.status)">{{ device.status }}</GnBadge>
+          </span>
+        </div>
+        <div class="info-row">
           <span class="info-label text-muted">Type:</span>
           <span class="info-value">{{ device.device_type }}</span>
         </div>
@@ -464,6 +470,16 @@
   router.push({ name: "devices" });
 }
 
+function systemStatusVariant(status) {
+  const map = {
+    active: "success",
+    removed: "danger",
+    freezed: "warning",
+    setup: "primary",
+  };
+  return map[status] || "secondary";
+}
+
 async function loadStatus() {
   const id = deviceId.value;
   if (!id || !device.value) return;