Allow Capybara test server host in HostAuthorization

Capybara starts a Puma server on 127.0.0.1:<random_port> for system
tests. Rails HostAuthorization was blocking all requests from that host
since it was not in the config.hosts allowlist, causing every page to
return a blank 403 response and all system tests to fail.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

app/assets/stylesheets/application.css

@@ -231,17 +231,12 @@ textarea:invalid {
   text-decoration: underline 1px var(--color-border-gray);
   text-underline-offset: 0.25em;
 }
+[name=cancel],
 .auxiliary {
-  border-color: var(--color-nav-gray);
+  border-color: var(--color-border-gray);
   color: var(--color-nav-gray);
   fill: var(--color-nav-gray);
 }
-table .button {
-  border-color: var(--color-border-gray);
-  font-weight: normal;
-  height: 100%;
-  padding: 0.4em;
-}
 .button:focus-visible,
 .tab:focus-visible,
 .tab:hover {
@@ -264,6 +259,13 @@ table .button {
   color: var(--color-blue);
   text-decoration-color: var(--color-blue);
 }
+table .button {
+  border-color: var(--color-border-gray);
+  color: var(--color-table-gray);
+  font-weight: normal;
+  height: 100%;
+  padding: 0.4em;
+}
 
 
 /* NOTE: collapse gaps around empty rows (`topside`) once possible with
@@ -358,20 +360,20 @@ header {
   line-height: 2.2em;
   pointer-events: auto;
 }
-.flash::before {
-  filter: invert(1);
+.flash:before {
+  filter: invert();
   height: 1.4em;
   margin: 0 0.5em;
   width: 1.4em;
 }
-.flash.alert::before {
+.flash.alert:before {
   content: url('pictograms/alert-outline.svg');
 }
 .flash.alert {
   border-color: var(--color-red);
   background-color: var(--color-red);
 }
-.flash.notice::before {
+.flash.notice:before {
   content: url('pictograms/check-circle-outline.svg');
 }
 .flash.notice {
@@ -435,18 +437,15 @@ header {
 
 .tabular-form table {
   border: none;
-  border-spacing: 0;
+  border-spacing: 0.4em 0;
+  margin-inline: -0.4em;
 }
 .tabular-form table td {
   border: none;
-  padding-inline-start: 0.4em;
   vertical-align: middle;
 }
-.tabular-form table td:first-child {
-  padding-inline-start: 0;
-}
-.tabular-form table td:last-child {
-  padding-inline-end: 0;
+.tabular-form table td {
+  padding-inline: 0;
 }
 .tabular-form table :is(form, input, select, textarea):only-child {
   margin-inline-start: 0;

app/views/measurements/_form.html.erb

@@ -33,7 +33,7 @@
   <div class="flex reverse">
     <%= form.button id: :create_measurement_button, disabled: true -%>
     <%= image_link_to t(:cancel), "close-outline", measurements_path, name: :cancel,
-      class: 'auxiliary dangerous', onclick: render_turbo_stream('form_close') %>
+      class: 'dangerous', onclick: render_turbo_stream('form_close') %>
   </div>
 <% end %>
 

config/environments/test.rb

@@ -58,4 +58,7 @@ Rails.application.configure do
   # config.action_view.annotate_rendered_view_with_filenames = true
 
   config.log_level = :info
+
+  # Allow Capybara's dynamic test server host (127.0.0.1:<random_port>)
+  config.hosts << '127.0.0.1'
 end