diff --git a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js
index c828289..1aed96c 100644
--- a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js
+++ b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js
@@ -526,7 +526,7 @@ const CANVAS_PALETTE = {
       waterfallHue: [45, 18], waterfallSat: 86, waterfallLight: [92, 42], waterfallAlpha: [0.34, 0.82],
     },
   },
-  fire: {
+  amber: {
     dark: {
       bg: "#130706",
       spectrumLine: "#ff7a1f", spectrumFill: "rgba(255,122,31,0.14)",
@@ -544,7 +544,7 @@ const CANVAS_PALETTE = {
       waterfallHue: [18, 48], waterfallSat: 90, waterfallLight: [92, 42], waterfallAlpha: [0.34, 0.84],
     },
   },
-  blood: {
+  fire: {
     dark: {
       bg: "#140406",
       spectrumLine: "#cf1b22", spectrumFill: "rgba(207,27,34,0.14)",
@@ -575,8 +575,12 @@ function canvasPalette() {
 }
 
 function setStyle(style) {
-  const remapped = style === "nord" ? "arctic" : style === "monokai" ? "lime" : style;
-  const valid = ["original", "arctic", "lime", "contrast", "neon-disco", "golden-rain", "fire", "blood"];
+  const remapped =
+    style === "nord" ? "arctic"
+    : style === "monokai" ? "lime"
+    : style === "blood" ? "fire"
+    : style;
+  const valid = ["original", "arctic", "lime", "contrast", "neon-disco", "golden-rain", "amber", "fire"];
   const next = valid.includes(remapped) ? remapped : "original";
   if (next === "original") {
     document.documentElement.removeAttribute("data-style");
diff --git a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/index.html b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/index.html
index 1cedc0d..a49459e 100644
--- a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/index.html
+++ b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/index.html
@@ -46,8 +46,8 @@
             <option value="contrast">Contrast</option>
             <option value="neon-disco">Neon Disco</option>
             <option value="golden-rain">Donald</option>
-            <option value="fire">Amber</option>
-            <option value="blood">Blood</option>
+            <option value="amber">Amber</option>
+            <option value="fire">Fire</option>
           </select>
         </div>
         <button id="theme-toggle" class="header-bar-btn" type="button" aria-label="Toggle dark or light theme">Light</button>
diff --git a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
index 31bcf75..66d588d 100644
--- a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
+++ b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
@@ -2308,7 +2308,7 @@ button:focus-visible, input:focus-visible, select:focus-visible {
 }
 
 /* ── Amber style ──────────────────────────────────────────────────────── */
-[data-style="fire"] {
+[data-style="amber"] {
   --bg: #120706;
   --card-bg: #1b0c0a;
   --input-bg: #180907;
@@ -2336,7 +2336,7 @@ button:focus-visible, input:focus-visible, select:focus-visible {
   --wavelength-fg: #d38d6a;
   --spectrum-bg: #140907;
 }
-[data-style="fire"][data-theme="light"] {
+[data-style="amber"][data-theme="light"] {
   --bg: #fff3ea;
   --card-bg: #fff7f0;
   --input-bg: #ffe9da;
@@ -2365,8 +2365,8 @@ button:focus-visible, input:focus-visible, select:focus-visible {
   --spectrum-bg: #fff0e4;
 }
 
-/* ── Blood style ──────────────────────────────────────────────────────── */
-[data-style="blood"] {
+/* ── Fire style ───────────────────────────────────────────────────────── */
+[data-style="fire"] {
   --bg: #140406;
   --card-bg: #1d0708;
   --input-bg: #1a0607;
@@ -2394,7 +2394,7 @@ button:focus-visible, input:focus-visible, select:focus-visible {
   --wavelength-fg: #d78d78;
   --spectrum-bg: #150508;
 }
-[data-style="blood"][data-theme="light"] {
+[data-style="fire"][data-theme="light"] {
   --bg: #fdf0ea;
   --card-bg: #fff6f1;
   --input-bg: #ffe5db;