diff --git a/wwwroot/index.html b/wwwroot/index.html
index d8c48cf..8856942 100644
--- a/wwwroot/index.html
+++ b/wwwroot/index.html
@@ -11,12 +11,12 @@
     <span class="status-dot"></span>
     <span id="phase-pill">Loading…</span>
     <span class="counts" id="counts">—</span>
-    <div class="name-inline">
-      <label for="name-input" class="label">Name</label>
-      <input id="name-input" maxlength="64" placeholder="Pick a name" />
-      <button id="save-name" class="ghost">Save</button>
-      <span class="hint warning hidden" id="name-warning">Name required</span>
-    </div>
+  </div>
+  <div class="name-bar">
+    <label for="name-input" class="label">Name</label>
+    <input id="name-input" maxlength="64" placeholder="Pick a name" />
+    <button id="save-name" class="ghost">Save</button>
+    <span class="hint warning hidden" id="name-warning">Name required</span>
   </div>
 
   <main class="grid">
diff --git a/wwwroot/styles.css b/wwwroot/styles.css
index c06b79a..4c04db8 100644
--- a/wwwroot/styles.css
+++ b/wwwroot/styles.css
@@ -33,17 +33,19 @@ body {
   font-size: 13px;
 }
 
-.name-inline {
+.name-bar {
   display: flex;
   align-items: center;
-  gap: 8px;
-}
-.name-inline input {
-  width: 160px;
-}
-.name-inline .hint {
-  margin: 0;
+  gap: 10px;
+  padding: 10px 12px;
+  margin-top: 8px;
+  background: rgba(15, 23, 42, 0.8);
+  border: 1px solid #1f2937;
+  border-radius: 10px;
+  box-shadow: 0 6px 16px rgba(0,0,0,0.2);
 }
+.name-bar input { width: 180px; }
+.name-bar .hint { margin: 0; }
 
 .grid {
   display: grid;