diff --git a/app/assets/stylesheets/comments.css b/app/assets/stylesheets/comments.css
index 45c98fb13..9e5094d15 100644
--- a/app/assets/stylesheets/comments.css
+++ b/app/assets/stylesheets/comments.css
@@ -35,6 +35,57 @@
     .house-md-content {
       padding: var(--comment-padding-block) 0 0;
     }
+
+    .comment--system & {
+      --comment-padding-block: var(--block-space-half);
+
+      max-inline-size: var(--comment-max);
+      text-align: center;
+
+      &::before {
+        /* Make up space for lack of avatar */
+        content: "";
+        display: flex;
+        inline-size: calc(var(--comment-padding-inline) * 0.75);
+      }
+
+      .comment__avatar {
+        display: none;
+      }
+
+      .comment__author {
+        a { margin: 0 auto; }
+        h3 { margin-inline: auto; }
+        strong { display: none; }
+      }
+
+      .comment__body {
+        padding: 0;
+        text-align: center;
+      }
+
+      .comment__content {
+        --stripe-color: var(--color-ink-lightest);
+
+        background-image: repeating-linear-gradient(
+          45deg in srgb,
+          var(--color-canvas) 0 1px,
+          var(--stripe-color) 1px 10px);
+        padding-inline: var(--comment-padding-inline);
+
+        .comments--system-expanded .comment--system & {
+          --stripe-color: color-mix(in srgb, var(--card-color) 10%, var(--color-canvas));
+        }
+
+        .comment__history {
+          background-color: var(--stripe-color);
+        }
+      }
+
+      .reactions {
+        display: none !important;
+      }
+    }
   }
 
   .comment__author {
@@ -94,86 +145,28 @@
   }
 
   .comment--system {
-    --comment-padding-block: var(--block-space-half);
-
     display: none;
-    max-inline-size: var(--comment-max);
-    text-align: center;
     transition: var(--dialog-duration) allow-discrete;
     transition-property: display;
 
     .comments--system-expanded & {
-      display: flex;
+      display: contents;
     }
+  }
 
-    &:nth-last-child(1 of &):not(:has(~ * &) *):not(:has(~ &) *):not(:has(~ * &)):not(:has(&)) {
-      /* This unholy selector targets the last system comment in the document */
-      /* Hat-tip, https://css-tip.com/last-element-dom/ */
-      display: flex;
+  /* Show the last system comment */
+  :nth-last-child(1 of .comment--system) {
+    display: contents;
 
-      .comment__history  {
-        display: grid;
-      }
+    .comment__history {
+      display: grid;
     }
+  }
 
-    &:nth-child(1 of &):not(:has(&) ~ * *):not(:has(&) ~ *):not(& ~ * *):not(& *) {
-      /* Targets the first system comment in the document to effectively */
-      /* hide the "Show history" button if there's only one entry */
-      .comment__history  {
-        display: none;
-      }
-    }
-
-    &::before {
-      /* Make up space for lack of avatar */
-      content: "";
-      display: flex;
-      inline-size: calc(var(--comment-padding-inline) * 0.75);
-    }
-
-    .comment__avatar {
+  /* Hide the "Show history" button if there's only one system comment */
+  :nth-child(1 of .comment--system) {
+    .comment__history {
       display: none;
     }
-
-    .comment__author {
-      a {
-        margin: 0 auto;
-      }
-
-      h3 {
-        margin-inline: auto;
-      }
-
-      strong {
-        display: none;
-      }
-    }
-
-    .comment__body {
-      padding: 0;
-      text-align: center;
-    }
-
-    .comment__content {
-      --stripe-color: var(--color-ink-lightest);
-
-      background-image: repeating-linear-gradient(
-        45deg in srgb,
-        var(--color-canvas) 0 1px,
-        var(--stripe-color) 1px 10px);
-      padding-inline: var(--comment-padding-inline);
-
-      .comments--system-expanded .comment--system & {
-        --stripe-color: color-mix(in srgb, var(--card-color) 10%, var(--color-canvas));
-      }
-
-      .comment__history {
-        background-color: var(--stripe-color);
-      }
-    }
-
-    .reactions {
-      display: none !important;
-    }
   }
 }
diff --git a/app/views/cards/comments/_comment.html.erb b/app/views/cards/comments/_comment.html.erb
index de2b94c0d..2f8a120a0 100644
--- a/app/views/cards/comments/_comment.html.erb
+++ b/app/views/cards/comments/_comment.html.erb
@@ -1,8 +1,8 @@
 <% cache comment do %>
   <%# Helper Dependency Updated: avatar_image_tag 2025-12-15 %>
-  <%= turbo_frame_tag comment, :container do %>
+  <%= turbo_frame_tag comment, :container, class: ["comment--system": comment.creator.system?] do %>
     <%# Cache bump 2025-12-14: action text attachment rendering changed for lightbox -%>
-    <div id="<%= dom_id(comment) %>" data-creator-id="<%= comment.creator_id %>"  class="comment align-start full-width <%= "comment--system" if comment.creator.system? %>">
+    <div id="<%= dom_id(comment) %>" data-creator-id="<%= comment.creator_id %>"  class="comment align-start full-width">
       <figure class="comment__avatar flex-item-no-shrink" aria-hidden="true">
         <%= avatar_tag comment.creator, hidden_for_screen_reader: true %>
       </figure>