Polish closed stamp

app/assets/stylesheets/cards.css

@@ -224,16 +224,25 @@
 
   .card__closed {
     align-items: center;
-    aspect-ratio: 7/4;
+    aspect-ratio: 8/5;
+    background-color: var(--color-bg);
     border: var(--block-space-half) solid var(--card-color);
+    border-radius: 0.2em;
+    color: var(--card-color);
     display: flex;
     flex-direction: column;
     inset: auto var(--block-space) var(--block-space-double) auto;
     justify-content: space-between;
+    max-inline-size: 25ch;
+    min-inline-size: 18ch;
     mix-blend-mode: multiply;
     padding: var(--block-space-half) calc(var(--inline-space) * 1.5);
     position: absolute;
     transform: rotate(-10deg);
+
+    @media (prefers-color-scheme: dark) {
+      mix-blend-mode: screen;
+    }
   }
 
   .card__closed-by {
@@ -242,8 +251,10 @@
 
   .card__closed-title {
     color: var(--color-ink-reversed);
-    font-size: var(--text-rel-large);
+    font-size: 1.5em;
     font-weight: 900;
+    line-height: 1.2;
+    text-align: center;
     text-shadow:
      -2px -2px 0 var(--card-color),
       2px -2px 0 var(--card-color),

app/views/cards/display/common/_background.html.erb

@@ -5,7 +5,7 @@
 <% if card.closed? %>
   <div class="card__closed">
     <span class="card__closed-title txt-uppercase"><%= card.closure.reason %></span>
-    <strong><%= card.closed_at.strftime("%b %d, %Y") %></strong>
-    <span>by <span class="card__closed-by"><%= card.closed_by.name %></span></span>
+    <strong class="txt-uppercase"><%= card.closed_at.strftime("%b %d, %Y") %></strong>
+    <span>by <span class="card__closed-by"><%= familiar_name_for(card.closed_by) %></span></span>
   </div>
 <% end %>