bingocode 1.1.105 → 1.1.106

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bingocode",
-  "version": "1.1.105",
+  "version": "1.1.106",
   "type": "module",
   "bin": {
     "claude": "bin/claude-win.cjs",

package/src/manager/CliMenuUi.tsx

@@ -273,17 +273,10 @@ export const TopBar: React.FC<{
       <Box width={width - 4} flexDirection="row" alignItems="flex-start">
         {/* Left Section: Welcome Text & IP */}
         <Box flexDirection="column" width={20} marginRight={2}>
-          {isHome ? (
-            <Box flexDirection="column">
-              <Text bold color="cyan">Welcome Bingo</Text>
-              <Text bold color="cyan">Code</Text>
-            </Box>
-          ) : (
-            <Text bold color="cyan">Bingo Code</Text>
-          )}
+              <Text bold color="cyan">{isHome ? 'Welcome Bingo\nCode' : 'Bingo Code'}</Text>
           {ip ? (
             <Box marginTop={1}>
-              <Text dimColor>IP: {ip.replace(':','\n   ')}</Text>
+              <Text color="green">IP: {ip.replace(' ','\n    ')}</Text>
             </Box>
           ) : null}
         </Box>

package/src/manager/TopToolbar.tsx

@@ -1,6 +1,6 @@
-//@C:M ID=M.UI.TopToolbar;K=M;V=1.2;P=top toolbar;D=CLI;M=cli;S=ui
+//@C:M ID=M.UI.TopToolbar;K=M;V=1.3;P=top toolbar;D=CLI;M=cli;S=ui
 import React, { memo, useMemo } from 'react';
-import { Box } from 'ink';
+import { Box, Text } from 'ink';
 import { Chip } from './CliMenuUi.tsx';
 import { useTheme } from '../components/design-system/ThemeProvider.tsx';
 import { getGlobalConfig, getCurrentProjectConfig } from '../utils/config.ts';
@@ -53,6 +53,17 @@ function basename(p: string) {
   return parts[parts.length - 1] || p;
 }
 
+/**
+ * Compact 1/6 size Mini-Clawd mascot string.
+ * Approx 3x2 characters.
+ */
+const MiniClawd = () => (
+  <Box flexDirection="column" marginRight={1}>
+    <Text color="cyan">▟█▙</Text>
+    <Text color="cyan">▜██</Text>
+  </Box>
+);
+
 export const TopToolbar: React.FC<Props> = memo(({ ready, page, animEnabled, tipsEnabled }) => {
   const [theme] = useTheme();
 
@@ -61,7 +72,7 @@ export const TopToolbar: React.FC<Props> = memo(({ ready, page, animEnabled, tip
   React.useEffect(() => {
     const update = () => setWindowCount(countLeases());
     update();
-    const id = setInterval(update, 10000);
+    const id = setInterval(update, 10000); // 10s poll
     return () => clearInterval(id);
   }, []);
 
@@ -94,30 +105,28 @@ export const TopToolbar: React.FC<Props> = memo(({ ready, page, animEnabled, tip
   const uiTone = (String(theme) === 'dark') ? 'accent' : (String(theme) === 'highContrast' ? 'warning' : 'info');
 
   return (
-    <Box flexDirection="row" width="100%" alignItems="center" justifyContent="space-between" minHeight={3}>
-      {/* Left: Clawd Icon + Window Indicators */}
-      <Box alignItems="center">
+    <Box flexDirection="row" width="100%" alignItems="flex-start" justifyContent="space-between">
+      {/* Left: Main Mascot + Compact Grid */}
+      <Box alignItems="flex-start">
         <Box marginRight={2}>
           {animEnabled ? <AnimatedClawd /> : <Clawd pose={clawdPose} />}
         </Box>
 
-        {/* Visual Window Grid (Mini-mobs) */}
-        <Box flexDirection="row" flexWrap="wrap">
+        {/* Visual Window Grid (Mini-mascots 1/6 size) */}
+        <Box flexDirection="row" flexWrap="wrap" maxWidth={40}>
           {Array.from({ length: windowCount }).map((_, i) => (
-            <Box key={i} marginRight={1}>
-               <Clawd pose="default" />
-            </Box>
+            <MiniClawd key={i} />
           ))}
         </Box>
       </Box>
 
-      {/* Right: Status Info Chips */}
-      <Box flexDirection="row">
+      {/* Right: Status Info Chips (Vertical Stack) */}
+      <Box flexDirection="column" alignItems="flex-end">
         <Chip label="Theme" value={themeLabel} tone="accent" />
         <Chip label="Project" value={projectName || '—'} tone="info" />
         <Chip
           label="UI"
-          value={`Anim ${animEnabled ? 'On' : 'Off'} · Tips ${tipsEnabled ? 'On' : 'Off'}`}
+          value={tipsEnabled ? 'Tips On' : 'Tips Off'}
           tone={uiTone as any}
         />
       </Box>