diff --git a/leaky-ships/components/Ships.tsx b/leaky-ships/components/Ships.tsx
index ac03ff2..a7af171 100644
--- a/leaky-ships/components/Ships.tsx
+++ b/leaky-ships/components/Ships.tsx
@@ -15,7 +15,7 @@ function Ships() {
         {shipIndexes.map(({ size, index }, i) => {
             const filename = `/assets/ship_blue_${size}x${index ? '_' + index : ''}.gif`
             return (
-                <div key={i} className={classNames('ship', size)} style={{ '--x': i + 3 } as CSSProperties}>
+                <div key={i} className={classNames('ship', 's' + size)} style={{ '--x': i + 3 } as CSSProperties}>
                     <img src={filename} alt={filename} />
                 </div>
             )
diff --git a/leaky-ships/components/useGameEvent.tsx b/leaky-ships/components/useGameEvent.tsx
index 2c05269..6f8f240 100644
--- a/leaky-ships/components/useGameEvent.tsx
+++ b/leaky-ships/components/useGameEvent.tsx
@@ -71,7 +71,7 @@ function useGameEvent(count: number) {
     const Targets = useCallback((targets: { show: boolean, x: number, y: number, edges: string[] }[], preview?: boolean) => {
         const { type } = scopeGrid
         return targets.map(({ edges, ...target }, i) => <Target key={i} props={{ type, preview, edges }} target={target} />)
-    }, [scopeGrid, mode])
+    }, [scopeGrid])
 
     useEffect(() => {
         const { fields } = scopeGrid