UI: unified design system, light/dark themes, redesigned pages and player UI

Tokens and components in styles.css, shared Ui (dialogs, toasts), icons,
bottom tab bar on mobile, keyboard/gamepad navigation, library shelf with
filters and conversion badges, hero game page, restyled player screens.
Games list now returns per-game version counts. Adds docs/UI_DESIGN.md.

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

frontend/src/pages/Play.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useRef, useState } from "react";
 import { useNavigate, useParams } from "react-router-dom";
 import type { Engine } from "../player/engine";
+import { Icon } from "../ui/Icon";
 
 export function Play() {
   const { versionId } = useParams();
@@ -33,8 +34,18 @@ export function Play() {
       <div ref={host} className="play-host" />
       {(status || error) && (
         <div className="play-status">
-          {error ? <span className="error">{error}</span> : status}
-          {error && <button onClick={() => navigate(-1)}>Назад</button>}
+          {error ? (
+            <>
+              <Icon name="alert" size={36} />
+              <span className="error-text">{error}</span>
+              <button className="btn" onClick={() => navigate(-1)}><Icon name="back" size={18} />Назад</button>
+            </>
+          ) : (
+            <>
+              <span className="spinner" />
+              {status}
+            </>
+          )}
         </div>
       )}
     </div>