fix(templates): forms and detail lists fit a phone screen

Column offsets without a breakpoint applied below it, where the column
is already full width, so the change password, compute, user, VM
create and VM settings forms ran past the right edge on a phone. Each
offset now starts at its column's breakpoint. The interface and network
detail lists were rows directly inside rows and sit in a column now;
the compute form loses a Bootstrap 3 thumbnail padding that broke its
gutters, and the add-rule dialog's hint is no longer cut off. The page
test checks both grid rules on every page.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

admin/templates/admin/user_form.html

@@ -8,7 +8,7 @@
 {% block page_heading %}{{ title }}{% endblock page_heading %}
 
 {% block content %}
-<div class="card col-sm-10 offset-1">
+<div class="card col-sm-10 offset-sm-1">
     <div class="card-body">
         <form id="create-update" action="" method="post">
             {% csrf_token %}