diff --git a/containers/libreportal/frontend/css/admin.css b/containers/libreportal/frontend/css/admin.css
index 73b078c..a28a7f1 100644
--- a/containers/libreportal/frontend/css/admin.css
+++ b/containers/libreportal/frontend/css/admin.css
@@ -324,10 +324,22 @@
     color: var(--text-primary);
     word-break: break-word;
 }
-.sys-os-value { display: inline-flex; align-items: center; gap: 8px; }
-.sys-os-icon { width: 22px; height: 22px; flex-shrink: 0; object-fit: contain; }
-/* CPU vendor logos are wordmarks (wide), so size by height and let width follow. */
-.sys-cpu-icon { height: 18px; width: auto; max-width: 70px; flex-shrink: 0; object-fit: contain; }
+/* OS + CPU value rows: a rounded icon tile (same look as the backup app
+   tiles) followed by the label text. */
+.sys-id-value { display: inline-flex; align-items: center; gap: 10px; }
+.sys-id-icon {
+    width: 36px;
+    height: 36px;
+    flex-shrink: 0;
+    box-sizing: border-box;
+    padding: 5px;
+    border-radius: 8px;
+    background: rgba(var(--text-rgb), 0.05);
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+}
+.sys-id-icon img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
 
 /* Per-app table */
 .sys-apps-wrap {
diff --git a/containers/libreportal/frontend/js/components/admin/admin-system.js b/containers/libreportal/frontend/js/components/admin/admin-system.js
index 5e735e1..58ff278 100644
--- a/containers/libreportal/frontend/js/components/admin/admin-system.js
+++ b/containers/libreportal/frontend/js/components/admin/admin-system.js
@@ -406,8 +406,8 @@ class AdminSystem {
         const slug = String(os || '').toLowerCase().replace(/[^a-z0-9]/g, '') || 'linux';
         return `<div class="sys-stat">
             <span class="sys-stat-label">OS</span>
-            <strong class="sys-stat-value sys-os-value">
-                <img class="sys-os-icon" src="/icons/os/${slug}.svg" alt="" onerror="this.onerror=null;this.src='/icons/os/linux.svg'">
+            <strong class="sys-stat-value sys-id-value">
+                <span class="sys-id-icon"><img src="/icons/os/${slug}.svg" alt="" onerror="this.onerror=null;this.src='/icons/os/linux.svg'"></span>
                 ${this.escape(os || '—')}
             </strong>
         </div>`;
@@ -429,10 +429,10 @@ class AdminSystem {
     _cpuStat(cpu) {
         const raw = String(cpu || '');
         const vendor = /amd/i.test(raw) ? 'amd' : /intel/i.test(raw) ? 'intel' : null;
-        const icon = vendor ? `<img class="sys-cpu-icon" src="/icons/cpu/${vendor}.svg" alt="${vendor}">` : '';
+        const icon = vendor ? `<span class="sys-id-icon"><img src="/icons/cpu/${vendor}.svg" alt="${vendor}"></span>` : '';
         return `<div class="sys-stat">
             <span class="sys-stat-label">CPU</span>
-            <strong class="sys-stat-value sys-os-value">${icon}${this.escape(this._cleanCpu(raw))}</strong>
+            <strong class="sys-stat-value sys-id-value">${icon}${this.escape(this._cleanCpu(raw))}</strong>
         </div>`;
     }
 }