fix(game): diegetic tone class on #game-view so the world tints

app.py

@@ -423,7 +423,23 @@ _HEAD_JS = """
 
     // mute button + restart + mode buttons, wired once rendered
   function icon() { return st.muted ? '\\uD83D\\uDD07' : '\\uD83D\\uDD0A'; }
+  // lift the per-turn tone onto #game-view so the WORLD tints (the marker
+  // .tone-now lives inside #game-entity, a sibling of #game-bg/#game-vig)
+  function applyTone() {
+    var gv = document.getElementById('game-view');
+    var mark = document.querySelector('#game-view .tone-now[data-tone]');
+    if (!gv || !mark) return;
+    var t = mark.getAttribute('data-tone');
+    if (gv.dataset.tone === t) return;
+    gv.dataset.tone = t;
+    ['tone-warm','tone-neutral','tone-wounded','tone-hostile'].forEach(function (c) {
+      gv.classList.remove(c);
+    });
+    gv.classList.add('tone-' + t);
+  }
+
   function wire() {
+    applyTone();
     // corner drawers: header chip toggles expand
     document.querySelectorAll('.game-drawer .drawer-head').forEach(function (h) {
       if (h.dataset.hollowWired) return;

render.py

@@ -300,7 +300,12 @@ def render_entity(affinity: int, mode: str = "idle", seq: int = 0,
         # text streams — the chime was redundant feedback and, with streaming,
         # fired out of sync (at stream start, then again at the end).
 
+    # tone-now marker: a head-JS MutationObserver reads data-tone and lifts the
+    # tone class onto #game-view (the common ancestor of #game-bg/#game-vig/
+    # #game-scene) so the whole world tints, not just this panel's silhouette.
+    tone_token = tone_class.split("-", 1)[1] if "-" in tone_class else "neutral"
     return (
+        f'<span class="tone-now" data-tone="{tone_token}" style="display:none"></span>'
         f'<div class="entity-scene {tone_class}">'
         f'{figure}{flash}{tint}'
         '</div>'

styles.css

@@ -1693,34 +1693,36 @@ footer { display: none !important; }
     overflow: hidden !important;
 }
 
-/* tone classes — the world blooms or rots */
-.tone-warm #game-bg { filter: grayscale(1) blur(38px) brightness(0.62); }
-.tone-warm #game-vig {
+/* tone classes — the world blooms or rots. Scoped under #game-view: the
+   tone token is lifted onto #game-view by the head JS (applyTone), so #game-bg
+   /#game-vig (siblings of #game-entity) actually tint. */
+#game-view.tone-warm #game-bg { filter: grayscale(1) blur(38px) brightness(0.62); }
+#game-view.tone-warm #game-vig {
     background:
         radial-gradient(ellipse at 50% 42%, transparent 52%, rgba(4,3,8,0.45) 100%),
         linear-gradient(to bottom, rgba(6,4,12,0.28) 0%, transparent 13%);
 }
-.tone-warm .entity-img { filter: brightness(1.12) drop-shadow(0 0 18px rgba(190,170,220,0.30)) !important; }
+#game-view.tone-warm .entity-img { filter: brightness(1.12) drop-shadow(0 0 18px rgba(190,170,220,0.30)) !important; }
 
-.tone-neutral #game-bg { filter: grayscale(1) blur(38px) brightness(0.52); }
+#game-view.tone-neutral #game-bg { filter: grayscale(1) blur(38px) brightness(0.52); }
 
-.tone-wounded #game-bg { filter: grayscale(1) blur(38px) brightness(0.38); }
-.tone-wounded #game-vig {
+#game-view.tone-wounded #game-bg { filter: grayscale(1) blur(38px) brightness(0.38); }
+#game-view.tone-wounded #game-vig {
     background:
         radial-gradient(ellipse at 50% 42%, transparent 38%, rgba(4,3,8,0.78) 100%),
         linear-gradient(to bottom, rgba(6,4,12,0.65) 0%, transparent 13%);
 }
-.tone-wounded .entity-img { opacity: 0.85 !important; }
+#game-view.tone-wounded .entity-img { opacity: 0.85 !important; }
 
-.tone-hostile #game-bg {
+#game-view.tone-hostile #game-bg {
     filter: grayscale(1) blur(38px) brightness(0.30);
 }
-.tone-hostile #game-vig {
+#game-view.tone-hostile #game-vig {
     background:
         radial-gradient(ellipse at 50% 42%, transparent 32%, rgba(30,4,8,0.80) 100%),
         linear-gradient(to bottom, rgba(40,6,12,0.52) 0%, transparent 20%);
 }
-.tone-hostile .entity-img {
+#game-view.tone-hostile .entity-img {
     filter: sepia(0.22) saturate(1.35) brightness(0.95) drop-shadow(0 0 18px rgba(120,40,40,0.35)) !important;
 }