Re-theme the app: token-based CSS and a full face lift

CSS refactor: every color, font, radius, and shadow is now defined once
in theme.css; all other styles derive translucent variants with
color-mix(), so re-theming means editing one file. Removed the
duplicate core.css/style.css import chains, dead styles, and the
Bootstrap/Tailwind orphan classes that were silently unstyled
(the main reason the splash page looked broken).

New "Lantern & Brine" look: brass and parchment on a lantern-lit
ink-navy night, Pirata One wordmark with Alegreya SC/Sans body fonts
(self-hosted via fontsource — they were previously referenced but
never loaded), parchment-faced playing cards, and a rebuilt splash
page. Inline color styles in components were replaced with semantic
classes (prompt-box, notice-banner, status chips, etc.), the rulebook's
embedded palette was updated to match, and the leftover Vite favicon
and "frontend" page title were replaced.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

frontend/src/assets/css/upkeep.css

@@ -1,4 +1,4 @@
-/* --- Between Scenes Upkeep --- */
+/* --- Between-scenes upkeep --- */
 .between-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
@@ -19,12 +19,7 @@
 .voted-confirmation-box {
     padding: 1.5rem;
     text-align: center;
-    border: 1px solid var(--neon-emerald);
-}
-
-.success-text {
-    color: var(--neon-emerald);
-    font-weight: 700;
+    border: 1px solid var(--success);
 }
 
 .ranks-ledger {
@@ -33,30 +28,66 @@
 
 .ranks-ledger li {
     padding: 0.5rem;
-    border-bottom: 1px solid rgba(255,255,255,0.05);
+    border-bottom: 1px solid var(--edge-soft);
     display: flex;
     justify-content: space-between;
 }
 
-.deep-badge {
-    background: rgba(0, 242, 254, 0.15);
-    border: 1px solid var(--neon-cyan);
-    color: var(--neon-cyan);
-    padding: 0.1rem 0.4rem;
-    font-size: 0.75rem;
-    border-radius: 4px;
+/* --- Death fate panel --- */
+.death-fate-card {
+    border: 2px solid var(--danger);
+    background: color-mix(in srgb, var(--danger) 5%, var(--surface));
+    padding: 2.5rem;
+    margin: 2rem auto;
+    max-width: 650px;
+    text-align: center;
 }
 
-.pirat-badge {
-    background: rgba(0, 255, 135, 0.15);
-    border: 1px solid var(--neon-emerald);
-    color: var(--neon-emerald);
-    padding: 0.1rem 0.4rem;
-    font-size: 0.75rem;
-    border-radius: 4px;
+.death-fate-card > h2 {
+    color: var(--danger);
+    font-size: 2rem;
+    margin-bottom: 1rem;
 }
 
-/* --- Deep Upkeep Hand Refresh Drag & Drop --- */
+.death-fate-card .description {
+    font-size: 1.15rem;
+    color: var(--text);
+    margin-bottom: 2rem;
+}
+
+.fate-choices {
+    display: flex;
+    gap: 1.5rem;
+    justify-content: center;
+    flex-wrap: wrap;
+}
+
+.creation-form-wrapper {
+    text-align: left;
+    background: var(--well);
+    padding: 1.5rem;
+    border-radius: var(--radius-md);
+    border: 1px solid var(--edge-soft);
+}
+
+.creation-form-wrapper h3 {
+    color: var(--accent);
+    margin-bottom: 1.5rem;
+    border-bottom: 1px solid var(--edge-accent);
+    padding-bottom: 0.5rem;
+}
+
+.form-actions {
+    display: flex;
+    gap: 1rem;
+    margin-top: 1.5rem;
+}
+
+.form-actions .btn {
+    flex: 1;
+}
+
+/* --- Deep hand refresh drag & drop --- */
 .upkeep-drag-container {
     display: grid;
     grid-template-columns: 1fr 1fr;
@@ -76,9 +107,9 @@
     flex-direction: column;
 }
 
-.upkeep-box h3 {
+.upkeep-box h4 {
     margin-bottom: 1rem;
-    font-family: var(--font-heading);
+    font-size: 1.1rem;
 }
 
 .upkeep-flex {
@@ -87,14 +118,16 @@
     flex-wrap: wrap;
     gap: 1rem;
     padding: 1.5rem;
-    background: rgba(0, 0, 0, 0.3);
-    border: 1px dashed var(--glass-border);
-    border-radius: 8px;
+    background: var(--well);
+    border: 1px dashed var(--edge);
+    border-radius: var(--radius-md);
     align-content: flex-start;
     min-height: 300px;
     transition: var(--transition-smooth);
 }
 
-.upkeep-box[ondragover]:hover .upkeep-flex {
-    border-color: var(--neon-cyan);
+.end-story-box {
+    margin-top: 1.5rem;
+    border-top: 1px solid var(--edge-soft);
+    padding-top: 1rem;
 }