diff --git a/app/views/account/join_codes/edit.html.erb b/app/views/account/join_codes/edit.html.erb
index 14958a44c..44854c6d0 100644
--- a/app/views/account/join_codes/edit.html.erb
+++ b/app/views/account/join_codes/edit.html.erb
@@ -11,7 +11,7 @@
   </div>
 <% end %>
 
-<article class="panel center shadow flex flex-column gap-half" style="view-transition-name: <%= dom_id(@join_code) %>">
+<article class="panel panel--wide center shadow flex flex-column gap-half" style="view-transition-name: <%= dom_id(@join_code) %>">
   <header class="margin-block-end-half">
     <h2 class="txt-large margin-none font-weight-black"><%= @page_title %></h2>
     <p class="txt-medium margin-none">How many times can this link be used to join the account?</p>
diff --git a/app/views/account/join_codes/show.html.erb b/app/views/account/join_codes/show.html.erb
index da1527501..d16006019 100644
--- a/app/views/account/join_codes/show.html.erb
+++ b/app/views/account/join_codes/show.html.erb
@@ -11,7 +11,7 @@
   </div>
 <% end %>
 
-<div class="panel shadow center flex flex-column gap" style="view-transition-name: <%= dom_id(@join_code) %>">
+<div class="panel panel--wide shadow center flex flex-column gap" style="view-transition-name: <%= dom_id(@join_code) %>">
   <header>
     <h2 class="txt-large margin-none font-weight-black"><%= @page_title %></h2>
     <p class="txt-medium margin-none">Share the link below to invite people to this account</p>