v1.1.1: UX fixes, non-destructive overheat, and an admin panel

- Migrate now returns you to the Racks tab instead of leaving you on
  whatever tab you were on.
- Singularity tab label was truncated to "Singular." - restored to full.
- Long usernames (e.g. "NeverEndingCode") were getting cut off in the
  header - widened the truncation limit.
- Collect All now shows whenever any owned rack isn't automated, not only
  when there's currently something ready to collect.
- Overclock overheating no longer destroys any owned nodes - hitting 100%
  heat now only triggers the 10s lane cooldown. Updated the meltdown
  modal and warning copy to match.
- The post-minigame "Resolved" modal no longer closes on a backdrop
  click, only via its own button - it was too easy to dismiss by accident.
- Added a STABILIZE button back to Overclock Balance, sharing the same
  scoring logic as clicking the bar directly.
- New admin-only section in Profile > Settings (visible and API-gated
  for a single hardcoded user id) listing every user and their save
  stats - server/routes/api.js's /api/admin/users checks this on every
  request rather than trusting anything from the client.

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

Author: Evan Phyillaier

client/package.json

@@ -1,7 +1,7 @@
 {
   "name": "rackstack-client",
   "private": true,
-  "version": "1.1.0",
+  "version": "1.1.1",
   "type": "module",
   "scripts": {
     "dev": "vite",

client/src/RackStack.jsx

@@ -174,8 +174,8 @@ export default function RackStack({ user }) {
           const netHeat = heatGain - eff.autoVentPerSec;
           newHeat = Math.min(100, Math.max(0, prev.heat + netHeat * dt));
           if (newHeat >= 100) {
+            // Overheating never destroys nodes - it just forces the cooldown.
             meltdown = true;
-            overclock = prev.overclock.map((o) => ({ ...o, owned: Math.floor(o.owned * 0.5) }));
             newHeat = 0;
             heatCooldownUntil = now + HEAT_COOLDOWN_MS;
           }
@@ -354,6 +354,7 @@ export default function RackStack({ user }) {
     setRun({ ...initialRun(), credits: startCredits });
     setMeta((prev) => ({ ...prev, legacyCores: prev.legacyCores + gain + echoBonus, stats: { ...prev.stats, migrates: prev.stats.migrates + 1 } }));
     setModal(null);
+    setActiveTab('racks');
   }
   function doSingularity() {
     const shardsGained = Math.floor(Math.sqrt(meta.legacyCores));
@@ -556,6 +557,7 @@ export default function RackStack({ user }) {
   const overclockOutput = heatOnCooldown ? 0 : run.overclock.reduce((sum, o, i) => sum + tierRate(o.owned, OVERCLOCK_DEFS[i].baseProd, overclockMult, thresholds), 0);
   const totalOutputPerSec = racksOutput + gridOutput + overclockOutput;
   const anyReady = run.tiers.some((ts) => !ts.manager && ts.ready > 0.01);
+  const anyManualOwned = run.tiers.some((ts) => ts.owned > 0 && !ts.manager);
   const gain = migrateGain(run.lifetimeRun, eff.legacyGainMult);
   const singularityGain = Math.floor(Math.sqrt(meta.legacyCores));
 
@@ -617,7 +619,7 @@ export default function RackStack({ user }) {
         <div className="max-w-2xl mx-auto px-4 pt-3">
           <HeaderBar user={user} level={meta.level} onOpenProfile={() => setProfileOpen(true)} />
           <StatsRow run={run} meta={meta} totalOutputPerSec={totalOutputPerSec} xpNeeded={xpNeeded} boost={boost} boostMultNow={boostMultNow} />
-          <MigrateBar gain={gain} anyReady={anyReady} onMigrate={() => setModal({ type: 'migrate' })} onCollectAll={collectAll} />
+          <MigrateBar gain={gain} showCollectAll={anyManualOwned} collectDisabled={!anyReady} onMigrate={() => setModal({ type: 'migrate' })} onCollectAll={collectAll} />
           <TabBar tabs={TABS} activeTab={activeTab} setActiveTab={setActiveTab} gridUnlocked={gridUnlocked} overclockUnlocked={overclockUnlocked} singularityUnlocked={singularityUnlocked} />
         </div>
       </div>
@@ -673,6 +675,7 @@ export default function RackStack({ user }) {
 
       {profileOpen && (
         <ProfileView
+          user={user}
           meta={meta}
           memberSince={user && user.memberSince}
           onClose={() => setProfileOpen(false)}

client/src/game/components/HeaderBar.jsx

@@ -16,7 +16,7 @@ export default function HeaderBar({ user, level, onOpenProfile }) {
             ) : (
               <UserCircle size={22} color={textDim} />
             )}
-            <span className="text-xs font-mono truncate max-w-[90px]" style={{ color: textDim }}>{user.username}</span>
+            <span className="text-xs font-mono truncate max-w-[160px]" style={{ color: textDim }}>{user.username}</span>
           </button>
         )}
         <div className="rounded-lg px-2 py-1 text-xs font-mono" style={{ background: inset, border: `1px solid ${cardBorder}`, color: violet }}>Lv {level}</div>

client/src/game/components/MigrateBar.jsx

@@ -1,7 +1,7 @@
 import { RefreshCw } from 'lucide-react';
 import { amber, cardBg, inset, cardBorder, textDim, textMain } from '../theme.js';
 
-export default function MigrateBar({ gain, anyReady, onMigrate, onCollectAll }) {
+export default function MigrateBar({ gain, showCollectAll, collectDisabled, onMigrate, onCollectAll }) {
   return (
     <div className="mt-3 flex gap-2">
       <button
@@ -12,8 +12,19 @@ export default function MigrateBar({ gain, anyReady, onMigrate, onCollectAll })
       >
         <RefreshCw size={16} /> Migrate{gain > 0 ? ` (+${gain} cores)` : ''}
       </button>
-      {anyReady && (
-        <button onClick={onCollectAll} className="rounded-lg px-4 py-2 text-sm font-semibold" style={{ background: inset, border: `1px solid ${cardBorder}`, color: textMain }}>
+      {showCollectAll && (
+        <button
+          onClick={onCollectAll}
+          disabled={collectDisabled}
+          className="rounded-lg px-4 py-2 text-sm font-semibold"
+          style={{
+            background: collectDisabled ? cardBg : inset,
+            border: `1px solid ${cardBorder}`,
+            color: collectDisabled ? textDim : textMain,
+            opacity: collectDisabled ? 0.55 : 1,
+            cursor: collectDisabled ? 'not-allowed' : 'pointer',
+          }}
+        >
           Collect All
         </button>
       )}

client/src/game/components/OverclockPanel.jsx

@@ -17,7 +17,7 @@ export default function OverclockPanel({ run, overclockMult, thresholds, onBuy,
         </div>
         {run.heat > 80 && !onCooldown && (
           <div className="text-xs mt-1 flex items-center gap-1" style={{ color: danger }}>
-            <AlertTriangle size={12} /> Meltdown risk &mdash; vent now, or you'll lose half your Overclock nodes
+            <AlertTriangle size={12} /> Overheating risk &mdash; vent now to avoid a mandatory cooldown
           </div>
         )}
         {onCooldown && (
@@ -30,7 +30,7 @@ export default function OverclockPanel({ run, overclockMult, thresholds, onBuy,
         </button>
       </div>
       <div className="rounded-lg p-3 text-xs" style={{ background: cardBg, border: `1px solid ${cardBorder}`, color: textDim }}>
-        Overclock nodes run on their own like the Grid, but generate heat. Let it hit 100% and half your nodes melt down, freezing the lane for 10s. Keep venting.
+        Overclock nodes run on their own like the Grid, but generate heat. Let it hit 100% and the lane freezes for 10s while it cools down - no nodes are ever lost. Keep venting to avoid the lockout.
       </div>
       {OVERCLOCK_DEFS.map((def, i) => {
         const o = run.overclock[i];

client/src/game/components/minigames/BalanceOverlay.jsx

@@ -1,6 +1,6 @@
 import { useRef, useEffect } from 'react';
 import { X } from 'lucide-react';
-import { textDim, danger, teal, inset, cardBorder } from '../../theme.js';
+import { textDim, textMain, danger, teal, inset, cardBorder } from '../../theme.js';
 import { BALANCE_SAFE_ZONE_MIN, BALANCE_SAFE_ZONE_MAX, BALANCE_BASE_SPEED, BALANCE_SPEED_VARIANCE } from '../../constants.js';
 
 // Smooth, rAF-driven indicator. Position lives in a ref and is painted
@@ -40,8 +40,13 @@ export default function BalanceOverlay({ minigame, onBarHit, onMiss, onCancel })
     return () => cancelAnimationFrame(rafId);
   }, []);
 
-  function handleBarClick(e) {
-    e.stopPropagation();
+  // Shared by both the bar's own click and the STABILIZE button below it -
+  // both are "attempt to score now" actions, so they get identical
+  // in-zone/out-of-zone behavior (silent no-op when out of zone, same as
+  // clicking the bar directly - only clicks *outside* the bar/button count
+  // as a miss).
+  function attemptScore(e) {
+    if (e) e.stopPropagation();
     const inZone = posRef.current >= BALANCE_SAFE_ZONE_MIN && posRef.current <= BALANCE_SAFE_ZONE_MAX;
     if (inZone) onBarHit();
   }
@@ -58,11 +63,14 @@ export default function BalanceOverlay({ minigame, onBarHit, onMiss, onCancel })
           <span>{minigame.timeLeft}s left</span>
           <span style={{ color: danger }}>{minigame.score} stabilized</span>
         </div>
-        <div className="relative h-8 rounded-full mb-8 cursor-pointer" style={{ background: inset, border: `1px solid ${cardBorder}` }} onClick={handleBarClick}>
+        <div className="relative h-8 rounded-full mb-8 cursor-pointer" style={{ background: inset, border: `1px solid ${cardBorder}` }} onClick={attemptScore}>
           <div className="absolute top-0 bottom-0" style={{ left: `${BALANCE_SAFE_ZONE_MIN}%`, width: `${BALANCE_SAFE_ZONE_MAX - BALANCE_SAFE_ZONE_MIN}%`, background: 'rgba(79,195,176,0.25)', borderLeft: `1px solid ${teal}`, borderRight: `1px solid ${teal}` }} />
           <div ref={needleRef} className="absolute top-0 bottom-0 w-1.5 rounded" style={{ left: 'calc(0% - 3px)', background: danger }} />
         </div>
-        <div className="text-xs" style={{ color: textDim }}>Click the bar while the marker is in the safe zone &mdash; clicking elsewhere costs points</div>
+        <div className="text-xs mb-4" style={{ color: textDim }}>Click the bar or press STABILIZE while the marker is in the safe zone &mdash; clicking elsewhere costs points</div>
+        <button onClick={attemptScore} className="w-full rounded-2xl py-4 text-base font-bold" style={{ background: danger, color: textMain }}>
+          STABILIZE
+        </button>
       </div>
     </div>
   );

client/src/game/components/modals/MessageModal.jsx

@@ -41,8 +41,8 @@ export default function MessageModal({ modal, onClose }) {
     case 'meltdown':
       return (
         <>
-          <h2 className="text-lg font-bold mb-2 flex items-center gap-2" style={{ color: danger }}><AlertTriangle size={18} /> Thermal Meltdown!</h2>
-          <p className="text-sm mb-4" style={{ color: textDim }}>Your Overclock Bay overheated and half your nodes were lost. The lane is frozen for a short cooldown. Keep an eye on the heat gauge and vent regularly, or invest in Thermal Regulators / Auto-Vent upgrades.</p>
+          <h2 className="text-lg font-bold mb-2 flex items-center gap-2" style={{ color: danger }}><AlertTriangle size={18} /> Overheated!</h2>
+          <p className="text-sm mb-4" style={{ color: textDim }}>Your Overclock Bay hit 100% heat and the lane is frozen for a short cooldown - no nodes were lost. Keep an eye on the heat gauge and vent regularly, or invest in Thermal Regulators / Auto-Vent upgrades to avoid the lockout.</p>
           <button onClick={onClose} className="w-full rounded-lg py-2 text-sm font-semibold" style={{ background: danger, color: textMain }}>Understood</button>
         </>
       );

client/src/game/components/modals/ModalRoot.jsx

@@ -5,7 +5,7 @@ import SingularityConfirmModal from './SingularityConfirmModal.jsx';
 import ResetConfirmModal from './ResetConfirmModal.jsx';
 import ResetTypeConfirmModal from './ResetTypeConfirmModal.jsx';
 
-const NON_DISMISSIBLE = ['migrate', 'reset', 'resetConfirmType', 'singularity'];
+const NON_DISMISSIBLE = ['migrate', 'reset', 'resetConfirmType', 'singularity', 'minigameResult'];
 const MESSAGE_TYPES = ['welcome', 'eventClaim', 'minigameResult', 'goalClaim', 'levelUp', 'singularityDone', 'meltdown'];
 
 export default function ModalRoot({ modal, setModal, meta, gain, singularityGain, onMigrate, onSingularity, onHardReset }) {

client/src/game/components/profile/AdminPanel.jsx

@@ -0,0 +1,50 @@
+import { useState, useEffect } from 'react';
+import { ShieldAlert } from 'lucide-react';
+import { cardBorder, textMain, textDim, violet, inset } from '../../theme.js';
+
+export default function AdminPanel() {
+  const [users, setUsers] = useState(null);
+  const [error, setError] = useState(null);
+
+  useEffect(() => {
+    let cancelled = false;
+    fetch('/api/admin/users', { credentials: 'include' })
+      .then((r) => { if (!r.ok) throw new Error(`request failed (${r.status})`); return r.json(); })
+      .then((data) => { if (!cancelled) setUsers(data.users); })
+      .catch(() => { if (!cancelled) setError('Failed to load users.'); });
+    return () => { cancelled = true; };
+  }, []);
+
+  return (
+    <div className="rounded-lg p-3" style={{ border: `1px solid ${violet}`, background: 'rgba(156,140,242,0.08)' }}>
+      <div className="flex items-center gap-1.5 text-xs font-semibold mb-2" style={{ color: violet }}>
+        <ShieldAlert size={13} /> ADMIN &mdash; ALL USERS
+      </div>
+      {error && <div className="text-xs" style={{ color: textDim }}>{error}</div>}
+      {!users && !error && <div className="text-xs" style={{ color: textDim }}>Loading&hellip;</div>}
+      {users && users.length === 0 && <div className="text-xs" style={{ color: textDim }}>No users yet.</div>}
+      {users && users.length > 0 && (
+        <div className="flex flex-col gap-2 max-h-72 overflow-y-auto">
+          {users.map((u) => (
+            <div key={u.id} className="rounded-md p-2 text-xs" style={{ background: inset, border: `1px solid ${cardBorder}` }}>
+              <div className="flex items-center justify-between font-mono gap-2" style={{ color: textMain }}>
+                <span className="truncate">{u.username || u.id}</span>
+                <span style={{ color: textDim }}>{u.provider}</span>
+              </div>
+              <div className="mt-0.5" style={{ color: textDim }}>
+                {u.level != null
+                  ? `Lv ${u.level} · ${u.wafers ?? 0} wafers · ${u.legacyCores ?? 0} cores · ${u.singularityShards ?? 0} shards`
+                  : 'No save yet'}
+              </div>
+              {u.stats && (
+                <div style={{ color: textDim }}>
+                  Migrates {u.stats.migrates ?? 0} &middot; Singularities {u.stats.singularities ?? 0} &middot; Minigames won {u.stats.minigamesWon ?? 0}
+                </div>
+              )}
+            </div>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}

client/src/game/components/profile/ProfileSettings.jsx

@@ -1,14 +1,18 @@
 import { LogOut } from 'lucide-react';
 import { textMain, inset, cardBorder } from '../../theme.js';
+import { ADMIN_USER_ID } from '../../constants.js';
 import DangerZone from './DangerZone.jsx';
+import AdminPanel from './AdminPanel.jsx';
 
-export default function ProfileSettings({ onLogout, onOpenReset }) {
+export default function ProfileSettings({ user, onLogout, onOpenReset }) {
+  const isAdmin = !!user && user.id === ADMIN_USER_ID;
   return (
     <div className="flex flex-col gap-4">
       <button onClick={onLogout} className="w-full rounded-lg py-2 text-sm font-semibold flex items-center justify-center gap-2" style={{ background: inset, border: `1px solid ${cardBorder}`, color: textMain }}>
         <LogOut size={16} /> Log out
       </button>
       <DangerZone onOpenReset={onOpenReset} />
+      {isAdmin && <AdminPanel />}
     </div>
   );
 }