Center stars with h1 by moving eyebrow above flex row

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

1 files changed, 13 insertions, 13 deletions

diff --git a/templates/form.html b/templates/form.html
index 05006e0..83e888e 100644
--- a/templates/form.html
+++ b/templates/form.html
@@ -14,20 +14,20 @@
       {% set current_stars = film.stars if film and film.stars else 0 %}
       <input type="hidden" id="stars" name="stars" value="{{ current_stars }}">
       <div class="form-heading">
-        <div>
-          <p class="eyebrow">Diary Entry</p>
+        <p class="eyebrow">Diary Entry</p>
+        <div class="form-heading-row">
           <h1>{{ page_title }}</h1>
-        </div>
-        <div class="star-control" role="group" aria-label="Rate film" data-form-stars data-current-stars="{{ current_stars }}">
-          {% for value in range(1, 4) %}
-            <button
-              type="button"
-              class="star-button {% if current_stars >= value %}is-active{% endif %}"
-              data-stars="{{ value }}"
-              aria-label="{{ value }} star{% if value > 1 %}s{% endif %}"
-              aria-pressed="{% if current_stars >= value %}true{% else %}false{% endif %}"
-            >✦</button>
-          {% endfor %}
+          <div class="star-control" role="group" aria-label="Rate film" data-form-stars data-current-stars="{{ current_stars }}">
+            {% for value in range(1, 4) %}
+              <button
+                type="button"
+                class="star-button {% if current_stars >= value %}is-active{% endif %}"
+                data-stars="{{ value }}"
+                aria-label="{{ value }} star{% if value > 1 %}s{% endif %}"
+                aria-pressed="{% if current_stars >= value %}true{% else %}false{% endif %}"
+              >✦</button>
+            {% endfor %}
+          </div>
         </div>
       </div>