From deb826401d77951396a34aea4085d8d8c235eba6 Mon Sep 17 00:00:00 2001
From: thibaud-leclere <thibaud.leclere@gmail.com>
Date: Sat, 28 Mar 2026 13:19:53 +0100
Subject: [PATCH] style: add game grid and popover styling

---
 assets/styles/app.css | 59 +++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 57 insertions(+), 2 deletions(-)

diff --git a/assets/styles/app.css b/assets/styles/app.css
index 625d2ea..1bcbb04 100644
--- a/assets/styles/app.css
+++ b/assets/styles/app.css
@@ -3,9 +3,64 @@ body {
     font-family: 'Noto Sans', sans-serif;
 }
 
+#actors {
+    border-collapse: collapse;
+    margin: 40px auto;
+}
+
 #actors td {
-    width: 16px;
-    height: 16px;
+    width: 32px;
+    height: 32px;
+    text-align: center;
+    vertical-align: middle;
+}
+
+.letter-input {
+    width: 32px;
+    height: 32px;
+    text-align: center;
+    font-size: 16px;
+    font-weight: bold;
+    border: 2px solid #d1d5db;
+    border-radius: 4px;
+    text-transform: uppercase;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+.letter-input:focus {
+    outline: none;
+    border-color: #2563eb;
+}
+
+.letter-highlighted {
+    background-color: #fecaca;
+    border-color: #dc2626;
+}
+
+.popover-trigger {
+    width: 28px;
+    height: 28px;
+    border-radius: 50%;
+    border: 1px solid #d1d5db;
+    background: white;
+    cursor: pointer;
+    font-size: 14px;
+    color: #6b7280;
+}
+
+.popover-trigger:hover {
+    background: #f3f4f6;
+}
+
+.actor-popover {
+    background: white;
+    border: 1px solid #d1d5db;
+    border-radius: 8px;
+    padding: 12px 16px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+    z-index: 100;
+    font-size: 14px;
 }
 
 .auth-container {