diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index 1e13e4c..9db1dd3 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -530,7 +530,7 @@
     grid-template-columns: minmax(0, 1fr) auto;
     align-items: center;
     column-gap: 10px;
-    padding: 10px 0;
+    padding: 12px 14px;
   }
 
   /* Kit td rules (padding + border-bottom) would stripe every stacked
@@ -552,6 +552,12 @@
     display: none;
   }
 
+  .secrets-table .table-row .secret-title-link {
+    font-size: 16px;
+    line-height: 1.35;
+    font-weight: 400;
+  }
+
   .secret-title-sub {
     display: block;
     margin-top: 3px;
@@ -560,6 +566,97 @@
     color: #787c99;
   }
 
+  /* Audit table collapses the same way: no thead, one card per event —
+     action + channel badge on the first line, time and IP (muted) on the
+     second, the metadata description list below spanning full width.
+     The nowrap/min-width rules from desktop drop out here. */
+  .audit-table {
+    display: block;
+  }
+
+  .audit-table .table-head {
+    display: none;
+  }
+
+  .audit-table .table-body {
+    display: block;
+  }
+
+  .audit-table .table-row {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr) auto;
+    align-items: center;
+    column-gap: 10px;
+    padding: 12px 14px;
+  }
+
+  .audit-table th,
+  .audit-table td {
+    white-space: normal;
+  }
+
+  .audit-table .table-row > td {
+    border-bottom: 0;
+    padding: 0;
+    width: auto;
+    min-width: 0;
+  }
+
+  .audit-table .table-row > td:nth-child(1) {
+    grid-area: 2 / 1;
+    font-size: 12px;
+    color: #787c99;
+  }
+
+  .audit-table .table-row > td:nth-child(2) {
+    grid-area: 1 / 1;
+    font-weight: 600;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .audit-table .table-row > td:nth-child(3) {
+    grid-area: 1 / 2;
+  }
+
+  .audit-table .table-row > td:nth-child(4) {
+    grid-area: 2 / 2;
+    font-size: 12px;
+    color: #787c99;
+    text-align: right;
+  }
+
+  .audit-table .table-row > td:nth-child(5) {
+    grid-area: 3 / 1 / 4 / -1;
+    padding-top: 8px;
+  }
+
+  .audit-table .table-row:not(:last-child) {
+    border-bottom: 2px solid rgba(192, 202, 245, 0.08);
+  }
+
+  /* The metadata description list inside a card: label stacks over value,
+     the list gets the full card width instead of its own 760px cap. */
+  .audit-table .description-list {
+    max-width: none;
+  }
+
+  .audit-table .description-list .description-list-row {
+    grid-template-columns: 1fr;
+    gap: 6px;
+  }
+
+  .audit-table .description-list-value {
+    transform: none;
+  }
+
+  /* Metadata cells that wrap long JSON-ish values (snapshot payloads) */
+  .audit-table .description-list-value code {
+    max-width: 100%;
+    white-space: normal;
+    overflow-wrap: anywhere;
+  }
+
   .form-grid.two,
   .create-field-row,
   .create-access-grid {