v0.13.0 web and terminal client enhance, replay api, linux server deploy, doc and dependency update

internal/server/webserver/chess-client-web/style.css

@@ -379,6 +379,10 @@ main {
     padding: 0.5rem;
 }
 
+.error-flash-message.info {
+    color: var(--tokyo-cyan);
+}
+
 /* Move History */
 .move-history-container {
     flex: 1 1 auto;
@@ -849,20 +853,21 @@ input[type="range"]:disabled {
         margin: 0;
     }
 
+    /* Four controls as a 2x2 grid; the column is too short for one per row. */
     .controls {
         grid-column: 1;
         grid-row: 2 / 4;
-        grid-template-columns: 1fr;
+        grid-template-columns: 1fr 1fr;
         grid-template-rows: 1fr 1fr;
-        gap: 0.5rem;
+        gap: 0.4rem;
         align-self: stretch;
         height: auto;
         min-height: 80px;
     }
 
     .btn {
-        padding: 0.5rem;
-        font-size: 0.85rem;
+        padding: 0.4rem 0.25rem;
+        font-size: 0.8rem;
         min-height: 35px;
         height: 100%;
         width: 100%;
@@ -907,3 +912,55 @@ input[type="range"]:disabled {
         min-width: 0;
     }
 }
+
+/* Promotion picker */
+.promotion-modal {
+    max-width: 320px;
+}
+
+.promotion-choices {
+    display: flex;
+    justify-content: center;
+    gap: 0.5rem;
+}
+
+.promotion-choice {
+    width: 56px;
+    height: 56px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 36px;
+    line-height: 1;
+    background: var(--square-light);
+    border: 2px solid var(--tokyo-border);
+    border-radius: 6px;
+    cursor: pointer;
+    transition: border-color 0.2s, background 0.2s;
+}
+
+.promotion-choice:hover,
+.promotion-choice:focus-visible {
+    outline: none;
+    border-color: var(--host-royal);
+    background: var(--square-selected);
+}
+
+.promotion-choices.white .promotion-choice {
+    color: var(--host-white);
+    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
+}
+
+.promotion-choices.black .promotion-choice {
+    color: var(--host-bg);
+    text-shadow: 1px 1px 2px rgba(255,255,255,0.2);
+}
+
+/* Resign confirmation */
+.confirm-modal {
+    max-width: 320px;
+}
+
+.confirm-modal h2 {
+    font-size: 1.2rem;
+}